react-elegant-ui/hooks/behavior/usePopper/usePopper.d.ts

Elegant UI components, made by BEM best practices for react

import { ReactNode, RefObject } from 'react';
import { Instance, Modifier, OptionsGeneric, VirtualElement } from '@popperjs/core';
import { Direction } from './directions';
import { Boundary, PopperConstructor, PopperPublicState } from './types';
export type PopupHookProps<M extends Partial<Modifier<any, any>>[] = Partial<Modifier<any, any>>[]> = {
    /**
     * Reference to object relative to which the popup will be positioned
     */
    anchorRef: RefObject<HTMLElement | VirtualElement>;
    /**
     * Target for positioning
     */
    popupRef: RefObject<HTMLElement>;
    /**
     * Tail element
     */
    arrowRef?: RefObject<HTMLElement>;
    /**
     * Toggle calculation
     */
    enabled?: boolean;
    /**
     * Content. Changes of this will trigger force update
     */
    children?: ReactNode;
    /**
     * Custom popper constructor
     */
    createPopper?: PopperConstructor;
    /**
     * Addon modifiers
     */
    modifiers?: M;
    /**
     * User defined options
     *
     * If you use this, you must configure all modifiers yourself
     */
    options?: OptionsGeneric<M>;
    /**
     * Direction to open popup
     */
    placement?: Direction | Direction[];
    /**
     * References to DOM elements that popup should fit into
     */
    boundary?: Boundary;
    /**
     * Fixate the position of the popup after opening
     */
    motionless?: boolean;
    /**
     * Number of pixels from popup edge, beyond which tail should not out
     */
    arrowMarginThreshold?: number;
    /**
     * Number of pixels from popup edge, which trigger a change of direction
     */
    marginThreshold?: number;
    /**
     * Offsets, a skidding and distance
     */
    offset?: [number | undefined, number | undefined];
    /**
     * Offset of tail from main direction
     */
    UNSAFE_tailOffset?: number;
};
export interface PopupHookResult extends PopperPublicState {
    popper: Instance | null;
}
/**
 * Use popperjs for positioning popup elements
 */
export declare function usePopper<M extends Partial<Modifier<any, any>>[] = Partial<Modifier<any, any>>[]>(props: PopupHookProps<M>): PopupHookResult;