react-msaview 5.4.1 → 5.6.0

package/dist/components/header/HeaderInfoArea.js

@@ -1,7 +1,7 @@
 import React from 'react';
+import { makeStyles } from '@jbrowse/core/util/tss-react';
 import { Typography } from '@mui/material';
 import { observer } from 'mobx-react';
-import { makeStyles } from 'tss-react/mui';
 const useStyles = makeStyles()({
     container: {
         display: 'flex',

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

@@ -1 +1 @@
-{"version":3,"file":"HeaderInfoArea.js","sourceRoot":"","sources":["../../../src/components/header/HeaderInfoArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAI1C,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;IAC7B,SAAS,EAAE;QACT,OAAO,EAAE,MAAM;QACf,QAAQ,EAAE,QAAQ;QAClB,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,EAAE;KACf;IACD,SAAS,EAAE;QACT,QAAQ,EAAE,QAAQ;QAClB,YAAY,EAAE,UAAU;QACxB,UAAU,EAAE,QAAQ;QACpB,QAAQ,EAAE,CAAC;KACZ;IACD,QAAQ,EAAE;QACR,UAAU,EAAE,QAAQ;QACpB,UAAU,EAAE,CAAC;KACd;CACF,CAAC,CAAA;AAEF,MAAM,cAAc,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IAC1E,MAAM,EAAE,gBAAgB,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;IAC5C,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,IAAI,CAAC,gBAAgB,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;QAChD,OAAO,IAAI,CAAA;IACb,CAAC;IACD,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;IACnD,MAAM,GAAG,GAAG,KAAK,CAAC,0BAA0B,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAA;IACxE,MAAM,MAAM,GAAG,KAAK,CAAC,qBAAqB,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAA;IACtE,OAAO,CACL,oBAAC,UAAU,IACT,SAAS,EAAC,KAAK,EACf,SAAS,EAAE,OAAO,CAAC,SAAS,EAC5B,KAAK,EAAE,gBAAgB;QAEvB,8BAAM,SAAS,EAAE,OAAO,CAAC,SAAS,IAC/B,gBAAgB,CAAC,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC,CAC1B;QACP,8BAAM,SAAS,EAAE,OAAO,CAAC,QAAQ;YAC9B,gBAAgB,CAAC,KAAK,CAAC,GAAG,CAAC;;YAAG,GAAG;;YAAI,MAAM;gBACvC,CACI,CACd,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,cAAc,CAAA"}
+{"version":3,"file":"HeaderInfoArea.js","sourceRoot":"","sources":["../../../src/components/header/HeaderInfoArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;IAC7B,SAAS,EAAE;QACT,OAAO,EAAE,MAAM;QACf,QAAQ,EAAE,QAAQ;QAClB,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,EAAE;KACf;IACD,SAAS,EAAE;QACT,QAAQ,EAAE,QAAQ;QAClB,YAAY,EAAE,UAAU;QACxB,UAAU,EAAE,QAAQ;QACpB,QAAQ,EAAE,CAAC;KACZ;IACD,QAAQ,EAAE;QACR,UAAU,EAAE,QAAQ;QACpB,UAAU,EAAE,CAAC;KACd;CACF,CAAC,CAAA;AAEF,MAAM,cAAc,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IAC1E,MAAM,EAAE,gBAAgB,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;IAC5C,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,IAAI,CAAC,gBAAgB,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;QAChD,OAAO,IAAI,CAAA;IACb,CAAC;IACD,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;IACnD,MAAM,GAAG,GAAG,KAAK,CAAC,0BAA0B,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAA;IACxE,MAAM,MAAM,GAAG,KAAK,CAAC,qBAAqB,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAA;IACtE,OAAO,CACL,oBAAC,UAAU,IACT,SAAS,EAAC,KAAK,EACf,SAAS,EAAE,OAAO,CAAC,SAAS,EAC5B,KAAK,EAAE,gBAAgB;QAEvB,8BAAM,SAAS,EAAE,OAAO,CAAC,SAAS,IAC/B,gBAAgB,CAAC,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC,CAC1B;QACP,8BAAM,SAAS,EAAE,OAAO,CAAC,QAAQ;YAC9B,gBAAgB,CAAC,KAAK,CAAC,GAAG,CAAC;;YAAG,GAAG;;YAAI,MAAM;gBACvC,CACI,CACd,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,cAAc,CAAA"}

package/dist/components/header/HeaderStatusArea.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { LoadingEllipses } from '@jbrowse/core/ui';
+import { makeStyles } from '@jbrowse/core/util/tss-react';
 import { Button, Typography } from '@mui/material';
 import { observer } from 'mobx-react';
-import { makeStyles } from 'tss-react/mui';
 const useStyles = makeStyles()({
     margin: {
         margin: 'auto',

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

@@ -1 +1 @@
-{"version":3,"file":"HeaderStatusArea.js","sourceRoot":"","sources":["../../../src/components/header/HeaderStatusArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAClD,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAI1C,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,EAAE;QACN,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,EAAE;KACf;CACF,CAAC,CAAA;AAEF,MAAM,gBAAgB,GAAG,QAAQ,CAAC,CAAC,EAAE,KAAK,EAA2B,EAAE,EAAE;IACvE,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAA;IACxB,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,oBAAC,UAAU,IAAC,SAAS,EAAE,OAAO,CAAC,MAAM;QACnC,oBAAC,eAAe,IAAC,OAAO,EAAE,MAAM,CAAC,GAAG,EAAE,SAAS,EAAC,MAAM,GAAG;QAAC,GAAG;QAC5D,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CACZ,2BAAG,IAAI,EAAE,MAAM,CAAC,GAAG,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,eAEjD,CACL,CAAC,CAAC,CAAC,IAAI;QAAE,GAAG;QACZ,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CACjB,oBAAC,MAAM,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE,EAAE,aAE9C,CACV,CAAC,CAAC,CAAC,IAAI,CACG,CACd,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA;AAEF,eAAe,gBAAgB,CAAA"}
+{"version":3,"file":"HeaderStatusArea.js","sourceRoot":"","sources":["../../../src/components/header/HeaderStatusArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AACzD,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,EAAE;QACN,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,EAAE;KACf;CACF,CAAC,CAAA;AAEF,MAAM,gBAAgB,GAAG,QAAQ,CAAC,CAAC,EAAE,KAAK,EAA2B,EAAE,EAAE;IACvE,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAA;IACxB,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,oBAAC,UAAU,IAAC,SAAS,EAAE,OAAO,CAAC,MAAM;QACnC,oBAAC,eAAe,IAAC,OAAO,EAAE,MAAM,CAAC,GAAG,EAAE,SAAS,EAAC,MAAM,GAAG;QAAC,GAAG;QAC5D,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CACZ,2BAAG,IAAI,EAAE,MAAM,CAAC,GAAG,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,eAEjD,CACL,CAAC,CAAC,CAAC,IAAI;QAAE,GAAG;QACZ,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CACjB,oBAAC,MAAM,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE,EAAE,aAE9C,CACV,CAAC,CAAC,CAAC,IAAI,CACG,CACd,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA;AAEF,eAAe,gBAAgB,CAAA"}

package/dist/components/header/MSASettingsMenu.js

@@ -4,7 +4,7 @@ import Tune from '@mui/icons-material/Tune';
 import { observer } from 'mobx-react';
 import { msaSettingsMenuItems } from "./settingsMenuItems.js";
 const MSASettingsMenu = observer(function ({ model }) {
-    return (React.createElement(CascadingMenuButton, { "data-testid": "msa_settings_menu", closeAfterItemClick: false, anchorOrigin: { vertical: 'bottom', horizontal: 'left' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, menuItems: msaSettingsMenuItems(model) },
+    return (React.createElement(CascadingMenuButton, { "data-testid": "msa_settings_menu", tooltip: "Alignment settings", closeAfterItemClick: false, anchorOrigin: { vertical: 'bottom', horizontal: 'left' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, menuItems: msaSettingsMenuItems(model) },
         React.createElement(Tune, null)));
 });
 export default MSASettingsMenu;

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

@@ -1 +1 @@
-{"version":3,"file":"MSASettingsMenu.js","sourceRoot":"","sources":["../../../src/components/header/MSASettingsMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,IAAI,MAAM,0BAA0B,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AAI7D,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IAC3E,OAAO,CACL,oBAAC,mBAAmB,mBACN,mBAAmB,EAC/B,mBAAmB,EAAE,KAAK,EAC1B,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,IAAI,OAAG,CACY,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}
+{"version":3,"file":"MSASettingsMenu.js","sourceRoot":"","sources":["../../../src/components/header/MSASettingsMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,IAAI,MAAM,0BAA0B,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AAI7D,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IAC3E,OAAO,CACL,oBAAC,mBAAmB,mBACN,mBAAmB,EAC/B,OAAO,EAAC,oBAAoB,EAC5B,mBAAmB,EAAE,KAAK,EAC1B,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,IAAI,OAAG,CACY,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,eAAe,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"MultiAlignmentSelector.js","sourceRoot":"","sources":["../../../src/components/header/MultiAlignmentSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,sBAAsB,GAAG,QAAQ,CAAC,UAAU,EAChD,KAAK,GAGN;IACC,MAAM,EAAE,gBAAgB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IAClD,OAAO,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACjC,oBAAC,SAAS,IACR,MAAM,QACN,OAAO,EAAC,UAAU,EAClB,KAAK,EAAE,gBAAgB,EACvB,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,KAAK,CAAC,EAAE;YAChB,KAAK,CAAC,mBAAmB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;YAC9C,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAA;YACnB,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAA;QACrB,CAAC,IAEA,cAAc,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CACrC,oBAAC,QAAQ,IAAC,GAAG,EAAE,GAAG,MAAM,IAAI,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,IAC9C,MAAM,CACE,CACZ,CAAC,CACQ,CACb,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA;AACF,eAAe,sBAAsB,CAAA"}
+{"version":3,"file":"MultiAlignmentSelector.js","sourceRoot":"","sources":["../../../src/components/header/MultiAlignmentSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,sBAAsB,GAAG,QAAQ,CAAC,UAAU,EAChD,KAAK,GAGN;IACC,MAAM,EAAE,gBAAgB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAA;IAClD,8EAA8E;IAC9E,6EAA6E;IAC7E,2EAA2E;IAC3E,sEAAsE;IACtE,MAAM,IAAI,GAAG,IAAI,GAAG,EAAkB,CAAA;IACtC,OAAO,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACjC,oBAAC,SAAS,IACR,MAAM,QACN,OAAO,EAAC,UAAU,EAClB,KAAK,EAAE,gBAAgB,EACvB,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,KAAK,CAAC,EAAE;YAChB,KAAK,CAAC,mBAAmB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;YAC9C,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAA;YACnB,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAA;QACrB,CAAC,IAEA,cAAc,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;QACpC,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;QAC/B,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,CAAA;QACvB,OAAO,CACL,oBAAC,QAAQ,IAAC,GAAG,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,IAC7D,MAAM,CACE,CACZ,CAAA;IACH,CAAC,CAAC,CACQ,CACb,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA;AACF,eAAe,sBAAsB,CAAA"}

package/dist/components/header/TreeSettingsMenu.js

@@ -5,7 +5,7 @@ import { observer } from 'mobx-react';
 import { treeSettingsMenuItems } from "./settingsMenuItems.js";
 const TreeSettingsMenu = observer(function ({ model, }) {
     const { rows } = model;
-    return (React.createElement(CascadingMenuButton, { "data-testid": "tree_settings_menu", closeAfterItemClick: false, anchorOrigin: { vertical: 'bottom', horizontal: 'left' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, menuItems: [
+    return (React.createElement(CascadingMenuButton, { "data-testid": "tree_settings_menu", tooltip: "Tree settings", closeAfterItemClick: false, anchorOrigin: { vertical: 'bottom', horizontal: 'left' }, transformOrigin: { vertical: 'top', horizontal: 'left' }, menuItems: [
             ...treeSettingsMenuItems(model),
             ...(rows.length >= 2
                 ? [

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

@@ -1 +1 @@
-{"version":3,"file":"TreeSettingsMenu.js","sourceRoot":"","sources":["../../../src/components/header/TreeSettingsMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,WAAW,MAAM,iCAAiC,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAA;AAI9D,MAAM,gBAAgB,GAAG,QAAQ,CAAC,UAAU,EAC1C,KAAK,GAGN;IACC,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAA;IACtB,OAAO,CACL,oBAAC,mBAAmB,mBACN,oBAAoB,EAChC,mBAAmB,EAAE,KAAK,EAC1B,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;YACT,GAAG,qBAAqB,CAAC,KAAK,CAAC;YAC/B,GAAG,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC;gBAClB,CAAC,CAAC;oBACE;wBACE,KAAK,EAAE,UAAU;wBACjB,IAAI,EAAE,SAAkB;wBACxB,OAAO,EAAE;4BACP;gCACE,KAAK,EAAE,4CAA4C;gCACnD,OAAO,EAAE,GAAG,EAAE;oCACZ,IAAI,CAAC;wCACH,KAAK,CAAC,mCAAmC,EAAE,CAAA;oCAC7C,CAAC;oCAAC,OAAO,CAAC,EAAE,CAAC;wCACX,OAAO,CAAC,KAAK,CAAC,8BAA8B,EAAE,CAAC,CAAC,CAAA;wCAChD,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;oCACnB,CAAC;gCACH,CAAC;6BACF;yBACF;qBACF;iBACF;gBACH,CAAC,CAAC,EAAE,CAAC;SACR;QAED,oBAAC,WAAW,OAAG,CACK,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,gBAAgB,CAAA"}
+{"version":3,"file":"TreeSettingsMenu.js","sourceRoot":"","sources":["../../../src/components/header/TreeSettingsMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,WAAW,MAAM,iCAAiC,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAA;AAI9D,MAAM,gBAAgB,GAAG,QAAQ,CAAC,UAAU,EAC1C,KAAK,GAGN;IACC,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAA;IACtB,OAAO,CACL,oBAAC,mBAAmB,mBACN,oBAAoB,EAChC,OAAO,EAAC,eAAe,EACvB,mBAAmB,EAAE,KAAK,EAC1B,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;YACT,GAAG,qBAAqB,CAAC,KAAK,CAAC;YAC/B,GAAG,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC;gBAClB,CAAC,CAAC;oBACE;wBACE,KAAK,EAAE,UAAU;wBACjB,IAAI,EAAE,SAAkB;wBACxB,OAAO,EAAE;4BACP;gCACE,KAAK,EAAE,4CAA4C;gCACnD,OAAO,EAAE,GAAG,EAAE;oCACZ,IAAI,CAAC;wCACH,KAAK,CAAC,mCAAmC,EAAE,CAAA;oCAC7C,CAAC;oCAAC,OAAO,CAAC,EAAE,CAAC;wCACX,OAAO,CAAC,KAAK,CAAC,8BAA8B,EAAE,CAAC,CAAC,CAAA;wCAChD,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;oCACnB,CAAC;gCACH,CAAC;6BACF;yBACF;qBACF;iBACF;gBACH,CAAC,CAAC,EAAE,CAAC;SACR;QAED,oBAAC,WAAW,OAAG,CACK,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,gBAAgB,CAAA"}

package/dist/components/header/ZoomControls.js

@@ -1,23 +1,25 @@
 import React from 'react';
+import Mouse from '@mui/icons-material/Mouse';
 import ZoomIn from '@mui/icons-material/ZoomIn';
-import ZoomInMap from '@mui/icons-material/ZoomInMap';
 import ZoomOut from '@mui/icons-material/ZoomOut';
-import { IconButton, ToggleButton } from '@mui/material';
+import { IconButton, ToggleButton, Tooltip } from '@mui/material';
 import { observer } from 'mobx-react';
 const ZoomControls = observer(function ZoomControls({ model, }) {
     return (React.createElement(React.Fragment, null,
-        React.createElement(IconButton, { onClick: () => {
-                model.zoomIn();
-            } },
-            React.createElement(ZoomIn, null)),
-        React.createElement(IconButton, { onClick: () => {
-                model.zoomOut();
-            } },
-            React.createElement(ZoomOut, null)),
-        React.createElement(ToggleButton, { value: "scrollZoom", selected: model.scrollZoom, title: "Toggle scroll-to-zoom (zoom on plain mouse wheel; ctrl+wheel always zooms)", size: "small", sx: { border: 'none' }, onChange: () => {
+        React.createElement(Tooltip, { title: "Zoom in" },
+            React.createElement(IconButton, { "aria-label": "Zoom in", onClick: () => {
+                    model.zoomIn();
+                } },
+                React.createElement(ZoomIn, null))),
+        React.createElement(Tooltip, { title: "Zoom out" },
+            React.createElement(IconButton, { "aria-label": "Zoom out", onClick: () => {
+                    model.zoomOut();
+                } },
+                React.createElement(ZoomOut, null))),
+        React.createElement(ToggleButton, { value: "scrollZoom", selected: model.scrollZoom, "aria-label": "Toggle scroll-to-zoom", title: "Toggle scroll-to-zoom (zoom on plain mouse wheel; ctrl+wheel always zooms)", size: "small", sx: { border: 'none' }, onChange: () => {
                 model.setScrollZoom(!model.scrollZoom);
             } },
-            React.createElement(ZoomInMap, null))));
+            React.createElement(Mouse, null))));
 });
 export default ZoomControls;
 //# sourceMappingURL=ZoomControls.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ZoomControls.js","sourceRoot":"","sources":["../../../src/components/header/ZoomControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,MAAM,MAAM,4BAA4B,CAAA;AAC/C,OAAO,SAAS,MAAM,+BAA+B,CAAA;AACrD,OAAO,OAAO,MAAM,6BAA6B,CAAA;AACjD,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,YAAY,GAAG,QAAQ,CAAC,SAAS,YAAY,CAAC,EAClD,KAAK,GAGN;IACC,OAAO,CACL;QACE,oBAAC,UAAU,IACT,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,MAAM,EAAE,CAAA;YAChB,CAAC;YAED,oBAAC,MAAM,OAAG,CACC;QACb,oBAAC,UAAU,IACT,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,OAAO,EAAE,CAAA;YACjB,CAAC;YAED,oBAAC,OAAO,OAAG,CACA;QACb,oBAAC,YAAY,IACX,KAAK,EAAC,YAAY,EAClB,QAAQ,EAAE,KAAK,CAAC,UAAU,EAC1B,KAAK,EAAC,4EAA4E,EAClF,IAAI,EAAC,OAAO,EACZ,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,EACtB,QAAQ,EAAE,GAAG,EAAE;gBACb,KAAK,CAAC,aAAa,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAA;YACxC,CAAC;YAED,oBAAC,SAAS,OAAG,CACA,CACd,CACJ,CAAA;AACH,CAAC,CAAC,CAAA;AACF,eAAe,YAAY,CAAA"}
+{"version":3,"file":"ZoomControls.js","sourceRoot":"","sources":["../../../src/components/header/ZoomControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,MAAM,2BAA2B,CAAA;AAC7C,OAAO,MAAM,MAAM,4BAA4B,CAAA;AAC/C,OAAO,OAAO,MAAM,6BAA6B,CAAA;AACjD,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,YAAY,GAAG,QAAQ,CAAC,SAAS,YAAY,CAAC,EAClD,KAAK,GAGN;IACC,OAAO,CACL;QACE,oBAAC,OAAO,IAAC,KAAK,EAAC,SAAS;YACtB,oBAAC,UAAU,kBACE,SAAS,EACpB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,MAAM,EAAE,CAAA;gBAChB,CAAC;gBAED,oBAAC,MAAM,OAAG,CACC,CACL;QACV,oBAAC,OAAO,IAAC,KAAK,EAAC,UAAU;YACvB,oBAAC,UAAU,kBACE,UAAU,EACrB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,OAAO,EAAE,CAAA;gBACjB,CAAC;gBAED,oBAAC,OAAO,OAAG,CACA,CACL;QACV,oBAAC,YAAY,IACX,KAAK,EAAC,YAAY,EAClB,QAAQ,EAAE,KAAK,CAAC,UAAU,gBACf,uBAAuB,EAClC,KAAK,EAAC,4EAA4E,EAClF,IAAI,EAAC,OAAO,EACZ,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,EACtB,QAAQ,EAAE,GAAG,EAAE;gBACb,KAAK,CAAC,aAAa,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAA;YACxC,CAAC;YAED,oBAAC,KAAK,OAAG,CACI,CACd,CACJ,CAAA;AACH,CAAC,CAAC,CAAA;AACF,eAAe,YAAY,CAAA"}

package/dist/components/header/ZoomMenu.js

@@ -4,7 +4,7 @@ import MoreVert from '@mui/icons-material/MoreVert';
 import RestartAlt from '@mui/icons-material/RestartAlt';
 import { observer } from 'mobx-react';
 const ZoomMenu = observer(function ({ model }) {
-    return (React.createElement(CascadingMenuButton, { menuItems: [
+    return (React.createElement(CascadingMenuButton, { tooltip: "Fit / zoom options", menuItems: [
             {
                 label: 'Fit both vertically/horizontally',
                 onClick: () => {
@@ -30,15 +30,6 @@ const ZoomMenu = observer(function ({ model }) {
                     model.resetZoom();
                 },
             },
-            {
-                label: 'Scroll zoom',
-                type: 'checkbox',
-                checked: model.scrollZoom,
-                onClick: () => {
-                    model.setScrollZoom(!model.scrollZoom);
-                },
-                helpText: 'When enabled, scrolling the mouse wheel zooms in and out without holding ctrl. Hold shift to pan instead. Ctrl/⌘+wheel always zooms.',
-            },
         ] },
         React.createElement(MoreVert, null)));
 });

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

@@ -1 +1 @@
-{"version":3,"file":"ZoomMenu.js","sourceRoot":"","sources":["../../../src/components/header/ZoomMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,QAAQ,MAAM,8BAA8B,CAAA;AACnD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACpE,OAAO,CACL,oBAAC,mBAAmB,IAClB,SAAS,EAAE;YACT;gBACE,KAAK,EAAE,kCAAkC;gBACzC,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,GAAG,EAAE,CAAA;gBACb,CAAC;aACF;YACD;gBACE,KAAK,EAAE,gBAAgB;gBACvB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,aAAa,EAAE,CAAA;gBACvB,CAAC;aACF;YACD;gBACE,KAAK,EAAE,kBAAkB;gBACzB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,eAAe,EAAE,CAAA;gBACzB,CAAC;aACF;YAED;gBACE,KAAK,EAAE,uBAAuB;gBAC9B,IAAI,EAAE,UAAU;gBAChB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,SAAS,EAAE,CAAA;gBACnB,CAAC;aACF;YACD;gBACE,KAAK,EAAE,aAAa;gBACpB,IAAI,EAAE,UAAU;gBAChB,OAAO,EAAE,KAAK,CAAC,UAAU;gBACzB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,aAAa,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAA;gBACxC,CAAC;gBACD,QAAQ,EACN,sIAAsI;aACzI;SACF;QAED,oBAAC,QAAQ,OAAG,CACQ,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"ZoomMenu.js","sourceRoot":"","sources":["../../../src/components/header/ZoomMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AACtE,OAAO,QAAQ,MAAM,8BAA8B,CAAA;AACnD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACpE,OAAO,CACL,oBAAC,mBAAmB,IAClB,OAAO,EAAC,oBAAoB,EAC5B,SAAS,EAAE;YACT;gBACE,KAAK,EAAE,kCAAkC;gBACzC,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,GAAG,EAAE,CAAA;gBACb,CAAC;aACF;YACD;gBACE,KAAK,EAAE,gBAAgB;gBACvB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,aAAa,EAAE,CAAA;gBACvB,CAAC;aACF;YACD;gBACE,KAAK,EAAE,kBAAkB;gBACzB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,eAAe,EAAE,CAAA;gBACzB,CAAC;aACF;YAED;gBACE,KAAK,EAAE,uBAAuB;gBAC9B,IAAI,EAAE,UAAU;gBAChB,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,SAAS,EAAE,CAAA;gBACnB,CAAC;aACF;SACF;QAED,oBAAC,QAAQ,OAAG,CACQ,CACvB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}

package/dist/components/header/settingsMenuItems.js

@@ -1,6 +1,14 @@
 export function msaSettingsMenuItems(model) {
-    const { drawMsaLetters, hideGaps, bgColor } = model;
+    const { drawMsaLetters, hideGaps, bgColor, showColumnStats } = model;
     return [
+        {
+            label: 'Show column statistics on hover',
+            type: 'checkbox',
+            checked: showColumnStats,
+            onClick: () => {
+                model.setShowColumnStats(!showColumnStats);
+            },
+        },
         {
             label: 'Draw letters',
             type: 'checkbox',

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

@@ -1 +1 @@
-{"version":3,"file":"settingsMenuItems.js","sourceRoot":"","sources":["../../../src/components/header/settingsMenuItems.ts"],"names":[],"mappings":"AAGA,MAAM,UAAU,oBAAoB,CAAC,KAAmB;IACtD,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,CAAA;IACnD,OAAO;QACL;YACE,KAAK,EAAE,cAAc;YACrB,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,cAAc;YACvB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,iBAAiB,CAAC,CAAC,cAAc,CAAC,CAAA;YAC1C,CAAC;SACF;QACD;YACE,KAAK,EAAE,8CAA8C;YACrD,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,CAAC,OAAO;YACjB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAA;YAC5B,CAAC;SACF;QACD;YACE,KAAK,EAAE,8BAA8B;YACrC,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAA;YAC9B,CAAC;SACF;KACF,CAAA;AACH,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAC,KAAmB;IACvD,MAAM,EACJ,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,UAAU,GACX,GAAG,KAAK,CAAA;IACT,OAAO;QACL;YACE,KAAK,EAAE,oBAAoB;YAC3B,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,aAAa;YACtB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,gBAAgB,CAAC,CAAC,aAAa,CAAC,CAAA;YACxC,CAAC;SACF;QACD;YACE,KAAK,EAAE,WAAW;YAClB,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAA;YAC9B,CAAC;SACF;QACD;YACE,KAAK,EAAE,yCAAyC;YAChD,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,eAAe;YACxB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,kBAAkB,CAAC,CAAC,eAAe,CAAC,CAAA;YAC5C,CAAC;SACF;QACD;YACE,KAAK,EAAE,yBAAyB;YAChC,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,gBAAgB;YACzB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,mBAAmB,CAAC,CAAC,gBAAgB,CAAC,CAAA;YAC9C,CAAC;SACF;QACD;YACE,KAAK,EAAE,aAAa;YACpB,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,UAAU;YACnB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC,CAAA;YAClC,CAAC;SACF;KACF,CAAA;AACH,CAAC"}
+{"version":3,"file":"settingsMenuItems.js","sourceRoot":"","sources":["../../../src/components/header/settingsMenuItems.ts"],"names":[],"mappings":"AAGA,MAAM,UAAU,oBAAoB,CAAC,KAAmB;IACtD,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,OAAO,EAAE,eAAe,EAAE,GAAG,KAAK,CAAA;IACpE,OAAO;QACL;YACE,KAAK,EAAE,iCAAiC;YACxC,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,eAAe;YACxB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,kBAAkB,CAAC,CAAC,eAAe,CAAC,CAAA;YAC5C,CAAC;SACF;QACD;YACE,KAAK,EAAE,cAAc;YACrB,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,cAAc;YACvB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,iBAAiB,CAAC,CAAC,cAAc,CAAC,CAAA;YAC1C,CAAC;SACF;QACD;YACE,KAAK,EAAE,8CAA8C;YACrD,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,CAAC,OAAO;YACjB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAA;YAC5B,CAAC;SACF;QACD;YACE,KAAK,EAAE,8BAA8B;YACrC,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAA;YAC9B,CAAC;SACF;KACF,CAAA;AACH,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAC,KAAmB;IACvD,MAAM,EACJ,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,UAAU,GACX,GAAG,KAAK,CAAA;IACT,OAAO;QACL;YACE,KAAK,EAAE,oBAAoB;YAC3B,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,aAAa;YACtB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,gBAAgB,CAAC,CAAC,aAAa,CAAC,CAAA;YACxC,CAAC;SACF;QACD;YACE,KAAK,EAAE,WAAW;YAClB,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAA;YAC9B,CAAC;SACF;QACD;YACE,KAAK,EAAE,yCAAyC;YAChD,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,eAAe;YACxB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,kBAAkB,CAAC,CAAC,eAAe,CAAC,CAAA;YAC5C,CAAC;SACF;QACD;YACE,KAAK,EAAE,yBAAyB;YAChC,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,gBAAgB;YACzB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,mBAAmB,CAAC,CAAC,gBAAgB,CAAC,CAAA;YAC9C,CAAC;SACF;QACD;YACE,KAAK,EAAE,aAAa;YACpB,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,UAAU;YACnB,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC,CAAA;YAClC,CAAC;SACF;KACF,CAAA;AACH,CAAC"}

package/dist/components/{header/HeaderMenu.d.ts → msa/ColumnStats.d.ts}

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

package/dist/components/msa/ColumnStats.js

@@ -0,0 +1,42 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+const pct = (n) => `${Math.round(n * 100)}%`;
+const ColumnStats = observer(function ({ model }) {
+    const stats = model.mouseOverColumnStats;
+    if (!stats) {
+        return null;
+    }
+    const { col, total, conservation, propertyConservation, consensusLetter, consensusFraction, gapFraction, distribution, } = stats;
+    const top = distribution.slice(0, 6);
+    return (React.createElement("div", null,
+        React.createElement("b", null,
+            "Column ",
+            col + 1),
+        " (",
+        total,
+        " seqs)",
+        React.createElement("br", null),
+        "Consensus: ",
+        consensusLetter || '-',
+        " (",
+        pct(consensusFraction),
+        ")",
+        React.createElement("br", null),
+        "Conservation: ",
+        conservation.toFixed(2),
+        propertyConservation === undefined ? null : (React.createElement(React.Fragment, null,
+            React.createElement("br", null),
+            "Property conservation: ",
+            propertyConservation.toFixed(2))),
+        React.createElement("br", null),
+        "Gaps: ",
+        pct(gapFraction),
+        top.length > 0 ? (React.createElement(React.Fragment, null,
+            React.createElement("br", null),
+            top.map(([letter, count]) => (React.createElement("span", { key: letter, style: { marginRight: 8 } },
+                letter,
+                " ",
+                pct(count / total)))))) : null));
+});
+export default ColumnStats;
+//# sourceMappingURL=ColumnStats.js.map

package/dist/components/msa/ColumnStats.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnStats.js","sourceRoot":"","sources":["../../../src/components/msa/ColumnStats.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,GAAG,GAAG,CAAC,CAAS,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,CAAC,GAAG,CAAA;AAEpD,MAAM,WAAW,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACvE,MAAM,KAAK,GAAG,KAAK,CAAC,oBAAoB,CAAA;IACxC,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,OAAO,IAAI,CAAA;IACb,CAAC;IACD,MAAM,EACJ,GAAG,EACH,KAAK,EACL,YAAY,EACZ,oBAAoB,EACpB,eAAe,EACf,iBAAiB,EACjB,WAAW,EACX,YAAY,GACb,GAAG,KAAK,CAAA;IACT,MAAM,GAAG,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;IACpC,OAAO,CACL;QACE;;YAAW,GAAG,GAAG,CAAC,CAAK;;QAAG,KAAK;;QAC/B,+BAAM;;QACM,eAAe,IAAI,GAAG;;QAAI,GAAG,CAAC,iBAAiB,CAAC;;QAC5D,+BAAM;;QACS,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;QACrC,oBAAoB,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC3C;YACE,+BAAM;;YACkB,oBAAoB,CAAC,OAAO,CAAC,CAAC,CAAC,CACtD,CACJ;QACD,+BAAM;;QACC,GAAG,CAAC,WAAW,CAAC;QACtB,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAChB;YACE,+BAAM;YACL,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAC5B,8BAAM,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE;gBACzC,MAAM;;gBAAG,GAAG,CAAC,KAAK,GAAG,KAAK,CAAC,CACvB,CACR,CAAC,CACD,CACJ,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,WAAW,CAAA"}

package/dist/components/msa/DomainLegend.d.ts

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

package/dist/components/msa/DomainLegend.js

@@ -0,0 +1,41 @@
+import React, { useState } from 'react';
+import ExpandLess from '@mui/icons-material/ExpandLess';
+import ExpandMore from '@mui/icons-material/ExpandMore';
+import { IconButton, Paper, Typography } from '@mui/material';
+import { observer } from 'mobx-react';
+const DomainLegend = observer(function ({ model }) {
+    const [expanded, setExpanded] = useState(true);
+    const { actuallyShowDomains, visibleDomainTypes: visible, fillPalette, } = model;
+    const ExpandIcon = expanded ? ExpandLess : ExpandMore;
+    return actuallyShowDomains && visible.length > 0 ? (React.createElement(Paper, { elevation: 3, style: {
+            position: 'absolute',
+            top: 4,
+            right: 4,
+            zIndex: 100,
+            maxWidth: 260,
+            maxHeight: '60%',
+            display: 'flex',
+            flexDirection: 'column',
+            opacity: 0.95,
+        } },
+        React.createElement("div", { style: {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'flex-end',
+                padding: '2px 4px 2px 8px',
+            } },
+            React.createElement(IconButton, { size: "small", onClick: () => {
+                    setExpanded(!expanded);
+                } },
+                React.createElement(ExpandIcon, { fontSize: "small" }))),
+        expanded ? (React.createElement("div", { style: { overflow: 'auto', padding: '0 8px 6px' } }, visible.map(({ accession, name }) => (React.createElement("div", { key: accession, style: { display: 'flex', alignItems: 'center', gap: 6 }, title: accession },
+            React.createElement("div", { style: {
+                    width: 12,
+                    height: 12,
+                    flexShrink: 0,
+                    background: fillPalette[accession],
+                } }),
+            React.createElement(Typography, { variant: "caption", noWrap: true }, name)))))) : null)) : null;
+});
+export default DomainLegend;
+//# sourceMappingURL=DomainLegend.js.map

package/dist/components/msa/DomainLegend.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DomainLegend.js","sourceRoot":"","sources":["../../../src/components/msa/DomainLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,MAAM,YAAY,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACxE,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAA;IAC9C,MAAM,EACJ,mBAAmB,EACnB,kBAAkB,EAAE,OAAO,EAC3B,WAAW,GACZ,GAAG,KAAK,CAAA;IACT,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAA;IAErD,OAAO,mBAAmB,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACjD,oBAAC,KAAK,IACJ,SAAS,EAAE,CAAC,EACZ,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,GAAG;YACX,QAAQ,EAAE,GAAG;YACb,SAAS,EAAE,KAAK;YAChB,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;YACvB,OAAO,EAAE,IAAI;SACd;QAED,6BACE,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,UAAU,EAAE,QAAQ;gBACpB,cAAc,EAAE,UAAU;gBAC1B,OAAO,EAAE,iBAAiB;aAC3B;YAED,oBAAC,UAAU,IACT,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE;oBACZ,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAA;gBACxB,CAAC;gBAED,oBAAC,UAAU,IAAC,QAAQ,EAAC,OAAO,GAAG,CACpB,CACT;QACL,QAAQ,CAAC,CAAC,CAAC,CACV,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,IACnD,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CACpC,6BACE,GAAG,EAAE,SAAS,EACd,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EACxD,KAAK,EAAE,SAAS;YAEhB,6BACE,KAAK,EAAE;oBACL,KAAK,EAAE,EAAE;oBACT,MAAM,EAAE,EAAE;oBACV,UAAU,EAAE,CAAC;oBACb,UAAU,EAAE,WAAW,CAAC,SAAS,CAAC;iBACnC,GACD;YACF,oBAAC,UAAU,IAAC,OAAO,EAAC,SAAS,EAAC,MAAM,UACjC,IAAI,CACM,CACT,CACP,CAAC,CACE,CACP,CAAC,CAAC,CAAC,IAAI,CACF,CACT,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA;AAEF,eAAe,YAAY,CAAA"}

package/dist/components/msa/MSACanvasBlock.js

@@ -1,9 +1,10 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useState } from 'react';
 import { BaseTooltip } from '@jbrowse/core/ui';
-import { autorun } from 'mobx';
 import { observer } from 'mobx-react';
+import ColumnStats from "./ColumnStats.js";
 import { renderBoxFeatureCanvasBlock } from "./renderBoxFeatureCanvasBlock.js";
 import { renderMSABlock } from "./renderMSABlock.js";
+import { useCanvasAutorun } from "../../useCanvasAutorun.js";
 import { useColorContrast } from "../../useColorContrast.js";
 function eventToColRow(event, el, offsetX, offsetY, colWidth, rowHeight) {
     const { left, top } = el.getBoundingClientRect();
@@ -15,31 +16,24 @@ function eventToColRow(event, el, offsetX, offsetY, colWidth, rowHeight) {
 const MSACanvasBlock = observer(function ({ model, offsetX, offsetY, }) {
     const { colWidth, rowHeight, scrollY, scrollX, colorScheme, blockSize, mouseClickCol, mouseClickRow, highResScaleFactor, } = model;
     const { theme, contrastScheme } = useColorContrast(colorScheme);
-    const ref = useRef(null);
-    useEffect(() => {
-        const ctx = ref.current?.getContext('2d');
-        if (!ctx) {
-            return;
-        }
-        return autorun(() => {
-            ctx.resetTransform();
-            ctx.clearRect(0, 0, blockSize * highResScaleFactor, blockSize * highResScaleFactor);
-            if (model.actuallyShowDomains) {
-                renderBoxFeatureCanvasBlock({
-                    ctx,
-                    offsetX,
-                    offsetY,
-                    model,
-                });
-            }
-            renderMSABlock({
+    const ref = useCanvasAutorun(ctx => {
+        ctx.resetTransform();
+        ctx.clearRect(0, 0, blockSize * highResScaleFactor, blockSize * highResScaleFactor);
+        if (model.actuallyShowDomains) {
+            renderBoxFeatureCanvasBlock({
                 ctx,
-                theme,
                 offsetX,
                 offsetY,
-                contrastScheme,
                 model,
             });
+        }
+        renderMSABlock({
+            ctx,
+            theme,
+            offsetX,
+            offsetY,
+            contrastScheme,
+            model,
         });
     }, [
         model,
@@ -51,7 +45,7 @@ const MSACanvasBlock = observer(function ({ model, offsetX, offsetY, }) {
         contrastScheme,
     ]);
     const [mousePosition, setMousePosition] = useState();
-    const { hoveredInsertion } = model;
+    const { hoveredInsertion, mouseOverDomains, showColumnStats } = model;
     return (React.createElement(React.Fragment, null,
         React.createElement("canvas", { ref: ref, onMouseMove: event => {
                 if (ref.current) {
@@ -66,11 +60,14 @@ const MSACanvasBlock = observer(function ({ model, offsetX, offsetY, }) {
                     else {
                         model.setMousePos(undefined, undefined);
                     }
-                    // only track client coords when an insertion is hovered (the only
-                    // consumer is the tooltip below); avoids a re-render on every move
-                    setMousePosition(model.hoveredInsertion
-                        ? { x: event.clientX, y: event.clientY }
-                        : undefined);
+                    // only track client coords when there's something to show in the
+                    // tooltip: an insertion, a domain under the cursor, or column stats
+                    // (when that option is enabled). avoids a re-render on every move
+                    // when nothing would be shown
+                    const hasTooltip = model.hoveredInsertion ||
+                        model.mouseOverDomains.length > 0 ||
+                        (model.showColumnStats && !!model.mouseOverColumnStats);
+                    setMousePosition(hasTooltip ? { x: event.clientX, y: event.clientY } : undefined);
                 }
             }, onClick: event => {
                 if (ref.current) {
@@ -100,7 +97,22 @@ const MSACanvasBlock = observer(function ({ model, offsetX, offsetY, }) {
             ' ',
             hoveredInsertion.letters.length > 20
                 ? `${hoveredInsertion.letters.slice(0, 20)}...`
-                : hoveredInsertion.letters)) : null));
+                : hoveredInsertion.letters)) : null,
+        !hoveredInsertion &&
+            mousePosition &&
+            (mouseOverDomains.length > 0 || showColumnStats) ? (React.createElement(BaseTooltip, { clientPoint: { x: mousePosition.x, y: mousePosition.y + 15 } },
+            mouseOverDomains.map(d => (React.createElement("div", { key: `${d.accession}-${d.start}-${d.end}` },
+                React.createElement("b", null, d.name),
+                " (",
+                d.accession,
+                ") ",
+                d.start,
+                "-",
+                d.end,
+                d.description ? (React.createElement(React.Fragment, null,
+                    React.createElement("br", null),
+                    d.description)) : null))),
+            showColumnStats ? React.createElement(ColumnStats, { model: model }) : null)) : null));
 });
 export default MSACanvasBlock;
 //# sourceMappingURL=MSACanvasBlock.js.map

package/dist/components/msa/MSACanvasBlock.js.map

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

package/dist/components/msa/MSAMouseoverCanvas.js

@@ -1,21 +1,15 @@
-import React, { useEffect, useRef } from 'react';
+import React from 'react';
 import { isAlive } from '@jbrowse/mobx-state-tree';
-import { autorun } from 'mobx';
 import { observer } from 'mobx-react';
 import { renderMouseover } from "./renderMSAMouseover.js";
+import { useCanvasAutorun } from "../../useCanvasAutorun.js";
 const MSAMouseoverCanvas = observer(function ({ model, }) {
-    const ref = useRef(null);
     const { height, msaAreaWidth, verticalScrollbarWidth, highResScaleFactor } = model;
     const width = msaAreaWidth - verticalScrollbarWidth;
-    useEffect(() => {
-        const ctx = ref.current?.getContext('2d');
-        return ctx
-            ? autorun(() => {
-                if (isAlive(model)) {
-                    renderMouseover({ ctx, model });
-                }
-            })
-            : undefined;
+    const ref = useCanvasAutorun(ctx => {
+        if (isAlive(model)) {
+            renderMouseover({ ctx, model });
+        }
     }, [model]);
     return (React.createElement("canvas", { ref: ref, id: "mouseover", width: width * highResScaleFactor, height: height * highResScaleFactor, style: {
             position: 'absolute',

package/dist/components/msa/MSAMouseoverCanvas.js.map

@@ -1 +1 @@
-{"version":3,"file":"MSAMouseoverCanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSAMouseoverCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAEhD,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAIzD,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,EAC5C,KAAK,GAGN;IACC,MAAM,GAAG,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC3C,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,GACxE,KAAK,CAAA;IACP,MAAM,KAAK,GAAG,YAAY,GAAG,sBAAsB,CAAA;IACnD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,GAAG,GAAG,GAAG,CAAC,OAAO,EAAE,UAAU,CAAC,IAAI,CAAC,CAAA;QACzC,OAAO,GAAG;YACR,CAAC,CAAC,OAAO,CAAC,GAAG,EAAE;gBACX,IAAI,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;oBACnB,eAAe,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,CAAA;gBACjC,CAAC;YACH,CAAC,CAAC;YACJ,CAAC,CAAC,SAAS,CAAA;IACf,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAC,WAAW,EACd,KAAK,EAAE,KAAK,GAAG,kBAAkB,EACjC,MAAM,EAAE,MAAM,GAAG,kBAAkB,EACnC,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;YACP,KAAK;YACL,MAAM;YACN,MAAM,EAAE,IAAI;YACZ,aAAa,EAAE,MAAM;SACtB,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,kBAAkB,CAAA"}
+{"version":3,"file":"MSAMouseoverCanvas.js","sourceRoot":"","sources":["../../../src/components/msa/MSAMouseoverCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAI5D,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,EAC5C,KAAK,GAGN;IACC,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,GACxE,KAAK,CAAA;IACP,MAAM,KAAK,GAAG,YAAY,GAAG,sBAAsB,CAAA;IACnD,MAAM,GAAG,GAAG,gBAAgB,CAC1B,GAAG,CAAC,EAAE;QACJ,IAAI,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;YACnB,eAAe,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,CAAA;QACjC,CAAC;IACH,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAA;IAED,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAC,WAAW,EACd,KAAK,EAAE,KAAK,GAAG,kBAAkB,EACjC,MAAM,EAAE,MAAM,GAAG,kBAAkB,EACnC,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;YACP,KAAK;YACL,MAAM;YACN,MAAM,EAAE,IAAI;YACZ,aAAa,EAAE,MAAM;SACtB,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,kBAAkB,CAAA"}

package/dist/components/msa/MSAPanel.js

@@ -1,11 +1,13 @@
 import React from 'react';
 import { observer } from 'mobx-react';
+import DomainLegend from "./DomainLegend.js";
 import MSACanvas from "./MSACanvas.js";
 import MSAMouseoverCanvas from "./MSAMouseoverCanvas.js";
 const MSAPanel = observer(function ({ model }) {
     return (React.createElement("div", { style: { position: 'relative' } },
         React.createElement(MSACanvas, { model: model }),
-        React.createElement(MSAMouseoverCanvas, { model: model })));
+        React.createElement(MSAMouseoverCanvas, { model: model }),
+        React.createElement(DomainLegend, { model: model })));
 });
 export default MSAPanel;
 //# sourceMappingURL=MSAPanel.js.map

package/dist/components/msa/MSAPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"MSAPanel.js","sourceRoot":"","sources":["../../../src/components/msa/MSAPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,SAAS,MAAM,gBAAiB,CAAA;AACvC,OAAO,kBAAkB,MAAM,yBAA0B,CAAA;AAKzD,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACpE,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE;QAClC,oBAAC,SAAS,IAAC,KAAK,EAAE,KAAK,GAAI;QAC3B,oBAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,GAAI,CAChC,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"MSAPanel.js","sourceRoot":"","sources":["../../../src/components/msa/MSAPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,YAAY,MAAM,mBAAoB,CAAA;AAC7C,OAAO,SAAS,MAAM,gBAAiB,CAAA;AACvC,OAAO,kBAAkB,MAAM,yBAA0B,CAAA;AAKzD,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACpE,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE;QAClC,oBAAC,SAAS,IAAC,KAAK,EAAE,KAAK,GAAI;QAC3B,oBAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,GAAI;QACpC,oBAAC,YAAY,IAAC,KAAK,EAAE,KAAK,GAAI,CAC1B,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}

package/dist/components/msa/renderBoxFeatureCanvasBlock.js

@@ -1,4 +1,5 @@
 import { getVisibleLeaves } from "./getVisibleLeaves.js";
+import { subFeatureRowHeight } from "../../constants.js";
 export function renderBoxFeatureCanvasBlock({ model, offsetX, offsetY, ctx, highResScaleFactorOverride, blockSizeYOverride, }) {
     const { blockSize, rowHeight, highResScaleFactor, showDomains } = model;
     if (showDomains) {
@@ -16,32 +17,77 @@ export function renderBoxFeatureCanvasBlock({ model, offsetX, offsetY, ctx, high
     }
 }
 function drawTiles({ model, ctx, visibleLeaves, }) {
-    const { subFeatureRows, colWidth, rowHeight, fillPalette, strokePalette, tidyFilteredGatheredInterProAnnotations, } = model;
+    const { subFeatureRows, colWidth, rowHeight, fillPalette, strokePalette, segmentLabels, showMsaLetters, tidyFilteredGatheredInterProAnnotations, } = model;
+    const h = subFeatureRows ? subFeatureRowHeight : rowHeight;
+    // exon numbers label the bands only when residue letters aren't drawn (zoomed
+    // out); when letters show, the alternating shades alone mark the boundaries
+    // and a number would collide with the sequence
+    const drawSegmentLabels = !showMsaLetters && !subFeatureRows && h >= 9;
     for (let i = 0, l1 = visibleLeaves.length; i < l1; i++) {
         const node = visibleLeaves[i];
-        const { x, data: { name }, } = node;
-        const y = x;
+        const { name } = node.data;
+        const y = node.x;
         const entry = tidyFilteredGatheredInterProAnnotations[name];
         if (entry) {
             for (let j = 0, l2 = entry.length; j < l2; j++) {
-                const { start, end, accession } = entry[j];
+                const { start, end, accession, strand } = entry[j];
                 // Convert sequence positions to visible column positions
                 // seqPos is 1-based from InterPro, so subtract 1 for 0-based
                 const m1 = model.seqPosToVisibleCol(name, start - 1);
                 const m2 = model.seqPosToVisibleCol(name, end);
-                if (m1 === undefined || m2 === undefined) {
-                    continue; // Skip if either position is hidden
+                if (m1 !== undefined && m2 !== undefined) {
+                    const x = m1 * colWidth;
+                    const t = y - rowHeight + (subFeatureRows ? j * h : 0);
+                    const lw = colWidth * (m2 - m1);
+                    ctx.fillStyle = fillPalette[accession];
+                    ctx.strokeStyle = strokePalette[accession];
+                    if (strand === undefined) {
+                        ctx.fillRect(x, t, lw, h);
+                        ctx.strokeRect(x, t, lw, h);
+                        // segment (exon) number drawn once per band, on the top visible row,
+                        // so it reads as a column header for the whole band
+                        const label = drawSegmentLabels
+                            ? segmentLabels.get(accession)
+                            : undefined;
+                        if (label !== undefined && i === 0) {
+                            const fontSize = Math.min(h - 2, 11);
+                            ctx.font = `${fontSize}px sans-serif`;
+                            if (ctx.measureText(label).width + 2 <= lw) {
+                                ctx.fillStyle = '#222';
+                                ctx.textAlign = 'center';
+                                ctx.textBaseline = 'middle';
+                                ctx.fillText(label, x + lw / 2, t + h / 2);
+                            }
+                        }
+                    }
+                    else {
+                        drawGeneArrow({ ctx, x, t, w: lw, h, strand });
+                    }
                 }
-                const x = m1 * colWidth;
-                ctx.fillStyle = fillPalette[accession];
-                ctx.strokeStyle = strokePalette[accession];
-                const h = subFeatureRows ? 4 : rowHeight;
-                const t = y - rowHeight + (subFeatureRows ? j * h : 0);
-                const lw = colWidth * (m2 - m1);
-                ctx.fillRect(x, t, lw, h);
-                ctx.strokeRect(x, t, lw, h);
             }
         }
     }
 }
+// A gene arrow: a full-width rectangular body spanning the feature's
+// start..end columns, plus a triangular head that points *beyond* that end in
+// the strand direction (right for +, left for -). Keeping the body aligned to
+// the exact start/end columns means + and - strand features read as having the
+// same boundaries; the arrow lives outside them purely to show transcription
+// direction, preserving the column-by-column homology down the rows.
+function drawGeneArrow({ ctx, x, t, w, h, strand, }) {
+    // body spans bodyStart..bodyEnd (the exact columns); the head extends one
+    // row-height past bodyEnd in the strand direction
+    const dir = strand > 0 ? 1 : -1;
+    const bodyStart = strand > 0 ? x : x + w;
+    const bodyEnd = strand > 0 ? x + w : x;
+    ctx.beginPath();
+    ctx.moveTo(bodyStart, t);
+    ctx.lineTo(bodyEnd, t);
+    ctx.lineTo(bodyEnd + dir * h, t + h / 2);
+    ctx.lineTo(bodyEnd, t + h);
+    ctx.lineTo(bodyStart, t + h);
+    ctx.closePath();
+    ctx.fill();
+    ctx.stroke();
+}
 //# sourceMappingURL=renderBoxFeatureCanvasBlock.js.map