office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
63 lines (62 loc) • 1.91 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 _entityHost;
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?);
}