jbrowse-plugin-mafviewer 1.4.3 → 1.4.6

package/dist/MafSequenceWidget/MafSequenceHoverHighlight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MafSequenceHoverHighlight.js","sourceRoot":"","sources":["../../src/MafSequenceWidget/MafSequenceHoverHighlight.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAK1C,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACvC,SAAS,EAAE;QACT,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,UAAU;QACpB,UAAU,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE;QACvE,UAAU,EAAE,aAAa,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE;QACrD,WAAW,EAAE,aAAa,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE;QACtD,aAAa,EAAE,MAAM;QACrB,MAAM,EAAE,EAAE;KACX;CACF,CAAC,CAAC,CAAA;AAEH,MAAM,yBAAyB,GAAG,QAAQ,CAAC,SAAS,yBAAyB,CAAC,EAC5E,KAAK,GAGN;IACC,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,CAAA;IACjC,MAAM,EAAE,eAAe,EAAE,GAAG,OAAO,CAAA;IAEnC,mEAAmE;IACnE,MAAM,OAAO,GACX,SAAS,IAAI,OAAO,CAAC,CAAC,CAAE,OAAO,CAAC,OAAgC,CAAC,CAAC,CAAC,SAAS,CAAA;IAC9E,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,IAAI,CAAA;IACb,CAAC;IAED,MAAM,UAAU,GAAsB,EAAE,CAAA;IAExC,KAAK,MAAM,CAAC,EAAE,MAAM,CAAC,IAAI,OAAO,EAAE,CAAC;QACjC,MAAM,CAAC,GAAG,MAIT,CAAA;QACD,IAAI,CAAC,CAAC,IAAI,KAAK,mBAAmB,IAAI,CAAC,CAAC,eAAe,KAAK,KAAK,CAAC,EAAE,EAAE,CAAC;YACrE,MAAM,SAAS,GAAG,MAAgC,CAAA;YAClD,MAAM,EAAE,cAAc,EAAE,GAAG,SAAS,CAAA;YAEpC,IAAI,cAAc,EAAE,CAAC;gBACnB,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,EAAE,YAAY,EAAE,GAAG,cAAc,CAAA;gBAC5D,MAAM,QAAQ,GAAG,eAAe,CAAC,GAAG,CAAC,YAAY,CAAC,CAAA;gBAClD,MAAM,gBAAgB,GACpB,QAAQ,EAAE,mBAAmB,CAAC,OAAO,CAAC,IAAI,OAAO,CAAA;gBAEnD,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC;oBAC3B,OAAO,EAAE,gBAAgB;oBACzB,KAAK,EAAE,KAAK;iBACb,CAAC,CAAA;gBACF,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAA;gBAErE,IAAI,OAAO,IAAI,KAAK,EAAE,CAAC;oBACrB,MAAM,IAAI,GACR,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAA;oBAC7D,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,QAAQ,GAAG,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAA;oBAEtE,UAAU,CAAC,IAAI,CACb,6BACE,GAAG,EAAE,aAAa,SAAS,CAAC,EAAE,EAAE,EAChC,SAAS,EAAE,OAAO,CAAC,SAAS,EAC5B,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,GACtB,CACH,CAAA;gBACH,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IAED,OAAO,0CAAG,UAAU,CAAI,CAAA;AAC1B,CAAC,CAAC,CAAA;AAEF,eAAe,yBAAyB,CAAA"}

package/dist/MafSequenceWidget/MafSequenceHoverHighlightExtension.d.ts

@@ -0,0 +1,2 @@
+import type PluginManager from '@jbrowse/core/PluginManager';
+export default function MafSequenceHoverHighlightExtensionF(pluginManager: PluginManager): void;

package/dist/MafSequenceWidget/MafSequenceHoverHighlightExtension.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import MafSequenceHoverHighlight from './MafSequenceHoverHighlight';
+export default function MafSequenceHoverHighlightExtensionF(pluginManager) {
+    pluginManager.addToExtensionPoint('LinearGenomeView-TracksContainerComponent', (rest, props) => {
+        const model = props.model;
+        return [
+            ...rest,
+            React.createElement(MafSequenceHoverHighlight, { key: "maf-sequence-hover-highlight", model: model }),
+        ];
+    });
+}
+//# sourceMappingURL=MafSequenceHoverHighlightExtension.js.map

