From 17df50420504a23a7b7ccfcdc2c50d55760152b3 Mon Sep 17 00:00:00 2001
From: Jamie Wong <jamie.lf.wong@gmail.com>
Date: Fri, 29 Dec 2017 22:07:27 -0500
Subject: [PATCH] Hide hovertip on mouseleave

---
 flamechart-style.ts | 3 +--
 flamechart-view.tsx | 6 ++++++
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/flamechart-style.ts b/flamechart-style.ts
index f225ff2..e20557c 100644
--- a/flamechart-style.ts
+++ b/flamechart-style.ts
@@ -16,7 +16,6 @@ export const style = StyleSheet.create({
     background: 'white',
     border: '1px solid black',
     maxWidth: Sizes.TOOLTIP_WIDTH_MAX,
-    overflow: 'hidden',
     paddingTop: HOVERTIP_PADDING,
     paddingBottom: HOVERTIP_PADDING,
     pointerEvents: 'none',
@@ -27,7 +26,7 @@ export const style = StyleSheet.create({
   hoverTipRow: {
     textOverflow: 'ellipsis',
     whiteSpace: 'nowrap',
-    overflow: 'hidden',
+    overflowX: 'hidden',
     paddingLeft: HOVERTIP_PADDING,
     paddingRight: HOVERTIP_PADDING,
     maxWidth: Sizes.TOOLTIP_WIDTH_MAX,
diff --git a/flamechart-view.tsx b/flamechart-view.tsx
index 698b58a..236adce 100644
--- a/flamechart-view.tsx
+++ b/flamechart-view.tsx
@@ -458,6 +458,11 @@ export class FlamechartPanZoomView extends ReloadableComponent<FlamechartPanZoom
     this.renderCanvas()
   }
 
+  private onMouseLeave = (ev: MouseEvent) => {
+    this.props.setNodeHover(null, new Vec2())
+    this.renderCanvas()
+  }
+
   private onWheel = (ev: WheelEvent) => {
     ev.preventDefault()
     this.frameHadWheelEvent = true
@@ -513,6 +518,7 @@ export class FlamechartPanZoomView extends ReloadableComponent<FlamechartPanZoom
         className={css(style.panZoomView, style.vbox)}
         onMouseDown={this.onMouseDown}
         onMouseMove={this.onMouseMove}
+        onMouseLeave={this.onMouseLeave}
         onWheel={this.onWheel}>
         <canvas
           width={1} height={1}