/** A box on screen, in CSS pixels. */
export interface Rect {
    left: number;
    top: number;
    width: number;
    height: number;
}
/** A picture in flight: the box the whole picture fills, the part of it on show, and that part's corner radius. */
export interface Frame {
    box: Rect;
    clip: Rect;
    radius: number;
}
export declare function contain(aspect: number, rect: Rect): Rect;
export declare function cover(aspect: number, rect: Rect): Rect;
export declare function intersect(a: Rect, b: Rect): Rect | null;
/**
 * The image on show where it sits on screen, cut to the PanZoom around it, which a zoomed-in image
 * overflows. `figure` is a Lightbox slide, whose first child is that PanZoom.
 */
export declare function pictureFrame(figure: Element): {
    frame: Frame;
    src: string;
    aspect: number;
} | null;
/** The whole picture around a thumbnail, which is usually a crop (`object-fit: cover`). Null off screen. */
export declare function thumbnailFrame(thumbnail: Element, aspect: number): Frame | null;
/** Hides a thumbnail until every caller that hid it has shown it again: the open viewer and a flight overlap. */
export declare function hideThumbnail(thumbnail: HTMLElement): () => void;
/** On past the edge of the screen, in the direction a swipe was moving it. */
export declare function flungFrame(frame: Frame, direction: number): Frame;
/**
 * For an element laid out at `layout` with `transform-origin: 0 0`. Every box has the picture's
 * shape, so one scale fits it, and the clip is in the element's own pixels, before that scale.
 */
export declare function flightKeyframes(from: Frame, to: Frame, layout: Rect): Keyframe[];