package/dist/MafSequenceWidget/MafSequenceHoverHighlightExtension.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MafSequenceHoverHighlightExtension.js","sourceRoot":"","sources":["../../src/MafSequenceWidget/MafSequenceHoverHighlightExtension.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,yBAAyB,MAAM,6BAA6B,CAAA;AAKnE,MAAM,CAAC,OAAO,UAAU,mCAAmC,CACzD,aAA4B;IAE5B,aAAa,CAAC,mBAAmB,CAC/B,2CAA2C,EAC3C,CAAC,IAAuB,EAAE,KAA8B,EAAE,EAAE;QAC1D,MAAM,KAAK,GAAG,KAAK,CAAC,KAA8B,CAAA;QAClD,OAAO;YACL,GAAG,IAAI;YACP,oBAAC,yBAAyB,IACxB,GAAG,EAAC,8BAA8B,EAClC,KAAK,EAAE,KAAK,GACZ;SACH,CAAA;IACH,CAAC,CACF,CAAA;AACH,CAAC"}

package/dist/MafSequenceWidget/MafSequenceWidget.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import type { MafSequenceWidgetModel } from './stateModelFactory';
+declare const MafSequenceWidget: ({ model, }: {
+    model: MafSequenceWidgetModel;
+}) => React.JSX.Element;
+export default MafSequenceWidget;

package/dist/MafSequenceWidget/MafSequenceWidget.js

