@ceed/cds 1.8.2 → 1.8.4

package/dist/index.cjs

@@ -2944,7 +2944,41 @@ var TextEllipsis = ({ children }) => {
   }, [children]);
   const content = /* @__PURE__ */ import_react25.default.createElement(EllipsisDiv, { ref: textRef }, children);
   if (showTooltip) {
-    return /* @__PURE__ */ import_react25.default.createElement(Tooltip_default, { title: children, placement: "top" }, content);
+    return /* @__PURE__ */ import_react25.default.createElement(
+      Tooltip_default,
+      {
+        title: children,
+        placement: "top",
+        onClick: (e) => e.stopPropagation()
+      },
+      content
+    );
+  }
+  return content;
+};
+var CellTextEllipsis = ({ children }) => {
+  const textRef = (0, import_react25.useRef)(null);
+  const [showTooltip, setShowTooltip] = (0, import_react25.useState)(false);
+  (0, import_react25.useLayoutEffect)(() => {
+    const element = textRef.current;
+    if (element) {
+      const isTextTruncated = element.scrollWidth > element.clientWidth;
+      setShowTooltip(isTextTruncated);
+    }
+  }, [children]);
+  const content = /* @__PURE__ */ import_react25.default.createElement(EllipsisDiv, { ref: textRef }, children);
+  if (showTooltip) {
+    return /* @__PURE__ */ import_react25.default.createElement(
+      Tooltip_default,
+      {
+        title: children,
+        placement: "top",
+        enterDelay: 1500,
+        enterNextDelay: 1500,
+        onClick: (e) => e.stopPropagation()
+      },
+      content
+    );
   }
   return content;
 };
@@ -3438,26 +3472,7 @@ var BodyCell = (props) => {
       className: isLastStartPinnedColumn && "is-last-left" || isLastEndPinnedColumn && "is-last-right" || ""
     },
     (0, import_react25.useMemo)(
-      () => showTooltip ? /* @__PURE__ */ import_react25.default.createElement(
-        Tooltip_default,
-        {
-          title: value,
-          placement: "bottom",
-          style: { maxWidth: "100%" },
-          enterDelay: 1500,
-          enterNextDelay: 1500
-        },
-        /* @__PURE__ */ import_react25.default.createElement(
-          "div",
-          {
-            style: {
-              overflow: "hidden",
-              textOverflow: "ellipsis"
-            }
-          },
-          CellComponent
-        )
-      ) : CellComponent,
+      () => showTooltip ? /* @__PURE__ */ import_react25.default.createElement(CellTextEllipsis, null, CellComponent) : CellComponent,
       [CellComponent, showTooltip, value]
     )
   );

package/dist/index.js

@@ -2912,7 +2912,41 @@ var TextEllipsis = ({ children }) => {
   }, [children]);
   const content = /* @__PURE__ */ React23.createElement(EllipsisDiv, { ref: textRef }, children);
   if (showTooltip) {
-    return /* @__PURE__ */ React23.createElement(Tooltip_default, { title: children, placement: "top" }, content);
+    return /* @__PURE__ */ React23.createElement(
+      Tooltip_default,
+      {
+        title: children,
+        placement: "top",
+        onClick: (e) => e.stopPropagation()
+      },
+      content
+    );
+  }
+  return content;
+};
+var CellTextEllipsis = ({ children }) => {
+  const textRef = useRef4(null);
+  const [showTooltip, setShowTooltip] = useState6(false);
+  useLayoutEffect(() => {
+    const element = textRef.current;
+    if (element) {
+      const isTextTruncated = element.scrollWidth > element.clientWidth;
+      setShowTooltip(isTextTruncated);
+    }
+  }, [children]);
+  const content = /* @__PURE__ */ React23.createElement(EllipsisDiv, { ref: textRef }, children);
+  if (showTooltip) {
+    return /* @__PURE__ */ React23.createElement(
+      Tooltip_default,
+      {
+        title: children,
+        placement: "top",
+        enterDelay: 1500,
+        enterNextDelay: 1500,
+        onClick: (e) => e.stopPropagation()
+      },
+      content
+    );
   }
   return content;
 };
@@ -3406,26 +3440,7 @@ var BodyCell = (props) => {
       className: isLastStartPinnedColumn && "is-last-left" || isLastEndPinnedColumn && "is-last-right" || ""
     },
     useMemo8(
-      () => showTooltip ? /* @__PURE__ */ React23.createElement(
-        Tooltip_default,
-        {
-          title: value,
-          placement: "bottom",
-          style: { maxWidth: "100%" },
-          enterDelay: 1500,
-          enterNextDelay: 1500
-        },
-        /* @__PURE__ */ React23.createElement(
-          "div",
-          {
-            style: {
-              overflow: "hidden",
-              textOverflow: "ellipsis"
-            }
-          },
-          CellComponent
-        )
-      ) : CellComponent,
+      () => showTooltip ? /* @__PURE__ */ React23.createElement(CellTextEllipsis, null, CellComponent) : CellComponent,
       [CellComponent, showTooltip, value]
     )
   );