@jbrowse/plugin-dotplot-view 3.7.0 → 4.0.0

package/dist/DotplotView/components/SliderTooltip.js

@@ -1,9 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = SliderTooltip;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const material_1 = require("@mui/material");
-function SliderTooltip(props) {
-    const { children, open, value } = props;
-    return ((0, jsx_runtime_1.jsx)(material_1.Tooltip, { open: open, enterTouchDelay: 0, placement: "top", title: value, arrow: true, children: children }));
-}

package/dist/DotplotView/components/WarningDialog.d.ts

@@ -1,16 +0,0 @@
-import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
-interface Warning {
-    message: string;
-    effect: string;
-}
-interface TrackWarning {
-    configuration: AnyConfigurationModel;
-    displays: {
-        warnings: Warning[];
-    }[];
-}
-declare const WarningDialog: ({ trackWarnings, handleClose, }: {
-    handleClose: () => void;
-    trackWarnings: TrackWarning[];
-}) => import("react/jsx-runtime").JSX.Element;
-export default WarningDialog;

package/dist/DotplotView/components/WarningDialog.js

@@ -1,39 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const configuration_1 = require("@jbrowse/core/configuration");
-const ui_1 = require("@jbrowse/core/ui");
-const util_1 = require("@jbrowse/core/util");
-const material_1 = require("@mui/material");
-const x_data_grid_1 = require("@mui/x-data-grid");
-const mobx_react_1 = require("mobx-react");
-const mui_1 = require("tss-react/mui");
-const useStyles = (0, mui_1.makeStyles)()({
-    content: {
-        minWidth: 600,
-    },
-});
-function getTrackWarnings({ trackWarnings, }) {
-    const rows = [];
-    for (const [i, trackWarning] of trackWarnings.entries()) {
-        const track = trackWarning;
-        const name = (0, configuration_1.getConf)(track, 'name');
-        const d = track.displays[0];
-        for (let j = 0; j < d.warnings.length; j++) {
-            const warning = d.warnings[j];
-            rows.push({ name, ...warning, id: `${i}_${j}` });
-        }
-    }
-    return rows;
-}
-const WarningDialog = (0, mobx_react_1.observer)(function WarningDialog({ trackWarnings, handleClose, }) {
-    const { classes } = useStyles();
-    const rows = getTrackWarnings({ trackWarnings });
-    const columns = [
-        { field: 'name' },
-        { field: 'message', width: (0, util_1.measureGridWidth)(rows.map(r => r.message)) },
-        { field: 'effect', width: (0, util_1.measureGridWidth)(rows.map(r => r.effect)) },
-    ];
-    return ((0, jsx_runtime_1.jsx)(ui_1.Dialog, { open: true, onClose: handleClose, maxWidth: "xl", title: "Dotplot rendered with warnings", children: (0, jsx_runtime_1.jsxs)(material_1.DialogContent, { className: classes.content, children: [(0, jsx_runtime_1.jsx)(material_1.DialogContentText, { children: "Found warnings while rendering the dotplot. This is often due to out-of-bound features that may indicate the wrong assemblies are being used. Check that the query and target are configured correctly, and that the right assemblies are being compared." }), (0, jsx_runtime_1.jsx)("div", { style: { height: 600, width: '100%', overflow: 'auto' }, children: (0, jsx_runtime_1.jsx)(x_data_grid_1.DataGrid, { rows: rows, columns: columns, disableRowSelectionOnClick: true, rowHeight: 25, disableColumnMenu: true }) })] }) }));
-});
-exports.default = WarningDialog;

package/dist/DotplotView/components/hooks/useCtrlKeyTracking.d.ts

@@ -1 +0,0 @@
-export declare function useCtrlKeyTracking(setCtrlKeyDown: (isDown: boolean) => void): void;

