@jbrowse/plugin-data-management 3.6.5 → 4.0.0

package/esm/HierarchicalTrackSelectorWidget/components/tree/TrackCategory.js

@@ -1,12 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import JBrowseMenu from '@jbrowse/core/ui/Menu';
+import { useCallback, useState } from 'react';
+import { CascadingMenuButton, SanitizedHTML } from '@jbrowse/core/ui';
+import { makeStyles } from '@jbrowse/core/util/tss-react';
 import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
 import ArrowRightIcon from '@mui/icons-material/ArrowRight';
 import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
-import { IconButton, Typography } from '@mui/material';
-import { makeStyles } from 'tss-react/mui';
-import { getAllChildren, treeToMap } from '../util';
+import { Typography } from '@mui/material';
+import { observer } from 'mobx-react';
+import { getAllChildren } from "../util.js";
 const useStyles = makeStyles()(theme => ({
     contrastColor: {
         color: theme.palette.tertiary.contrastText,
@@ -16,60 +17,89 @@ const useStyles = makeStyles()(theme => ({
         width: '100%',
     },
 }));
-export default function Category({ isOpen, setOpen, data, }) {
+function getAllSubcategories(node) {
+    const categoryIds = [];
+    for (const child of node.children) {
+        if (child.type === 'category') {
+            categoryIds.push(child.id, ...getAllSubcategories(child));
+        }
+    }
+    return categoryIds;
+}
+function getTrackIdsFromCategory(node) {
+    return node.children
+        .filter(entry => entry.type === 'track')
+        .map(entry => entry.trackId);
+}
+const TrackCategory = observer(function TrackCategory({ item, model, }) {
     const { classes } = useStyles();
-    const [menuEl, setMenuEl] = useState(null);
-    const { menuItems = [], name, model, id, tree } = data;
-    return (_jsxs("div", { className: classes.accordionText, onClick: () => {
-            if (!menuEl) {
-                data.toggleCollapse(id);
-                setOpen(!isOpen);
-            }
-        }, children: [_jsxs(Typography, { "data-testid": `htsCategory-${name}`, children: [isOpen ? _jsx(ArrowDropDownIcon, {}) : _jsx(ArrowRightIcon, {}), name, _jsx(IconButton, { onClick: event => {
-                            setMenuEl(event.currentTarget);
-                            event.stopPropagation();
-                        }, className: classes.contrastColor, children: _jsx(MoreHorizIcon, {}) })] }), menuEl ? (_jsx(JBrowseMenu, { anchorEl: menuEl, menuItems: [
-                    {
-                        label: 'Add to selection',
-                        onClick: () => {
-                            const r = treeToMap(tree).get(id);
-                            model.addToSelection(getAllChildren(r));
-                        },
-                    },
+    const [menuOpen, setMenuOpen] = useState(false);
+    const { name, id } = item;
+    const isOpen = !model.collapsed.get(id);
+    const getMenuItems = useCallback(() => {
+        const subcategoryIds = getAllSubcategories(item);
+        const hasSubcategories = subcategoryIds.length > 0;
+        return [
+            {
+                label: 'Add to selection',
+                onClick: () => {
+                    model.addToSelection(getAllChildren(item));
+                },
+                helpText: 'Add all tracks in this category to the current selection. This allows you to perform bulk operations on multiple tracks at once, such as configuring settings or exporting track configurations.',
+            },
+            {
+                label: 'Remove from selection',
+                onClick: () => {
+                    model.removeFromSelection(getAllChildren(item));
+                },
+                helpText: 'Remove all tracks in this category from the current selection. Use this to deselect tracks that were previously added to your selection.',
+            },
+            {
+                label: 'Show all',
+                onClick: () => {
+                    for (const trackId of getTrackIdsFromCategory(item)) {
+                        model.view.showTrack(trackId);
+                    }
+                },
+                helpText: 'Display all tracks in this category on the current view. This is useful when you want to visualize multiple related tracks simultaneously to compare their data.',
+            },
+            {
+                label: 'Hide all',
+                onClick: () => {
+                    for (const trackId of getTrackIdsFromCategory(item)) {
+                        model.view.hideTrack(trackId);
+                    }
+                },
+                helpText: 'Hide all tracks in this category from the current view. This helps declutter your view by removing tracks you are not currently analyzing.',
+            },
+            ...(hasSubcategories
+                ? [
                     {
-                        label: 'Remove from selection',
+                        label: 'Collapse all subcategories',
                         onClick: () => {
-                            const r = treeToMap(tree).get(id);
-                            model.removeFromSelection(getAllChildren(r));
-                        },
-                    },
-                    {
-                        label: 'Show all tracks',
-                        onClick: () => {
-                            var _a;
-                            for (const entry of ((_a = treeToMap(tree).get(id)) === null || _a === void 0 ? void 0 : _a.children) || []) {
-                                if (entry.type === 'track') {
-                                    model.view.showTrack(entry.trackId);
-                                }
+                            for (const subcategoryId of subcategoryIds) {
+                                model.setCategoryCollapsed(subcategoryId, true);
                             }
                         },
+                        helpText: 'Collapse all nested subcategories within this category. This provides a cleaner, more compact view of the track hierarchy by hiding the detailed contents of subcategories.',
                     },
                     {
-                        label: 'Hide all tracks',
+                        label: 'Expand all subcategories',
                         onClick: () => {
-                            var _a;
-                            for (const entry of ((_a = treeToMap(tree).get(id)) === null || _a === void 0 ? void 0 : _a.children) || []) {
-                                if (entry.type === 'track') {
-                                    model.view.hideTrack(entry.trackId);
-                                }
+                            for (const subcategoryId of subcategoryIds) {
+                                model.setCategoryCollapsed(subcategoryId, false);
                             }
                         },
+                        helpText: 'Expand all nested subcategories within this category. This reveals all tracks and subcategories at once, making it easier to browse and select tracks from the entire hierarchy.',
                     },
-                    ...menuItems,
-                ], onMenuItemClick: (_event, callback) => {
-                    callback();
-                    setMenuEl(null);
-                }, open: Boolean(menuEl), onClose: () => {
-                    setMenuEl(null);
-                } })) : null] }));
-}
+                ]
+                : []),
+        ];
+    }, [item, model]);
+    return (_jsx("div", { className: classes.accordionText, onClick: () => {
+            if (!menuOpen) {
+                model.toggleCategory(id);
+            }
+        }, children: _jsxs(Typography, { "data-testid": `htsCategory-${name}`, children: [isOpen ? _jsx(ArrowDropDownIcon, {}) : _jsx(ArrowRightIcon, {}), _jsx(SanitizedHTML, { html: name }), _jsx(CascadingMenuButton, { menuItems: getMenuItems, className: classes.contrastColor, stopPropagation: true, setOpen: setMenuOpen, children: _jsx(MoreHorizIcon, {}) })] }) }));
+});
+export default TrackCategory;

package/esm/HierarchicalTrackSelectorWidget/components/tree/TrackLabel.d.ts

@@ -1,10 +1,14 @@
-import type { NodeData } from '../util';
+import type { HierarchicalTrackSelectorModel } from '../../model.ts';
+import type { TreeTrackNode } from '../../types.ts';
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
 export interface InfoArgs {
     target: HTMLElement;
     id: string;
     conf: AnyConfigurationModel;
 }
-export default function TrackLabel({ data }: {
-    data: NodeData;
-}): import("react/jsx-runtime").JSX.Element;
+declare const TrackLabel: import("react").NamedExoticComponent<{
+    model: HierarchicalTrackSelectorModel;
+    item: TreeTrackNode;
+    checked: boolean;
+}>;
+export default TrackLabel;

package/esm/HierarchicalTrackSelectorWidget/components/tree/TrackLabel.js

@@ -1,10 +1,13 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useCallback } from 'react';
 import { readConfObject } from '@jbrowse/core/configuration';
 import SanitizedHTML from '@jbrowse/core/ui/SanitizedHTML';
+import { getSession } from '@jbrowse/core/util';
+import { makeStyles } from '@jbrowse/core/util/tss-react';
 import { Checkbox, FormControlLabel, Tooltip } from '@mui/material';
-import { makeStyles } from 'tss-react/mui';
-import { isUnsupported } from '../util';
-import TrackLabelMenu from './TrackLabelMenu';
+import { observer } from 'mobx-react';
+import { isUnsupported } from "../util.js";
+import TrackSelectorTrackMenu from "./TrackSelectorTrackMenu.js";
 const useStyles = makeStyles()(theme => ({
     compactCheckbox: {
         padding: 0,
@@ -19,13 +22,28 @@ const useStyles = makeStyles()(theme => ({
         background: '#cccc',
     },
 }));
-export default function TrackLabel({ data }) {
+const TrackCheckbox = memo(function TrackCheckbox({ checked, onChange, id, disabled, className, }) {
+    return (_jsx(Checkbox, { className: className, checked: checked, onChange: onChange, disabled: disabled, slotProps: {
+            input: {
+                'data-testid': `htsTrackEntry-${id}`,
+            },
+        } }));
+});
+const TrackLabelText = observer(function TrackLabelText({ model, conf, id, name, selectedClass, }) {
+    const selected = model.selectionSet.has(conf);
+    return (_jsx("div", { "data-testid": `htsTrackLabel-${id}`, className: selected ? selectedClass : undefined, children: _jsx(SanitizedHTML, { html: name }) }));
+});
+const TrackLabel = memo(function TrackLabel({ model, item, checked, }) {
     const { classes } = useStyles();
-    const { checked, conf, model, drawerPosition, id, trackId, name, selected, onChange, } = data;
+    const { drawerPosition } = getSession(model);
+    const { id, name, conf, trackId } = item;
     const description = readConfObject(conf, 'description');
-    return (_jsxs(_Fragment, { children: [_jsx(Tooltip, { title: description + (selected ? ' (in selection)' : ''), placement: drawerPosition === 'left' ? 'right' : 'left', children: _jsx(FormControlLabel, { className: classes.checkboxLabel, onClick: event => {
+    const onChange = useCallback(() => {
+        model.view.toggleTrack(trackId);
+    }, [model.view, trackId]);
+    return (_jsxs(_Fragment, { children: [_jsx(Tooltip, { title: description, placement: drawerPosition === 'left' ? 'right' : 'left', children: _jsx(FormControlLabel, { className: classes.checkboxLabel, onClick: event => {
                         if (event.ctrlKey || event.metaKey) {
-                            if (selected) {
+                            if (model.selectionSet.has(conf)) {
                                 model.removeFromSelection([conf]);
                             }
                             else {
@@ -33,11 +51,6 @@ export default function TrackLabel({ data }) {
                             }
                             event.preventDefault();
                         }
-                    }, control: _jsx(Checkbox, { className: classes.compactCheckbox, checked: checked, onChange: () => {
-                            onChange(trackId);
-                        }, disabled: isUnsupported(name), slotProps: {
-                            input: {
-                                'data-testid': `htsTrackEntry-${id}`,
-                            },
-                        } }), label: _jsx("div", { "data-testid": `htsTrackLabel-${id}`, className: selected ? classes.selected : undefined, children: _jsx(SanitizedHTML, { html: name }) }) }) }), _jsx(TrackLabelMenu, { model: model, trackId: trackId, id: id, conf: conf })] }));
-}
+                    }, control: _jsx(TrackCheckbox, { checked: checked, onChange: onChange, id: id, disabled: isUnsupported(name), className: classes.compactCheckbox }), label: _jsx(TrackLabelText, { model: model, conf: conf, id: id, name: name, selectedClass: classes.selected }) }) }), _jsx(TrackSelectorTrackMenu, { model: model, id: id, conf: conf })] }));
+});
+export default TrackLabel;

package/{dist/HierarchicalTrackSelectorWidget/components/tree/TrackLabelMenu.d.ts → esm/HierarchicalTrackSelectorWidget/components/tree/TrackSelectorTrackMenu.d.ts}

@@ -1,11 +1,10 @@
-import type { HierarchicalTrackSelectorModel } from '../../model';
+import type { HierarchicalTrackSelectorModel } from '../../model.ts';
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
-declare const TrackLabelMenu: ({ id, trackId, stopPropagation, model, setOpen, conf, }: {
+declare const TrackSelectorTrackMenu: ({ id, stopPropagation, model, setOpen, conf, }: {
     id: string;
-    trackId: string;
     stopPropagation?: boolean;
     conf: AnyConfigurationModel;
     setOpen?: (arg: boolean) => void;
     model: HierarchicalTrackSelectorModel;
 }) => import("react/jsx-runtime").JSX.Element;
-export default TrackLabelMenu;
+export default TrackSelectorTrackMenu;

package/esm/HierarchicalTrackSelectorWidget/components/tree/{TrackLabelMenu.js → TrackSelectorTrackMenu.js}

@@ -1,20 +1,24 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback } from 'react';
 import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
 import { getSession } from '@jbrowse/core/util';
+import { makeStyles } from '@jbrowse/core/util/tss-react';
 import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
 import FilledStarIcon from '@mui/icons-material/Star';
 import StarIcon from '@mui/icons-material/StarBorderOutlined';
-import { makeStyles } from 'tss-react/mui';
 const useStyles = makeStyles()({
     cascadingStyle: {
         padding: 0,
     },
 });
-const TrackLabelMenu = function ({ id, trackId, stopPropagation, model, setOpen, conf, }) {
-    var _a, _b;
+const TrackSelectorTrackMenu = function ({ id, stopPropagation, model, setOpen, conf, }) {
     const { classes } = useStyles();
-    return (_jsx(CascadingMenuButton, { className: classes.cascadingStyle, stopPropagation: stopPropagation, setOpen: setOpen, "data-testid": `htsTrackEntryMenu-${id}`, menuItems: [
-            ...(((_b = (_a = getSession(model)).getTrackActionMenuItems) === null || _b === void 0 ? void 0 : _b.call(_a, conf)) || []),
+    const trackId = conf.trackId;
+    const getMenuItems = useCallback(() => {
+        const session = getSession(model);
+        const flatMenuItems = session.getTrackListMenuItems?.(conf) || [];
+        return [
+            ...flatMenuItems,
             model.isFavorite(trackId)
                 ? {
                     label: 'Remove from favorites',
@@ -46,6 +50,8 @@ const TrackLabelMenu = function ({ id, trackId, stopPropagation, model, setOpen,
                     },
                 ]
                 : []),
-        ], children: _jsx(MoreHorizIcon, {}) }));
+        ];
+    }, [conf, model, trackId]);
+    return (_jsx(CascadingMenuButton, { className: classes.cascadingStyle, stopPropagation: stopPropagation, setOpen: setOpen, "data-testid": `htsTrackEntryMenu-${id}`, menuItems: getMenuItems, children: _jsx(MoreHorizIcon, {}) }));
 };
-export default TrackLabelMenu;
+export default TrackSelectorTrackMenu;

package/esm/HierarchicalTrackSelectorWidget/components/tree/TreeItem.d.ts

@@ -0,0 +1,9 @@
+import type { HierarchicalTrackSelectorModel } from '../../model.ts';
+import type { TreeNode } from '../../types.ts';
+declare const TreeItem: import("react").NamedExoticComponent<{
+    item: TreeNode;
+    model: HierarchicalTrackSelectorModel;
+    top: number;
+    checked?: boolean;
+}>;
+export default TreeItem;

package/esm/HierarchicalTrackSelectorWidget/components/tree/TreeItem.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useMemo } from 'react';
+import { makeStyles } from '@jbrowse/core/util/tss-react';
+import TrackCategory from "./TrackCategory.js";
+import TrackLabel from "./TrackLabel.js";
+import { getItemHeight } from "../../model.js";
+const levelWidth = 10;
+const useStyles = makeStyles()(theme => ({
+    nestingLevelMarker: {
+        position: 'absolute',
+        borderLeft: '1.5px solid #555',
+    },
+    accordionCard: {
+        padding: 3,
+        cursor: 'pointer',
+        display: 'flex',
+    },
+    accordionColor: {
+        background: theme.palette.tertiary.main,
+        color: theme.palette.tertiary.contrastText,
+        width: '100%',
+        display: 'flex',
+        paddingLeft: 5,
+    },
+}));
+const NestingMarkers = memo(function NestingMarkers({ nestingLevel, height, className, }) {
+    const markers = useMemo(() => Array.from({ length: nestingLevel }, (_, idx) => (_jsx("div", { style: { left: idx * levelWidth + 4, height }, className: className }, idx))), [nestingLevel, height, className]);
+    return _jsx(_Fragment, { children: markers });
+});
+const TreeItem = memo(function TreeItem({ item, model, top, checked, }) {
+    const { classes } = useStyles();
+    const isCategory = item.type === 'category';
+    const { nestingLevel } = item;
+    const height = getItemHeight(item);
+    const marginLeft = nestingLevel * levelWidth + (isCategory ? 0 : levelWidth);
+    return (_jsxs("div", { style: {
+            position: 'absolute',
+            width: '100%',
+            display: 'flex',
+            cursor: 'pointer',
+            height,
+            top,
+        }, children: [_jsx(NestingMarkers, { nestingLevel: nestingLevel, height: height, className: classes.nestingLevelMarker }), _jsx("div", { className: isCategory ? classes.accordionCard : undefined, style: {
+                    marginLeft,
+                    whiteSpace: 'nowrap',
+                    flex: 1,
+                }, children: _jsx("div", { className: isCategory ? classes.accordionColor : undefined, children: isCategory ? (_jsx(TrackCategory, { model: model, item: item })) : (_jsx(TrackLabel, { model: model, item: item, checked: checked })) }) })] }));
+});
+export default TreeItem;

package/esm/HierarchicalTrackSelectorWidget/components/tree/trackListStyles.d.ts

@@ -0,0 +1,21 @@
+import type { MenuItem } from '@jbrowse/core/ui/Menu';
+export declare const useSmallBadgeStyles: (_params?: unknown, muiStyleOverridesParams?: {
+    props: {
+        classes?: Record<string, string>;
+    };
+} | undefined) => {
+    classes: Record<"margin" | "smallBadge", string>;
+    theme: import("@mui/material").Theme;
+    css: import("node_modules/@jbrowse/core/src/util/tss-react/types").Css;
+    cx: import("node_modules/@jbrowse/core/src/util/tss-react/types").Cx;
+};
+export declare const badgeAnchorOrigin: {
+    readonly vertical: "bottom";
+    readonly horizontal: "right";
+};
+export declare function getDropdownMenuItems({ hasTracks, clearLabel, emptyLabel, onClear, }: {
+    hasTracks: boolean;
+    clearLabel: string;
+    emptyLabel: string;
+    onClear: () => void;
+}): MenuItem[];

package/esm/HierarchicalTrackSelectorWidget/components/tree/trackListStyles.js

@@ -0,0 +1,29 @@
+import { makeStyles } from '@jbrowse/core/util/tss-react';
+export const useSmallBadgeStyles = makeStyles()({
+    smallBadge: {
+        height: 14,
+    },
+    margin: {
+        marginRight: 10,
+    },
+});
+export const badgeAnchorOrigin = {
+    vertical: 'bottom',
+    horizontal: 'right',
+};
+export function getDropdownMenuItems({ hasTracks, clearLabel, emptyLabel, onClear, }) {
+    return hasTracks
+        ? [
+            { type: 'divider' },
+            {
+                label: clearLabel,
+                onClick: onClear,
+            },
+        ]
+        : [
+            {
+                label: emptyLabel,
+                onClick: () => { },
+            },
+        ];
+}

package/esm/HierarchicalTrackSelectorWidget/components/util.d.ts

@@ -1,23 +1,4 @@
-import type { TreeNode } from '../generateHierarchy';
-import type { HierarchicalTrackSelectorModel } from '../model';
+import type { TreeNode } from '../types.ts';
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
-import type { MenuItem } from '@jbrowse/core/ui';
-export interface NodeData {
-    nestingLevel: number;
-    checked: boolean;
-    conf: AnyConfigurationModel;
-    drawerPosition: unknown;
-    id: string;
-    trackId: string;
-    isLeaf: boolean;
-    name: string;
-    onChange: (trackId: string) => void;
-    toggleCollapse: (arg: string) => void;
-    tree: TreeNode;
-    selected: boolean;
-    menuItems?: MenuItem[];
-    model: HierarchicalTrackSelectorModel;
-}
 export declare function getAllChildren(subtree?: TreeNode): AnyConfigurationModel[];
-export declare function treeToMap(tree: TreeNode, map?: Map<string, TreeNode>): Map<string, TreeNode>;
 export declare function isUnsupported(name?: string): boolean;

package/esm/HierarchicalTrackSelectorWidget/components/util.js

@@ -1,17 +1,8 @@
 export function getAllChildren(subtree) {
-    return (subtree === null || subtree === void 0 ? void 0 : subtree.type) === 'category'
+    return subtree?.type === 'category'
         ? subtree.children.flatMap(t => t.type === 'category' ? getAllChildren(t) : t.conf)
         : [];
 }
-export function treeToMap(tree, map = new Map()) {
-    if (tree.id && tree.children.length) {
-        map.set(tree.id, tree);
-    }
-    for (const node of tree.children) {
-        treeToMap(node, map);
-    }
-    return map;
-}
 export function isUnsupported(name = '') {
     return name.endsWith('(Unsupported)') || name.endsWith('(Unknown)');
 }

package/esm/HierarchicalTrackSelectorWidget/configSchema.d.ts

@@ -1,2 +1,2 @@
-declare const configSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>;
+declare const configSchema: import("node_modules/@jbrowse/core/src/configuration/configurationSchema").ConfigurationSchemaType<{}, import("node_modules/@jbrowse/core/src/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>;
 export default configSchema;

package/esm/HierarchicalTrackSelectorWidget/facetedModel.d.ts

@@ -1,10 +1,10 @@
-import type { Instance } from 'mobx-state-tree';
-export declare function facetedStateTreeF(): import("mobx-state-tree").IModelType<{
-    filterText: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
-    showSparse: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
-    showFilters: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
-    showOptions: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
-    panelWidth: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<number>, [undefined]>;
+import type { Instance } from '@jbrowse/mobx-state-tree';
+export declare function facetedStateTreeF(): import("@jbrowse/mobx-state-tree").IModelType<{
+    filterText: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<string>, [undefined]>;
+    showSparse: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<boolean>, [undefined]>;
+    showFilters: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<boolean>, [undefined]>;
+    showOptions: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<boolean>, [undefined]>;
+    panelWidth: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<number>, [undefined]>;
 }, {
     visible: Record<string, boolean>;
     useShoppingCart: boolean;
@@ -17,32 +17,25 @@ export declare function facetedStateTreeF(): import("mobx-state-tree").IModelTyp
     setShowSparse(f: boolean): void;
     setShowOptions(f: boolean): void;
     setShowFilters(f: boolean): void;
+    setVisible(args: Record<string, boolean>): void;
 } & {
     readonly allTrackConfigurations: ({
         [x: string]: any;
-    } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
+    } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & {
         setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
             [x: string]: any;
-        } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
-            setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
-                [x: string]: any;
-            } & import("mobx-state-tree/dist/internal").NonEmptyObject & any & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
-        } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
-    } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>)[];
+        } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & any & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
+    } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>)[];
 } & {
     readonly rows: {
         readonly id: string;
         readonly conf: {
             [x: string]: any;
-        } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
+        } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & {
             setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
                 [x: string]: any;
-            } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
-                setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
-                    [x: string]: any;
-                } & import("mobx-state-tree/dist/internal").NonEmptyObject & any & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
-            } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
-        } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>;
+            } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & any & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
+        } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>;
         readonly name: string;
         readonly category: string;
         readonly adapter: string;
@@ -58,15 +51,11 @@ export declare function facetedStateTreeF(): import("mobx-state-tree").IModelTyp
         readonly id: string;
         readonly conf: {
             [x: string]: any;
-        } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
+        } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & {
             setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
                 [x: string]: any;
-            } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
-                setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
-                    [x: string]: any;
-                } & import("mobx-state-tree/dist/internal").NonEmptyObject & any & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
-            } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
-        } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>;
+            } & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject & any & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
+        } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>;
         readonly name: string;
         readonly category: string;
         readonly adapter: string;
@@ -74,9 +63,14 @@ export declare function facetedStateTreeF(): import("mobx-state-tree").IModelTyp
         readonly metadata: Record<string, unknown>;
     }[];
 } & {
-    setVisible(args: Record<string, boolean>): void;
     afterAttach(): void;
-}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;
+}, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree").ModelSnapshotType<{
+    filterText: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<string>, [undefined]>;
+    showSparse: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<boolean>, [undefined]>;
+    showFilters: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<boolean>, [undefined]>;
+    showOptions: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<boolean>, [undefined]>;
+    panelWidth: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<number>, [undefined]>;
+}>>;
 export type FacetedStateModel = ReturnType<typeof facetedStateTreeF>;
 export type FacetedModel = Instance<FacetedStateModel>;
 export type FacetedRow = FacetedModel['filteredRows'][0];