From 6a16b999991f246eafc44bfc6945d388b68f1812 Mon Sep 17 00:00:00 2001 From: WK Wong Date: Fri, 10 Jan 2025 20:40:31 +0800 Subject: [PATCH 1/2] fix(tooltip): accessing element.ref was removed in React 19 issue --- .changeset/great-feet-lay.md | 5 +++++ packages/components/tooltip/src/tooltip.tsx | 6 +++++- 2 files changed, 10 insertions(+), 1 deletion(-) create mode 100644 .changeset/great-feet-lay.md diff --git a/.changeset/great-feet-lay.md b/.changeset/great-feet-lay.md new file mode 100644 index 0000000000..a76e81d991 --- /dev/null +++ b/.changeset/great-feet-lay.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/tooltip": patch +--- + +fix "Accessing element.ref was removed in React 19" issue (#4526) diff --git a/packages/components/tooltip/src/tooltip.tsx b/packages/components/tooltip/src/tooltip.tsx index e014eb8944..feda666bca 100644 --- a/packages/components/tooltip/src/tooltip.tsx +++ b/packages/components/tooltip/src/tooltip.tsx @@ -48,7 +48,11 @@ const Tooltip = forwardRef<"div", TooltipProps>((props, ref) => { ref?: React.Ref; }; - trigger = cloneElement(child, getTriggerProps(child.props, child.ref)); + // Accessing the ref from props, else fallback to element.ref + // https://github.com/facebook/react/pull/28348 + const childRef = child.props.ref ?? (child as any).ref; + + trigger = cloneElement(child, getTriggerProps(child.props, childRef)); } } catch (error) { trigger = ; From f1d6d436743da8ac2a3f01e4ac025a2102203bab Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D5=A1=D3=84=D5=A1?= Date: Sat, 18 Jan 2025 21:02:48 +0800 Subject: [PATCH 2/2] chore(changeset): update package name --- .changeset/great-feet-lay.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/great-feet-lay.md b/.changeset/great-feet-lay.md index a76e81d991..986a4113f5 100644 --- a/.changeset/great-feet-lay.md +++ b/.changeset/great-feet-lay.md @@ -1,5 +1,5 @@ --- -"@nextui-org/tooltip": patch +"@heroui/tooltip": patch --- fix "Accessing element.ref was removed in React 19" issue (#4526)