office-ui-fabric-react
Version: 
Reusable React components for building experiences for Office 365.
62 lines (61 loc) • 1.88 kB
TypeScript
/// <reference types="react" />
import { BaseComponent } from '../../Utilities';
import { ICoachmarkTypes } from './Coachmark.types';
/**
 * An interface for the cached dimensions of entity inner host.
 */
export interface IEntityRect {
    width: number;
    height: number;
}
export interface ICoachmarkState {
    /**
     * Is the Coachmark currently collapsed into
     * a tear drop shape
     */
    collapsed: boolean;
    /**
     * Enables/Disables the beacon that radiates
     * from the center of the coachmark.
     */
    isBeaconAnimating: boolean;
    /**
     * Is the teaching bubble currently retreiving the
     * original dimensions of the hosted entity.
     */
    isMeasuring: boolean;
    /**
     * Cached width and height of _entityInnerHostElement
     */
    entityInnerHostRect: IEntityRect;
    /**
     * Is the mouse in proximity of the default target element
     */
    isMouseInProximity: boolean;
    /**
     * The left position of the beak
     */
    beakLeft?: string | null;
    /**
     * The right position of the beak
     */
    beakTop?: string | null;
}
export declare class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
    static defaultProps: Partial<ICoachmarkTypes>;
    /**
     * The cached HTMLElement reference to the Entity Inner Host
     * element.
     */
    private _entityInnerHostElement;
    private _translateAnimationContainer;
    private _positioningContainer;
    constructor(props: ICoachmarkTypes);
    render(): JSX.Element;
    componentWillReceiveProps(newProps: ICoachmarkTypes): void;
    componentDidMount(): void;
    private _onFocusHandler();
    private _openCoachmark();
    private _addProximityHandler(mouseProximityOffset?);
    private _isInsideElement(mouseX, mouseY, elementRect, mouseProximityOffset?);
}