@clayui/tooltip 3.156.0 → 3.158.0

package/lib/cjs/useAlign.js

@@ -1,37 +1,58 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useAlign_exports = {};
+__export(useAlign_exports, {
+  useAlign: () => useAlign
 });
-exports.useAlign = useAlign;
-var _shared = require("@clayui/shared");
-var _domAlign = require("dom-align");
-var _react = require("react");
-/**
- * SPDX-FileCopyrightText: © 2019 Liferay, Inc. <https://liferay.com>
- * SPDX-License-Identifier: BSD-3-Clause
- */
-
-const ALIGNMENTS = ['top', 'top-right', 'right', 'bottom-right', 'bottom', 'bottom-left', 'left', 'top-left'];
+module.exports = __toCommonJS(useAlign_exports);
+var import_shared = require("@clayui/shared");
+var import_dom_align = require("dom-align");
+var import_react = require("react");
+const ALIGNMENTS = [
+  "top",
+  "top-right",
+  "right",
+  "bottom-right",
+  "bottom",
+  "bottom-left",
+  "left",
+  "top-left"
+];
 const ALIGNMENTS_MAP = {
-  bottom: ['tc', 'bc'],
-  'bottom-left': ['tl', 'bl'],
-  'bottom-right': ['tr', 'br'],
-  left: ['cr', 'cl'],
-  right: ['cl', 'cr'],
-  top: ['bc', 'tc'],
-  'top-left': ['bl', 'tl'],
-  'top-right': ['br', 'tr']
+  "bottom": ["tc", "bc"],
+  "bottom-left": ["tl", "bl"],
+  "bottom-right": ["tr", "br"],
+  "left": ["cr", "cl"],
+  "right": ["cl", "cr"],
+  "top": ["bc", "tc"],
+  "top-left": ["bl", "tl"],
+  "top-right": ["br", "tr"]
 };
 const ALIGNMENTS_INVERSE_MAP = {
-  bctc: 'top',
-  bltl: 'top-left',
-  brtr: 'top-right',
-  clcr: 'right',
-  crcl: 'left',
-  tcbc: 'bottom',
-  tlbl: 'bottom-left',
-  trbr: 'bottom-right'
+  bctc: "top",
+  bltl: "top-left",
+  brtr: "top-right",
+  clcr: "right",
+  crcl: "left",
+  tcbc: "bottom",
+  tlbl: "bottom-left",
+  trbr: "bottom-right"
 };
 const BOTTOM_OFFSET = [0, 7];
 const LEFT_OFFSET = [-7, 0];
@@ -49,38 +70,41 @@ const OFFSET_MAP = {
 };
 const ALIGNMENTS_FORCE_MAP = {
   ...ALIGNMENTS_INVERSE_MAP,
-  bctc: 'top-left',
-  tcbc: 'bottom-left'
+  bctc: "top-left",
+  tcbc: "bottom-left"
 };