@@ -0,0 +1,189 @@
+import React, { useEffect, useState } from 'react';
+import { CascadingMenuButton, ErrorMessage, LoadingEllipses, } from '@jbrowse/core/ui';
+import { getSession, useLocalStorage } from '@jbrowse/core/util';
+import { Button, Paper } from '@mui/material';
+import { observer } from 'mobx-react';
+import { makeStyles } from 'tss-react/mui';
+import { ContentCopy as CopyIcon, Difference as DifferenceIcon, Download as DownloadIcon, FormatColorFill as ColorBackgroundIcon, KeyboardArrowDown, Label as LabelIcon, PlaylistAdd as InsertionsIcon, Subject as AllLettersIcon, TableRows as TableRowsIcon, } from '@mui/icons-material';
+import SequenceDisplay from './SequenceDisplay';
+import { copyToClipboard, downloadAsFile } from '../util/clipboard';
+const useStyles = makeStyles()(theme => ({
+    root: {
+        padding: theme.spacing(2),
+    },
+    controls: {
+        display: 'flex',
+        alignItems: 'center',
+        flexWrap: 'wrap',
+        gap: theme.spacing(1),
+        marginBottom: theme.spacing(2),
+    },
+}));
+const MafSequenceWidget = observer(function MafSequenceWidget({ model, }) {
+    const { classes } = useStyles();
+    const session = getSession(model);
+    const { adapterConfig, samples, regions } = model;
+    const [showAllLetters, setShowAllLetters] = useLocalStorage('mafSequenceWidget-showAllLetters', true);
+    const [includeInsertions, setIncludeInsertions] = useLocalStorage('mafSequenceWidget-includeInsertions', false);
+    const [singleLineFormat, setSingleLineFormat] = useLocalStorage('mafSequenceWidget-singleLineFormat', false);
+    const [colorBackground, setColorBackground] = useLocalStorage('mafSequenceWidget-colorBackground', true);
+    const [showSampleNames, setShowSampleNames] = useLocalStorage('mafSequenceWidget-showSampleNames', true);
+    const [rawSequences, setRawSequences] = useState([]);
+    const [formattedSequence, setFormattedSequence] = useState('');
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState();
+    useEffect(() => {
+        if (!adapterConfig || !samples || !regions) {
+            return;
+        }
+        // eslint-disable-next-line @typescript-eslint/no-floating-promises
+        ;
+        (async () => {
+            try {
+                setLoading(true);
+                setError(undefined);
+                const { rpcManager } = session;
+                const fastaSequence = (await rpcManager.call('MafSequenceWidget', 'MafGetSequences', {
+                    sessionId: 'MafSequenceWidget',
+                    adapterConfig,
+                    samples,
+                    showAllLetters,
+                    includeInsertions,
+                    regions,
+                }));
+                setRawSequences(fastaSequence);
+                let formatted;
+                if (singleLineFormat) {
+                    const maxLabelLength = Math.max(...samples.map(s => (s.label ?? s.id).length));
+                    formatted = fastaSequence
+                        .map((r, idx) => {
+                        const sample = samples[idx];
+                        const label = sample.label ?? sample.id;
+                        const padding = ' '.repeat(maxLabelLength - label.length + 2);
+                        return `>${label}${padding}${r}`;
+                    })
+                        .join('\n');
+                }
+                else {
+                    formatted = fastaSequence
+                        .map((r, idx) => {
+                        const sample = samples[idx];
+                        return `>${sample.label ?? sample.id}\n${r}`;
+                    })
+                        .join('\n');
+                }
+                setFormattedSequence(formatted);
+            }
+            catch (e) {
+                console.error(e);
+                setError(e);
+            }
+            finally {
+                setLoading(false);
+            }
+        })();
+    }, [
+        adapterConfig,
+        samples,
+        regions,
+        showAllLetters,
+        includeInsertions,
+        singleLineFormat,
+        session,
+    ]);
+    const sequenceTooLarge = formattedSequence
+        ? formattedSequence.length > 5_000_000
+        : false;
+    if (!adapterConfig || !samples || !regions) {
+        return (React.createElement(Paper, { className: classes.root },
+            React.createElement("div", null, "No sequence data available")));
+    }
+    return (React.createElement(Paper, { className: classes.root },
+        React.createElement("div", { className: classes.controls },
+            React.createElement(CascadingMenuButton, { menuItems: [
+                    {
+                        label: 'Show all letters',
+                        icon: AllLettersIcon,
+                        type: 'radio',
+                        checked: showAllLetters,
+                        onClick: () => {
+                            setShowAllLetters(true);
+                        },
+                    },
+                    {
+                        label: 'Show only differences',
+                        icon: DifferenceIcon,
+                        type: 'radio',
+                        checked: !showAllLetters,
+                        onClick: () => {
+                            setShowAllLetters(false);
+                        },
+                    },
+                    {
+                        label: 'Include insertions',
+                        icon: InsertionsIcon,
+                        type: 'checkbox',
+                        checked: includeInsertions,
+                        onClick: () => {
+                            setIncludeInsertions(!includeInsertions);
+                        },
+                    },
+                    {
+                        label: 'Single line format',
+                        icon: TableRowsIcon,
+                        type: 'checkbox',
+                        checked: singleLineFormat,
+                        onClick: () => {
+                            setSingleLineFormat(!singleLineFormat);
+                        },
+                    },
+                    {
+                        label: 'Color background',
+                        icon: ColorBackgroundIcon,
+                        type: 'checkbox',
+                        checked: colorBackground,
+                        onClick: () => {
+                            setColorBackground(!colorBackground);
+                        },
+                    },
+                    {
+                        label: 'Show sample names',
+                        icon: LabelIcon,
+                        type: 'checkbox',
+                        checked: showSampleNames,
+                        onClick: () => {
+                            setShowSampleNames(!showSampleNames);
+                        },
+                    },
+                    { type: 'divider' },
+                    {
+                        label: 'Copy to clipboard',
+                        icon: CopyIcon,
+                        disabled: loading || !formattedSequence,
+                        onClick: () => {
+                            copyToClipboard(formattedSequence, () => {
+                                session.notify('Sequence copied to clipboard', 'info');
+                            }, e => {
+                                session.notifyError(`${e}`, e);
+                            }).catch((e) => {
+                                console.error(e);
+                            });
+                        },
+                    },
+                    {
+                        label: 'Download as FASTA',
+                        icon: DownloadIcon,
+                        disabled: loading || !formattedSequence,
+                        onClick: () => {
+                            downloadAsFile(formattedSequence, 'sequence.fasta', () => {
+                                session.notify('Sequence downloaded', 'info');
+                            }, e => {
+                                session.notifyError(`${e}`, e);
+                            });
+                        },
+                    },
+                ], ButtonComponent: props => (React.createElement(Button, { ...props, variant: "contained", size: "small", endIcon: React.createElement(KeyboardArrowDown, null) }, "Actions")) })),
+        error ? (React.createElement(ErrorMessage, { error: error })) : (React.createElement(React.Fragment, null, loading ? (React.createElement(LoadingEllipses, null)) : sequenceTooLarge ? (React.createElement("div", null, "Reference sequence too large to display, use the Download button")) : (React.createElement(SequenceDisplay, { model: model, sequences: rawSequences, singleLineFormat: singleLineFormat, includeInsertions: includeInsertions, colorBackground: colorBackground, showSampleNames: showSampleNames }))))));
+});
+export default MafSequenceWidget;
+//# sourceMappingURL=MafSequenceWidget.js.map

