@weng-lab/genomebrowser 0.0.1 → 0.0.2

package/dist/components/browser/browser.d.ts

@@ -0,0 +1,9 @@
+import { BrowserAction, BrowserState } from '../context/browserContext';
+import { default as React } from 'react';
+declare function GenomeBrowser({ children, browserState, browserDispatch, externalFetch }: {
+    children?: React.ReactNode;
+    browserState: BrowserState;
+    browserDispatch: React.Dispatch<BrowserAction>;
+    externalFetch?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export default GenomeBrowser;

package/dist/components/browser/gqltracks.d.ts

@@ -0,0 +1,13 @@
+import { BrowserAction, BrowserState } from '../context/browserContext';
+export type TranscriptRequest = {
+    chromosome: string;
+    assembly: string;
+    start: number;
+    end: number;
+    version: number;
+};
+declare function GQLTracks({ browserState, browserDispatch }: {
+    browserState: BrowserState;
+    browserDispatch: React.Dispatch<BrowserAction>;
+}): null;
+export default GQLTracks;

package/dist/components/browser/index.d.ts

@@ -0,0 +1,2 @@
+import { default as GenomeBrowser } from './browser';
+export { GenomeBrowser };

package/dist/components/browser/menuWrapper.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+import { ToolTipData, ContextMenuData } from './types';
+import { DisplayMode } from '../tracks/types';
+export type MenuWrapperProps = {
+    onModeChange?: (id: string, displayMode: DisplayMode) => void;
+    children: React.ReactNode;
+};
+export type MenuState = {
+    tooltip: ToolTipData;
+    contextmenu: ContextMenuData;
+};
+/**
+ * Provides a genome browser container which wraps children in an SVG
+ * element and provides a mechanism for dragging to select regions.
+ */
+export default function MenuWrapper({ children, onModeChange }: MenuWrapperProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/browser/selectRegion.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+import { Domain } from '../../utils/types';
+export type SelectRegionProps = {
+    domain: Domain;
+    width: number;
+    height: number;
+    dragRegionHeight: number;
+    leftMargin: number;
+    onSelectionEnd: (domain: Domain) => void;
+};
+declare const SelectRegion: React.FC<SelectRegionProps>;
+export default SelectRegion;

package/dist/components/browser/stacked.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { BrowserState } from '../context/browserContext';
+declare function Stacked({ children, browserState, rulerHeight }: {
+    children: React.ReactNode;
+    browserState: BrowserState;
+    rulerHeight: number;
+}): import("react/jsx-runtime").JSX.Element;
+export default Stacked;

package/dist/components/browser/stackedtracks.d.ts

@@ -0,0 +1,8 @@
+import { default as React, PropsWithChildren } from 'react';
+import { StackedTrackProps } from './types';
+/**
+ * Automatically stacks a number of child tracks on top of each other, updating y-coordinates
+ * appropriately as the tracks render themselves and update their heights.
+ */
+declare const StackedTracks: React.FC<PropsWithChildren<StackedTrackProps>>;
+export default StackedTracks;

package/dist/components/browser/svgWrapper.d.ts

@@ -0,0 +1,8 @@
+interface SvgWrapperProps {
+    width: number;
+    height: number;
+    svgRef?: React.RefObject<SVGSVGElement>;
+    children: React.ReactNode;
+}
+export default function SvgWrapper({ width, height, svgRef, children }: SvgWrapperProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/browser/types.d.ts

@@ -0,0 +1,55 @@
+import { Domain } from '../../utils/types';
+export type GenomeBrowserDomainChangedAction = {
+    type: "domainChanged";
+    newDomain: Domain;
+};
+export type GenomeBrowserHeightChangedAction = {
+    type: "heightChanged";
+    newHeight: number;
+};
+export type GenomeBrowserTooltipChangedAction = {
+    type: "tooltipChanged";
+    tooltip: ToolTipData;
+};
+export type GenomeBrowserContextMenuChangedAction = {
+    type: "contextMenuChanged";
+    contextmenu: ContextMenuData;
+};
+export type ToolTipData = {
+    show: boolean;
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    content?: React.ReactElement;
+};
+export type ContextMenuData = {
+    show: boolean;
+    x: number;
+    y: number;
+    id: string;
+    displayMode?: string;
+    displayModeOptions?: string[];
+    downloadSVG?: () => void;
+};
+export type GenomeBrowserAction = GenomeBrowserDomainChangedAction | GenomeBrowserHeightChangedAction | GenomeBrowserTooltipChangedAction | GenomeBrowserContextMenuChangedAction;
+export type StackedTrackProps = {
+    id: string;
+    transform?: string;
+    height?: number;
+    onHeightChanged?: (height: number) => void;
+    svgRef?: React.RefObject<SVGSVGElement>;
+};
+export type StackedTrackState = {
+    heights: number[];
+};
+export type StackedTrackChildHeightChangedAction = {
+    type: "childHeightChanged";
+    index: number;
+    height: number;
+};
+export type StackedTrackChildrenAddedAction = {
+    type: "childrenAdded";
+    heights: number[];
+};
+export type StackedTrackAction = StackedTrackChildHeightChangedAction | StackedTrackChildrenAddedAction;

package/dist/components/browser/utils.d.ts

@@ -0,0 +1 @@
+export declare const useEvent: (event: any, handler: (e: KeyboardEvent) => void, passive?: boolean) => void;

package/dist/components/clipPath/clipPath.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+export type ClipPathProps = {
+    height: number;
+    width: number;
+    id: string;
+};
+/**
+ * Creates an SVG clipPath element with a unique ID.
+ * @param width the width of the element relative to the SVG.
+ * @param height the height of the element relative to the SVG.
+ * @param id the unqiue ID of the element, used to refer to it in properties of clipped elements.
+ */
+declare const ClipPath: React.FC<ClipPathProps>;
+export default ClipPath;

package/dist/components/context/browserContext.d.ts

@@ -0,0 +1,113 @@
+import { Domain, YRange } from '../../utils/types';
+import { TrackProps } from '../tracks/types';
+import { TranscriptOptions } from '../tracks/transcripts/transcript';
+import { BigWigOptions } from '../tracks/bigwig/bigwig';
+import { BigBedOptions } from '../tracks/bigbed/bigbed';
+export declare const BrowserStateContext: import('react').Context<BrowserState>;
+export declare const BrowserDispatchContext: import('react').Context<import('react').Dispatch<BrowserAction>>;
+export type BrowserState = {
+    domain: Domain;
+    preRenderedWidth: number;
+    width: number;
+    zoomLevel: number;
+    delta: number;
+    tracks: TrackProps[];
+};
+export declare enum BrowserActionType {
+    SET_DOMAIN = "setDomain",
+    SHIFT_DOMAIN = "shiftDomain",
+    ADD_TRACK = "addTrack",
+    UPDATE_TRACK = "updateTrack",
+    SET_TRACK_HEIGHT = "setTrackHeight",
+    SET_TRACK_DATA = "setTrackData",
+    SET_LOADING = "setLoading",
+    SWAP_TRACKS = "swapTracks",
+    RELOAD_TRACKS = "reloadTracks",
+    SHIFT_TRACK = "shiftTrack",
+    REMOVE_TRANSLATION = "removeTranslation",
+    INSERT_TRACK = "insertTrack",
+    DELETE_TRACK = "deleteTrack",
+    TRANSLATE_TRACK = "translateTrack",
+    SET_RANGE = "setRange",
+    UPDATE_PROPS = "updateProps",
+    BRING_TO_TOP = "bringToTop",
+    SET_DELTA = "setDelta"
+}
+export type BrowserAction = SetDomain | AddTrack | UpdateTrack | SetTrackHeight | SetTrackData | SwapTracks | ShiftDomain | SetLoading | ShiftTrack | RemoveTranslation | InsertTrack | DeleteTrack | TranslateTrack | SetRange | UpdateProps | BringToTop | SetDelta;
+export type SetDelta = {
+    type: BrowserActionType.SET_DELTA;
+    delta: number;
+};
+export type SetDomain = {
+    type: BrowserActionType.SET_DOMAIN;
+    domain: Domain;
+};
+export type AddTrack = {
+    type: BrowserActionType.ADD_TRACK;
+    track: TrackProps;
+};
+export type UpdateTrack = {
+    type: BrowserActionType.UPDATE_TRACK;
+    id: string;
+    track: Partial<TrackProps>;
+};
+export type SetTrackHeight = {
+    type: BrowserActionType.SET_TRACK_HEIGHT;
+    id: string;
+    height: number;
+};
+export type SetTrackData = {
+    type: BrowserActionType.SET_TRACK_DATA;
+    id: string;
+    data: any;
+};
+export type SwapTracks = {
+    type: BrowserActionType.SWAP_TRACKS;
+    id1: string;
+    id2: string;
+};
+export type ShiftDomain = {
+    type: BrowserActionType.SHIFT_DOMAIN;
+    delta: number;
+};
+export type SetLoading = {
+    type: BrowserActionType.SET_LOADING;
+};
+export type ShiftTrack = {
+    type: BrowserActionType.SHIFT_TRACK;
+    id1: string;
+    id2: string;
+};
+export type RemoveTranslation = {
+    type: BrowserActionType.REMOVE_TRANSLATION;
+    id: string;
+};
+export type InsertTrack = {
+    type: BrowserActionType.INSERT_TRACK;
+    index: number;
+    track: TrackProps;
+};
+export type DeleteTrack = {
+    type: BrowserActionType.DELETE_TRACK;
+    id: string;
+};
+export type TranslateTrack = {
+    type: BrowserActionType.TRANSLATE_TRACK;
+    id: string;
+    dist: number;
+};
+export type SetRange = {
+    type: BrowserActionType.SET_RANGE;
+    id: string;
+    range: YRange;
+};
+export type UpdateProps = {
+    type: BrowserActionType.UPDATE_PROPS;
+    id: string;
+    props: TranscriptOptions | BigWigOptions | BigBedOptions;
+};
+export type BringToTop = {
+    type: BrowserActionType.BRING_TO_TOP;
+    id: string;
+};
+export declare function BrowserReducer(state: BrowserState, action: BrowserAction): BrowserState;

package/dist/components/context/domainContext.d.ts

@@ -0,0 +1,9 @@
+import { Domain } from '../../utils/types';
+type stateContext<T> = [
+    T,
+    React.Dispatch<React.SetStateAction<T>>
+];
+export declare const DomainContext: import('react').Context<Domain>;
+export declare const DomainDispatchContext: import('react').Context<any>;
+export declare const DeltaContext: import('react').Context<stateContext<number>>;
+export {};

package/dist/components/context/providers.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+import { BrowserState, BrowserAction } from './browserContext';
+import { TrackModalInfo } from '../../hooks/useModal';
+export declare const ModalContext: import('react').Context<{
+    openModal: TrackModalInfo | null;
+    showModal: (trackId: string, mouseX: number, mouseY: number) => void;
+    closeModal: () => void;
+}>;
+interface ContextObjects {
+    children: ReactNode;
+    browserState: BrowserState;
+    browserDispatch: React.Dispatch<BrowserAction>;
+    deltaContext: [number, React.Dispatch<React.SetStateAction<number>>];
+    modalState: {
+        openModal: TrackModalInfo | null;
+        showModal: (trackId: string, mouseX: number, mouseY: number) => void;
+        closeModal: () => void;
+    };
+}
+export default function ContextProvider({ children, browserState, browserDispatch, modalState, deltaContext }: ContextObjects): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/controls/custombigwig.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { CustomBigWigProps } from './types';
+declare const CustomBigWig: React.FC<CustomBigWigProps>;
+export default CustomBigWig;

package/dist/components/controls/index.d.ts

@@ -0,0 +1,6 @@
+import { default as ShiftButton } from './shiftbutton';
+import { default as ZoomButton } from './zoombutton';
+import { default as InputRegion } from './inputregion';
+import { default as UCSCControls } from './ucsc';
+import { default as CustomBigWig } from './custombigwig';
+export { ShiftButton, ZoomButton, InputRegion, CustomBigWig, UCSCControls };

package/dist/components/controls/inputregion.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { InputRegionProps } from './types';
+declare const InputRegion: React.FC<InputRegionProps>;
+export default InputRegion;

package/dist/components/controls/shiftbutton.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { ShiftButtonProps } from './types';
+declare const ShiftButton: React.FC<ShiftButtonProps>;
+export default ShiftButton;

package/dist/components/controls/types.d.ts

@@ -0,0 +1,33 @@
+import { Domain } from '../../utils/types';
+export type CustomBigWigProps = {
+    text: string;
+    onSubmit: (value: CustomBigWig) => void;
+};
+export type CustomBigWig = {
+    url: string;
+    title: string;
+};
+export type InputRegionProps = {
+    text?: string;
+    domain: Domain;
+    chromosome?: string;
+    size: number;
+    onSubmit: (domain: Domain) => void;
+};
+export type ShiftButtonProps = {
+    text: string;
+    shift: number;
+    domain: Domain;
+    onClick: (domain: Domain) => void;
+};
+export type ZoomButtonProps = {
+    text: string;
+    factor: number;
+    domain: Domain;
+    onClick: (domain: Domain) => void;
+};
+export type UCSCControlProps = {
+    domain: Domain;
+    onDomainChanged: (domain: Domain) => void;
+    withInput: boolean;
+};

package/dist/components/controls/ucsc.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { UCSCControlProps } from './types';
+declare const UCSCControls: React.FC<UCSCControlProps>;
+export default UCSCControls;

package/dist/components/controls/zoombutton.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { ZoomButtonProps } from './types';
+declare const ZoomButton: React.FC<ZoomButtonProps>;
+export default ZoomButton;

package/dist/components/cytobands/centromere.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { CentromereProps } from './types';
+declare const Centromere: React.FC<CentromereProps>;
+export default Centromere;

package/dist/components/cytobands/cytoband.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { CytobandProps } from './types';
+declare const Cytoband: React.FC<CytobandProps>;
+export default Cytoband;

package/dist/components/cytobands/cytobands.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { CytobandsProps } from './types';
+declare const Cytobands: React.FC<CytobandsProps>;
+export default Cytobands;

package/dist/components/cytobands/highlight.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { CytobandHighlightProps } from './types';
+declare const CytobandHighlight: React.FC<CytobandHighlightProps>;
+export default CytobandHighlight;

package/dist/components/cytobands/index.d.ts

@@ -0,0 +1,3 @@
+import { default as Cytobands } from './cytobands';
+export { type CytobandsProps, type Cytoband, type CytobandColors } from './types';
+export { Cytobands };

package/dist/components/cytobands/shorthighlight.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { ShortHighlightProps } from './types';
+declare const ShortHighlight: React.FC<ShortHighlightProps>;
+export default ShortHighlight;

package/dist/components/cytobands/types.d.ts

@@ -0,0 +1,61 @@
+import { default as React } from 'react';
+import { Domain } from '../../utils/types';
+export type Highlight = {
+    color: string;
+    start: number;
+    end: number;
+};
+export type ShortHighlightProps = {
+    highlight: Highlight;
+    x: (value: number) => number;
+    height: number;
+};
+export type Cytoband = {
+    stain: string;
+    coordinates: Domain;
+};
+export type CytobandColors = {
+    default: string;
+    centromere: string;
+    stalk: string;
+};
+export type CytobandsProps = {
+    data: Cytoband[];
+    width: number;
+    height: number;
+    id: string;
+    colors?: CytobandColors;
+    transform?: string;
+    highlight?: Highlight;
+    highlights?: Highlight[];
+    onHighlightMouseOver?: (highlight: Highlight, x: number, i: number) => void;
+    onHighlightMouseOut?: () => void;
+    onHighlightClick?: (highlight: Highlight, x: number, i: number) => void;
+    domain: Domain;
+    children?: React.ReactNode;
+    opacity?: number;
+};
+export type CytobandProps = {
+    colors: CytobandColors;
+    width: number;
+    height: number;
+    type: string;
+    x: number;
+    opacity?: number;
+};
+export type CentromereProps = {
+    color: string;
+    width: number;
+    height: number;
+    x: number;
+    opening: boolean;
+};
+export type CytobandHighlightProps = {
+    x: (value: number) => number;
+    height: number;
+    width: number;
+    highlight: Highlight;
+    onMouseOver?: () => void;
+    onMouseOut?: () => void;
+    onClick?: () => void;
+};

package/dist/components/icons/error.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { ErrorIconProps } from './types';
+/**
+ * An error icon, consisting of a red exclamation point inside a triangle.
+ * @param width the width of the icon relative to the containing SVG.
+ * @param height the height of the icon relative to the containing SVG.
+ */
+declare const ErrorIcon: React.FC<ErrorIconProps>;
+export default ErrorIcon;

package/dist/components/icons/index.d.ts

@@ -0,0 +1,3 @@
+import { default as LoadingSpinner } from './spinner';
+import { default as ErrorIcon } from './error';
+export { LoadingSpinner, ErrorIcon };

package/dist/components/icons/settings.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+declare function SettingsIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default SettingsIcon;

package/dist/components/icons/spinner.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { LoadingSpinnerProps } from './types';
+/**
+ * A loading spinner.
+ * @param width the width of the element relative to the containing SVG.
+ * @param height the height of the element relative to the containing SVG.
+ */
+declare const LoadingSpinner: React.FC<LoadingSpinnerProps>;
+export default LoadingSpinner;

package/dist/components/icons/top.d.ts

@@ -0,0 +1,2 @@
+declare function TopIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+export default TopIcon;

package/dist/components/icons/types.d.ts

@@ -0,0 +1,12 @@
+export type ErrorIconProps = {
+    width: number;
+    height: number;
+};
+export type LoadingSpinnerProps = {
+    width: number;
+    height: number;
+};
+export type SettingsIconProps = {
+    width: number;
+    height: number;
+};

package/dist/components/magnification/index.d.ts

@@ -0,0 +1,2 @@
+import { default as Magnification } from './magnification';
+export { Magnification };

package/dist/components/magnification/magnification.d.ts

@@ -0,0 +1,13 @@
+import { default as React, PropsWithChildren } from 'react';
+import { Domain } from '../../utils/types';
+export type MagnificationProps = {
+    width: number;
+    id?: string;
+    domain: Domain;
+    transform?: string;
+    svgRef?: React.RefObject<SVGSVGElement>;
+    onHeightChanged?: (height: number) => void;
+    zoomFactor?: number;
+};
+declare const Magnification: React.FC<PropsWithChildren<MagnificationProps>>;
+export default Magnification;

package/dist/components/menu/browserContextMenu.d.ts

@@ -0,0 +1,10 @@
+import { DisplayMode } from '../tracks/types';
+import { ContextMenuData } from '../browser/types';
+import { default as React } from 'react';
+type BrowserContextMenuProps = {
+    data: ContextMenuData;
+    onModeChange?: (id: string, mode: DisplayMode) => void;
+    setContextMenu: (contextmenu: ContextMenuData) => void;
+};
+declare const BrowserContextMenu: React.FC<BrowserContextMenuProps>;
+export default BrowserContextMenu;

package/dist/components/menu/contextMenu.d.ts

@@ -0,0 +1,6 @@
+import { default as React, PropsWithChildren } from 'react';
+import { ContextMenuProps, ContextMenuData } from './types';
+declare const ContextMenuContext: React.Context<ContextMenuData>;
+declare const ContextMenu: React.FC<PropsWithChildren<ContextMenuProps>>;
+export default ContextMenu;
+export { ContextMenuContext };

package/dist/components/menu/types.d.ts

@@ -0,0 +1,22 @@
+export type ContextMenuProps = {
+    width: number;
+    height: number;
+};
+export type ContextMenuData = {
+    show: boolean;
+    x: number;
+    y: number;
+    id: string;
+    setContextMenu: (contextMenu: {
+        show: boolean;
+        x: number;
+        y: number;
+        id: string;
+        displayMode?: string;
+        displayModeOptions?: string[];
+        downloadSVG?: () => void;
+    }) => void;
+    displayMode?: string;
+    displayModeOptions?: string[];
+    downloadSVG?: () => void;
+};

package/dist/components/modal/forms/form.d.ts

@@ -0,0 +1,3 @@
+export default function Form({ children }: {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/modal/forms/heightForm.d.ts

@@ -0,0 +1,4 @@
+import { TrackProps } from '../../tracks/types';
+export default function HeightForm({ track }: {
+    track: TrackProps;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/modal/forms/rangeForm.d.ts

@@ -0,0 +1,5 @@
+import { BigWigTrackProps } from '../../tracks/types';
+declare function RangeForm({ track }: {
+    track: BigWigTrackProps;
+}): import("react/jsx-runtime").JSX.Element;
+export default RangeForm;

package/dist/components/modal/forms/transcriptForm.d.ts

@@ -0,0 +1,4 @@
+import { TranscriptTrackProps } from '../../tracks/types';
+export default function TranscriptForm({ track }: {
+    track: TranscriptTrackProps;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/modal/forms/universalForm.d.ts

@@ -0,0 +1,4 @@
+import { TrackProps } from '../../tracks/types';
+export default function UniversalForm({ track }: {
+    track: TrackProps;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/modal/modal.d.ts

@@ -0,0 +1 @@
+export default function TrackModal(): import('react').ReactPortal | null;

package/dist/components/modal/styles.d.ts

@@ -0,0 +1,25 @@
+export declare const contentStyle: {
+    position: "fixed";
+    top: string;
+    left: string;
+    boxShadow: string;
+    width: string;
+    transform: string;
+    background: string;
+};
+export declare const inputStyle: {
+    width: string;
+};
+export declare const labelStyle: {
+    display: string;
+    flexDirection: "column";
+    paddingInline: string;
+};
+export declare const inputNumberWebkitStyle: {
+    WebkitAppearance: "none";
+    margin: string;
+};
+export declare const inputNumberFirefoxStyle: {
+    MozAppearance: "textfield";
+    appearance: "textfield";
+};