@selenite/commons/dist/utils/html.svelte.d.ts

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

import type { Position } from './math';
/**
 * Reactive window state for use in svelte 5.
 *
 * At the moment, it exposes width and height.
 */
export declare class WindowState {
    readonly width: number;
    readonly height: number;
    constructor();
}
/**
 * Returns whether the current environment is a browser, based on window being defined.
 */
export declare function isBrowser(): boolean;
/**
 * Constant indicating whether the current environment is a browser.
 */
export declare const browser: boolean;
export declare function posFromClient({ clientX: x, clientY: y }: {
    clientX: number;
    clientY: number;
}): Position;
/**
 * Definition of a rectangle..
 */
export declare class Rect {
    x: number;
    y: number;
    width: number;
    height: number;
    constructor(x?: number, y?: number, width?: number, height?: number);
    get right(): number;
    get bottom(): number;
}
/**
 * Utils to compute intersection, union and area of bouding rectangles.
 */
export declare namespace Rect {
    /**
     * Returns the intersection of multiple bouding rectangles.
     */
    function intersection(rect: Rect | DOMRect, ...rects: (Rect | DOMRect)[]): Rect;
    /**
     * Return the union of multiple bounding rectangles.
     */
    function union(rect: Rect, ...rects: Rect[]): Rect;
    /**
     * Returns the area of a rectangle.
     */
    function area(rect: Rect): number;
    function pos(rect: Rect): Position;
}
export declare function download(filename: string, data: unknown): void;
export declare function downloadJSON(name: string, data: unknown): void;
/**
 * Bounds of an element relative to the window.
 *
 * All distances are measured from the edges of the window.
 */
export type WindowBounds = {
    top: number;
    left: number;
    right: number;
    bottom: number;
};
/**
 * Returns the bounds of an element relative to the window.
 * @param element
 * @returns
 */
export declare function getBounds(element?: Element): WindowBounds;
/**
 * Returns the union of the window bounds of multiple elements.
 * @param bounds
 * @returns
 */
export declare function getBoundsUnion(bounds: (WindowBounds | Element | undefined)[]): WindowBounds;
/**
 * Returns padded window bounds.
 * @param bounds - bounds to pad
 * @param padding - pixels to pad
 * @returns padded window bounds
 */
export declare function padBounds(bounds: WindowBounds, padding: number): WindowBounds;
export declare function getBoundsIntersection(...bounds: (WindowBounds | HTMLElement | undefined)[]): WindowBounds;
export declare function getClosestElement(target: Element, elements: Element[]): Element | undefined;
export declare function getClosestElementIndex(target: Element, elements: Element[]): number;
export declare class PointerDownWatcher {
    #private;
    isPointerDown: boolean;
    pos: Position | undefined;
    lastEvent: PointerEvent | undefined;
    static get instance(): PointerDownWatcher;
    private constructor();
    subscribe(run: (value: boolean) => void): () => void;
    protected onpointerdown(e: PointerEvent): void;
    protected onpointerup(): void;
}
export declare function isOverflowing(el: HTMLElement): {
    vertical: boolean;
    horizontal: boolean;
};