Feat: add possibility to hide tooltip on window scroll

README.md

@@ -101,6 +101,7 @@ const HeaderWithTooltip = withTooltip(Header, {
 |distance|10|Any number (pixels)|Specifies how far away the tooltip is from its element.|
 |offset|0|Any number (pixels)|Offsets the tooltip on its opposite axis. For position top and bottom, it acts as offsetX. For position left and right, it acts as offsetY.|
 |hideOnClick|`true`|`true` `false` `'persistent'`|Specifies whether to hide a tooltip upon clicking its element after hovering over.|
+|hideOnScroll|`false`|`true` `false`|Specifies whether to hide a tooltip on scroll event.|
 |multiple|`false`|`true` `false`|Specifies whether to allow multiple tooltips open on the page (click trigger only).|
 |followCursor|`false`|`true` `false`|Specifies whether to follow the user's mouse cursor (mouse devices only).|
 |inertia|`false`|`true` `false`|Modifies the transition-timing-function with a cubic bezier to create a "slingshot" intertial effect.|

index.d.ts

@@ -40,6 +40,7 @@ export interface TooltipProps {
   distance?: number;
   offset?: number;
   hideOnClick?: boolean | "persistent";
+  hideOnScroll?: boolean;
   multiple?: boolean;
   followCursor?: boolean;
   inertia?: boolean;

src/Tooltip/component.js

@@ -18,6 +18,7 @@ const defaultProps = {
   theme: 'dark',
   offset: 0,
   hideOnClick: true,
+  hideOnScroll: false,
   multiple: false,
   followCursor: false,
   inertia: false,
@@ -202,6 +203,7 @@ class Tooltip extends Component {
         theme: this.props.theme,
         offset: this.props.offset,
         hideOnClick: this.props.hideOnClick,
+        hideOnScroll: this.props.hideOnScroll,
         multiple: this.props.multiple,
         size: this.props.size,
         followCursor: this.props.followCursor,

src/Tooltip/js/core/getEventListenerHandlers.js

@@ -20,6 +20,7 @@ export default function getEventListenerHandlers(el, popper, settings) {
     interactiveBorder,
     distance,
     hideOnClick,
+    hideOnScroll,
     trigger,
     touchHold,
     touchWait
@@ -94,6 +95,7 @@ export default function getEventListenerHandlers(el, popper, settings) {
         const triggerHide = () => {
           document.body.removeEventListener('mouseleave', hide)
           document.removeEventListener('mousemove', handleMousemove)
+          document.removeEventListener('scroll', hide);
           hide()
         }
 
@@ -115,6 +117,10 @@ export default function getEventListenerHandlers(el, popper, settings) {
         }
       }
 
+      if (hideOnScroll) {
+        document.addEventListener('scroll', hide);
+      }
+
       document.body.addEventListener('mouseleave', hide)
       document.addEventListener('mousemove', handleMousemove)
 

src/Tooltip/js/core/globals.js

@@ -50,6 +50,7 @@ export const Defaults = {
   distance: 10,
   offset: 0,
   hideOnClick: true,
+  hideOnScroll: false,
   multiple: false,
   followCursor: false,
   inertia: false,