import { ViewportPositionerClassNameContract } from "@microsoft/fast-components-class-name-contracts-base"; import Foundation, { HandledProps } from "@microsoft/fast-components-foundation-react"; import React from "react"; import { ViewportPositionerHandledProps, ViewportPositionerProps, ViewportPositionerUnhandledProps } from "./viewport-positioner.props"; import { ViewportContext, ViewportContextType } from "./viewport-context"; export interface Dimension { height: number; width: number; } export interface ViewportPositionerState { disabled: boolean; /** * Indicates that the component is unable to react to viewport changes and only places the * positioner in the default position on mount. */ noObserverMode: boolean; /** * values to be applied to the component's transform origin attribute on render */ xTransformOrigin: string; yTransformOrigin: string; /** * values to be applied to the component's translate transform attribute on render */ xTranslate: number; yTranslate: number; /** * values to be applied to the component's positioning attributes on render */ top: number; right: number; bottom: number; left: number; /** * the positions currently being applied to layout */ currentVerticalPosition: ViewportPositionerVerticalPositionLabel; currentHorizontalPosition: ViewportPositionerHorizontalPositionLabel; /** * the default positions based on default position and positioning mode props */ defaultVerticalPosition: ViewportPositionerVerticalPositionLabel; defaultHorizontalPosition: ViewportPositionerHorizontalPositionLabel; /** * the size (pixels) of the selected position on each axis */ horizontalSelectedPositionWidth: number | null; verticalSelectedPositionHeight: number | null; /** * indicates that an initial positioning pass on layout has completed */ initialLayoutComplete: boolean; /** * how many checks for a valid viewport before we give up * this is primarily because during the initial layout pass * we may not have a valid viewport dom instance available yet */ validRefChecksRemaining: number; } export declare enum ViewportPositionerHorizontalPositionLabel { left = "left", insetLeft = "insetLeft", insetRight = "insetRight", right = "right", undefined = "undefined" } export declare enum ViewportPositionerVerticalPositionLabel { top = "top", insetTop = "insetTop", insetBottom = "insetBottom", bottom = "bottom", undefined = "undefined" } declare class ViewportPositioner extends Foundation { static displayName: string; static contextType: React.Context; static defaultProps: Partial; protected handledProps: HandledProps; private rootElement; private openRequestAnimationFrame; private collisionDetector; private resizeDetector; private viewportRect; private positionerDimension; private anchorTop; private anchorRight; private anchorBottom; private anchorLeft; private anchorHeight; private anchorWidth; private scrollTop; private scrollLeft; /** * base offsets between the positioner's base position and the anchor's */ private baseHorizontalOffset; private baseVerticalOffset; /** * constructor */ constructor(props: ViewportPositionerProps); componentDidMount(): void; componentWillUnmount(): void; componentDidUpdate(prevProps: ViewportPositionerProps): void; /** * Renders the component */ render(): React.ReactElement; /** * Create class-names */ protected generateClassNames(): string; /** * gets the CSS classes to be programmatically applied to the component */ private getPositioningStyles; /** * Checks whether component should be disabled or not */ private updateDisabledState; /** * Enable the component */ private enableComponent; /** * If observers are not supported we do expensive getBoundingClientRect calls * once to get correct initial placement */ private setNoObserverMode; /** * Disable the component */ private disable; /** * removes event listeners and observers when component is being unmounted or reset */ private detachListeners; /** * Get available Horizontal positions based on positioning mode */ private getHorizontalPositioningOptions; /** * Get available Vertical positions based on positioning mode */ private getVerticalPositioningOptions; /** * Get the width available for a particular horizontal position */ private getAvailableWidth; /** * Get the height available for a particular vertical position */ private getAvailableHeight; /** * Handle scroll events */ private handleScroll; /** * Handle resize events */ private handleResize; /** * Handle positioner resize events */ private handlePositionerResize; /** * Handle anchor resize events */ private handleAnchorResize; /** * Handle collisions */ private handleCollision; /** * Update data based on anchor collisions */ private handleAnchorCollision; /** * Update data based on positioner collisions */ private handlePositionerCollision; /** * Update the offset values */ private updatePositionerOffset; /** * Check for scroll changes in viewport and adjust position data */ private updateForScrolling; /** * Recalculate layout related state values */ private updateLayout; /** * Get positioner dimensions for next render */ private getNextPositionerDimension; /** * Get horizontal positioning state based on desired position */ private getHorizontalPositioningState; /** * Get vertical positioning state based on desired position */ private getVerticalPositioningState; /** * Calculate horizontal translation to keep positioner in view */ private getHorizontalTranslate; /** * Calculate vertical translation to keep positioner in view */ private getVerticalTranslate; /** * Request's an animation frame if there are currently no open animation frame requests */ private requestFrame; /** * get the anchor element */ private getAnchorElement; /** * get the viewport element, prefer one provided in props, then context, then document root */ private getViewportElement; /** * returns null if the extracted viewport element is Text */ private extractElement; /** * Converts simple horizontal position to a position label based on AxisPositioningMode */ private getHorizontalPositionToLabel; /** * Converts simple vertical position to a position label based on AxisPositioningMode */ private getVerticalPositionToLabel; /** * Gets the uninitialized state */ private generateInitialState; } export default ViewportPositioner; export * from "./viewport-positioner.props"; export { ViewportPositionerClassNameContract, ViewportContext, ViewportContextType };