feat(Tooltip): add explicit focus in and focus out handlers (reactstr…

…ap#1012)
RockinRonE · May 21, 2018 · 738dac0 · 738dac0
1 parent 92e4a4b
commit 738dac0
Showing 1 changed file with 13 additions and 7 deletions.
diff --git a/src/Tooltip.js b/src/Tooltip.js
@@ -66,7 +66,9 @@ class Tooltip extends React.Component {
     this.show = this.show.bind(this);
     this.hide = this.hide.bind(this);
     this.onEscKeyDown = this.onEscKeyDown.bind(this);
-    this.handleFocus = this.handleFocus.bind(this);
+    this.handleFocusIn = this.handleFocusIn.bind(this);
+    this.handleFocusOut = this.handleFocusOut.bind(this);
+
   }
 
   componentDidMount() {
@@ -125,8 +127,12 @@ class Tooltip extends React.Component {
     return delay;
   }
 
-  handleFocus() {
-    this.toggle();
+  handleFocusIn() {
+    this.show();
+  }
+
+  handleFocusOut() {
+    this.hide();
   }
 
   show() {
@@ -169,8 +175,8 @@ class Tooltip extends React.Component {
     this._target.addEventListener('mouseover', this.onMouseOverTooltip, true);
     this._target.addEventListener('mouseout', this.onMouseLeaveTooltip, true);
     this._target.addEventListener('keydown', this.onEscKeyDown, true);
-    this._target.addEventListener('focusin', this.handleFocus, true);
-    this._target.addEventListener('focusout', this.handleFocus, true);
+    this._target.addEventListener('focusin', this.handleFocusIn, true);
+    this._target.addEventListener('focusout', this.handleFocusOut, true);
 
 
     ['click', 'touchstart'].forEach(event =>
@@ -182,8 +188,8 @@ class Tooltip extends React.Component {
     this._target.removeEventListener('mouseover', this.onMouseOverTooltip, true);
     this._target.removeEventListener('mouseout', this.onMouseLeaveTooltip, true);
     this._target.addEventListener('keydown', this.onEscKeyDown, true);
-    this._target.addEventListener('focusin', this.handleFocus, true);
-    this._target.addEventListener('focusout', this.handleFocus, true);
+    this._target.addEventListener('focusin', this.handleFocusIn, true);
+    this._target.addEventListener('focusout', this.handleFocusOut, true);
 
     ['click', 'touchstart'].forEach(event =>
       document.removeEventListener(event, this.handleDocumentClick, true)