@selenite/commons/dist/utils/layout.d.ts

This typescript package provides a set of frequently used utilities, types and svelte actions for building projects with Typescript and Svelte.

/**
 * Utilities for layouting elements.
 * @module
 */
import { Vector2D } from '../datastructure';
/**
 * Structure used by the layout utilities.
 *
 * It represents a bounding rect for a layout element.
 */
export type LayoutRect = {
    /** Position on the x axis of top left corner. */
    x: number;
    /** Position on the y axis of top left corner. */
    y: number;
    /** Width of the bounding rect. */
    w: number;
    /** Height of the bounding rect. */
    h: number;
};
/**
 * Additional options for the layout utilities.
 */
export type LayoutOptions = {
    /** Index of the reference element. Defaults to 0. */
    refPos?: number;
};
/**
 * Returns offsets to align the tops of elements to the top of a reference element.
 * @param rects - Bounding rectangles of elements to align.
 * @param options - Additional options for the layout.
 * @returns Array of offsets for each element.
 */
export declare function getAlignTopOffsets(rects: LayoutRect[], options?: LayoutOptions): Vector2D[];
/**
 * Returns offsets to align the bottoms of elements to the bottom of a reference element.
 * @param rects - Bounding rectangles of elements to align.
 * @param options - Additional options for the layout.
 * @returns Array of offsets for each element.
 */
export declare function getAlignBottomOffsets(rects: LayoutRect[], options?: LayoutOptions): Vector2D[];
/**
 * Returns offsets to align the middles of elements to the middle of a reference element.
 * @param rects - Bounding rectangles of elements to align.
 * @param options - Additional options for the layout.
 * @returns Array of offsets for each element.
 */
export declare function getAlignMiddleOffsets(rects: LayoutRect[], options?: LayoutOptions): Vector2D[];
/**
 * Returns offsets to align the lefts of elements to the left of a reference element.
 * @param rects - Bounding rectangles of elements to align.
 * @param options - Additional options for the layout.
 * @returns Array of offsets for each element.
 */
export declare function getJustifyLeftOffsets(rects: LayoutRect[], options?: LayoutOptions): Vector2D[];
/**
 * Returns offsets to align the rights of elements to the right of a reference element.
 * @param rects - Bounding rectangles of elements to align.
 * @param options - Additional options for the layout.
 * @returns Array of offsets for each element.
 */
export declare function getJustifyRightOffsets(rects: LayoutRect[], options?: LayoutOptions): Vector2D[];
/**
 * Returns offsets to align the centers of elements to the center of a reference element.
 * @param rects - Bounding rectangles of elements to align.
 * @param options - Additional options for the layout.
 * @returns Array of offsets for each element.
 */
export declare function getJustifyCenterOffsets(rects: LayoutRect[], options?: LayoutOptions): Vector2D[];
/**
 * Additional options for the space between layout utilities.
 */
export type LayoutBetweenOptions = {
    /** Min gap between elements. */
    minGap?: number;
    /** Whether to use a center based approach, or a bounds based approach. Defaults to bounds. */
    centerBased?: boolean;
};
/**
 * Returns offsets to space elements evenly on the x axis with a minimum gap.
 * @param rects - Bounding rectangles of elements to align.
 * @param options - Additional options for the layout.
 * @returns Array of offsets for each element.
 */
export declare function getJustifyBetweenOffsets(rects: LayoutRect[], { minGap, centerBased }?: LayoutBetweenOptions): Vector2D[];
/**
 * Returns offsets to space elements evenly on the y axis with a minimum gap.
 * @param rects - Bounding rectangles of elements to align.
 * @param options - Additional options for the layout.
 * @returns Array of offsets for each element.
 */
export declare function getAlignBetweenOffsets(rects: LayoutRect[], { minGap, centerBased }?: LayoutBetweenOptions): Vector2D[];