office-ui-fabric-react/lib/components/Coachmark/Coachmark.styles.d.ts

Reusable React components for building experiences for Office 365.

import { IStyle, ITheme } from '../../Styling';
export declare const COACHMARK_WIDTH = 32;
export declare const COACHMARK_HEIGHT = 32;
export interface ICoachmarkStyleProps {
    /**
     * Is the Coachmark collapsed.  Deprecated: use isCollapsed instead.
     * @deprecated
     */
    collapsed?: boolean;
    /**
     * Is the Coachmark collapsed
     */
    isCollapsed: boolean;
    /**
     * Is the beacon currently animating.
     */
    isBeaconAnimating: boolean;
    /**
     * Is the component taking measurements
     */
    isMeasuring: boolean;
    /**
     * Is the Coachmark finished measuring the dimensions of innerHostElement
     */
    isMeasured: boolean;
    /**
     * The height measured before the component has been mounted
     * in pixels
     */
    entityHostHeight?: string;
    /**
     * The width measured in pixels
     */
    entityHostWidth?: string;
    /**
     * Width of the coachmark
     */
    width?: string;
    /**
     * Height of the coachmark
     */
    height?: string;
    /**
     * Color
     */
    color?: string;
    /**
     * Beacon color one
     */
    beaconColorOne?: string;
    /**
     * Beacon color two
     */
    beaconColorTwo?: string;
    /**
     * Transform origin for teaching bubble content
     */
    transformOrigin?: string;
}
export interface ICoachmarkStyles {
    /**
     * Style for the root element in the default enabled/unchecked state.
     */
    root?: IStyle;
    /**
     * The pulsing beacon that animates when the Coachmark is collapsed.
     */
    pulsingBeacon?: IStyle;
    /**
     * The layer, or div, that the translate animation will be applied to.
     */
    translateAnimationContainer?: IStyle;
    /**
     * The layer the Scale animation will be applied to.
     */
    scaleAnimationLayer?: IStyle;
    /**
     * The layer the Rotate animation will be applied to.
     */
    rotateAnimationLayer?: IStyle;
    /**
     * The layer that content/components/elments will be hosted in.
     */
    entityHost?: IStyle;
    /**
     * The inner layer that components will be hosted in
     * and primary purpose is scaling the layer down while the
     * Coachmark collapsed.
     */
    entityInnerHost: IStyle;
    /**
     * The layer that directly contains the TeachingBubbleContent
     */
    childrenContainer: IStyle;
    /**
     * The styles applied when the Coachmark has collapsed.
     */
    collapsed?: IStyle;
    /**
     * The styles applied to the ARIA attribute container
     */
    ariaContainer?: IStyle;
}
export declare const translateOne: string;
export declare const scaleOne: string;
export declare const rotateOne: string;
export declare function getStyles(props: ICoachmarkStyleProps, theme?: ITheme): ICoachmarkStyles;