Ensure that you can use Transition Child components in more scenario's

[RobinMalfait]

When you are using the implicit variants of the components, for example
when you are using a Transition component inside a Menu component then
it might look weird in Vue.

The Vue code could look like this:

<Menu>
  <TransitionRoot>
    <MenuItems>...</MenuItems>
  </TransitionRoot>
<Menu>

However, TransitionRoot doesn't make much sense here because it sits
in the middle of 2 components, and it is also not controlled by an
explicit show prop.

This commit will allows you to use a TransitionChild instead (in fact,
both work).

We basically now do a few things, when you are using a TransitionChild:

• Do we have a parent TransitionRoot? Yes -> Use it
• Do we have an open closed state? Yes -> Render a TransitionRoot in
  between behind the scenes.
• Throw the error we were throwing before!

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployments, click below or on the icon next to each commit.

headlessui-react – ./packages/@headlessui-react

🔍 Inspect: https://vercel.com/tailwindlabs/headlessui-react/VMbLRXpTY5qsyjCUxw41T3ahdNdV
✅ Preview: https://headlessui-rea-git-improve-transitions-with-open-closed-3e3744.vercel.app

headlessui-vue – ./packages/@headlessui-vue

🔍 Inspect: https://vercel.com/tailwindlabs/headlessui-vue/4Y5bm3R8g4mjwZaCSmxYd7BnpkVq
✅ Preview: https://headlessui-vue-git-improve-transitions-with-open-closed-df1893.vercel.app