point-focus
Version:
A React component for zooming and focusing on image points via click, drag, or cursor.
35 lines (34 loc) • 1.67 kB
TypeScript
import { IImageTypes } from '../ImageMagnifier.types';
export declare const getPageCoords: (e: React.MouseEvent | React.TouchEvent) => {
x: number;
y: number;
};
export declare const getOffsets: (pageX: number, pageY: number, left: number, top: number) => {
x: number;
y: number;
};
export declare const getBounds: (container: HTMLDivElement | null) => DOMRect | {
width: number;
height: number;
left: number;
top: number;
};
export declare const getRatios: (bounds: {
width: number;
height: number;
}, dimensions: {
width: number;
height: number;
}) => {
x: number;
y: number;
};
export declare const getScaledDimensions: (zoomedImgRef: HTMLImageElement, zoomScale: number) => {
width: number;
height: number;
};
export declare const getDefaults: () => IImageTypes;
export declare const applyDragMove: (pageX: number, pageY: number, zoomContextRef: React.MutableRefObject<IImageTypes>, setLeft: (val: number) => void, setTop: (val: number) => void) => void;
export declare const handleNativeDragMove: (e: MouseEvent | TouchEvent, zoomContextRef: React.MutableRefObject<IImageTypes>, setLeft: (v: number) => void, setTop: (v: number) => void) => void;
export declare const applyMouseMove: (pageX: number, pageY: number, zoomContextRef: React.MutableRefObject<IImageTypes>, setLeft: (val: number) => void, setTop: (val: number) => void) => void;
export declare const initializeZoomPosition: (pageX: number, pageY: number, type: "drag" | "pan", container: HTMLDivElement | null, zoomContextRef: React.MutableRefObject<IImageTypes>, setLeft: (val: number) => void, setTop: (val: number) => void) => void;