[Bug]: Transition applied on content instead of Disclosure panel

What package within Headless UI are you using?

@headlessui/react

What version of that package are you using?

v1.4.2

What browser are you using?

Chrome (Tested on Edge and Firefox)

Reproduction URL

https://codesandbox.io/s/headlessui-disclosure-transition-issue-6ogxj?file=/src/App.tsx

Describe your issue

When i use Transition component on Disclosure Panel, the transition is applied on content of panel instead of panel himself. I tried to use only documentation exemple, outside my project, but the exemple on documentation was already broken 🤔

(Note: I have volontarily increase the duration of transition to expect the beahavor) (Note 2: I tried to use unmount prop already, but seems to component was systematicaly unmounted regardless this prop)

[hodbn]

Another workaround is to use the Disclosure component but manage its state manually using static, and then transition the height (or max-height to workaround the transition to auto):

<Disclosure>
  {({ open }) => (
    <>
      <Disclosure.Button>button</Disclosure.Button>
      <Transition
        show={open}
        className='overflow-hidden'
        enter='transition transition-[max-height] duration-200 ease-in'
        enterFrom='transform max-h-0'
        enterTo='transform max-h-screen'
        leave='transition transition-[max-height] duration-400 ease-out'
        leaveFrom='transform max-h-screen'
        leaveTo='transform max-h-0'
      >
        <Disclosure.Panel static>content</Disclosure.Panel>
      </Transition>
    </>
  )}
</Disclosure>

[benderillo]

@RobinMalfait What about the behaviour I described in my comment? the sandbox example you provided also shows it. When you expand the Disclosure, the panel appears instantly, or at least everything shifts down instantly and the contents emerge from 0 opacity gradually (based on transition time function and duration). This produces ugly jump of a page content below the disclosure which the Transition meant to avoid at the first place.