From f3c7f8a8c678df930f13e069e183b00e0f256244 Mon Sep 17 00:00:00 2001 From: huumanoid Date: Sun, 29 Jan 2017 10:20:17 +0300 Subject: [PATCH 1/2] fix #246 delayHide triggers when tip already hidden --- src/index.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/index.js b/src/index.js index 86538fc8f..8f14b0b97 100644 --- a/src/index.js +++ b/src/index.js @@ -250,6 +250,9 @@ class ReactTooltip extends Component { scrollHide = this.props.scrollHide } + // To prevent previously created timers from triggering + this.clearTimer() + this.setState({ placeholder, isEmptyTip, From c1222ed9c6f81243220aa0ad14a4828911223b8a Mon Sep 17 00:00:00 2001 From: huumanoid Date: Sun, 29 Jan 2017 16:45:56 +0300 Subject: [PATCH 2/2] fix wrong effect detection during listeners binding --- src/decorators/getEffect.js | 11 +++++++++++ src/index.js | 8 +++++--- 2 files changed, 16 insertions(+), 3 deletions(-) create mode 100644 src/decorators/getEffect.js diff --git a/src/decorators/getEffect.js b/src/decorators/getEffect.js new file mode 100644 index 000000000..cfa73ae86 --- /dev/null +++ b/src/decorators/getEffect.js @@ -0,0 +1,11 @@ +/** + * Util method to get effect + */ + +export default function (target) { + target.prototype.getEffect = function (currentTarget) { + const dataEffect = currentTarget.getAttribute('data-effect') + return dataEffect || this.props.effect || 'float' + } +} + diff --git a/src/index.js b/src/index.js index 8f14b0b97..c620f254c 100644 --- a/src/index.js +++ b/src/index.js @@ -9,6 +9,7 @@ import staticMethods from './decorators/staticMethods' import windowListener from './decorators/windowListener' import customEvent from './decorators/customEvent' import isCapture from './decorators/isCapture' +import getEffect from './decorators/getEffect' /* Utils */ import getPosition from './utils/getPosition' @@ -18,7 +19,7 @@ import { parseAria } from './utils/aria' /* CSS */ import cssStyle from './style' -@staticMethods @windowListener @customEvent @isCapture +@staticMethods @windowListener @customEvent @isCapture @getEffect class ReactTooltip extends Component { static propTypes = { @@ -161,6 +162,7 @@ class ReactTooltip extends Component { targetArray.forEach(target => { const isCaptureMode = this.isCapture(target) + const effect = this.getEffect(target) if (target.getAttribute('currentItem') === null) { target.setAttribute('currentItem', 'false') } @@ -172,7 +174,7 @@ class ReactTooltip extends Component { } target.addEventListener('mouseenter', this.showTooltip, isCaptureMode) - if (this.state.effect === 'float') { + if (effect === 'float') { target.addEventListener('mousemove', this.updateTooltip, isCaptureMode) } target.addEventListener('mouseleave', this.hideTooltip, isCaptureMode) @@ -258,7 +260,7 @@ class ReactTooltip extends Component { isEmptyTip, place: e.currentTarget.getAttribute('data-place') || this.props.place || 'top', type: e.currentTarget.getAttribute('data-type') || this.props.type || 'dark', - effect: switchToSolid && 'solid' || e.currentTarget.getAttribute('data-effect') || this.props.effect || 'float', + effect: switchToSolid && 'solid' || this.getEffect(e.currentTarget), offset: e.currentTarget.getAttribute('data-offset') || this.props.offset || {}, html: e.currentTarget.getAttribute('data-html') ? e.currentTarget.getAttribute('data-html') === 'true'