popover-lite/dist/index.d.ts

Tiny wrapper over the native Popover API + CSS Anchor Positioning

/*************************************************
 *              Public Types & API               *
 *************************************************/
export type Placement = 'top' | 'bottom' | 'left' | 'right';
export interface PopoverOptions {
    /** Preferred placement or priority list. */
    placement?: Placement | Placement[];
    /** Gap between popover and anchor, in px. */
    offset?: number | {
        x?: number;
        y?: number;
    };
    /** Extra bias per placement used in scoring. */
    preference?: Partial<Record<Placement, number>>;
}
export interface PopoverController {
    readonly element: HTMLElement;
    show(): void;
    hide(): void;
    toggle(): void;
    update(): void;
    destroy(): void;
}
/*************************************************
 *          Placement scoring engine             *
 *************************************************/
export interface PlacementScore {
    placement: Placement;
    space: number;
    overflow: number;
    misalign: number;
    preference: number;
    score: number;
}
export declare function computeScores(anchor: HTMLElement, size: {
    width: number;
    height: number;
}, prefs?: Partial<Record<Placement, number>>): PlacementScore[];
/*************************************************
 *                createPopover                  *
 *************************************************/
export declare function createPopover(anchor: HTMLElement, opts?: PopoverOptions): PopoverController;