import * as React from 'react' ; import Popover from '../popover' ; import ToolTipToggle from './ToolTipToggle' ; export interface DropdownProps { open ? : boolean ; onToggle ? : ( open : boolean ) => void ; disabled ? : boolean ; aligned ? : boolean ; direction ? : 'up' | 'down' | 'left' | 'right' ; align ? : 'top' | 'right' | 'bottom' | 'left' | 'middle' ; right ? : boolean ; overlay : React . ReactNode ; } class ToolTip extends React . PureComponent < DropdownProps , any > { constructor ( props ) { super ( props ) ; this . handleToggle = this . handleToggle . bind ( this ) ; this . state = { open : props . open || false , } ; } static defaultProps = { direction : 'down' , align : 'left' , } ; componentWillReceiveProps ( nextProps ) { 'open' in nextProps && this . setState ( { open : nextProps . open } ) ; } open ( ) { this . setState ( { open : true } ) ; } close ( ) { this . setState ( { open : false } ) ; } handleToggle ( open ) { this . setState ( { open } ) ; this . props . onToggle && this . props . onToggle ( open ) ; } render ( ) { const { children , disabled , aligned , overlay , ... restProps } = this . props ; const { open } = this . state ; return ( < Popover triggerMode = "click" open = { open } onToggle = { this . handleToggle } content = { overlay } disabled = { disabled } aligned = { aligned } { ... restProps } > < ToolTipToggle open = { open } > { children } < /ToolTipToggle> < /Popover>); } } export default ToolTip ;