package/dist/DotplotView/components/hooks/useCtrlKeyTracking.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useCtrlKeyTracking = useCtrlKeyTracking;
-const react_1 = require("react");
-function useCtrlKeyTracking(setCtrlKeyDown) {
-    (0, react_1.useEffect)(() => {
-        function globalCtrlKeyDown(event) {
-            if (event.metaKey || event.ctrlKey) {
-                setCtrlKeyDown(true);
-            }
-        }
-        function globalCtrlKeyUp(event) {
-            if (!event.metaKey && !event.ctrlKey) {
-                setCtrlKeyDown(false);
-            }
-        }
-        window.addEventListener('keydown', globalCtrlKeyDown);
-        window.addEventListener('keyup', globalCtrlKeyUp);
-        return () => {
-            window.removeEventListener('keydown', globalCtrlKeyDown);
-            window.removeEventListener('keyup', globalCtrlKeyUp);
-        };
-    }, [setCtrlKeyDown]);
-}

package/dist/DotplotView/components/hooks/useCursorMode.d.ts

@@ -1,7 +0,0 @@
-export declare function useCursorMode(cursorMode: string): {
-    ctrlKeyDown: boolean;
-    validPan: boolean;
-    validSelect: boolean;
-    setCtrlKeyWasUsed: import("react").Dispatch<import("react").SetStateAction<boolean>>;
-    setCtrlKeyDown: import("react").Dispatch<import("react").SetStateAction<boolean>>;
-};

package/dist/DotplotView/components/hooks/useCursorMode.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useCursorMode = useCursorMode;
-const react_1 = require("react");
-function useCursorMode(cursorMode) {
-    const [ctrlKeyWasUsed, setCtrlKeyWasUsed] = (0, react_1.useState)(false);
-    const [ctrlKeyDown, setCtrlKeyDown] = (0, react_1.useState)(false);
-    const validPan = (cursorMode === 'move' && !ctrlKeyWasUsed) ||
-        (cursorMode === 'crosshair' && ctrlKeyWasUsed);
-    const validSelect = (cursorMode === 'move' && ctrlKeyWasUsed) ||
-        (cursorMode === 'crosshair' && !ctrlKeyWasUsed);
-    return {
-        ctrlKeyDown,
-        validPan,
-        validSelect,
-        setCtrlKeyWasUsed,
-        setCtrlKeyDown,
-    };
-}

package/dist/DotplotView/components/hooks/useMouseCoordinates.d.ts

@@ -1,29 +0,0 @@
-type Coord = [number, number] | undefined;
-interface Rect {
-    left: number;
-    top: number;
-    width: number;
-    height: number;
-}
-export declare function useMouseCoordinates(): {
-    mousecurrClient: Coord;
-    mousedownClient: Coord;
-    mouseupClient: Coord;
-    mouseOvered: boolean;
-    setMouseCurrClient: import("react").Dispatch<import("react").SetStateAction<Coord>>;
-    setMouseDownClient: import("react").Dispatch<import("react").SetStateAction<Coord>>;
-    setMouseUpClient: import("react").Dispatch<import("react").SetStateAction<Coord>>;
-    setMouseOvered: import("react").Dispatch<import("react").SetStateAction<boolean>>;
-    ref: import("react").RefObject<HTMLDivElement | null>;
-    root: import("react").RefObject<HTMLDivElement | null>;
-    svg: Rect;
-    rootRect: Rect;
-    mousedown: Coord;
-    mousecurr: Coord;
-    mouseup: Coord;
-    mouserect: Coord;
-    mouserectClient: Coord;
-    xdistance: number;
-    ydistance: number;
-};
-export {};

package/dist/DotplotView/components/hooks/useMouseCoordinates.js

