@jbrowse/plugin-linear-genome-view
Version:
JBrowse 2 linear genome view
31 lines (30 loc) • 1.34 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { getSession, stringify } from '@jbrowse/core/util';
import { makeStyles } from '@jbrowse/core/util/tss-react';
import { Tooltip } from '@mui/material';
import { observer } from 'mobx-react';
const useStyles = makeStyles()({
guide: {
pointerEvents: 'none',
height: '100%',
width: 1,
position: 'absolute',
left: 0,
},
});
const OverviewRubberbandHoverTooltip = observer(function OverviewRubberbandHoverTooltip({ model, open, guideX, overview, }) {
const { classes } = useStyles();
const { cytobandOffset } = model;
const { assemblyManager } = getSession(model);
const px = overview.pxToBp(guideX - cytobandOffset);
const assembly = assemblyManager.get(px.assemblyName);
const cytoband = assembly?.cytobands?.find(f => px.coord > f.get('start') &&
px.coord < f.get('end') &&
px.refName === assembly.getCanonicalRefName(f.get('refName')));
return (_jsx(Tooltip, { open: open, placement: "top", title: [
stringify(px),
cytoband?.get('name'),
cytoband?.get('type'),
].join(' '), arrow: true, children: _jsx("div", { className: classes.guide, style: { transform: `translateX(${guideX}px)` } }) }));
});
export default OverviewRubberbandHoverTooltip;