@jbrowse/core 4.0.3 → 4.0.4

package/esm/BaseFeatureWidget/BaseFeatureDetail/ArrayValue.js

@@ -1,9 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
 import Attributes from "./Attributes.js";
 import BasicValue from "./BasicValue.js";
 import FieldName from "./FieldName.js";
 import { isObject } from "../../util/index.js";
 import { makeStyles } from "../../util/tss-react/index.js";
+const MAX_ARRAY_LENGTH = 100;
 const useStyles = makeStyles()(theme => ({
     field: {
         display: 'flex',
@@ -20,6 +22,9 @@ const useStyles = makeStyles()(theme => ({
 }));
 export default function ArrayValue({ name, value, description, formatter, prefix = [], }) {
     const { classes } = useStyles();
+    const [showAll, setShowAll] = useState(false);
+    const needsTruncation = value.length > MAX_ARRAY_LENGTH;
+    const displayedValues = needsTruncation && !showAll ? value.slice(0, MAX_ARRAY_LENGTH) : value;
     if (value.length === 1) {
         return isObject(value[0]) ? (_jsx(Attributes, { formatter: formatter, attributes: value[0], prefix: [...prefix, name] })) : (_jsxs("div", { className: classes.field, children: [_jsx(FieldName, { prefix: prefix, description: description, name: name }), _jsx(BasicValue, { value: formatter ? formatter(value[0], name) : value[0] })] }));
     }
@@ -27,6 +32,10 @@ export default function ArrayValue({ name, value, description, formatter, prefix
         return (_jsx(_Fragment, { children: value.map((val, i) => (_jsx(Attributes, { formatter: formatter, attributes: val, prefix: [...prefix, `${name}-${i}`] }, `${JSON.stringify(val)}-${i}`))) }));
     }
     else {
-        return (_jsxs("div", { className: classes.field, children: [_jsx(FieldName, { prefix: prefix, description: description, name: name }), value.map((val, i) => (_jsx("div", { className: classes.fieldSubvalue, children: _jsx(BasicValue, { value: formatter ? formatter(val, name) : val }) }, `${JSON.stringify(val)}-${i}`)))] }));
+        return (_jsxs("div", { className: classes.field, children: [_jsx(FieldName, { prefix: prefix, description: description, name: name }), displayedValues.map((val, i) => (_jsx("div", { className: classes.fieldSubvalue, children: _jsx(BasicValue, { value: formatter ? formatter(val, name) : val }) }, `${JSON.stringify(val)}-${i}`))), needsTruncation ? (_jsx("button", { type: "button", onClick: () => {
+                        setShowAll(val => !val);
+                    }, children: showAll
+                        ? 'Show less'
+                        : `Showing ${MAX_ARRAY_LENGTH} of ${value.length}. Show all...` })) : null] }));
     }
 }

package/esm/pluggableElementTypes/models/BaseDisplayModel.d.ts

@@ -52,6 +52,7 @@ export declare const BaseDisplay: import("@jbrowse/mobx-state-tree").IModelType<
     }> | null;
     readonly adapterConfig: any;
     readonly parentTrack: import("../../util/index.ts").AbstractTrackModel;
+    readonly isMinimized: boolean;
     readonly parentDisplay: any;
     readonly effectiveRpcDriverName: any;
 } & {
@@ -108,6 +109,7 @@ export declare const BaseDisplay: import("@jbrowse/mobx-state-tree").IModelType<
             }> | null;
             readonly adapterConfig: any;
             readonly parentTrack: import("../../util/index.ts").AbstractTrackModel;
+            readonly isMinimized: boolean;
             readonly parentDisplay: any;
             readonly effectiveRpcDriverName: any;
         } & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IModelType<{
@@ -161,6 +163,7 @@ export declare const BaseDisplay: import("@jbrowse/mobx-state-tree").IModelType<
             }> | null;
             readonly adapterConfig: any;
             readonly parentTrack: import("../../util/index.ts").AbstractTrackModel;
+            readonly isMinimized: boolean;
             readonly parentDisplay: any;
             readonly effectiveRpcDriverName: any;
         }, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>;

package/esm/pluggableElementTypes/models/BaseDisplayModel.js

@@ -30,6 +30,9 @@ function stateModelFactory() {
         get parentTrack() {
             return getContainingTrack(self);
         },
+        get isMinimized() {
+            return this.parentTrack.minimized;
+        },
         get parentDisplay() {
             try {
                 const parent = getParent(self);
@@ -62,7 +65,7 @@ function stateModelFactory() {
         renderProps() {
             return {
                 ...getParentRenderProps(self),
-                notReady: getContainingView(self).minimized,
+                notReady: self.isMinimized || getContainingView(self).minimized,
                 rpcDriverName: self.effectiveRpcDriverName,
             };
         },

package/esm/ui/CascadingMenu.js

@@ -5,9 +5,16 @@ import { Divider, ListItemIcon, ListItemText, ListSubheader, Menu, MenuItem, } f
 import CascadingMenuHelpIconButton from "./CascadingMenuHelpIconButton.js";
 import HoverMenu from "./HoverMenu.js";
 import { MenuItemEndDecoration } from "./MenuItems.js";
+function labelToTestId(label) {
+    if (typeof label === 'string') {
+        return label.toLowerCase().replace(/\s+/g, '_');
+    }
+    return undefined;
+}
 function CascadingSubmenu({ title, Icon, inset, menuItems, onMenuItemClick, closeAfterItemClick, onCloseRoot, isOpen, onOpen, onClose, }) {
     const [anchorEl, setAnchorEl] = useState(null);
-    return (_jsxs(_Fragment, { children: [_jsxs(MenuItem, { ref: setAnchorEl, onMouseOver: onOpen, onFocus: onOpen, onClick: onOpen, children: [Icon ? (_jsx(ListItemIcon, { children: _jsx(Icon, {}) })) : null, _jsx(ListItemText, { primary: title, inset: inset }), _jsx(ChevronRight, {})] }), _jsx(HoverMenu, { open: isOpen, anchorEl: anchorEl, onClose: onClose, anchorOrigin: { vertical: 'top', horizontal: 'right' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, children: _jsx(CascadingMenuList, { closeAfterItemClick: closeAfterItemClick, onMenuItemClick: onMenuItemClick, menuItems: menuItems, onCloseRoot: onCloseRoot }) })] }));
+    const testId = labelToTestId(title);
+    return (_jsxs(_Fragment, { children: [_jsxs(MenuItem, { ref: setAnchorEl, "data-testid": testId ? `cascading-submenu-${testId}` : undefined, onMouseOver: onOpen, onFocus: onOpen, onClick: onOpen, children: [Icon ? (_jsx(ListItemIcon, { children: _jsx(Icon, {}) })) : null, _jsx(ListItemText, { primary: title, inset: inset }), _jsx(ChevronRight, {})] }), _jsx(HoverMenu, { open: isOpen, anchorEl: anchorEl, onClose: onClose, anchorOrigin: { vertical: 'top', horizontal: 'right' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, children: _jsx(CascadingMenuList, { closeAfterItemClick: closeAfterItemClick, onMenuItemClick: onMenuItemClick, menuItems: menuItems, onCloseRoot: onCloseRoot }) })] }));
 }
 function CascadingMenuList({ onMenuItemClick, closeAfterItemClick, menuItems, onCloseRoot, }) {
     const [openSubmenuIdx, setOpenSubmenuIdx] = useState();
@@ -34,7 +41,8 @@ function CascadingMenuList({ onMenuItemClick, closeAfterItemClick, menuItems, on
             const actionItem = item;
             const helpText = actionItem.helpText;
             const isCheckOrRadio = actionItem.type === 'checkbox' || actionItem.type === 'radio';
-            return (_jsxs(MenuItem, { disabled: Boolean(actionItem.disabled), onClick: event => {
+            const itemTestId = labelToTestId(actionItem.label);
+            return (_jsxs(MenuItem, { "data-testid": itemTestId ? `cascading-menuitem-${itemTestId}` : undefined, disabled: Boolean(actionItem.disabled), onClick: event => {
                     if (closeAfterItemClick) {
                         onCloseRoot();
                     }

package/esm/ui/HoverMenu.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
 import type { MenuProps } from '@mui/material';
-declare const HoverMenu: React.ComponentType<MenuProps>;
+declare const HoverMenu: React.ForwardRefExoticComponent<Omit<MenuProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export default HoverMenu;

package/esm/util/types/ElementId.d.ts

@@ -1 +1,2 @@
+export declare function createElementId(): string;
 export declare const ElementId: import("@jbrowse/mobx-state-tree").IOptionalIType<import("@jbrowse/mobx-state-tree").ISimpleType<string>, [undefined]>;

package/esm/util/types/ElementId.js

@@ -1,3 +1,6 @@
 import { types } from '@jbrowse/mobx-state-tree';
 import { nanoid } from "../nanoid.js";
-export const ElementId = types.optional(types.identifier, () => nanoid(10));
+export function createElementId() {
+    return nanoid(10);
+}
+export const ElementId = types.optional(types.identifier, createElementId);

package/esm/util/types/index.d.ts

@@ -190,6 +190,7 @@ export interface AbstractTrackModel {
     configuration: AnyConfigurationModel & {
         displays: Display[];
     };
+    minimized: boolean;
 }
 export declare function isTrackModel(thing: unknown): thing is AbstractTrackModel;
 export interface AbstractDisplayModel {

package/esm/util/types/mst.d.ts

@@ -104,4 +104,4 @@ export declare const FileLocation: import("@jbrowse/mobx-state-tree").ISnapshotP
         authInfo: import("@jbrowse/mobx-state-tree").IType<any, any, any>;
     }, {}, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>>;
 }>> & import("@jbrowse/mobx-state-tree/dist/internal").NonEmptyObject)>, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>;
-export { ElementId } from './ElementId.ts';
+export { ElementId, createElementId } from './ElementId.ts';

package/esm/util/types/mst.js

@@ -65,4 +65,4 @@ export const FileLocation = types.snapshotProcessor(types.union(LocalPathLocatio
         return snap;
     },
 });
-export { ElementId } from "./ElementId.js";
+export { ElementId, createElementId } from "./ElementId.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/core",
-  "version": "4.0.3",
+  "version": "4.0.4",
   "type": "module",
   "description": "JBrowse 2 core libraries used by plugins",
   "keywords": [
@@ -398,10 +398,6 @@
       "types": "./esm/util/mst-reflection.d.ts",
       "import": "./esm/util/mst-reflection.js"
     },
-    "./util/nanoid": {
-      "types": "./esm/util/nanoid.d.ts",
-      "import": "./esm/util/nanoid.js"
-    },
     "./util/offscreenCanvasPonyfill": {
       "types": "./esm/util/offscreenCanvasPonyfill.d.ts",
       "import": "./esm/util/offscreenCanvasPonyfill.js"
@@ -457,6 +453,10 @@
     "./ui/ReturnToImportFormDialog": {
       "types": "./esm/ui/ReturnToImportFormDialog.d.ts",
       "import": "./esm/ui/ReturnToImportFormDialog.js"
+    },
+    "./util/nanoid": {
+      "types": "./esm/util/nanoid.d.ts",
+      "import": "./esm/util/nanoid.js"
     }
   },
   "files": [
@@ -468,8 +468,8 @@
     "@emotion/utils": "^1.4.2",
     "@floating-ui/react": "^0.27.16",
     "@gmod/abortable-promise-cache": "^3.0.4",
-    "@gmod/bgzf-filehandle": "^6.0.9",
-    "@gmod/http-range-fetcher": "^5.0.6",
+    "@gmod/bgzf-filehandle": "^6.0.10",
+    "@gmod/http-range-fetcher": "^5.0.7",
     "@jbrowse/jexl": "^3.0.1",
     "@jbrowse/mobx-state-tree": "^5.5.0",
     "@jbrowse/quick-lru": "^7.3.5",
@@ -478,7 +478,8 @@
     "@mui/material": "^7.3.6",
     "@mui/system": "^7.3.6",
     "@mui/types": "^7.4.9",
-    "@mui/x-data-grid": "^8.23.0",
+    "@mui/x-data-grid": "^8.25.0",
+    "@types/file-saver-es": "^2.0.3",
     "canvas-sequencer-ts": "^3.1.3",
     "canvas2svg": "^1.0.16",
     "colord": "^2.9.3",
@@ -488,7 +489,6 @@
     "dompurify": "^3.3.1",
     "escape-html": "^1.0.3",
     "fast-deep-equal": "^3.1.3",
-    "@types/file-saver-es": "^2.0.3",
     "file-saver-es": "^2.0.5",
     "generic-filehandle2": "^2.0.18",
     "librpc-web-mod": "^2.1.1",