@@ -1,52 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMouseCoordinates = useMouseCoordinates;
-const react_1 = require("react");
-const blank = { left: 0, top: 0, width: 0, height: 0 };
-function getOffset(coord, rect) {
-    return coord && [coord[0] - rect.left, coord[1] - rect.top];
-}
-function useMouseCoordinates() {
-    const [mousecurrClient, setMouseCurrClient] = (0, react_1.useState)();
-    const [mousedownClient, setMouseDownClient] = (0, react_1.useState)();
-    const [mouseupClient, setMouseUpClient] = (0, react_1.useState)();
-    const [mouseOvered, setMouseOvered] = (0, react_1.useState)(false);
-    const [rect, setRect] = (0, react_1.useState)(blank);
-    const ref = (0, react_1.useRef)(null);
-    const root = (0, react_1.useRef)(null);
-    (0, react_1.useLayoutEffect)(() => {
-        if (ref.current) {
-            setRect(ref.current.getBoundingClientRect());
-        }
-    }, [mousecurrClient, mousedownClient, mouseupClient]);
-    const svg = rect;
-    const rootRect = rect;
-    const mousedown = getOffset(mousedownClient, rect);
-    const mousecurr = getOffset(mousecurrClient, rect);
-    const mouseup = getOffset(mouseupClient, rect);
-    const mouserect = mouseup || mousecurr;
-    const mouserectClient = mouseupClient || mousecurrClient;
-    const xdistance = mousedown && mouserect ? mouserect[0] - mousedown[0] : 0;
-    const ydistance = mousedown && mouserect ? mouserect[1] - mousedown[1] : 0;
-    return {
-        mousecurrClient,
-        mousedownClient,
-        mouseupClient,
-        mouseOvered,
-        setMouseCurrClient,
-        setMouseDownClient,
-        setMouseUpClient,
-        setMouseOvered,
-        ref,
-        root,
-        svg,
-        rootRect,
-        mousedown,
-        mousecurr,
-        mouseup,
-        mouserect,
-        mouserectClient,
-        xdistance,
-        ydistance,
-    };
-}

package/dist/DotplotView/components/hooks/useMouseMoveHandler.d.ts

@@ -1,6 +0,0 @@
-type Coord = [number, number] | undefined;
-interface View {
-    scroll: (distance: number) => void;
-}
-export declare function useMouseMoveHandler(mousecurrClient: Coord, mousedownClient: Coord, mouseupClient: Coord, validPan: boolean, hview: View, vview: View, setMouseCurrClient: (coord: Coord) => void): void;
-export {};

package/dist/DotplotView/components/hooks/useMouseMoveHandler.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMouseMoveHandler = useMouseMoveHandler;
-const react_1 = require("react");
-function useMouseMoveHandler(mousecurrClient, mousedownClient, mouseupClient, validPan, hview, vview, setMouseCurrClient) {
-    (0, react_1.useEffect)(() => {
-        function globalMouseMove(event) {
-            setMouseCurrClient([event.clientX, event.clientY]);
-            if (mousecurrClient && mousedownClient && validPan && !mouseupClient) {
-                hview.scroll(-event.clientX + mousecurrClient[0]);
-                vview.scroll(event.clientY - mousecurrClient[1]);
-            }
-        }
-        window.addEventListener('mousemove', globalMouseMove);
-        return () => {
-            window.removeEventListener('mousemove', globalMouseMove);
-        };
-    }, [
-        validPan,
-        mousecurrClient,
-        mousedownClient,
-        mouseupClient,
-        hview,
-        vview,
-        setMouseCurrClient,
-    ]);
-}

package/dist/DotplotView/components/hooks/useMouseUpHandler.d.ts

@@ -1,3 +0,0 @@
-type Coord = [number, number] | undefined;
-export declare function useMouseUpHandler(mousedown: Coord, mouseup: Coord, xdistance: number, ydistance: number, validSelect: boolean, setMouseUpClient: (coord: Coord) => void, setMouseDownClient: (coord: Coord) => void): void;
-export {};

package/dist/DotplotView/components/hooks/useMouseUpHandler.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMouseUpHandler = useMouseUpHandler;
-const react_1 = require("react");
-function useMouseUpHandler(mousedown, mouseup, xdistance, ydistance, validSelect, setMouseUpClient, setMouseDownClient) {
-    (0, react_1.useEffect)(() => {
-        function globalMouseUp(event) {
-            if (Math.abs(xdistance) > 3 && Math.abs(ydistance) > 3 && validSelect) {
-                setMouseUpClient([event.clientX, event.clientY]);
-            }
-            else {
-                setMouseDownClient(undefined);
-            }
-        }
-        if (mousedown && !mouseup) {
-            window.addEventListener('mouseup', globalMouseUp, true);
-            return () => {
-                window.removeEventListener('mouseup', globalMouseUp, true);
-            };
-        }
-        return () => { };
-    }, [
-        validSelect,
-        mousedown,
-        mouseup,
-        xdistance,
-        ydistance,
-        setMouseUpClient,
-        setMouseDownClient,
-    ]);
-}

