From 7c3ce5c4f68b6e68911da092f06dc72d10176e34 Mon Sep 17 00:00:00 2001 From: Jordan Pittman Date: Wed, 17 Jul 2024 12:21:30 -0400 Subject: [PATCH] Ensure ref are forwarded when freezing data --- packages/@headlessui-react/src/internal/frozen.tsx | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/packages/@headlessui-react/src/internal/frozen.tsx b/packages/@headlessui-react/src/internal/frozen.tsx index 6deffe31b5..5ab73174a3 100644 --- a/packages/@headlessui-react/src/internal/frozen.tsx +++ b/packages/@headlessui-react/src/internal/frozen.tsx @@ -1,10 +1,20 @@ -import React, { useState } from 'react' +import React, { cloneElement, isValidElement, useState } from 'react' -export function Frozen({ children, freeze }: { children: React.ReactNode; freeze: boolean }) { +function FrozenFn( + { children, freeze }: { children: React.ReactNode; freeze: boolean }, + ref: React.ForwardedRef +) { let contents = useFrozenData(freeze, children) + + if (isValidElement(contents)) { + return cloneElement(contents as React.ReactElement, { ref }) + } + return <>{contents} } +export const Frozen = React.forwardRef(FrozenFn) + export function useFrozenData(freeze: boolean, data: T) { let [frozenValue, setFrozenValue] = useState(data)