lucid-ui
Version:
A UI component library from AppNexus.
137 lines (136 loc) • 4.55 kB
TypeScript
import React from 'react';
import { ICloseIconProps } from '../Icon/CloseIcon/CloseIcon';
import * as reducers from './ToolTip.reducers';
import { StandardProps } from '../../util/component-types';
interface IToolTipTargetProps extends StandardProps {
description?: string;
elementType?: string;
}
interface IToolTipTitleProps extends StandardProps {
description?: string;
}
interface IToolTipBodyProps extends StandardProps {
description?: string;
}
export interface IToolTipState {
isExpanded: boolean;
isMouseOverFlyout: boolean;
isMouseOverTarget: boolean;
}
export interface IToolTipProps extends StandardProps {
/** Set this to \`true\` if you want to have a \`x\` close icon. */
isCloseable?: boolean;
/** Offers a lighter style for the tooltip window. Defaults to false. */
isLight?: boolean;
/** Called when the user closes the \`Banner\`. */
onClose?: ({ event, props, }: {
event: React.MouseEvent;
props: IToolTipProps;
}) => void;
/** Passed through to the root FlyOut element. */
flyOutStyle?: React.CSSProperties;
/** maximum width of the ToolTip FlyOut. Defaults to 200px. */
flyOutMaxWidth?: number | string;
/** direction of the FlyOut relative to Target. */
direction?: 'down' | 'up' | 'right' | 'left';
/** alignment of the Flyout relative to Target in the cross axis from \`direction\ */
alignment?: 'start' | 'center' | 'end';
/** Indicates whether the ToolTip will render or not. */
isExpanded?: boolean;
/** Called when cursor moves over the target */
onMouseOver?: ({ event, props, }: {
event: React.MouseEvent;
props: IToolTipProps;
}) => void;
/** Called when cursor leaves the target and the ToolTip */
onMouseOut?: ({ event, props, }: {
event: React.MouseEvent;
props: IToolTipProps;
}) => void;
/** The \`id\` of the FlyOut portal element that is appended to
\`document.body\`. Defaults to a generated \`id\`. */
portalId?: string | null;
}
declare class ToolTip extends React.Component<IToolTipProps, IToolTipState> {
constructor(props: IToolTipProps);
static displayName: string;
static Title: {
(_props: IToolTipTitleProps): null;
displayName: string;
peek: {
description: string;
};
propName: string;
};
static Target: {
(_props: IToolTipTargetProps): null;
displayName: string;
peek: {
description: string;
};
propName: string;
};
static Body: {
(_props: IToolTipBodyProps): null;
displayName: string;
peek: {
description: string;
};
propName: string;
};
static peek: {
description: string;
notes: {
overview: string;
intendedUse: string;
technicalRecommendations: string;
};
categories: string[];
madeFrom: string[];
};
static reducers: typeof reducers;
static propTypes: {
children: any;
className: any;
isCloseable: any;
isLight: any;
onClose: any;
style: any;
flyOutStyle: any;
flyOutMaxWidth: any;
direction: any;
alignment: any;
isExpanded: any;
onMouseOver: any;
onMouseOut: any;
portalId: any;
Body: any;
Title: any;
Target: any;
};
static defaultProps: {
alignment: import("../ContextMenu/ContextMenu").EnumAlignment;
direction: import("../ContextMenu/ContextMenu").EnumDirection;
flyOutStyle: {};
isCloseable: boolean;
isExpanded: boolean;
isLight: boolean;
onClose: (...args: any[]) => void;
onMouseOut: (...args: any[]) => void;
onMouseOver: (...args: any[]) => void;
portalId: null;
};
handleMouseOut: (event: React.MouseEvent) => void;
handleMouseOverFlyout: () => void;
handleMouseOutFlyout: (event: React.MouseEvent) => void;
handleMouseOverTarget: (event: React.MouseEvent) => void;
handleMouseOutTarget: (event: React.MouseEvent) => void;
handleClose: ({ event, props, }: {
event: React.MouseEvent;
props: ICloseIconProps;
}) => void;
render(): JSX.Element;
}
declare const _default: typeof ToolTip & import("../../util/state-management").IHybridComponent<IToolTipProps, IToolTipState>;
export default _default;
export { ToolTip as ToolTipDumb };