@clayui/tooltip - npm Package Compare versions

Comparing version 3.0.1 to 3.0.2

lib/TooltipProvider.js

@@ -8,4 +8,6 @@ "use strict";
 
-var _Tooltip = _interopRequireDefault(require("./Tooltip"));
+var _shared = require("@clayui/shared");
 
+var _metalPosition = require("metal-position");
+
 var _react = _interopRequireWildcard(require("react"));
@@ -15,10 +17,8 @@
 
-var _metalPosition = require("metal-position");
+var _Tooltip = _interopRequireDefault(require("./Tooltip"));
 
-var _shared = require("@clayui/shared");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
@@ -81,2 +81,21 @@
 
+function closestAncestor(node, s) {
+  var el = node;
+  var ancestor = node;
+
+  if (!document.documentElement.contains(el)) {
+    return null;
+  }
+
+  do {
+    if (ancestor.matches(s)) {
+      return ancestor;
+    }
+
+    ancestor = ancestor.parentElement;
+  } while (ancestor !== null);
+
+  return null;
+}
+
 var TooltipBase = function TooltipBase(_ref2) {
@@ -95,6 +114,8 @@ var _ref2$autoAlign = _ref2.autoAlign,
       show = _useReducer2$.show,
-      dispatch = _useReducer2[1];
+      dispatch = _useReducer2[1]; // Using `any` type since TS incorrectly infers setTimeout to be from NodeJS
 
+
   var timeoutIdRef = (0, _react.useRef)();
   var targetRef = (0, _react.useRef)(null);
+  var titleNodeRef = (0, _react.useRef)(null);
   var tooltipRef = (0, _react.useRef)(null);
@@ -104,9 +125,15 @@
     var target = _ref3.target;
-    var dataTitle = target && target.getAttribute('data-title');
 
+    if (!titleNodeRef.current) {
+      return;
+    }
+
+    var dataTitle = titleNodeRef.current.getAttribute('data-title');
+
     if (dataTitle) {
+      target.removeEventListener('click', handleHide);
+      titleNodeRef.current.setAttribute('title', dataTitle);
+      titleNodeRef.current.removeAttribute('data-title');
+      titleNodeRef.current = null;
       targetRef.current = null;
-      target.removeEventListener('click', handleHide);
-      target.setAttribute('title', dataTitle);
-      target.removeAttribute('data-title');
       dispatch({
@@ -121,12 +148,15 @@ type: 'hide'
     var target = _ref4.target;
-    var title = target && target.getAttribute('title');
+    var hasTitle = target && target.hasAttribute('title');
+    var titleNode = hasTitle ? target : closestAncestor(target, '[title]');
+    var title = titleNode && titleNode.getAttribute('title');
 
     if (title) {
+      titleNodeRef.current = titleNode;
       targetRef.current = target;
       target.addEventListener('click', handleHide);
-      target.setAttribute('data-title', title);
-      target.removeAttribute('title');
-      var customDelay = target.getAttribute('data-tooltip-delay');
-      var newAlign = target.getAttribute('data-tooltip-align');
-      timeoutIdRef.current = window.setTimeout(function () {
+      titleNode.setAttribute('data-title', title);
+      titleNode.removeAttribute('title');
+      var customDelay = titleNode.getAttribute('data-tooltip-delay');
+      var newAlign = titleNode.getAttribute('data-tooltip-align');
+      timeoutIdRef.current = setTimeout(function () {
         dispatch({
@@ -142,4 +172,4 @@ align: newAlign,
   (0, _react.useEffect)(function () {
-    if (targetRef.current && tooltipRef.current) {
-      var newAlignment = ALIGNMENTS[_metalPosition.Align.align(tooltipRef.current, targetRef.current, ALIGNMENTS_MAP[align || 'top'], autoAlign)];
+    if (titleNodeRef.current && tooltipRef.current) {
+      var newAlignment = ALIGNMENTS[_metalPosition.Align.align(tooltipRef.current, titleNodeRef.current, ALIGNMENTS_MAP[align || 'top'], autoAlign)];
 
@@ -146,0 +176,0 @@ if (newAlignment !== align) {

package.json

 {
 	"name": "@clayui/tooltip",
-	"version": "3.0.1",
+	"version": "3.0.2",
 	"description": "ClayTooltip component",
@@ -29,3 +29,3 @@ "license": "BSD-3-Clause",
 	"dependencies": {
-		"@clayui/shared": "^3.0.1",
+		"@clayui/shared": "^3.0.2",
 		"classnames": "^2.2.6",
@@ -42,3 +42,4 @@ "metal-position": "^2.1.2",
 		"extends browserslist-config-clay"
-	]
+	],
+	"gitHead": "93b7745a96e45cd274ba50c4b25d4395a0c566ca"
 }

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

22393

increased by19.51%

Number of package files

15

increased by15.38%

Lines of code

500

increased by10.38%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• Updated@clayui/shared@^3.0.2