Skip to content

Commit 6823b7e

Browse files
committed
Merge remote-tracking branch 'upstream/master'
# Conflicts: # dist/react-tooltip.min.js
2 parents 3efc456 + 027e43d commit 6823b7e

File tree

8 files changed

+87
-57
lines changed

8 files changed

+87
-57
lines changed

CHANGELOG.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,9 @@
11
## Change Log
22

3+
### 2.0.3 (2016/06/01 13:45 +00:00)
4+
- [#112](https://github.com/wwayne/react-tooltip/pull/112) Add custom event to hide tooltip (@wwayne)
5+
- [#103](https://github.com/wwayne/react-tooltip/pull/103) Allow user to specify separate off event for the tooltip (@ondy1985)
6+
37
### 2.0.2 (2016/05/19 10:01 +00:00)
48
- [#104](https://github.com/wwayne/react-tooltip/pull/104) Ensure data-html is converted to bool type (@antoniodgonzalez)
59

README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@ Check example: [React-tooltip Test](http://wwayne.com/react-tooltip)
5151
type | data-type | String | success, warning, error, info, light | tooltip's color theme
5252
effect | data-effect | String | float, solid | either float or pinned
5353
event | data-event | String | e.g. click | custom event to trigger tooltip
54+
eventOff | data-event-off | String | e.g. click | custom event to hide tooltip
5455
isCapture | data-iscapture | Bool | true, false | when set to ture, custom event's propagation mode will be capture, default is false, `<p data-tip="tooltip" data-event='click' data-iscapture='true'></p>` or `<ReactTooltip isCapture={true} />` |
5556
offset | data-offset | Object | top, right, bottom, left | `data-offset="{'top': 10, 'left': 10}"` for specific and `offset={{top: 10, left: 10}}` for global
5657
multiline | data-multiline | Bool | true, false | support `<br>`, `<br />` to make multiline

dist/react-tooltip.js

Lines changed: 19 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,7 @@ var ReactTooltip = function (_Component) {
101101
delayHide: 0,
102102
delayShow: 0,
103103
event: props.event || null,
104+
eventOff: props.eventOff || null,
104105
isCapture: props.isCapture || false
105106
};
106107
_this.delayShowLoop = null;
@@ -170,15 +171,23 @@ var ReactTooltip = function (_Component) {
170171
value: function bindListener() {
171172
var targetArray = this.getTargetArray();
172173

173-
var dataEvent = void 0;
174+
var dataEvent = undefined;
175+
var dataEventOff = undefined;
174176
for (var i = 0; i < targetArray.length; i++) {
175177
if (targetArray[i].getAttribute('currentItem') === null) {
176178
targetArray[i].setAttribute('currentItem', 'false');
177179
}
178180
dataEvent = this.state.event || targetArray[i].getAttribute('data-event');
179181
if (dataEvent) {
182+
// if off event is specified, we will show tip on data-event and hide it on data-event-off
183+
dataEventOff = this.state.eventOff || targetArray[i].getAttribute('data-event-off');
184+
180185
targetArray[i].removeEventListener(dataEvent, this.checkStatus);
181186
targetArray[i].addEventListener(dataEvent, this.checkStatus, false);
187+
if (dataEventOff) {
188+
targetArray[i].removeEventListener(dataEventOff, this.hideTooltip);
189+
targetArray[i].addEventListener(dataEventOff, this.hideTooltip, false);
190+
}
182191
} else {
183192
targetArray[i].removeEventListener('mouseenter', this.showTooltip);
184193
targetArray[i].addEventListener('mouseenter', this.showTooltip, false);
@@ -197,7 +206,7 @@ var ReactTooltip = function (_Component) {
197206
key: 'unbindListener',
198207
value: function unbindListener() {
199208
var targetArray = document.querySelectorAll('[data-tip]');
200-
var dataEvent = void 0;
209+
var dataEvent = undefined;
201210

202211
for (var i = 0; i < targetArray.length; i++) {
203212
dataEvent = this.state.event || targetArray[i].getAttribute('data-event');
@@ -220,7 +229,7 @@ var ReactTooltip = function (_Component) {
220229
value: function getTargetArray() {
221230
var id = this.props.id;
222231

223-
var targetArray = void 0;
232+
var targetArray = undefined;
224233

225234
if (id === undefined) {
226235
targetArray = document.querySelectorAll('[data-tip]:not([data-for])');
@@ -269,7 +278,7 @@ var ReactTooltip = function (_Component) {
269278
value: function checkStatus(e) {
270279
var show = this.state.show;
271280

272-
var isCapture = void 0;
281+
var isCapture = undefined;
273282

274283
if (e.currentTarget.getAttribute('data-iscapture')) {
275284
isCapture = e.currentTarget.getAttribute('data-iscapture') === 'true';
@@ -320,7 +329,7 @@ var ReactTooltip = function (_Component) {
320329
/* Detect multiline */
321330
var regexp = /<br\s*\/?>/;
322331
var multiline = e.currentTarget.getAttribute('data-multiline') ? e.currentTarget.getAttribute('data-multiline') : this.props.multiline ? this.props.multiline : false;
323-
var tooltipText = void 0;
332+
var tooltipText = undefined;
324333
var multilineCount = 0;
325334
if (!multiline || multiline === 'false' || !regexp.test(originTooltip)) {
326335
tooltipText = originTooltip;
@@ -455,8 +464,8 @@ var ReactTooltip = function (_Component) {
455464
var targetHeight = currentTarget.clientHeight;
456465
var windoWidth = window.innerWidth;
457466
var windowHeight = window.innerHeight;
458-
var x = void 0;
459-
var y = void 0;
467+
var x = undefined;
468+
var y = undefined;
460469
var defaultTopY = targetTop - tipHeight - 8;
461470
var defaultBottomY = targetTop + targetHeight + 8;
462471
var defaultLeftX = targetLeft - tipWidth - 6;
@@ -744,8 +753,8 @@ var ReactTooltip = function (_Component) {
744753
}
745754
firstCount++;
746755
}
747-
for (var _i = string.length - 1; _i >= 0; _i--) {
748-
if (string[_i] !== ' ') {
756+
for (var i = string.length - 1; i >= 0; i--) {
757+
if (string[i] !== ' ') {
749758
break;
750759
}
751760
lastCount++;
@@ -773,6 +782,7 @@ ReactTooltip.propTypes = {
773782
delayHide: _react.PropTypes.number,
774783
delayShow: _react.PropTypes.number,
775784
event: _react.PropTypes.any,
785+
eventOff: _react.PropTypes.any,
776786
watchWindow: _react.PropTypes.bool,
777787
isCapture: _react.PropTypes.bool
778788
};

dist/react-tooltip.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-tooltip",
3-
"version": "2.0.2",
3+
"version": "2.0.3",
44
"description": "react tooltip component",
55
"main": "index.js",
66
"scripts": {

src/index.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,7 @@ class ReactTooltip extends Component {
6868
delayHide: 0,
6969
delayShow: 0,
7070
event: props.event || null,
71+
eventOff: props.eventOff || null,
7172
isCapture: props.isCapture || false
7273
}
7374
this.delayShowLoop = null
@@ -118,14 +119,22 @@ class ReactTooltip extends Component {
118119
let targetArray = this.getTargetArray()
119120

120121
let dataEvent
122+
let dataEventOff
121123
for (let i = 0; i < targetArray.length; i++) {
122124
if (targetArray[i].getAttribute('currentItem') === null) {
123125
targetArray[i].setAttribute('currentItem', 'false')
124126
}
125127
dataEvent = this.state.event || targetArray[i].getAttribute('data-event')
126128
if (dataEvent) {
129+
// if off event is specified, we will show tip on data-event and hide it on data-event-off
130+
dataEventOff = this.state.eventOff || targetArray[i].getAttribute('data-event-off')
131+
127132
targetArray[i].removeEventListener(dataEvent, this.checkStatus)
128133
targetArray[i].addEventListener(dataEvent, this.checkStatus, false)
134+
if (dataEventOff) {
135+
targetArray[i].removeEventListener(dataEventOff, this.hideTooltip)
136+
targetArray[i].addEventListener(dataEventOff, this.hideTooltip, false)
137+
}
129138
} else {
130139
targetArray[i].removeEventListener('mouseenter', this.showTooltip)
131140
targetArray[i].addEventListener('mouseenter', this.showTooltip, false)
@@ -664,6 +673,7 @@ ReactTooltip.propTypes = {
664673
delayHide: PropTypes.number,
665674
delayShow: PropTypes.number,
666675
event: PropTypes.any,
676+
eventOff: PropTypes.any,
667677
watchWindow: PropTypes.bool,
668678
isCapture: PropTypes.bool
669679
}

standalone/react-tooltip.js

Lines changed: 50 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,47 @@
11
(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.ReactTooltip = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
22
/*!
3-
Copyright (c) 2016 Jed Watson.
3+
Copyright (c) 2015 Jed Watson.
44
Licensed under the MIT License (MIT), see
55
http://jedwatson.github.io/classnames
66
*/
7-
/* global define */
87

9-
(function () {
10-
'use strict';
8+
function classNames() {
9+
var classes = '';
10+
var arg;
1111

12-
var hasOwn = {}.hasOwnProperty;
13-
14-
function classNames () {
15-
var classes = [];
16-
17-
for (var i = 0; i < arguments.length; i++) {
18-
var arg = arguments[i];
19-
if (!arg) continue;
20-
21-
var argType = typeof arg;
12+
for (var i = 0; i < arguments.length; i++) {
13+
arg = arguments[i];
14+
if (!arg) {
15+
continue;
16+
}
2217

23-
if (argType === 'string' || argType === 'number') {
24-
classes.push(arg);
25-
} else if (Array.isArray(arg)) {
26-
classes.push(classNames.apply(null, arg));
27-
} else if (argType === 'object') {
28-
for (var key in arg) {
29-
if (hasOwn.call(arg, key) && arg[key]) {
30-
classes.push(key);
31-
}
18+
if ('string' === typeof arg || 'number' === typeof arg) {
19+
classes += ' ' + arg;
20+
} else if (Object.prototype.toString.call(arg) === '[object Array]') {
21+
classes += ' ' + classNames.apply(null, arg);
22+
} else if ('object' === typeof arg) {
23+
for (var key in arg) {
24+
if (!arg.hasOwnProperty(key) || !arg[key]) {
25+
continue;
3226
}
27+
classes += ' ' + key;
3328
}
3429
}
35-
36-
return classes.join(' ');
3730
}
31+
return classes.substr(1);
32+
}
3833

39-
if (typeof module !== 'undefined' && module.exports) {
40-
module.exports = classNames;
41-
} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {
42-
// register as 'classnames', consistent with npm package name
43-
define('classnames', [], function () {
44-
return classNames;
45-
});
46-
} else {
47-
window.classNames = classNames;
48-
}
49-
}());
34+
// safely export classNames for node / browserify
35+
if (typeof module !== 'undefined' && module.exports) {
36+
module.exports = classNames;
37+
}
38+
39+
// safely export classNames for RequireJS
40+
if (typeof define !== 'undefined' && define.amd) {
41+
define('classnames', [], function() {
42+
return classNames;
43+
});
44+
}
5045

5146
},{}],2:[function(require,module,exports){
5247
(function (global){
@@ -153,6 +148,7 @@ var ReactTooltip = function (_Component) {
153148
delayHide: 0,
154149
delayShow: 0,
155150
event: props.event || null,
151+
eventOff: props.eventOff || null,
156152
isCapture: props.isCapture || false
157153
};
158154
_this.delayShowLoop = null;
@@ -222,15 +218,23 @@ var ReactTooltip = function (_Component) {
222218
value: function bindListener() {
223219
var targetArray = this.getTargetArray();
224220

225-
var dataEvent = void 0;
221+
var dataEvent = undefined;
222+
var dataEventOff = undefined;
226223
for (var i = 0; i < targetArray.length; i++) {
227224
if (targetArray[i].getAttribute('currentItem') === null) {
228225
targetArray[i].setAttribute('currentItem', 'false');
229226
}
230227
dataEvent = this.state.event || targetArray[i].getAttribute('data-event');
231228
if (dataEvent) {
229+
// if off event is specified, we will show tip on data-event and hide it on data-event-off
230+
dataEventOff = this.state.eventOff || targetArray[i].getAttribute('data-event-off');
231+
232232
targetArray[i].removeEventListener(dataEvent, this.checkStatus);
233233
targetArray[i].addEventListener(dataEvent, this.checkStatus, false);
234+
if (dataEventOff) {
235+
targetArray[i].removeEventListener(dataEventOff, this.hideTooltip);
236+
targetArray[i].addEventListener(dataEventOff, this.hideTooltip, false);
237+
}
234238
} else {
235239
targetArray[i].removeEventListener('mouseenter', this.showTooltip);
236240
targetArray[i].addEventListener('mouseenter', this.showTooltip, false);
@@ -249,7 +253,7 @@ var ReactTooltip = function (_Component) {
249253
key: 'unbindListener',
250254
value: function unbindListener() {
251255
var targetArray = document.querySelectorAll('[data-tip]');
252-
var dataEvent = void 0;
256+
var dataEvent = undefined;
253257

254258
for (var i = 0; i < targetArray.length; i++) {
255259
dataEvent = this.state.event || targetArray[i].getAttribute('data-event');
@@ -272,7 +276,7 @@ var ReactTooltip = function (_Component) {
272276
value: function getTargetArray() {
273277
var id = this.props.id;
274278

275-
var targetArray = void 0;
279+
var targetArray = undefined;
276280

277281
if (id === undefined) {
278282
targetArray = document.querySelectorAll('[data-tip]:not([data-for])');
@@ -321,7 +325,7 @@ var ReactTooltip = function (_Component) {
321325
value: function checkStatus(e) {
322326
var show = this.state.show;
323327

324-
var isCapture = void 0;
328+
var isCapture = undefined;
325329

326330
if (e.currentTarget.getAttribute('data-iscapture')) {
327331
isCapture = e.currentTarget.getAttribute('data-iscapture') === 'true';
@@ -372,7 +376,7 @@ var ReactTooltip = function (_Component) {
372376
/* Detect multiline */
373377
var regexp = /<br\s*\/?>/;
374378
var multiline = e.currentTarget.getAttribute('data-multiline') ? e.currentTarget.getAttribute('data-multiline') : this.props.multiline ? this.props.multiline : false;
375-
var tooltipText = void 0;
379+
var tooltipText = undefined;
376380
var multilineCount = 0;
377381
if (!multiline || multiline === 'false' || !regexp.test(originTooltip)) {
378382
tooltipText = originTooltip;
@@ -507,8 +511,8 @@ var ReactTooltip = function (_Component) {
507511
var targetHeight = currentTarget.clientHeight;
508512
var windoWidth = window.innerWidth;
509513
var windowHeight = window.innerHeight;
510-
var x = void 0;
511-
var y = void 0;
514+
var x = undefined;
515+
var y = undefined;
512516
var defaultTopY = targetTop - tipHeight - 8;
513517
var defaultBottomY = targetTop + targetHeight + 8;
514518
var defaultLeftX = targetLeft - tipWidth - 6;
@@ -780,8 +784,8 @@ var ReactTooltip = function (_Component) {
780784
}
781785
firstCount++;
782786
}
783-
for (var _i = string.length - 1; _i >= 0; _i--) {
784-
if (string[_i] !== ' ') {
787+
for (var i = string.length - 1; i >= 0; i--) {
788+
if (string[i] !== ' ') {
785789
break;
786790
}
787791
lastCount++;
@@ -809,6 +813,7 @@ ReactTooltip.propTypes = {
809813
delayHide: _react.PropTypes.number,
810814
delayShow: _react.PropTypes.number,
811815
event: _react.PropTypes.any,
816+
eventOff: _react.PropTypes.any,
812817
watchWindow: _react.PropTypes.bool,
813818
isCapture: _react.PropTypes.bool
814819
};

standalone/react-tooltip.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)