diff --git a/.changeset/beige-readers-relate.md b/.changeset/beige-readers-relate.md new file mode 100644 index 000000000..7b753f6d8 --- /dev/null +++ b/.changeset/beige-readers-relate.md @@ -0,0 +1,5 @@ +--- +"@cube-dev/ui-kit": patch +--- + +Fix tooltip condition in ItemBase. diff --git a/.changeset/khaki-kids-care.md b/.changeset/khaki-kids-care.md new file mode 100644 index 000000000..a483bb3ef --- /dev/null +++ b/.changeset/khaki-kids-care.md @@ -0,0 +1,5 @@ +--- +"@cube-dev/ui-kit": patch +--- + +Allow to rewrite the tooltip title in ItemBase. diff --git a/src/components/content/ItemBase/ItemBase.tsx b/src/components/content/ItemBase/ItemBase.tsx index a677cdb5c..9df119342 100644 --- a/src/components/content/ItemBase/ItemBase.tsx +++ b/src/components/content/ItemBase/ItemBase.tsx @@ -53,11 +53,7 @@ import { Styles, tasty, } from '../../../tasty'; -import { - mergeProps, - useCombinedRefs, - useLayoutEffect, -} from '../../../utils/react'; +import { mergeProps, useCombinedRefs } from '../../../utils/react'; import { CubeTooltipProviderProps, TooltipProvider, @@ -491,10 +487,10 @@ const ItemBase = ( // Determine if auto tooltip is enabled const isAutoTooltipEnabled = useMemo(() => { - if (tooltip === true) return true; + if (tooltip === true && typeof children === 'string') return true; if (typeof tooltip === 'object' && tooltip?.auto) return true; return false; - }, [tooltip]); + }, [tooltip, typeof children]); // Track label overflow for auto tooltip (only when enabled) const mergedLabelRef = useCombinedRefs((labelProps as any)?.ref); @@ -519,7 +515,7 @@ const ItemBase = ( }, [children, isAutoTooltipEnabled, checkLabelOverflow]); useEffect(() => { - if (!isAutoTooltipEnabled || typeof children !== 'string') return; + if (!isAutoTooltipEnabled) return; const label = mergedLabelRef.current; if (!label) return; @@ -614,7 +610,7 @@ const ItemBase = ( return ( {itemElement}