package/dist/MafSequenceWidget/MafSequenceWidget.js.map

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

package/dist/MafSequenceWidget/SequenceCanvas.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { Sample } from '../LinearMafDisplay/types';
+interface SequenceCanvasProps {
+    samples: Sample[];
+    sequences: string[];
+    colorBackground: boolean;
+    hoveredCol?: number;
+    onHover: (col: number | undefined, row: number | undefined, clientX: number, clientY: number) => void;
+    onLeave: () => void;
+}
+export default function SequenceCanvas({ samples, sequences, colorBackground, hoveredCol, onHover, onLeave, }: SequenceCanvasProps): React.JSX.Element;
+export {};

package/dist/MafSequenceWidget/SequenceCanvas.js

@@ -0,0 +1,86 @@
+import React, { useCallback, useEffect, useRef } from 'react';
+import { alpha, useTheme } from '@mui/material';
+import { getBaseColor, getContrastText } from './baseColors';
+import { CHAR_WIDTH, FONT, ROW_HEIGHT } from './constants';
+export default function SequenceCanvas({ samples, sequences, colorBackground, hoveredCol, onHover, onLeave, }) {
+    const theme = useTheme();
+    const canvasRef = useRef(null);
+    const seqLength = sequences[0]?.length || 0;
+    const canvasWidth = seqLength * CHAR_WIDTH;
+    const canvasHeight = samples.length * ROW_HEIGHT;
+    useEffect(() => {
+        const canvas = canvasRef.current;
+        if (!canvas) {
+            return;
+        }
+        const ctx = canvas.getContext('2d');
+        if (!ctx) {
+            return;
+        }
+        const dpr = window.devicePixelRatio || 1;
+        canvas.width = canvasWidth * dpr;
+        canvas.height = canvasHeight * dpr;
+        canvas.style.width = `${canvasWidth}px`;
+        canvas.style.height = `${canvasHeight}px`;
+        ctx.scale(dpr, dpr);
+        ctx.fillStyle = theme.palette.background.paper;
+        ctx.fillRect(0, 0, canvasWidth, canvasHeight);
+        ctx.font = FONT;
+        ctx.textBaseline = 'top';
+        for (let rowIdx = 0; rowIdx < samples.length; rowIdx++) {
+            const seq = sequences[rowIdx] || '';
+            const y = rowIdx * ROW_HEIGHT;
+            for (let colIdx = 0; colIdx < seq.length; colIdx++) {
+                const char = seq[colIdx];
+                const x = colIdx * CHAR_WIDTH;
+                if (colorBackground && char !== '-' && char !== '.') {
+                    ctx.fillStyle = getBaseColor(char, theme);
+                    ctx.fillRect(x, y, CHAR_WIDTH, ROW_HEIGHT);
+                }
+                if (colIdx === hoveredCol) {
+                    const highlight = theme.palette.highlight;
+                    const highlightColor = highlight?.main ?? '#FFB11D';
+                    ctx.fillStyle = alpha(highlightColor, 0.5);
+                    ctx.fillRect(x, y, CHAR_WIDTH, ROW_HEIGHT);
+                }
+                if (char === '-') {
+                    ctx.fillStyle = theme.palette.grey[400];
+                }
+                else if (char === '.') {
+                    ctx.fillStyle = theme.palette.grey[500];
+                }
+                else if (colorBackground) {
+                    ctx.fillStyle = getContrastText(char, theme);
+                }
+                else {
+                    ctx.fillStyle = getBaseColor(char, theme);
+                }
+                ctx.fillText(char, x + 2, y + 2);
+            }
+        }
+    }, [
+        samples,
+        sequences,
+        canvasWidth,
+        canvasHeight,
+        hoveredCol,
+        colorBackground,
+        theme,
+    ]);
+    const handleMouseMove = useCallback((e) => {
+        const canvas = canvasRef.current;
+        if (!canvas) {
+            return;
+        }
+        const rect = canvas.getBoundingClientRect();
+        const x = e.clientX - rect.left;
+        const y = e.clientY - rect.top;
+        const col = Math.floor(x / CHAR_WIDTH);
+        const row = Math.floor(y / ROW_HEIGHT);
+        const validCol = col >= 0 && col < seqLength ? col : undefined;
+        const validRow = row >= 0 && row < samples.length ? row : undefined;
+        onHover(validCol, validRow, e.clientX, e.clientY);
+    }, [seqLength, samples.length, onHover]);
+    return (React.createElement("canvas", { ref: canvasRef, style: { display: 'block' }, onMouseMove: handleMouseMove, onMouseLeave: onLeave }));
+}
+//# sourceMappingURL=SequenceCanvas.js.map

