ant-design/components/popover/index.tsx

60 lines
1.4 KiB
TypeScript
Raw Normal View History

import * as React from 'react';
import Tooltip, { AbstractTooltipProps, TooltipPlacement, TooltipTrigger } from '../tooltip';
import warning from '../_util/warning';
2015-06-17 16:58:13 +08:00
2016-11-30 16:43:35 +08:00
export interface PopoverProps extends AbstractTooltipProps {
2016-10-24 12:04:26 +08:00
title?: React.ReactNode;
content?: React.ReactNode;
2016-07-29 14:45:06 +08:00
}
export default class Popover extends React.Component<PopoverProps, {}> {
static defaultProps = {
2016-04-01 01:36:42 +08:00
prefixCls: 'ant-popover',
placement: 'top' as TooltipPlacement,
2016-04-07 15:02:22 +08:00
transitionName: 'zoom-big',
trigger: 'hover' as TooltipTrigger,
mouseEnterDelay: 0.1,
mouseLeaveDelay: 0.1,
2016-04-01 01:36:42 +08:00
overlayStyle: {},
2016-07-13 11:14:24 +08:00
};
2017-09-17 15:48:44 +08:00
private tooltip: Tooltip;
2016-11-30 16:43:35 +08:00
2015-11-04 17:15:33 +08:00
getPopupDomNode() {
return this.tooltip.getPopupDomNode();
}
2015-11-04 17:15:33 +08:00
getOverlay() {
const { title, prefixCls, content } = this.props;
warning(
!('overlay' in this.props),
'Popover[overlay] is removed, please use Popover[content] instead, ' +
'see: https://u.ant.design/popover-content',
);
return (
<div>
2016-04-01 01:36:42 +08:00
{title && <div className={`${prefixCls}-title`}>{title}</div>}
2016-03-17 15:10:49 +08:00
<div className={`${prefixCls}-inner-content`}>
{content}
</div>
</div>
);
}
saveTooltip = (node: any) => {
this.tooltip = node;
}
render() {
const props = { ...this.props };
delete props.title;
return (
<Tooltip
{...props}
ref={this.saveTooltip}
overlay={this.getOverlay()}
/>
);
}
}