Tooltip.js 4.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  3. import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
  4. var _excluded = ["overlayClassName", "trigger", "mouseEnterDelay", "mouseLeaveDelay", "overlayStyle", "prefixCls", "children", "onVisibleChange", "afterVisibleChange", "transitionName", "animation", "motion", "placement", "align", "destroyTooltipOnHide", "defaultVisible", "getTooltipContainer", "overlayInnerStyle", "arrowContent", "overlay", "id", "showArrow", "classNames", "styles"];
  5. import Trigger from '@rc-component/trigger';
  6. import classNames from 'classnames';
  7. import * as React from 'react';
  8. import { forwardRef, useImperativeHandle, useRef } from 'react';
  9. import { placements } from "./placements";
  10. import Popup from "./Popup";
  11. import useId from "rc-util/es/hooks/useId";
  12. var Tooltip = function Tooltip(props, ref) {
  13. var overlayClassName = props.overlayClassName,
  14. _props$trigger = props.trigger,
  15. trigger = _props$trigger === void 0 ? ['hover'] : _props$trigger,
  16. _props$mouseEnterDela = props.mouseEnterDelay,
  17. mouseEnterDelay = _props$mouseEnterDela === void 0 ? 0 : _props$mouseEnterDela,
  18. _props$mouseLeaveDela = props.mouseLeaveDelay,
  19. mouseLeaveDelay = _props$mouseLeaveDela === void 0 ? 0.1 : _props$mouseLeaveDela,
  20. overlayStyle = props.overlayStyle,
  21. _props$prefixCls = props.prefixCls,
  22. prefixCls = _props$prefixCls === void 0 ? 'rc-tooltip' : _props$prefixCls,
  23. children = props.children,
  24. onVisibleChange = props.onVisibleChange,
  25. afterVisibleChange = props.afterVisibleChange,
  26. transitionName = props.transitionName,
  27. animation = props.animation,
  28. motion = props.motion,
  29. _props$placement = props.placement,
  30. placement = _props$placement === void 0 ? 'right' : _props$placement,
  31. _props$align = props.align,
  32. align = _props$align === void 0 ? {} : _props$align,
  33. _props$destroyTooltip = props.destroyTooltipOnHide,
  34. destroyTooltipOnHide = _props$destroyTooltip === void 0 ? false : _props$destroyTooltip,
  35. defaultVisible = props.defaultVisible,
  36. getTooltipContainer = props.getTooltipContainer,
  37. overlayInnerStyle = props.overlayInnerStyle,
  38. arrowContent = props.arrowContent,
  39. overlay = props.overlay,
  40. id = props.id,
  41. _props$showArrow = props.showArrow,
  42. showArrow = _props$showArrow === void 0 ? true : _props$showArrow,
  43. tooltipClassNames = props.classNames,
  44. tooltipStyles = props.styles,
  45. restProps = _objectWithoutProperties(props, _excluded);
  46. var mergedId = useId(id);
  47. var triggerRef = useRef(null);
  48. useImperativeHandle(ref, function () {
  49. return triggerRef.current;
  50. });
  51. var extraProps = _objectSpread({}, restProps);
  52. if ('visible' in props) {
  53. extraProps.popupVisible = props.visible;
  54. }
  55. var getPopupElement = function getPopupElement() {
  56. return /*#__PURE__*/React.createElement(Popup, {
  57. key: "content",
  58. prefixCls: prefixCls,
  59. id: mergedId,
  60. bodyClassName: tooltipClassNames === null || tooltipClassNames === void 0 ? void 0 : tooltipClassNames.body,
  61. overlayInnerStyle: _objectSpread(_objectSpread({}, overlayInnerStyle), tooltipStyles === null || tooltipStyles === void 0 ? void 0 : tooltipStyles.body)
  62. }, overlay);
  63. };
  64. var getChildren = function getChildren() {
  65. var child = React.Children.only(children);
  66. var originalProps = (child === null || child === void 0 ? void 0 : child.props) || {};
  67. var childProps = _objectSpread(_objectSpread({}, originalProps), {}, {
  68. 'aria-describedby': overlay ? mergedId : null
  69. });
  70. return /*#__PURE__*/React.cloneElement(children, childProps);
  71. };
  72. return /*#__PURE__*/React.createElement(Trigger, _extends({
  73. popupClassName: classNames(overlayClassName, tooltipClassNames === null || tooltipClassNames === void 0 ? void 0 : tooltipClassNames.root),
  74. prefixCls: prefixCls,
  75. popup: getPopupElement,
  76. action: trigger,
  77. builtinPlacements: placements,
  78. popupPlacement: placement,
  79. ref: triggerRef,
  80. popupAlign: align,
  81. getPopupContainer: getTooltipContainer,
  82. onPopupVisibleChange: onVisibleChange,
  83. afterPopupVisibleChange: afterVisibleChange,
  84. popupTransitionName: transitionName,
  85. popupAnimation: animation,
  86. popupMotion: motion,
  87. defaultPopupVisible: defaultVisible,
  88. autoDestroy: destroyTooltipOnHide,
  89. mouseLeaveDelay: mouseLeaveDelay,
  90. popupStyle: _objectSpread(_objectSpread({}, overlayStyle), tooltipStyles === null || tooltipStyles === void 0 ? void 0 : tooltipStyles.root),
  91. mouseEnterDelay: mouseEnterDelay,
  92. arrow: showArrow
  93. }, extraProps), getChildren());
  94. };
  95. export default /*#__PURE__*/forwardRef(Tooltip);