@mmcodemark/fuselage-hooks/dist/usePosition/index.d.ts

React hooks for Fuselage, Rocket.Chat's design system and UI toolkit

import type { RefObject, CSSProperties } from 'react';
import type { Placement } from './Placement';
import type { TargetBoundaries } from './getTargetBoundaries';
import type { VariantBoundaries } from './getVariantBoundaries';
export type UsePositionOptions = {
    margin?: number;
    container?: Element;
    placement?: Placement;
};
export type UsePositionResult = {
    style: CSSProperties;
    placement?: Placement;
};
export declare function getPositionStyle({ placement, targetRect, containerRect, targetBoundaries, variantBoundaries, margin, }: {
    placement: Placement;
    targetRect: DOMRect;
    containerRect: DOMRect;
    targetBoundaries: TargetBoundaries;
    variantBoundaries: VariantBoundaries;
    margin?: number;
}): UsePositionResult;
/**
 * Hook to deal and position an element using an anchor
 * @param anchorRef - the anchor
 * @param targetRef - the element to be positioned
 * @param options - options to position
 * @returns The style containing top and left position
 * @public
 */
export declare function usePosition<TTarget extends Element, TAnchor extends Element>(anchorRef: RefObject<TAnchor>, targetRef: RefObject<TTarget>, { margin, placement, container, }?: UsePositionOptions): UsePositionResult;
//# sourceMappingURL=index.d.ts.map