package/dist/DotplotView/components/hooks/useWheelHandler.d.ts

@@ -1,8 +0,0 @@
-type Coord = [number, number] | undefined;
-interface View {
-    scroll: (distance: number) => void;
-    zoomTo: (bpPerPx: number, position: number) => void;
-    bpPerPx: number;
-}
-export declare function useWheelHandler(ref: React.RefObject<HTMLDivElement | null>, wheelMode: string, hview: View, vview: View, mousecurr: Coord, rootRectHeight: number): void;
-export {};

package/dist/DotplotView/components/hooks/useWheelHandler.js

@@ -1,47 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useWheelHandler = useWheelHandler;
-const react_1 = require("react");
-const mobx_1 = require("mobx");
-function useWheelHandler(ref, wheelMode, hview, vview, mousecurr, rootRectHeight) {
-    const distanceX = (0, react_1.useRef)(0);
-    const distanceY = (0, react_1.useRef)(0);
-    const scheduled = (0, react_1.useRef)(false);
-    (0, react_1.useEffect)(() => {
-        function onWheel(event) {
-            event.preventDefault();
-            distanceX.current += event.deltaX;
-            distanceY.current -= event.deltaY;
-            if (!scheduled.current) {
-                scheduled.current = true;
-                window.requestAnimationFrame(() => {
-                    (0, mobx_1.transaction)(() => {
-                        if (wheelMode === 'pan') {
-                            hview.scroll(distanceX.current / 3);
-                            vview.scroll(distanceY.current / 10);
-                        }
-                        else if (wheelMode === 'zoom') {
-                            if (Math.abs(distanceY.current) > Math.abs(distanceX.current) * 2 &&
-                                mousecurr) {
-                                const val = distanceY.current < 0 ? 1.1 : 0.9;
-                                hview.zoomTo(hview.bpPerPx * val, mousecurr[0]);
-                                vview.zoomTo(vview.bpPerPx * val, rootRectHeight - mousecurr[1]);
-                            }
-                        }
-                    });
-                    scheduled.current = false;
-                    distanceX.current = 0;
-                    distanceY.current = 0;
-                });
-            }
-        }
-        if (ref.current) {
-            const curr = ref.current;
-            curr.addEventListener('wheel', onWheel);
-            return () => {
-                curr.removeEventListener('wheel', onWheel);
-            };
-        }
-        return () => { };
-    }, [hview, vview, wheelMode, mousecurr, rootRectHeight, ref]);
-}

package/dist/DotplotView/components/util.d.ts

@@ -1,14 +0,0 @@
-import type { Dotplot1DViewModel } from '../model';
-import type { BaseBlock } from '@jbrowse/core/util/blockTypes';
-export declare function locstr(px: number, view: Dotplot1DViewModel, includeAsm?: boolean): string;
-export declare function getBlockLabelKeysToHide(blocks: BaseBlock[], length: number, viewOffsetPx: number): Set<string>;
-export declare function chooseGridPitch(scale: number, minMajorPitchPx: number, minMinorPitchPx: number): {
-    majorPitch: number;
-    minorPitch: number;
-};
-export declare function makeTicks(regions: BaseBlock[], bpPerPx: number, emitMajor?: boolean, emitMinor?: boolean): {
-    type: string;
-    base: number;
-    index: number;
-    refName: string;
-}[];

package/dist/DotplotView/components/util.js