package/dist/MafSequenceWidget/SequenceCanvas.js.map

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

package/dist/MafSequenceWidget/SequenceDisplay.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { MafSequenceWidgetModel } from './stateModelFactory';
+interface SequenceDisplayProps {
+    model: MafSequenceWidgetModel;
+    sequences: string[];
+    singleLineFormat: boolean;
+    includeInsertions: boolean;
+    colorBackground: boolean;
+    showSampleNames: boolean;
+}
+declare const SequenceDisplay: ({ model, sequences, colorBackground, showSampleNames, }: SequenceDisplayProps) => React.JSX.Element;
+export default SequenceDisplay;

package/dist/MafSequenceWidget/SequenceDisplay.js

@@ -0,0 +1,117 @@
+import React, { useCallback, useEffect, useMemo, useRef } from 'react';
+import { observer } from 'mobx-react';
+import { makeStyles } from 'tss-react/mui';
+import LabelsCanvas from './LabelsCanvas';
+import SequenceCanvas from './SequenceCanvas';
+import SequenceTooltip from './SequenceTooltip';
+import { buildColToGenomePos, findRefSampleIndex } from './colToGenomePos';
+const useStyles = makeStyles()(theme => ({
+    container: {
+        border: `1px solid ${theme.palette.divider}`,
+        borderRadius: theme.shape.borderRadius,
+        maxHeight: 400,
+        backgroundColor: theme.palette.background.paper,
+        display: 'flex',
+        overflow: 'hidden',
+        position: 'relative',
+    },
+    labelsContainer: {
+        flexShrink: 0,
+        borderRight: `1px solid ${theme.palette.divider}`,
+        backgroundColor: theme.palette.background.paper,
+        overflowY: 'auto',
+        scrollbarWidth: 'none',
+        '&::-webkit-scrollbar': {
+            display: 'none',
+        },
+    },
+    sequenceContainer: {
+        flex: 1,
+        overflow: 'auto',
+    },
+}));
+const SequenceDisplay = observer(function SequenceDisplay({ model, sequences, colorBackground, showSampleNames, }) {
+    const { classes } = useStyles();
+    const labelsContainerRef = useRef(null);
+    const seqContainerRef = useRef(null);
+    const { samples, regions } = model;
+    const [hoveredCol, setHoveredCol] = React.useState();
+    const [hoveredRow, setHoveredRow] = React.useState();
+    const [tooltipPos, setTooltipPos] = React.useState();
+    const maxLabelLength = useMemo(() => samples ? Math.max(...samples.map(s => (s.label ?? s.id).length)) : 0, [samples]);
+    const colToGenomePos = useMemo(() => {
+        if (!regions) {
+            return [];
+        }
+        const region = regions[0];
+        if (!region) {
+            return [];
+        }
+        const refIdx = findRefSampleIndex(samples, region.assemblyName);
+        const refSequence = sequences[refIdx] || '';
+        return buildColToGenomePos(refSequence, region.start);
+    }, [sequences, regions, samples]);
+    // Sync vertical scroll between labels and sequences
+    useEffect(() => {
+        const labelsContainer = labelsContainerRef.current;
+        const seqContainer = seqContainerRef.current;
+        if (!labelsContainer || !seqContainer) {
+            return;
+        }
+        const handleSeqScroll = () => {
+            labelsContainer.scrollTop = seqContainer.scrollTop;
+        };
+        seqContainer.addEventListener('scroll', handleSeqScroll);
+        return () => {
+            seqContainer.removeEventListener('scroll', handleSeqScroll);
+        };
+    }, []);
+    const handleHover = useCallback((col, row, clientX, clientY) => {
+        if (!regions) {
+            return;
+        }
+        setHoveredCol(col);
+        setHoveredRow(row);
+        setTooltipPos({ x: clientX, y: clientY });
+        if (col !== undefined) {
+            const genomicPos = colToGenomePos[col];
+            const region = regions[0];
+            if (genomicPos !== undefined && region) {
+                model.setHoverHighlight({
+                    refName: region.refName,
+                    start: genomicPos,
+                    end: genomicPos + 1,
+                    assemblyName: region.assemblyName,
+                });
+            }
+            else {
+                model.setHoverHighlight(undefined);
+            }
+        }
+        else {
+            model.setHoverHighlight(undefined);
+        }
+    }, [colToGenomePos, model, regions]);
+    const handleLeave = useCallback(() => {
+        setHoveredCol(undefined);
+        setHoveredRow(undefined);
+        setTooltipPos(undefined);
+        model.setHoverHighlight(undefined);
+    }, [model]);
+    if (!samples || !regions || sequences.length === 0) {
+        return React.createElement("div", null, "No sequence data");
+    }
+    const hoveredSample = hoveredRow !== undefined ? samples[hoveredRow] : undefined;
+    const hoveredChar = hoveredRow !== undefined && hoveredCol !== undefined
+        ? sequences[hoveredRow]?.[hoveredCol]
+        : undefined;
+    const genomicPos = hoveredCol !== undefined ? colToGenomePos[hoveredCol] : undefined;
+    return (React.createElement("div", { className: classes.container },
+        showSampleNames && (React.createElement("div", { ref: labelsContainerRef, className: classes.labelsContainer },
+            React.createElement(LabelsCanvas, { samples: samples, maxLabelLength: maxLabelLength }))),
+        React.createElement("div", { ref: seqContainerRef, className: classes.sequenceContainer },
+            React.createElement(SequenceCanvas, { samples: samples, sequences: sequences, colorBackground: colorBackground, hoveredCol: hoveredCol, onHover: handleHover, onLeave: handleLeave })),
+        tooltipPos && hoveredSample && (React.createElement(SequenceTooltip, { x: tooltipPos.x, y: tooltipPos.y, sample: hoveredSample, base: hoveredChar, genomicPos: genomicPos }))));
+});
+export default SequenceDisplay;
+//# sourceMappingURL=SequenceDisplay.js.map