-function useAlign(_ref) {
-  let {
-    align,
-    autoAlign,
-    floating,
-    isOpen,
-    onAlign,
-    sourceElement,
-    targetElement,
-    title
-  } = _ref;
-  const mousePosition = (0, _shared.useMousePosition)(20);
-  (0, _react.useEffect)(() => {
+function useAlign({
+  align,
+  autoAlign,
+  floating,
+  isOpen,
+  onAlign,
+  sourceElement,
+  targetElement,
+  title
+}) {
+  const mousePosition = (0, import_shared.useMousePosition)(20);
+  (0, import_react.useEffect)(() => {
     if (sourceElement.current && isOpen && floating) {
-      const points = ALIGNMENTS_MAP[align || 'top'];
+      const points = ALIGNMENTS_MAP[align || "top"];
       const [clientX, clientY] = mousePosition;
-      (0, _domAlign.alignPoint)(sourceElement.current, {
-        clientX,
-        clientY
-      }, {
-        offset: OFFSET_MAP[points.join('')],
-        points
-      });
+      (0, import_dom_align.alignPoint)(
+        sourceElement.current,
+        {
+          clientX,
+          clientY
+        },
+        {
+          offset: OFFSET_MAP[points.join("")],
+          points
+        }
+      );
     }
   }, [isOpen, floating]);
-  (0, _react.useEffect)(() => {
+  (0, import_react.useEffect)(() => {
     if (targetElement.current && sourceElement.current && isOpen && !floating) {
-      const points = ALIGNMENTS_MAP[align || 'top'];
-      const alignment = (0, _shared.doAlign)({
+      const points = ALIGNMENTS_MAP[align || "top"];
+      const alignment = (0, import_shared.doAlign)({
         overflow: {
           adjustX: autoAlign,
           adjustY: autoAlign
@@ -89,8 +113,10 @@ function useAlign(_ref) {
         sourceElement: sourceElement.current,
         targetElement: targetElement.current
       });
-      const alignmentString = alignment.points.join('');
-      const pointsString = points.join('');
+      const alignmentString = alignment.points.join(
+        ""
+      );
+      const pointsString = points.join("");
       if (alignment.overflow.adjustX) {
         onAlign(ALIGNMENTS_FORCE_MAP[alignmentString]);
       } else if (pointsString !== alignmentString) {
@@ -98,4 +124,4 @@ function useAlign(_ref) {
       }
     }
   }, [align, title, isOpen]);
-}
+}

package/lib/cjs/useClosestTitle.js

@@ -1,15 +1,27 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useClosestTitle_exports = {};
+__export(useClosestTitle_exports, {
+  useClosestTitle: () => useClosestTitle
 });
-exports.useClosestTitle = useClosestTitle;
-var _react = require("react");
-/**
- * SPDX-FileCopyrightText: © 2019 Liferay, Inc. <https://liferay.com>
- * SPDX-License-Identifier: BSD-3-Clause
- */
-
+module.exports = __toCommonJS(useClosestTitle_exports);
+var import_react = require("react");
 function matches(element, selectorString) {
   if (element.matches) {
     return element.matches(selectorString);
@@ -36,49 +48,50 @@ function closestAncestor(node, s) {
   return null;
 }
 function useClosestTitle(props) {
-  const targetRef = (0, _react.useRef)(null);
-  const titleNodeRef = (0, _react.useRef)(null);
-  const saveTitle = (0, _react.useCallback)(element => {
-    const title = element.getAttribute('title');
+  const targetRef = (0, import_react.useRef)(null);
+  const titleNodeRef = (0, import_react.useRef)(null);
+  const saveTitle = (0, import_react.useCallback)((element) => {
+    const title = element.getAttribute("title");
     if (title) {
-      element.setAttribute('data-restore-title', title);
-      element.removeAttribute('title');
-    } else if (element.tagName === 'svg') {
-      const titleTag = element.querySelector('title');
+      element.setAttribute("data-restore-title", title);
+      element.removeAttribute("title");
+    } else if (element.tagName === "svg") {
+      const titleTag = element.querySelector("title");
       if (titleTag) {
-        element.setAttribute('data-restore-title', titleTag.innerHTML);
+        element.setAttribute("data-restore-title", titleTag.innerHTML);
         titleTag.remove();
       }
     }
-    const hasParentTitle = element.closest('[title]');
+    const hasParentTitle = element.closest("[title]");
     if (hasParentTitle) {
       saveTitle(hasParentTitle);
     }
   }, []);
-  const restoreTitle = (0, _react.useCallback)(element => {
-    const title = element.getAttribute('data-restore-title');
+  const restoreTitle = (0, import_react.useCallback)((element) => {
+    const title = element.getAttribute("data-restore-title");
     if (title) {
-      if (element.tagName === 'svg') {
-        const titleTag = document.createElement('title');
+      if (element.tagName === "svg") {
+        const titleTag = document.createElement("title");
         titleTag.innerHTML = title;
         element.appendChild(titleTag);
       } else {
-        element.setAttribute('title', title);
+        element.setAttribute("title", title);
       }
-      element.removeAttribute('data-restore-title');
+      element.removeAttribute("data-restore-title");
     }
-    const hasParentTitle = element.closest('[data-restore-title]');
+    const hasParentTitle = element.closest(
+      "[data-restore-title]"
+    );
     if (hasParentTitle) {
       restoreTitle(hasParentTitle);
     }
   }, []);
-  const onClick = (0, _react.useCallback)(event => {
+  const onClick = (0, import_react.useCallback)((event) => {
     props.onClick();
-    // eslint-disable-next-line @typescript-eslint/no-use-before-define
     onHide(event);
   }, []);
-  const onHide = (0, _react.useCallback)(event => {
-    if (event && !event.relatedTarget?.getAttribute('title') && (props.tooltipRef.current?.contains(event.relatedTarget) || targetRef.current?.contains(event.relatedTarget))) {
+  const onHide = (0, import_react.useCallback)((event) => {
+    if (event && !event.relatedTarget?.getAttribute("title") && (props.tooltipRef.current?.contains(event.relatedTarget) || targetRef.current?.contains(event.relatedTarget))) {
       return null;
     }
     props.onHide();
@@ -87,49 +100,54 @@ function useClosestTitle(props) {
       titleNodeRef.current = null;
     }
     if (targetRef.current) {
-      targetRef.current.removeEventListener('click', onClick);
+      targetRef.current.removeEventListener("click", onClick);
       targetRef.current = null;
     }
   }, []);
-  const forceHide = (0, _react.useCallback)(() => {
+  const forceHide = (0, import_react.useCallback)(() => {
     props.forceHide();
     if (titleNodeRef.current) {
       restoreTitle(titleNodeRef.current);
       titleNodeRef.current = null;
     }
     if (targetRef.current) {
-      targetRef.current.removeEventListener('click', onClick);
+      targetRef.current.removeEventListener("click", onClick);
       targetRef.current = null;
     }
   }, []);
-  const getProps = (0, _react.useCallback)((event, hideBrowserTitle) => {
-    if (targetRef.current) {
-      props.onClick();
-      if (onHide(event) === null) {
-        return;
+  const getProps = (0, import_react.useCallback)(
+    (event, hideBrowserTitle) => {
+      if (targetRef.current) {
+        props.onClick();
+        if (onHide(event) === null) {
+          return;
+        }
       }
-    }
-    const target = event.target;
-    const hasTitle = target && (target.hasAttribute('[title]') || target.hasAttribute('[data-title]'));
-    const node = hasTitle ? target : closestAncestor(target, '[title], [data-title]');
-    const hasNonEmptyTitle = node?.getAttribute('title') !== '';
-    if (node && hasNonEmptyTitle) {
-      targetRef.current = target;
-      target.addEventListener('click', onClick);
-      const title = node.getAttribute('title') || node.getAttribute('data-title') || '';
-      titleNodeRef.current = node;
-      if (hideBrowserTitle) {
-        saveTitle(node);
+      const target = event.target;
+      const hasTitle = target && (target.hasAttribute("[title]") || target.hasAttribute("[data-title]"));
+      const node = hasTitle ? target : closestAncestor(target, "[title], [data-title]");
+      const hasNonEmptyTitle = node?.getAttribute("title") !== "";
+      if (node && hasNonEmptyTitle) {
+        targetRef.current = target;
+        target.addEventListener("click", onClick);
+        const title = node.getAttribute("title") || node.getAttribute("data-title") || "";
+        titleNodeRef.current = node;
+        if (hideBrowserTitle) {
+          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
+        };
       }
-      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
-      };
-    }
-  }, []);
+    },
+    []
+  );
   return {
     forceHide,
     getProps,
@@ -137,4 +155,4 @@ function useClosestTitle(props) {
     target: targetRef,
     titleNode: titleNodeRef
   };
-}
+}

package/lib/cjs/useTooltipState.js

@@ -1,32 +1,44 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useTooltipState_exports = {};
+__export(useTooltipState_exports, {
+  useTooltipState: () => useTooltipState
 });
-exports.useTooltipState = useTooltipState;
-var _react = require("react");
-/**
- * SPDX-FileCopyrightText: © 2019 Liferay, Inc. <https://liferay.com>
- * SPDX-License-Identifier: BSD-3-Clause
- */
-
-function useTooltipState(_ref) {
-  let {
-    delay = 600
-  } = _ref;
-  const [isOpen, setOpen] = (0, _react.useState)(false);
-  const timeoutIdRef = (0, _react.useRef)();
-  const open = (0, _react.useCallback)((immediate, customDelay) => {
+module.exports = __toCommonJS(useTooltipState_exports);
+var import_react = require("react");
+function useTooltipState({ delay = 600 }) {
+  const [isOpen, setOpen] = (0, import_react.useState)(false);
+  const timeoutIdRef = (0, import_react.useRef)();
+  const open = (0, import_react.useCallback)((immediate, customDelay) => {
     if (!immediate) {
       clearTimeout(timeoutIdRef.current);
-      timeoutIdRef.current = setTimeout(() => {
-        setOpen(true);
-      }, customDelay !== undefined ? customDelay : delay);
+      timeoutIdRef.current = setTimeout(
+        () => {
+          setOpen(true);
+        },
+        customDelay !== void 0 ? customDelay : delay
+      );
     } else {
       setOpen(true);
     }
   }, []);
-  const close = (0, _react.useCallback)(() => {
+  const close = (0, import_react.useCallback)(() => {
     clearTimeout(timeoutIdRef.current);
     setOpen(false);
   }, []);
@@ -35,4 +47,4 @@ function useTooltipState(_ref) {
     isOpen,
     open
   };
-}
+}

package/lib/esm/Tooltip.js

@@ -1,31 +1,43 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-/**
- * SPDX-FileCopyrightText: © 2019 Liferay, Inc. <https://liferay.com>
- * SPDX-License-Identifier: BSD-3-Clause
- */
-
-import classNames from 'classnames';
-import React from 'react';
-export const ALIGN_POSITIONS = ['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'right'];
-export const Tooltip = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    alignPosition = 'bottom',
+import classNames from "classnames";
+import React from "react";
+const ALIGN_POSITIONS = [
+  "top",
+  "top-left",
+  "top-right",
+  "bottom",
+  "bottom-left",
+  "bottom-right",
+  "left",
+  "right"
+];
+const Tooltip = React.forwardRef(
+  ({
+    alignPosition = "bottom",
     children,
     className,
     show,
     ...otherProps
-  } = _ref;
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: classNames(className, 'tooltip', `clay-tooltip-${alignPosition}`, {
-      show
-    }),
-    role: "tooltip"
-  }, otherProps, {
-    ref: ref
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "arrow"
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "tooltip-inner"
-  }, children));
-});
-Tooltip.displayName = 'ClayTooltip';
+  }, ref) => {
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: classNames(
+          className,
+          "tooltip",
+          `clay-tooltip-${alignPosition}`,
+          { show }
+        ),
+        role: "tooltip",
+        ...otherProps,
+        ref
+      },
+      /* @__PURE__ */ React.createElement("div", { className: "arrow" }),
+      /* @__PURE__ */ React.createElement("div", { className: "tooltip-inner" }, children)
+    );
+  }
+);
+Tooltip.displayName = "ClayTooltip";
+export {
+  ALIGN_POSITIONS,
+  Tooltip
+};