ant-design/components/popover/index.tsx

65 lines
2.0 KiB
TypeScript
Raw Normal View History

import classNames from 'classnames';
import * as React from 'react';
2022-05-23 15:41:59 +08:00
import { ConfigContext } from '../config-provider';
import type { AbstractTooltipProps, TooltipPlacement } from '../tooltip';
import Tooltip from '../tooltip';
import type { RenderFunction } from '../_util/getRenderPropValue';
import { getTransitionName } from '../_util/motion';
import PurePanel, { getOverlay } from './PurePanel';
// CSSINJS
import useStyle from './style';
2016-11-30 16:43:35 +08:00
export interface PopoverProps extends AbstractTooltipProps {
title?: React.ReactNode | RenderFunction;
content?: React.ReactNode | RenderFunction;
2022-06-01 18:28:31 +08:00
/** @private Used For Popconfirm. Safe to remove. */
2022-05-23 15:41:59 +08:00
_overlay?: React.ReactNode;
2016-07-29 14:45:06 +08:00
}
const Popover = React.forwardRef<unknown, PopoverProps>(
2022-05-23 15:52:14 +08:00
(
{ prefixCls: customizePrefixCls, title, content, overlayClassName, _overlay, ...otherProps },
ref,
) => {
const { getPrefixCls } = React.useContext(ConfigContext);
const prefixCls = getPrefixCls('popover', customizePrefixCls);
const [wrapSSR, hashId] = useStyle(prefixCls);
const rootPrefixCls = getPrefixCls();
const overlayCls = classNames(overlayClassName, hashId);
return wrapSSR(
<Tooltip
{...otherProps}
prefixCls={prefixCls}
overlayClassName={overlayCls}
ref={ref as any}
overlay={_overlay || getOverlay(prefixCls, title, content)}
transitionName={getTransitionName(rootPrefixCls, 'zoom-big', otherProps.transitionName)}
data-popover-inject
/>,
);
},
) as React.ForwardRefExoticComponent<
React.PropsWithoutRef<PopoverProps> & React.RefAttributes<unknown>
> & {
_InternalPanelDoNotUseOrYouWillBeFired: typeof PurePanel;
};
if (process.env.NODE_ENV !== 'production') {
Popover.displayName = 'Popover';
}
Popover.defaultProps = {
placement: 'top' as TooltipPlacement,
trigger: 'hover',
mouseEnterDelay: 0.1,
mouseLeaveDelay: 0.1,
overlayStyle: {},
};
Popover._InternalPanelDoNotUseOrYouWillBeFired = PurePanel;
export default Popover;