package/dist/MafSequenceWidget/SequenceDisplay.js.map

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

package/dist/MafSequenceWidget/SequenceTooltip.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { Sample } from '../LinearMafDisplay/types';
+interface SequenceTooltipProps {
+    x: number;
+    y: number;
+    sample: Sample;
+    base?: string;
+    genomicPos?: number;
+}
+export default function SequenceTooltip({ x, y, sample, base, genomicPos, }: SequenceTooltipProps): React.JSX.Element;
+export {};

package/dist/MafSequenceWidget/SequenceTooltip.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import { makeStyles } from 'tss-react/mui';
+const useStyles = makeStyles()(theme => ({
+    tooltip: {
+        position: 'fixed',
+        pointerEvents: 'none',
+        zIndex: 1000,
+        backgroundColor: theme.palette.grey[800],
+        color: theme.palette.common.white,
+        padding: '4px 8px',
+        borderRadius: 4,
+        fontSize: 12,
+        whiteSpace: 'nowrap',
+    },
+    insertion: {
+        color: theme.palette.warning.light,
+        fontStyle: 'italic',
+    },
+}));
+export default function SequenceTooltip({ x, y, sample, base, genomicPos, }) {
+    const { classes } = useStyles();
+    // An insertion is when we have a base but no genomic position
+    // (the reference has a gap at this column)
+    const isInsertion = base !== undefined && genomicPos === undefined;
+    return (React.createElement("div", { className: classes.tooltip, style: {
+            left: x + 12,
+            top: y + 12,
+        } },
+        React.createElement("div", null,
+            React.createElement("strong", null, sample.label)),
+        base && (React.createElement("div", null,
+            "Base: ",
+            base,
+            genomicPos !== undefined
+                ? ` | Pos: ${(genomicPos + 1).toLocaleString('en-US')}`
+                : null)),
+        isInsertion && (React.createElement("div", { className: classes.insertion }, "Insertion (not in reference)"))));
+}
+//# sourceMappingURL=SequenceTooltip.js.map

