From fd4669fbf77544886c74d6a9d6d9142217c955bb Mon Sep 17 00:00:00 2001
From: Dany Castillo <31006608+dcastil@users.noreply.github.com>
Date: Fri, 29 Oct 2021 11:27:03 +0200
Subject: [PATCH] Rely on `initial` state of Transition component (#882)

The `useId` hook causes a re-render in TransitionChild immediately after mount which triggers a transition by `initial` being false in the second re-render regardless of how `appear` was set.
---
 .../src/components/transitions/transition.tsx               | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/@headlessui-react/src/components/transitions/transition.tsx b/packages/@headlessui-react/src/components/transitions/transition.tsx
index 266b9160c4..c3446f3caf 100644
--- a/packages/@headlessui-react/src/components/transitions/transition.tsx
+++ b/packages/@headlessui-react/src/components/transitions/transition.tsx
@@ -36,6 +36,7 @@ function useSplitClasses(classes: string = '') {
 interface TransitionContextValues {
   show: boolean
   appear: boolean
+  initial: boolean
 }
 let TransitionContext = createContext<TransitionContextValues | null>(null)
 TransitionContext.displayName = 'TransitionContext'
@@ -213,10 +214,9 @@ function TransitionChild<TTag extends ElementType = typeof DEFAULT_TRANSITION_CH
   let [state, setState] = useState(TreeStates.Visible)
   let strategy = rest.unmount ? RenderStrategy.Unmount : RenderStrategy.Hidden
 
-  let { show, appear } = useTransitionContext()
+  let { show, appear, initial } = useTransitionContext()
   let { register, unregister } = useParentNesting()
 
-  let initial = useIsInitialRender()
   let id = useId()
 
   let isTransitioning = useRef(false)
@@ -371,7 +371,7 @@ export function Transition<TTag extends ElementType = typeof DEFAULT_TRANSITION_
 
   let initial = useIsInitialRender()
   let transitionBag = useMemo<TransitionContextValues>(
-    () => ({ show: show as boolean, appear: appear || !initial }),
+    () => ({ show: show as boolean, appear: appear || !initial, initial }),
     [show, appear, initial]
   )