react-msaview 8.2.0 → 8.4.0

package/dist/components/dialogs/FeatureDialog.js

@@ -1,14 +1,13 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { Dialog } from '@jbrowse/core/ui';
-import { Button, Checkbox, DialogContent, Table, TableBody, TableCell, TableHead, TableRow, } from '@mui/material';
+import { Button, Checkbox, DialogContent, Table, TableBody, TableCell, TableHead, TableRow, TextField, } from '@mui/material';
 import { observer } from 'mobx-react';
-const Toggles = observer(function ({ model }) {
-    // the accessions the file has, not the ones the filter map happens to hold:
-    // that map now carries only what the reader turned off, and before that it
-    // accumulated every accession of every file opened in this view
-    const { annotationTypes } = model;
+function matches(type, query) {
+    return [type.accession, type.name, type.description].some(field => field?.toLowerCase().includes(query));
+}
+const Toggles = observer(function ({ model, accessions, }) {
     const setAll = (shown) => {
-        for (const accession of annotationTypes.keys()) {
+        for (const accession of accessions) {
             model.setFilter(accession, shown);
         }
     };
@@ -22,6 +21,9 @@ const Toggles = observer(function ({ model }) {
 });
 const FeatureTable = observer(function ({ model }) {
     const { annotationTypes, annotations, featureColors, fillPalette } = model;
+    const [query, setQuery] = useState('');
+    const needle = query.trim().toLowerCase();
+    const types = [...annotationTypes.values()].filter(type => !needle || matches(type, needle));
     const counts = new Map();
     const swatches = new Map();
     for (const annot of annotations) {
@@ -32,7 +34,10 @@ const FeatureTable = observer(function ({ model }) {
         }
     }
     return (React.createElement(React.Fragment, null,
-        React.createElement(Toggles, { model: model }),
+        React.createElement(TextField, { label: "Filter", size: "small", value: query, onChange: event => {
+                setQuery(event.target.value);
+            } }),
+        React.createElement(Toggles, { model: model, accessions: types.map(t => t.accession) }),
         React.createElement(Table, { size: "small" },
             React.createElement(TableHead, null,
                 React.createElement(TableRow, null,
@@ -42,7 +47,7 @@ const FeatureTable = observer(function ({ model }) {
                     React.createElement(TableCell, null, "name"),
                     React.createElement(TableCell, null, "count"),
                     React.createElement(TableCell, null, "description"))),
-            React.createElement(TableBody, null, [...annotationTypes.values()].map(({ accession, name, description }) => (React.createElement(TableRow, { key: accession },
+            React.createElement(TableBody, null, types.map(({ accession, name, description }) => (React.createElement(TableRow, { key: accession },
                 React.createElement(TableCell, { padding: "checkbox" },
                     React.createElement(Checkbox, { checked: !model.turnedOffFeatures.get(accession), onChange: () => {
                             model.setFilter(accession, !!model.turnedOffFeatures.get(accession));

package/dist/components/dialogs/FeatureDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"FeatureDialog.js","sourceRoot":"","sources":["../../../src/components/dialogs/FeatureDialog.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"FeatureDialog.js","sourceRoot":"","sources":["../../../src/components/dialogs/FeatureDialog.tsx"],"names":[],"mappings":"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"}

package/dist/components/dialogs/MetadataDialog.js

@@ -1,9 +1,8 @@
 import React from 'react';
-import Attributes from '@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail/Attributes';
-import BaseCard from '@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail/BaseCard';
 import { Dialog } from '@jbrowse/core/ui';
-import { DialogContent } from '@mui/material';
+import { DialogContent, Typography } from '@mui/material';
 import { observer } from 'mobx-react';
+import MetadataTable, { isEmpty } from '../MetadataTable.js';
 import SequenceTextArea from '../SequenceTextArea.js';
 const MetadataDialog = observer(function ({ model, onClose, }) {
     const { header } = model;
@@ -11,9 +10,9 @@ const MetadataDialog = observer(function ({ model, onClose, }) {
             onClose();
         }, open: true, title: "Metadata", maxWidth: "xl" },
         React.createElement(DialogContent, null,
-            React.createElement(Attributes, { attributes: header }),
-            React.createElement(BaseCard, { title: "sequence" },
-                React.createElement(SequenceTextArea, { str: model.rows })))));
+            Object.values(header).every(isEmpty) ? (React.createElement(Typography, null, "This alignment has no metadata.")) : (React.createElement(MetadataTable, { record: header })),
+            React.createElement(Typography, { variant: "h6" }, "Sequences"),
+            React.createElement(SequenceTextArea, { str: model.rows }))));
 });
 export default MetadataDialog;
 //# sourceMappingURL=MetadataDialog.js.map

package/dist/components/dialogs/MetadataDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"MetadataDialog.js","sourceRoot":"","sources":["../../../src/components/dialogs/MetadataDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,UAAU,MAAM,8DAA8D,CAAA;AACrF,OAAO,QAAQ,MAAM,4DAA4D,CAAA;AACjF,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,gBAAgB,MAAM,wBAAyB,CAAA;AAItD,MAAM,cAAc,GAAG,QAAQ,CAAC,UAAU,EACxC,KAAK,EACL,OAAO,GAIR;IACC,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAA;IAExB,OAAO,CACL,oBAAC,MAAM,IACL,OAAO,EAAE,GAAG,EAAE;YACZ,OAAO,EAAE,CAAA;QACX,CAAC,EACD,IAAI,QACJ,KAAK,EAAC,UAAU,EAChB,QAAQ,EAAC,IAAI;QAEb,oBAAC,aAAa;YACZ,oBAAC,UAAU,IAAC,UAAU,EAAE,MAAM,GAAI;YAClC,oBAAC,QAAQ,IAAC,KAAK,EAAC,UAAU;gBACxB,oBAAC,gBAAgB,IAAC,GAAG,EAAE,KAAK,CAAC,IAAI,GAAI,CAC5B,CACG,CACT,CACV,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,cAAc,CAAA"}
+{"version":3,"file":"MetadataDialog.js","sourceRoot":"","sources":["../../../src/components/dialogs/MetadataDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,aAAa,EAAE,EAAE,OAAO,EAAE,MAAM,qBAAsB,CAAA;AAC7D,OAAO,gBAAgB,MAAM,wBAAyB,CAAA;AAItD,MAAM,cAAc,GAAG,QAAQ,CAAC,UAAU,EACxC,KAAK,EACL,OAAO,GAIR;IACC,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAA;IACxB,OAAO,CACL,oBAAC,MAAM,IACL,OAAO,EAAE,GAAG,EAAE;YACZ,OAAO,EAAE,CAAA;QACX,CAAC,EACD,IAAI,QACJ,KAAK,EAAC,UAAU,EAChB,QAAQ,EAAC,IAAI;QAEb,oBAAC,aAAa;YACX,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CACtC,oBAAC,UAAU,0CAA6C,CACzD,CAAC,CAAC,CAAC,CACF,oBAAC,aAAa,IAAC,MAAM,EAAE,MAAM,GAAI,CAClC;YACD,oBAAC,UAAU,IAAC,OAAO,EAAC,IAAI,gBAAuB;YAC/C,oBAAC,gBAAgB,IAAC,GAAG,EAAE,KAAK,CAAC,IAAI,GAAI,CACvB,CACT,CACV,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,cAAc,CAAA"}

package/dist/components/getVisibleLeaves.d.ts

@@ -11,4 +11,4 @@ export declare function getVisibleLeaves({ model, offsetY, blockSizeY, }: {
     model: MsaViewModel;
     offsetY: number;
     blockSizeY: number;
-}): import("../hierarchy.ts").HierarchyNode<import("../types.ts").NodeWithIdsAndLength>[];
+}): import("../hierarchy.ts").HierarchyNode<import("../types.ts").NodeWithIds>[];

package/dist/components/header/ColorSchemeMenu.d.ts

@@ -1,5 +1,11 @@
 import React from 'react';
 import type { MsaViewModel } from '../../model.ts';
+export declare function colorSchemeMenuItems(model: MsaViewModel): {
+    readonly label: string;
+    readonly type: 'radio';
+    readonly checked: boolean;
+    readonly onClick: () => void;
+}[];
 declare const ColorSchemeMenu: ({ model }: {
     model: MsaViewModel;
 }) => React.JSX.Element;

package/dist/components/header/ColorSchemeMenu.js

@@ -3,16 +3,34 @@ import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
 import Palette from '@mui/icons-material/Palette';
 import { observer } from 'mobx-react';
 import colorSchemes from '../../colorSchemes.js';
-const ColorSchemeMenu = observer(function ({ model }) {
-    const { colorSchemeName } = model;
-    return (React.createElement(CascadingMenuButton, { "data-testid": "color_scheme_menu", tooltip: "Color scheme", closeAfterItemClick: true, anchorOrigin: { vertical: 'bottom', horizontal: 'left' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, menuItems: Object.keys(colorSchemes).map(option => ({
+// While a `customColorScheme` map is set, a checked Custom entry stands for it
+// and no named scheme is checked. Picking a named scheme clears the map.
+export function colorSchemeMenuItems(model) {
+    const { colorSchemeName, customColorScheme } = model;
+    const custom = customColorScheme
+        ? [
+            {
+                label: 'Custom',
+                type: 'radio',
+                checked: true,
+                onClick: () => { },
+            },
+        ]
+        : [];
+    return [
+        ...custom,
+        ...Object.keys(colorSchemes).map(option => ({
             label: option,
             type: 'radio',
-            checked: colorSchemeName === option,
+            checked: !customColorScheme && colorSchemeName === option,
             onClick: () => {
                 model.setColorSchemeName(option);
             },
-        })) },
+        })),
+    ];
+}
+const ColorSchemeMenu = observer(function ({ model }) {
+    return (React.createElement(CascadingMenuButton, { "data-testid": "color_scheme_menu", tooltip: "Color scheme", closeAfterItemClick: true, anchorOrigin: { vertical: 'bottom', horizontal: 'left' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, menuItems: colorSchemeMenuItems(model) },
         React.createElement(Palette, null)));
 });
 export default ColorSchemeMenu;

package/dist/components/header/ColorSchemeMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorSchemeMenu.js","sourceRoot":"","sources":["../../../src/components/header/ColorSchemeMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,OAAO,MAAM,6BAA6B,CAAA;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,YAAY,MAAM,uBAAuB,CAAA;AAIhD,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IAC3E,MAAM,EAAE,eAAe,EAAE,GAAG,KAAK,CAAA;IACjC,OAAO,CACL,oBAAC,mBAAmB,mBACN,mBAAmB,EAC/B,OAAO,EAAC,cAAc,EACtB,mBAAmB,QACnB,YAAY,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,eAAe,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CACtC,MAAM,CAAC,EAAE,CACP,CAAC;YACC,KAAK,EAAE,MAAM;YACb,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,eAAe,KAAK,MAAM;YACnC,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAA;YAClC,CAAC;SACF,CAAU,CACd;QAED,oBAAC,OAAO,OAAG,CACS,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}
+{"version":3,"file":"ColorSchemeMenu.js","sourceRoot":"","sources":["../../../src/components/header/ColorSchemeMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,OAAO,MAAM,6BAA6B,CAAA;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,YAAY,MAAM,uBAAuB,CAAA;AAIhD,+EAA+E;AAC/E,yEAAyE;AACzE,MAAM,UAAU,oBAAoB,CAAC,KAAmB;IACtD,MAAM,EAAE,eAAe,EAAE,iBAAiB,EAAE,GAAG,KAAK,CAAA;IACpD,MAAM,MAAM,GAAG,iBAAiB;QAC9B,CAAC,CAAC;YACE;gBACE,KAAK,EAAE,QAAQ;gBACf,IAAI,EAAE,OAAO;gBACb,OAAO,EAAE,IAAI;gBACb,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;aACT;SACX;QACH,CAAC,CAAC,EAAE,CAAA;IACN,OAAO;QACL,GAAG,MAAM;QACT,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAC9B,MAAM,CAAC,EAAE,CACP,CAAC;YACC,KAAK,EAAE,MAAM;YACb,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,CAAC,iBAAiB,IAAI,eAAe,KAAK,MAAM;YACzD,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAA;YAClC,CAAC;SACF,CAAU,CACd;KACF,CAAA;AACH,CAAC;AAED,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IAC3E,OAAO,CACL,oBAAC,mBAAmB,mBACN,mBAAmB,EAC/B,OAAO,EAAC,cAAc,EACtB,mBAAmB,QACnB,YAAY,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,eAAe,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,SAAS,EAAE,oBAAoB,CAAC,KAAK,CAAC;QAEtC,oBAAC,OAAO,OAAG,CACS,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}

package/dist/components/header/FileMenu.js

@@ -1,5 +1,6 @@
 import React, { lazy } from 'react';
 import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
+import AccountTree from '@mui/icons-material/AccountTree';
 import Assignment from '@mui/icons-material/Assignment';
 import FolderOpen from '@mui/icons-material/FolderOpen';
 import Menu from '@mui/icons-material/Menu';
@@ -37,6 +38,14 @@ const FileMenu = observer(({ model }) => {
                     model,
                 }),
             },
+            {
+                label: 'Export tree (Newick)',
+                icon: AccountTree,
+                disabled: !!model.tree.noTree,
+                onClick: () => {
+                    model.exportNewick();
+                },
+            },
             {
                 label: 'Export SVG',
                 icon: PhotoCamera,

package/dist/components/header/FileMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileMenu.js","sourceRoot":"","sources":["../../../src/components/header/FileMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAEnC,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,IAAI,MAAM,0BAA0B,CAAA;AAC3C,OAAO,WAAW,MAAM,iCAAiC,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAA;AAI5D,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,8BAA+B,CAAC,CAAC,CAAA;AAC1E,MAAM,eAAe,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,+BAAgC,CAAC,CAAC,CAAA;AAE5E,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,EAAE,KAAK,EAA2B,EAAE,EAAE;IAC/D,OAAO,CACL,oBAAC,mBAAmB,mBACN,WAAW,EACvB,OAAO,EAAC,MAAM,EACd,SAAS,EAAE;YACT;gBACE,KAAK,EAAE,uBAAuB;gBAC9B,IAAI,EAAE,UAAU;gBAChB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,KAAK,EAAE,CAAA;gBACf,CAAC;aACF;YACD;gBACE,KAAK,EAAE,UAAU;gBACjB,IAAI,EAAE,UAAU;gBAChB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,CAAC;wBAC3B,cAAc;wBACd;4BACE,KAAK;4BACL,OAAO;yBACR;qBACF,CAAC,CAAA;gBACJ,CAAC;aACF;YACD;gBACE,KAAK,EAAE,aAAa;gBACpB,IAAI,EAAE,SAAS;gBACf,OAAO,EAAE,kBAAkB,CAAC;oBAC1B,KAAK;iBACN,CAAC;aACH;YACD;gBACE,KAAK,EAAE,YAAY;gBACnB,IAAI,EAAE,WAAW;gBACjB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,CAAC;wBAC3B,eAAe;wBACf;4BACE,OAAO;4BACP,KAAK;yBACN;qBACF,CAAC,CAAA;gBACJ,CAAC;aACF;SACF,EACD,YAAY,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,eAAe,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE;QAExD,oBAAC,IAAI,OAAG,CACY,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"FileMenu.js","sourceRoot":"","sources":["../../../src/components/header/FileMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAEnC,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,WAAW,MAAM,iCAAiC,CAAA;AACzD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,IAAI,MAAM,0BAA0B,CAAA;AAC3C,OAAO,WAAW,MAAM,iCAAiC,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAA;AAI5D,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,8BAA+B,CAAC,CAAC,CAAA;AAC1E,MAAM,eAAe,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,+BAAgC,CAAC,CAAC,CAAA;AAE5E,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,EAAE,KAAK,EAA2B,EAAE,EAAE;IAC/D,OAAO,CACL,oBAAC,mBAAmB,mBACN,WAAW,EACvB,OAAO,EAAC,MAAM,EACd,SAAS,EAAE;YACT;gBACE,KAAK,EAAE,uBAAuB;gBAC9B,IAAI,EAAE,UAAU;gBAChB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,KAAK,EAAE,CAAA;gBACf,CAAC;aACF;YACD;gBACE,KAAK,EAAE,UAAU;gBACjB,IAAI,EAAE,UAAU;gBAChB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,CAAC;wBAC3B,cAAc;wBACd;4BACE,KAAK;4BACL,OAAO;yBACR;qBACF,CAAC,CAAA;gBACJ,CAAC;aACF;YACD;gBACE,KAAK,EAAE,aAAa;gBACpB,IAAI,EAAE,SAAS;gBACf,OAAO,EAAE,kBAAkB,CAAC;oBAC1B,KAAK;iBACN,CAAC;aACH;YACD;gBACE,KAAK,EAAE,sBAAsB;gBAC7B,IAAI,EAAE,WAAW;gBACjB,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM;gBAC7B,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,YAAY,EAAE,CAAA;gBACtB,CAAC;aACF;YACD;gBACE,KAAK,EAAE,YAAY;gBACnB,IAAI,EAAE,WAAW;gBACjB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,CAAC;wBAC3B,eAAe;wBACf;4BACE,OAAO;4BACP,KAAK;yBACN;qBACF,CAAC,CAAA;gBACJ,CAAC;aACF;SACF,EACD,YAAY,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,EACxD,eAAe,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE;QAExD,oBAAC,IAAI,OAAG,CACY,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}

package/dist/components/header/GappynessSlider.js

@@ -1,15 +1,17 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { Slider, Typography } from '@mui/material';
 import { observer } from 'mobx-react';
 const GappynessSlider = observer(function GappynessSlider({ model, }) {
     const { hideGaps, allowedGappyness } = model;
+    const [dragValue, setDragValue] = useState();
+    const value = dragValue ?? allowedGappyness;
     if (!hideGaps) {
         return null;
     }
     return (React.createElement("div", { style: { display: 'flex', alignItems: 'center', gap: 8 } },
         React.createElement(Typography, { style: { whiteSpace: 'nowrap' } },
             "Hide columns w/ \u2265",
-            allowedGappyness,
+            value,
             "% gaps"),
         React.createElement(Slider
         // In JBrowse other MUI Sliders share the page, so `.MuiSlider-thumb`
@@ -19,8 +21,18 @@ const GappynessSlider = observer(function GappynessSlider({ model, }) {
         //
         // Not `slotProps={{ input: ... }}`: that widens `onChange`'s `val` to
         // `number | number[]`, which setAllowedGappyness rejects.
-        , { "data-testid": "gappyness_slider", style: { width: 100 }, min: 1, max: 100, value: allowedGappyness, onChange: (_, val) => {
+        //
+        // The thumb follows local state while dragging and the model takes the
+        // value on release, since each write recomputes the gap columns over
+        // the whole alignment.
+        //
+        // The thumb centers on the track's ends, so the margin keeps its
+        // overhang off the label and the row search beside it.
+        , { "data-testid": "gappyness_slider", style: { width: 100, marginInline: 10 }, min: 1, max: 100, value: value, onChange: (_, val) => {
+                setDragValue(val);
+            }, onChangeCommitted: (_, val) => {
                 model.setAllowedGappyness(val);
+                setDragValue(undefined);
             } })));
 });
 export default GappynessSlider;

package/dist/components/header/GappynessSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"GappynessSlider.js","sourceRoot":"","sources":["../../../src/components/header/GappynessSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,eAAe,GAAG,QAAQ,CAAC,SAAS,eAAe,CAAC,EACxD,KAAK,GAGN;IACC,MAAM,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAG,KAAK,CAAA;IAC5C,IAAI,CAAC,QAAQ,EAAE,CAAC;QACd,OAAO,IAAI,CAAA;IACb,CAAC;IACD,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE;QAI3D,oBAAC,UAAU,IAAC,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE;;YACpB,gBAAgB;qBAC1B;QACb,oBAAC,MAAM;QACL,qEAAqE;QACrE,6DAA6D;QAC7D,wEAAwE;QACxE,yCAAyC;QACzC,EAAE;QACF,sEAAsE;QACtE,0DAA0D;2BAC9C,kBAAkB,EAC9B,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,EACrB,GAAG,EAAE,CAAC,EACN,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,gBAAgB,EACvB,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE;gBACnB,KAAK,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAA;YAChC,CAAC,GACD,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}
+{"version":3,"file":"GappynessSlider.js","sourceRoot":"","sources":["../../../src/components/header/GappynessSlider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,eAAe,GAAG,QAAQ,CAAC,SAAS,eAAe,CAAC,EACxD,KAAK,GAGN;IACC,MAAM,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAG,KAAK,CAAA;IAC5C,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,EAAU,CAAA;IACpD,MAAM,KAAK,GAAG,SAAS,IAAI,gBAAgB,CAAA;IAC3C,IAAI,CAAC,QAAQ,EAAE,CAAC;QACd,OAAO,IAAI,CAAA;IACb,CAAC;IACD,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE;QAI3D,oBAAC,UAAU,IAAC,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE;;YACpB,KAAK;qBACf;QACb,oBAAC,MAAM;QACL,qEAAqE;QACrE,6DAA6D;QAC7D,wEAAwE;QACxE,yCAAyC;QACzC,EAAE;QACF,sEAAsE;QACtE,0DAA0D;QAC1D,EAAE;QACF,uEAAuE;QACvE,qEAAqE;QACrE,uBAAuB;QACvB,EAAE;QACF,iEAAiE;QACjE,uDAAuD;2BAC3C,kBAAkB,EAC9B,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,YAAY,EAAE,EAAE,EAAE,EACvC,GAAG,EAAE,CAAC,EACN,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE;gBACnB,YAAY,CAAC,GAAG,CAAC,CAAA;YACnB,CAAC,EACD,iBAAiB,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE;gBAC5B,KAAK,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAA;gBAC9B,YAAY,CAAC,SAAS,CAAC,CAAA;YACzB,CAAC,GACD,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}

package/dist/components/header/{HeaderStatusArea.d.ts → GoToBox.d.ts}

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { MsaViewModel } from '../../model.ts';
-declare const HeaderStatusArea: ({ model }: {
+declare const GoToBox: ({ model }: {
     model: MsaViewModel;
 }) => React.JSX.Element | null;
-export default HeaderStatusArea;
+export default GoToBox;

package/dist/components/header/GoToBox.js

@@ -0,0 +1,21 @@
+import React, { useState } from 'react';
+import { Autocomplete, TextField } from '@mui/material';
+import { observer } from 'mobx-react';
+import { findableRowNames, goTo, rowNameSuggestions } from './goTo.js';
+const label = 'Go to row or column';
+const GoToBox = observer(function ({ model }) {
+    const [missed, setMissed] = useState(false);
+    const names = findableRowNames(model);
+    return names.length > 1 || model.numColumns > 0 ? (React.createElement(Autocomplete, { freeSolo: true, size: "small", options: names, filterOptions: (options, { inputValue }) => rowNameSuggestions(options, inputValue), value: null, blurOnSelect: true, onInputChange: () => {
+            setMissed(false);
+        }, onChange: (_, text) => {
+            if (text) {
+                setMissed(!goTo(model, text));
+            }
+        }, style: { width: 180, margin: 'auto 8px' }, renderInput: params => (React.createElement(TextField, { ...params, error: missed, placeholder: label, title: "A row name, a column number, or name:residue", slotProps: {
+                ...params.slotProps,
+                htmlInput: { ...params.slotProps.htmlInput, 'aria-label': label },
+            } })) })) : null;
+});
+export default GoToBox;
+//# sourceMappingURL=GoToBox.js.map

package/dist/components/header/GoToBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GoToBox.js","sourceRoot":"","sources":["../../../src/components/header/GoToBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAA;AAItE,MAAM,KAAK,GAAG,qBAAqB,CAAA;AAEnC,MAAM,OAAO,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACnE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC3C,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAA;IACrC,OAAO,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,CAChD,oBAAC,YAAY,IACX,QAAQ,QACR,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,KAAK,EACd,aAAa,EAAE,CAAC,OAAO,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,CACzC,kBAAkB,CAAC,OAAO,EAAE,UAAU,CAAC,EAEzC,KAAK,EAAE,IAAI,EACX,YAAY,QACZ,aAAa,EAAE,GAAG,EAAE;YAClB,SAAS,CAAC,KAAK,CAAC,CAAA;QAClB,CAAC,EACD,QAAQ,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE;YACpB,IAAI,IAAI,EAAE,CAAC;gBACT,SAAS,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAA;YAC/B,CAAC;QACH,CAAC,EACD,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,UAAU,EAAE,EACzC,WAAW,EAAE,MAAM,CAAC,EAAE,CAAC,CACrB,oBAAC,SAAS,OACJ,MAAM,EACV,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,KAAK,EAClB,KAAK,EAAC,8CAA8C,EACpD,SAAS,EAAE;gBACT,GAAG,MAAM,CAAC,SAAS;gBACnB,SAAS,EAAE,EAAE,GAAG,MAAM,CAAC,SAAS,CAAC,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE;aAClE,GACD,CACH,GACD,CACH,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA"}

package/dist/components/header/Header.js

@@ -3,14 +3,16 @@ import useMeasure from '@jbrowse/core/util/useMeasure';
 import Help from '@mui/icons-material/Help';
 import { IconButton, Tooltip } from '@mui/material';
 import { observer } from 'mobx-react';
+import StatusMessage from '../StatusMessage.js';
 import ColorSchemeMenu from './ColorSchemeMenu.js';
 import FileMenu from './FileMenu.js';
 import GappynessSlider from './GappynessSlider.js';
+import GoToBox from './GoToBox.js';
 import HeaderInfoArea from './HeaderInfoArea.js';
-import HeaderStatusArea from './HeaderStatusArea.js';
 import LoadWarnings from './LoadWarnings.js';
 import MSASettingsMenu from './MSASettingsMenu.js';
 import MultiAlignmentSelector from './MultiAlignmentSelector.js';
+import SelectionMenu from './SelectionMenu.js';
 import TreeSettingsMenu from './TreeSettingsMenu.js';
 import UnshareableDataWarning from './UnshareableDataWarning.js';
 import ZoomControls from './ZoomControls.js';
@@ -32,21 +34,20 @@ const Header = observer(function ({ model }) {
         React.createElement(ZoomControls, { model: model }),
         React.createElement(ZoomMenu, { model: model }),
         React.createElement(GappynessSlider, { model: model }),
+        React.createElement(GoToBox, { model: model }),
         React.createElement("div", { style: { paddingLeft: 20, margin: 'auto' } },
             React.createElement(MultiAlignmentSelector, { model: model })),
-        React.createElement(HeaderInfoArea, { model: model }),
-        React.createElement(Spacer, null),
+        React.createElement("div", { style: { flex: '1 1 0', minWidth: 0, display: 'flex' } },
+            React.createElement(SelectionMenu, { model: model }),
+            React.createElement(HeaderInfoArea, { model: model })),
         React.createElement(LoadWarnings, { model: model }),
         React.createElement(UnshareableDataWarning, { model: model }),
-        React.createElement(HeaderStatusArea, { model: model }),
+        React.createElement(StatusMessage, { model: model, variant: "header" }),
         React.createElement(Tooltip, { title: "About" },
             React.createElement(IconButton, { "aria-label": "About", onClick: () => {
                     model.queueDialog(onClose => [AboutDialog, { onClose }]);
                 } },
                 React.createElement(Help, null)))));
 });
-function Spacer() {
-    return React.createElement("div", { style: { flex: 1 } });
-}
 export default Header;
 //# sourceMappingURL=Header.js.map

package/dist/components/header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../src/components/header/Header.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../src/components/header/Header.tsx"],"names":[],"mappings":"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"}

package/dist/components/header/SelectionMenu.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { MsaViewModel } from '../../model.ts';
+/**
+ * The selected block's size, as a button opening what to do with it. It
+ * renders only while there is a selection. Header.tsx puts it in the slot
+ * with no width of its own, so the label ellipsizes before it could wrap the
+ * header onto a second line.
+ */
+declare const SelectionMenu: ({ model }: {
+    model: MsaViewModel;
+}) => React.JSX.Element | null;
+export default SelectionMenu;

package/dist/components/header/SelectionMenu.js

@@ -0,0 +1,72 @@
+import React, { useState } from 'react';
+import ArrowDropDown from '@mui/icons-material/ArrowDropDown';
+import Clear from '@mui/icons-material/Clear';
+import ContentCopy from '@mui/icons-material/ContentCopy';
+import ZoomIn from '@mui/icons-material/ZoomIn';
+import { Button, ListItemIcon, ListItemText, Menu, MenuItem, Tooltip, } from '@mui/material';
+import { observer } from 'mobx-react';
+import copy from '../../vendor/copyToClipboard.js';
+function count(n, noun) {
+    return `${n.toLocaleString('en-US')} ${noun}${n === 1 ? '' : 's'}`;
+}
+/**
+ * The selected block's size, as a button opening what to do with it. It
+ * renders only while there is a selection. Header.tsx puts it in the slot
+ * with no width of its own, so the label ellipsizes before it could wrap the
+ * header onto a second line.
+ */
+const SelectionMenu = observer(function ({ model }) {
+    const [anchorEl, setAnchorEl] = useState();
+    const { selectionSize, selectionFileSpan } = model;
+    if (!selectionSize || !selectionFileSpan) {
+        return null;
+    }
+    const label = `${count(selectionSize.columns, 'column')} × ${count(selectionSize.rows, 'row')}`;
+    const items = [
+        {
+            text: 'Copy as FASTA',
+            Icon: ContentCopy,
+            act: () => {
+                copy(model.selectionFasta);
+            },
+        },
+        {
+            text: 'Zoom to selection',
+            Icon: ZoomIn,
+            act: () => {
+                model.zoomToSelection();
+            },
+        },
+        {
+            text: 'Clear selection',
+            Icon: Clear,
+            act: () => {
+                model.clearSelection();
+            },
+        },
+    ];
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Tooltip, { title: `Columns ${selectionFileSpan.start}-${selectionFileSpan.end} selected. Shift-drag the alignment to select, Escape to clear` },
+            React.createElement(Button, { size: "small", "aria-label": `Selection: ${label}`, endIcon: React.createElement(ArrowDropDown, null), onClick: event => {
+                    setAnchorEl(event.currentTarget);
+                }, style: {
+                    margin: 'auto 0 auto 8px',
+                    flexShrink: 0,
+                    maxWidth: '100%',
+                    minWidth: 0,
+                    textTransform: 'none',
+                    whiteSpace: 'nowrap',
+                } },
+                React.createElement("span", { style: { overflow: 'hidden', textOverflow: 'ellipsis' } }, label))),
+        anchorEl ? (React.createElement(Menu, { anchorEl: anchorEl, open: true, transitionDuration: 0, onClose: () => {
+                setAnchorEl(undefined);
+            } }, items.map(({ text, Icon, act }) => (React.createElement(MenuItem, { key: text, dense: true, onClick: () => {
+                act();
+                setAnchorEl(undefined);
+            } },
+            React.createElement(ListItemIcon, null,
+                React.createElement(Icon, { fontSize: "small" })),
+            React.createElement(ListItemText, null, text)))))) : null));
+});
+export default SelectionMenu;
+//# sourceMappingURL=SelectionMenu.js.map

package/dist/components/header/SelectionMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionMenu.js","sourceRoot":"","sources":["../../../src/components/header/SelectionMenu.tsx"],"names":[],"mappings":"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"}

package/dist/components/header/goTo.d.ts

@@ -0,0 +1,20 @@
+import type { MsaViewModel } from '../../model.ts';
+export declare function findableRowNames(model: MsaViewModel): string[];
+export declare function rowNameSuggestions(names: string[], input: string, limit?: number): string[];
+/**
+ * The visible row and column a "Go to" entry names: a row by its name, the
+ * column the ruler numbers N, or residue N of a row written `name:N`. A name
+ * is tried whole first, so a row called `chr1:100` stays reachable.
+ */
+export declare function resolveGoTo(model: MsaViewModel, text: string): {
+    row: number;
+    col?: undefined;
+} | {
+    row: number | undefined;
+    col: number;
+} | {
+    row?: undefined;
+    col: number;
+} | undefined;
+/** centers the view on the entry's target and lights it; false if none */
+export declare function goTo(model: MsaViewModel, text: string): boolean;

package/dist/components/header/goTo.js

@@ -0,0 +1,69 @@
+export function findableRowNames(model) {
+    const collapsed = new Set(model.collapsed);
+    return model.leaves
+        .filter(({ data: { id, name } }) => !(collapsed.has(id) && name === id))
+        .map(leaf => leaf.data.name);
+}
+// not MUI's createFilterOptions: JBrowse hosts do not re-export it, so
+// jbrowse-plugin-msaview would fail to load
+export function rowNameSuggestions(names, input, limit = 50) {
+    const query = input.toLowerCase();
+    return names
+        .filter(name => name.toLowerCase().includes(query))
+        .slice(0, limit);
+}
+/**
+ * The visible row and column a "Go to" entry names: a row by its name, the
+ * column the ruler numbers N, or residue N of a row written `name:N`. A name
+ * is tried whole first, so a row called `chr1:100` stays reachable.
+ */
+export function resolveGoTo(model, text) {
+    const query = text.trim();
+    const row = model.rowNamesSet.get(query);
+    if (row !== undefined) {
+        return { row };
+    }
+    const residue = /^(.+):(\d+)$/.exec(query);
+    if (residue) {
+        const [, name = '', pos] = residue;
+        const rowIndex = model.rowNamesSet.get(name);
+        const col = rowIndex === undefined ? undefined : columnOfResidue(model, name, +pos);
+        return col === undefined ? undefined : { row: rowIndex, col };
+    }
+    if (/^\d+$/.test(query)) {
+        const n = +query;
+        const { relativeTo, numColumns } = model;
+        const col = relativeTo
+            ? columnOfResidue(model, relativeTo, n)
+            : n >= 1 && n <= numColumns
+                ? n - 1
+                : undefined;
+        return col === undefined ? undefined : { col };
+    }
+    return undefined;
+}
+// seqPosToVisibleCol maps a residue past the row's end to the column after
+// it; here that residue names nothing
+function columnOfResidue(model, name, pos) {
+    const globalCol = model.seqPosIndex(name)?.[pos - 1];
+    return globalCol === undefined
+        ? undefined
+        : model.globalColToVisibleCol(globalCol);
+}
+/** centers the view on the entry's target and lights it; false if none */
+export function goTo(model, text) {
+    const target = resolveGoTo(model, text);
+    if (target) {
+        const { row, col } = target;
+        const { rowHeight, colWidth, msaAreaHeight, msaAreaWidth } = model;
+        if (row !== undefined) {
+            model.setScrollY(-(row + 0.5) * rowHeight + msaAreaHeight / 2);
+        }
+        if (col !== undefined) {
+            model.setScrollX(-(col + 0.5) * colWidth + msaAreaWidth / 2);
+        }
+        model.setMousePos(col, row);
+    }
+    return target !== undefined;
+}
+//# sourceMappingURL=goTo.js.map

package/dist/components/header/goTo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"goTo.js","sourceRoot":"","sources":["../../../src/components/header/goTo.ts"],"names":[],"mappings":"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"}

package/dist/components/header/settingsMenuItems.js

@@ -1,3 +1,19 @@
+import { treeOrders } from '../../constants.js';
+function radio(label, checked, onClick) {
+    return { label, type: 'radio', checked, onClick };
+}
+const treeOrderLabels = {
+    branchLength: 'By branch length',
+    input: 'As written',
+    ladderize: 'Ladderize, small clades first',
+    ladderizeReverse: 'Ladderize, large clades first',
+};
+function outgroupLabel(outgroup) {
+    const [first, ...rest] = outgroup;
+    return rest.length === 0
+        ? `Outgroup ${first}`
+        : `Outgroup ${first} … ${rest.at(-1)}`;
+}
 function toggle(label, checked, set) {
     return {
         label,
@@ -40,8 +56,48 @@ export function msaSettingsMenuItems(model) {
     ];
 }
 export function treeSettingsMenuItems(model) {
-    const { drawTree, showBranchLen, labelsAlignRight, drawNodeBubbles, drawNodeLabels, drawLabels, showTreeOverview, } = model;
+    const { drawTree, showBranchLen, labelsAlignRight, drawNodeBubbles, drawNodeLabels, drawLabels, showTreeOverview, treeOrder, treeRoot, rotated, } = model;
     return [
+        {
+            label: 'Order',
+            type: 'subMenu',
+            subMenu: [
+                ...treeOrders.map(order => radio(treeOrderLabels[order], treeOrder === order, () => {
+                    model.setTreeOrder(order);
+                })),
+                { type: 'divider' },
+                {
+                    label: 'Undo rotations',
+                    disabled: rotated.length === 0,
+                    onClick: () => {
+                        model.clearRotated();
+                    },
+                },
+            ],
+        },
+        {
+            label: 'Root',
+            type: 'subMenu',
+            subMenu: [
+                radio('As written', treeRoot === undefined, () => {
+                    model.setTreeRoot(undefined);
+                }),
+                radio('Midpoint', treeRoot === 'midpoint', () => {
+                    model.setTreeRoot('midpoint');
+                }),
+                // "Reroot here" in a node's menu sets the outgroup, so this only
+                // reports it
+                ...(typeof treeRoot === 'object'
+                    ? [
+                        {
+                            ...radio(outgroupLabel(treeRoot.outgroup), true, () => { }),
+                            disabled: true,
+                        },
+                    ]
+                    : []),
+            ],
+        },
+        { type: 'divider' },
         toggle('Show branch length', showBranchLen, arg => {
             model.setShowBranchLen(arg);
         }),