react-tooltip 5.9.1-beta.0 → 5.10.0-beta.0

package/dist/react-tooltip.esm.js

@@ -100,13 +100,6 @@ var debounce = (func, wait, immediate) => {
 };
 var debounce_default = debounce;
 
-// src/components/TooltipContent/TooltipContent.tsx
-import { jsx } from "react/jsx-runtime";
-var TooltipContent = ({ content }) => {
-  return /* @__PURE__ */ jsx("span", { dangerouslySetInnerHTML: { __html: content } });
-};
-var TooltipContent_default = TooltipContent;
-
 // src/components/TooltipProvider/TooltipProvider.tsx
 import {
   createContext,
@@ -115,7 +108,7 @@ import {
   useMemo,
   useState
 } from "react";
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 var DEFAULT_TOOLTIP_ID = "DEFAULT_TOOLTIP_ID";
 var DEFAULT_CONTEXT_DATA = {
   anchorRefs: /* @__PURE__ */ new Set(),
@@ -183,7 +176,7 @@ var TooltipProvider = ({ children }) => {
       getTooltipData
     };
   }, [getTooltipData]);
-  return /* @__PURE__ */ jsx2(TooltipContext.Provider, { value: context, children });
+  return /* @__PURE__ */ jsx(TooltipContext.Provider, { value: context, children });
 };
 function useTooltip(tooltipId = DEFAULT_TOOLTIP_ID) {
   return useContext(TooltipContext).getTooltipData(tooltipId);
@@ -193,7 +186,7 @@ var TooltipProvider_default = TooltipProvider;
 // src/components/TooltipProvider/TooltipWrapper.tsx
 var import_classnames = __toESM(require_classnames());
 import { useEffect, useRef } from "react";
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { jsx as jsx2 } from "react/jsx-runtime";
 var TooltipWrapper = ({
   tooltipId,
   children,
@@ -217,7 +210,7 @@ var TooltipWrapper = ({
       detach(anchorRef);
     };
   }, []);
-  return /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx2(
     "span",
     {
       ref: anchorRef,
@@ -709,7 +702,7 @@ var computeTooltipPosition = async ({
 var styles_module_default = { "arrow": "react-tooltip__arrow_KtSkBq", "clickable": "react-tooltip__clickable_KtSkBq", "dark": "react-tooltip__dark_KtSkBq", "error": "react-tooltip__error_KtSkBq", "fixed": "react-tooltip__fixed_KtSkBq", "info": "react-tooltip__info_KtSkBq", "light": "react-tooltip__light_KtSkBq", "noArrow": "react-tooltip__no-arrow_KtSkBq", "show": "react-tooltip__show_KtSkBq", "success": "react-tooltip__success_KtSkBq", "tooltip": "react-tooltip__tooltip_KtSkBq", "warning": "react-tooltip__warning_KtSkBq" };
 
 // src/components/Tooltip/Tooltip.tsx
-import { jsx as jsx4, jsxs } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs } from "react/jsx-runtime";
 var Tooltip = ({
   // props
   id,
@@ -724,7 +717,6 @@ var Tooltip = ({
   positionStrategy = "absolute",
   middlewares,
   wrapper: WrapperElement,
-  children = null,
   delayShow = 0,
   delayHide = 0,
   float = false,
@@ -737,7 +729,6 @@ var Tooltip = ({
   afterHide,
   // props handled by controller
   content,
-  html,
   isOpen,
   setIsOpen,
   activeAnchor,
@@ -1096,7 +1087,7 @@ var Tooltip = ({
       }
       setActualPlacement(computedStylesData.place);
     });
-  }, [show, activeAnchor, content, html, place, offset, positionStrategy, position]);
+  }, [show, activeAnchor, content, place, offset, positionStrategy, position]);
   useEffect3(() => {
     var _a;
     const anchorById = document.querySelector(`[id='${anchorId}']`);
@@ -1130,27 +1121,29 @@ var Tooltip = ({
       setAnchorsBySelect([]);
     }
   }, [id, anchorSelect]);
-  const hasContentOrChildren = Boolean(html || content || children);
-  const canShow = hasContentOrChildren && show && Object.keys(inlineStyles).length > 0;
+  const canShow = content && show && Object.keys(inlineStyles).length > 0;
   return rendered ? /* @__PURE__ */ jsxs(
     WrapperElement,
     {
       id,
       role: "tooltip",
-      className: (0, import_classnames2.default)("react-tooltip", styles_module_default["tooltip"], styles_module_default[variant], className, {
-        [styles_module_default["show"]]: canShow,
-        [styles_module_default["fixed"]]: positionStrategy === "fixed",
-        [styles_module_default["clickable"]]: clickable,
-        "react-tooltip__place-top": actualPlacement === "top",
-        "react-tooltip__place-right": actualPlacement === "right",
-        "react-tooltip__place-bottom": actualPlacement === "bottom",
-        "react-tooltip__place-left": actualPlacement === "left"
-      }),
+      className: (0, import_classnames2.default)(
+        "react-tooltip",
+        styles_module_default["tooltip"],
+        styles_module_default[variant],
+        className,
+        `react-tooltip__place-${actualPlacement}`,
+        {
+          [styles_module_default["show"]]: canShow,
+          [styles_module_default["fixed"]]: positionStrategy === "fixed",
+          [styles_module_default["clickable"]]: clickable
+        }
+      ),
       style: { ...externalStyles, ...inlineStyles },
       ref: tooltipRef,
       children: [
-        html && /* @__PURE__ */ jsx4(TooltipContent_default, { content: html }) || content || children,
-        /* @__PURE__ */ jsx4(
+        content,
+        /* @__PURE__ */ jsx3(
           WrapperElement,
           {
             className: (0, import_classnames2.default)("react-tooltip-arrow", styles_module_default["arrow"], classNameArrow, {
@@ -1170,6 +1163,13 @@ var Tooltip = ({
 };
 var Tooltip_default = Tooltip;
 
+// src/components/TooltipContent/TooltipContent.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var TooltipContent = ({ content }) => {
+  return /* @__PURE__ */ jsx4("span", { dangerouslySetInnerHTML: { __html: content } });
+};
+var TooltipContent_default = TooltipContent;
+
 // src/components/TooltipController/TooltipController.tsx
 import { jsx as jsx5 } from "react/jsx-runtime";
 var TooltipController = ({
@@ -1178,6 +1178,7 @@ var TooltipController = ({
   anchorSelect,
   content,
   html,
+  render,
   className,
   classNameArrow,
   variant = "dark",
@@ -1325,14 +1326,22 @@ var TooltipController = ({
       observer.disconnect();
     };
   }, [anchorRefs, providerActiveAnchor, activeAnchor, anchorId, anchorSelect]);
+  let renderedContent = children;
+  if (render) {
+    renderedContent = render({ content: tooltipContent != null ? tooltipContent : null, activeAnchor });
+  } else if (tooltipContent) {
+    renderedContent = tooltipContent;
+  }
+  if (tooltipHtml) {
+    renderedContent = /* @__PURE__ */ jsx5(TooltipContent_default, { content: tooltipHtml });
+  }
   const props = {
     id,
     anchorId,
     anchorSelect,
     className,
     classNameArrow,
-    content: tooltipContent,
-    html: tooltipHtml,
+    content: renderedContent,
     place: tooltipPlace,
     variant: tooltipVariant,
     offset: tooltipOffset,
@@ -1355,7 +1364,7 @@ var TooltipController = ({
     activeAnchor,
     setActiveAnchor: (anchor) => setActiveAnchor(anchor)
   };
-  return children ? /* @__PURE__ */ jsx5(Tooltip_default, { ...props, children }) : /* @__PURE__ */ jsx5(Tooltip_default, { ...props });
+  return /* @__PURE__ */ jsx5(Tooltip_default, { ...props });
 };
 var TooltipController_default = TooltipController;
 export {