@clayui/tooltip 3.75.2 → 3.78.0

package/lib/useClosestTitle.js

@@ -0,0 +1,138 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useClosestTitle = useClosestTitle;
+
+var _react = require("react");
+
+/**
+ * SPDX-FileCopyrightText: © 2019 Liferay, Inc. <https://liferay.com>
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+function matches(element, selectorString) {
+  if (element.matches) {
+    return element.matches(selectorString);
+  } else if (element.msMatchesSelector) {
+    return element.msMatchesSelector(selectorString);
+  } else if (element.webkitMatchesSelector) {
+    return element.webkitMatchesSelector(selectorString);
+  } else {
+    return false;
+  }
+}
+
+function closestAncestor(node, s) {
+  var element = node;
+  var ancestor = node;
+
+  if (!document.documentElement.contains(element)) {
+    return null;
+  }
+
+  do {
+    if (matches(ancestor, s)) {
+      return ancestor;
+    }
+
+    ancestor = ancestor.parentElement;
+  } while (ancestor !== null);
+
+  return null;
+}
+
+function useClosestTitle(props) {
+  var targetRef = (0, _react.useRef)(null);
+  var titleNodeRef = (0, _react.useRef)(null);
+  var saveTitle = (0, _react.useCallback)(function (element) {
+    titleNodeRef.current = element;
+    var title = element.getAttribute('title');
+
+    if (title) {
+      element.setAttribute('data-restore-title', title);
+      element.removeAttribute('title');
+    } else if (element.tagName === 'svg') {
+      var titleTag = element.querySelector('title');
+
+      if (titleTag) {
+        element.setAttribute('data-restore-title', titleTag.innerHTML);
+        titleTag.remove();
+      }
+    }
+  }, []);
+  var restoreTitle = (0, _react.useCallback)(function () {
+    var element = titleNodeRef.current;
+
+    if (element) {
+      var title = element.getAttribute('data-restore-title');
+
+      if (title) {
+        if (element.tagName === 'svg') {
+          var titleTag = document.createElement('title');
+          titleTag.innerHTML = title;
+          element.appendChild(titleTag);
+        } else {
+          element.setAttribute('title', title);
+        }
+
+        element.removeAttribute('data-restore-title');
+      }
+
+      titleNodeRef.current = null;
+    }
+  }, []);
+  var onClick = (0, _react.useCallback)(function (event) {
+    props.onClick(); // eslint-disable-next-line @typescript-eslint/no-use-before-define
+
+    onHide(event);
+  }, []);
+  var onHide = (0, _react.useCallback)(function (event) {
+    var _props$tooltipRef$cur, _targetRef$current;
+
+    if (event && ((_props$tooltipRef$cur = props.tooltipRef.current) !== null && _props$tooltipRef$cur !== void 0 && _props$tooltipRef$cur.contains(event.relatedTarget) || (_targetRef$current = targetRef.current) !== null && _targetRef$current !== void 0 && _targetRef$current.contains(event.relatedTarget))) {
+      return null;
+    }
+
+    props.onHide();
+    restoreTitle();
+
+    if (targetRef.current) {
+      targetRef.current.removeEventListener('click', onClick);
+      targetRef.current = null;
+    }
+  }, []);
+  var getProps = (0, _react.useCallback)(function (event) {
+    if (targetRef.current) {
+      props.onClick();
+
+      if (onHide(event) === null) {
+        return;
+      }
+    }
+
+    var target = event.target;
+    var hasTitle = target && (target.hasAttribute('[title]') || target.hasAttribute('[data-title]'));
+    var node = hasTitle ? target : closestAncestor(target, '[title], [data-title]');
+
+    if (node) {
+      targetRef.current = target;
+      target.addEventListener('click', onClick);
+      var title = node.getAttribute('title') || node.getAttribute('data-title') || '';
+      saveTitle(node);
+      return {
+        align: node.getAttribute('data-tooltip-align'),
+        delay: node.getAttribute('data-tooltip-delay'),
+        floating: Boolean(node.getAttribute('data-tooltip-floating')),
+        setAsHTML: !!node.getAttribute('data-title-set-as-html'),
+        title: title
+      };
+    }
+  }, []);
+  return {
+    getProps: getProps,
+    onHide: onHide,
+    target: targetRef,
+    titleNode: titleNodeRef
+  };
+}

package/lib/useTooltipState.d.ts

@@ -0,0 +1,13 @@
+/**
+ * SPDX-FileCopyrightText: © 2019 Liferay, Inc. <https://liferay.com>
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+declare type Props = {
+    delay?: number;
+};
+export declare function useTooltipState({ delay }: Props): {
+    close: () => void;
+    isOpen: boolean;
+    open: (immediate: boolean, customDelay?: number) => void;
+};
+export {};

package/lib/useTooltipState.js

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTooltipState = useTooltipState;
+
+var _react = require("react");
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function useTooltipState(_ref) {
+  var _ref$delay = _ref.delay,
+      delay = _ref$delay === void 0 ? 600 : _ref$delay;
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      isOpen = _useState2[0],
+      setOpen = _useState2[1];
+
+  var timeoutIdRef = (0, _react.useRef)();
+  var open = (0, _react.useCallback)(function (immediate, customDelay) {
+    if (!immediate) {
+      clearTimeout(timeoutIdRef.current);
+      timeoutIdRef.current = setTimeout(function () {
+        setOpen(true);
+      }, customDelay !== undefined ? customDelay : delay);
+    } else {
+      setOpen(true);
+    }
+  }, []);
+  var close = (0, _react.useCallback)(function () {
+    clearTimeout(timeoutIdRef.current);
+    setOpen(false);
+  }, []);
+  return {
+    close: close,
+    isOpen: isOpen,
+    open: open
+  };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@clayui/tooltip",
-	"version": "3.75.2",
+	"version": "3.78.0",
 	"description": "ClayTooltip component",
 	"license": "BSD-3-Clause",
 	"repository": "https://github.com/liferay/clay",
@@ -26,7 +26,7 @@
 		"react"
 	],
 	"dependencies": {
-		"@clayui/shared": "^3.75.2",
+		"@clayui/shared": "^3.78.0",
 		"classnames": "^2.2.6",
 		"dom-align": "^1.12.2",
 		"warning": "^4.0.3"
@@ -39,5 +39,5 @@
 	"browserslist": [
 		"extends browserslist-config-clay"
 	],
-	"gitHead": "2b0e308f458bab6c8e4aca763d34197e7bd69cb1"
+	"gitHead": "128788059d168c956b392363054933db34c67cab"
 }