@jbrowse/plugin-wiggle/esm/Tooltip.js

JBrowse 2 wiggle adapters, tracks, etc.

import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { Suspense } from 'react';
import BaseTooltip from '@jbrowse/core/ui/BaseTooltip';
import { makeStyles } from '@jbrowse/core/util/tss-react';
import { observer } from 'mobx-react';
import { YSCALEBAR_LABEL_OFFSET } from "./util.js";
const useStyles = makeStyles()(theme => ({
    hoverVertical: {
        background: theme.palette.text.primary,
        border: 'none',
        width: 1,
        height: '100%',
        top: YSCALEBAR_LABEL_OFFSET,
        cursor: 'default',
        position: 'absolute',
        pointerEvents: 'none',
    },
}));
const Tooltip = observer(function Tooltip({ model, height, clientMouseCoord, offsetMouseCoord, TooltipContents, }) {
    const { featureUnderMouse } = model;
    const { classes } = useStyles();
    const x = clientMouseCoord[0] + 5;
    const y = clientMouseCoord[1];
    return featureUnderMouse ? (_jsxs(_Fragment, { children: [_jsx(Suspense, { fallback: null, children: _jsx(BaseTooltip, { clientPoint: { x, y }, children: _jsx(TooltipContents, { model: model, feature: featureUnderMouse }) }) }), _jsx("div", { className: classes.hoverVertical, style: {
                    left: offsetMouseCoord[0],
                    height: height - YSCALEBAR_LABEL_OFFSET * 2,
                } })] })) : null;
});
export default Tooltip;