@naturalcycles/js-lib/dist/browser/imageFitter.d.ts

Standard library for universal (browser + Node.js) javascript

export interface FitImagesCfg {
    /**
     * Container of the images
     */
    containerElement: HTMLElement;
    /**
     * Array of image metadatas (most notably: aspectRatio).
     */
    images: FitImage[];
    /**
     * Will be called on each layout change.
     * Should be listened to to update the width/height of the images in your DOM.
     */
    onChange: (images: FitImage[]) => any;
    /**
     * Max image height in pixels.
     *
     * @default 300
     */
    maxHeight?: number;
    /**
     * Margin between images.
     *
     * @default 8
     */
    margin?: number;
}
export interface FitImage {
    src: string;
    /**
     * width divided by height
     */
    aspectRatio: number;
    /**
     * Calculated image width to fit the layout.
     */
    fitWidth?: number;
    /**
     * Calculated image height to fit the layout.
     */
    fitHeight?: number;
}
/**
 * Calculates the width/height of the images to fit in the layout.
 *
 * Currently does not mutate the cfg.images array, but DOES mutate individual images with .fitWidth, .fitHeight properties.
 *
 * @experimental
 */
export declare class ImageFitter {
    constructor(cfg: FitImagesCfg);
    cfg: Required<FitImagesCfg>;
    resizeObserver: ResizeObserver;
    containerWidth: number;
    stop(): void;
    private update;
    private doLayout;
    private getHeigth;
    private setHeight;
}