@@ -1,80 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.locstr = locstr;
-exports.getBlockLabelKeysToHide = getBlockLabelKeysToHide;
-exports.chooseGridPitch = chooseGridPitch;
-exports.makeTicks = makeTicks;
-function locstr(px, view, includeAsm = true) {
-    const { assemblyName, refName, start, offset, oob } = view.pxToBp(px);
-    const coord = Math.floor(start + offset);
-    return oob
-        ? 'out of bounds'
-        : `${includeAsm ? `{${assemblyName}}` : ''}${refName}:${coord.toLocaleString('en-US')}`;
-}
-function getBlockLabelKeysToHide(blocks, length, viewOffsetPx) {
-    const blockLabelKeysToHide = new Set();
-    const sortedBlocks = [...blocks].sort((a, b) => {
-        const alen = a.end - a.start;
-        const blen = b.end - b.start;
-        return blen - alen;
-    });
-    const positions = Array.from({ length: Math.round(length) });
-    for (const { key, offsetPx } of sortedBlocks) {
-        const y = Math.round(length - offsetPx + viewOffsetPx);
-        const labelBounds = [Math.max(y - 12, 0), y];
-        if (y === 0 || positions.slice(...labelBounds).some(Boolean)) {
-            blockLabelKeysToHide.add(key);
-        }
-        else {
-            positions.fill(true, ...labelBounds);
-        }
-    }
-    return blockLabelKeysToHide;
-}
-function chooseGridPitch(scale, minMajorPitchPx, minMinorPitchPx) {
-    scale = Math.abs(scale);
-    const minMajorPitchBp = minMajorPitchPx * scale;
-    const majorMagnitude = +minMajorPitchBp.toExponential().split(/e/i)[1];
-    let majorPitch = 10 ** majorMagnitude;
-    while (majorPitch < minMajorPitchBp) {
-        majorPitch *= 2;
-        if (majorPitch >= minMajorPitchBp) {
-            break;
-        }
-        majorPitch *= 2.5;
-    }
-    majorPitch = Math.max(majorPitch, 5);
-    const majorPitchPx = majorPitch / scale;
-    let minorPitch = 0;
-    if (!(majorPitch % 10) && majorPitchPx / 10 >= minMinorPitchPx) {
-        minorPitch = majorPitch / 10;
-    }
-    else if (!(majorPitch % 5) && majorPitchPx / 5 >= minMinorPitchPx) {
-        minorPitch = majorPitch / 5;
-    }
-    else if (!(majorPitch % 2) && majorPitchPx / 2 >= minMinorPitchPx) {
-        minorPitch = majorPitch / 2;
-    }
-    return { majorPitch, minorPitch };
-}
-function makeTicks(regions, bpPerPx, emitMajor = true, emitMinor = true) {
-    const ticks = [];
-    const gridPitch = chooseGridPitch(bpPerPx, 60, 15);
-    const iterPitch = gridPitch.minorPitch || gridPitch.majorPitch;
-    for (const { start, end, refName } of regions) {
-        let index = 0;
-        const minBase = start;
-        const maxBase = end;
-        for (let base = Math.floor(minBase / iterPitch) * iterPitch; base < Math.ceil(maxBase / iterPitch) * iterPitch + 1; base += iterPitch) {
-            if (emitMinor && base % gridPitch.majorPitch) {
-                ticks.push({ type: 'minor', base: base - 1, index, refName });
-                index += 1;
-            }
-            else if (emitMajor && Math.abs(base - start) > gridPitch.minorPitch) {
-                ticks.push({ type: 'major', base: base - 1, index, refName });
-                index += 1;
-            }
-        }
-    }
-    return ticks;
-}

package/dist/DotplotView/index.d.ts

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

package/dist/DotplotView/index.js

@@ -1,52 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = DotplotViewF;
-const react_1 = require("react");
-const ViewType_1 = __importDefault(require("@jbrowse/core/pluggableElementTypes/ViewType"));
-const model_1 = __importDefault(require("./model"));
-function DotplotViewF(pluginManager) {
-    pluginManager.addViewType(() => {
-        return new ViewType_1.default({
-            name: 'DotplotView',
-            displayName: 'Dotplot view',
-            stateModel: (0, model_1.default)(pluginManager),
-            ReactComponent: (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/DotplotView')))),
-        });
-    });
-}