package/dist/MafSequenceWidget/SequenceTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SequenceTooltip.js","sourceRoot":"","sources":["../../src/MafSequenceWidget/SequenceTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAI1C,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACvC,OAAO,EAAE;QACP,QAAQ,EAAE,OAAO;QACjB,aAAa,EAAE,MAAM;QACrB,MAAM,EAAE,IAAI;QACZ,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;QACxC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK;QACjC,OAAO,EAAE,SAAS;QAClB,YAAY,EAAE,CAAC;QACf,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,QAAQ;KACrB;IACD,SAAS,EAAE;QACT,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK;QAClC,SAAS,EAAE,QAAQ;KACpB;CACF,CAAC,CAAC,CAAA;AAUH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,CAAC,EACD,CAAC,EACD,MAAM,EACN,IAAI,EACJ,UAAU,GACW;IACrB,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAE/B,8DAA8D;IAC9D,2CAA2C;IAC3C,MAAM,WAAW,GAAG,IAAI,KAAK,SAAS,IAAI,UAAU,KAAK,SAAS,CAAA;IAElE,OAAO,CACL,6BACE,SAAS,EAAE,OAAO,CAAC,OAAO,EAC1B,KAAK,EAAE;YACL,IAAI,EAAE,CAAC,GAAG,EAAE;YACZ,GAAG,EAAE,CAAC,GAAG,EAAE;SACZ;QAED;YACE,oCAAS,MAAM,CAAC,KAAK,CAAU,CAC3B;QACL,IAAI,IAAI,CACP;;YACS,IAAI;YACV,UAAU,KAAK,SAAS;gBACvB,CAAC,CAAC,WAAW,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE;gBACvD,CAAC,CAAC,IAAI,CACJ,CACP;QACA,WAAW,IAAI,CACd,6BAAK,SAAS,EAAE,OAAO,CAAC,SAAS,mCAAoC,CACtE,CACG,CACP,CAAA;AACH,CAAC"}

package/dist/MafSequenceWidget/baseColors.d.ts

@@ -0,0 +1,3 @@
+import type { Theme } from '@mui/material';
+export declare function getBaseColor(base: string, theme: Theme): string;
+export declare function getContrastText(base: string, theme: Theme): string;

package/dist/MafSequenceWidget/baseColors.js

@@ -0,0 +1,64 @@
+function getBases(theme) {
+    return theme.palette.bases;
+}
+export function getBaseColor(base, theme) {
+    const bases = getBases(theme);
+    if (!bases) {
+        switch (base.toUpperCase()) {
+            case 'A':
+                return '#6dbf6d';
+            case 'C':
+                return '#6c6cff';
+            case 'G':
+                return '#ffb347';
+            case 'T':
+            case 'U':
+                return '#ff6b6b';
+            default:
+                return theme.palette.grey[500];
+        }
+    }
+    switch (base.toUpperCase()) {
+        case 'A':
+            return bases.A.main;
+        case 'C':
+            return bases.C.main;
+        case 'G':
+            return bases.G.main;
+        case 'T':
+        case 'U':
+            return bases.T.main;
+        default:
+            return theme.palette.grey[500];
+    }
+}
+export function getContrastText(base, theme) {
+    const bases = getBases(theme);
+    if (!bases) {
+        switch (base.toUpperCase()) {
+            case 'A':
+            case 'C':
+            case 'T':
+            case 'U':
+                return '#fff';
+            case 'G':
+                return '#000';
+            default:
+                return theme.palette.common.white;
+        }
+    }
+    switch (base.toUpperCase()) {
+        case 'A':
+            return bases.A.contrastText;
+        case 'C':
+            return bases.C.contrastText;
+        case 'G':
+            return bases.G.contrastText;
+        case 'T':
+        case 'U':
+            return bases.T.contrastText;
+        default:
+            return theme.palette.common.white;
+    }
+}
+//# sourceMappingURL=baseColors.js.map

package/dist/MafSequenceWidget/baseColors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"baseColors.js","sourceRoot":"","sources":["../../src/MafSequenceWidget/baseColors.ts"],"names":[],"mappings":"AASA,SAAS,QAAQ,CAAC,KAAY;IAC5B,OAAQ,KAAK,CAAC,OAAe,CAAC,KAAgC,CAAA;AAChE,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,IAAY,EAAE,KAAY;IACrD,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC7B,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,QAAQ,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC;YAC3B,KAAK,GAAG;gBACN,OAAO,SAAS,CAAA;YAClB,KAAK,GAAG;gBACN,OAAO,SAAS,CAAA;YAClB,KAAK,GAAG;gBACN,OAAO,SAAS,CAAA;YAClB,KAAK,GAAG,CAAC;YACT,KAAK,GAAG;gBACN,OAAO,SAAS,CAAA;YAClB;gBACE,OAAO,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;QAClC,CAAC;IACH,CAAC;IAED,QAAQ,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC;QAC3B,KAAK,GAAG;YACN,OAAO,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA;QACrB,KAAK,GAAG;YACN,OAAO,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA;QACrB,KAAK,GAAG;YACN,OAAO,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA;QACrB,KAAK,GAAG,CAAC;QACT,KAAK,GAAG;YACN,OAAO,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA;QACrB;YACE,OAAO,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IAClC,CAAC;AACH,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,IAAY,EAAE,KAAY;IACxD,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC7B,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,QAAQ,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC;YAC3B,KAAK,GAAG,CAAC;YACT,KAAK,GAAG,CAAC;YACT,KAAK,GAAG,CAAC;YACT,KAAK,GAAG;gBACN,OAAO,MAAM,CAAA;YACf,KAAK,GAAG;gBACN,OAAO,MAAM,CAAA;YACf;gBACE,OAAO,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAA;QACrC,CAAC;IACH,CAAC;IAED,QAAQ,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC;QAC3B,KAAK,GAAG;YACN,OAAO,KAAK,CAAC,CAAC,CAAC,YAAY,CAAA;QAC7B,KAAK,GAAG;YACN,OAAO,KAAK,CAAC,CAAC,CAAC,YAAY,CAAA;QAC7B,KAAK,GAAG;YACN,OAAO,KAAK,CAAC,CAAC,CAAC,YAAY,CAAA;QAC7B,KAAK,GAAG,CAAC;QACT,KAAK,GAAG;YACN,OAAO,KAAK,CAAC,CAAC,CAAC,YAAY,CAAA;QAC7B;YACE,OAAO,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAA;IACrC,CAAC;AACH,CAAC"}

package/dist/MafSequenceWidget/colToGenomePos.d.ts

@@ -0,0 +1,13 @@
+import type { Sample } from '../LinearMafDisplay/types';
+/**
+ * Find the index of the reference sample (matching the assembly name from the region)
+ * Falls back to 0 if no match is found
+ */
+export declare function findRefSampleIndex(samples: Sample[] | undefined, assemblyName: string | undefined): number;
+/**
+ * Build a mapping from display column index to genomic position.
+ * Only the reference sequence determines genomic positions - gaps in the
+ * reference map to undefined (no genomic position), while gaps in other
+ * samples don't affect the mapping.
+ */
+export declare function buildColToGenomePos(refSequence: string, regionStart: number): (number | undefined)[];