From f48bb4659e4223a158577918aa789cb5fa11cf83 Mon Sep 17 00:00:00 2001
From: Jordan Pittman <jordan@cryptica.me>
Date: Thu, 27 Jan 2022 18:39:18 -0500
Subject: [PATCH] Fix circular component types

---
 .../src/components/dialog/dialog.test.ts              | 11 +++++++++--
 .../src/components/transitions/transition.ts          |  6 +++++-
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/packages/@headlessui-vue/src/components/dialog/dialog.test.ts b/packages/@headlessui-vue/src/components/dialog/dialog.test.ts
index a54a50f..2eedd73 100644
--- a/packages/@headlessui-vue/src/components/dialog/dialog.test.ts
+++ b/packages/@headlessui-vue/src/components/dialog/dialog.test.ts
@@ -1,4 +1,11 @@
-import { defineComponent, ref, nextTick, h, ComponentOptionsWithoutProps } from 'vue'
+import {
+  defineComponent,
+  ref,
+  nextTick,
+  h,
+  ComponentOptionsWithoutProps,
+  ConcreteComponent,
+} from 'vue'
 import { render } from '../../test-utils/vue-testing-library'
 
 import { Dialog, DialogOverlay, DialogTitle, DialogDescription } from './dialog'
@@ -931,7 +938,7 @@ describe('Mouse interactions', () => {
 })
 
 describe('Nesting', () => {
-  let Nested = defineComponent({
+  let Nested: ConcreteComponent = defineComponent({
     components: { Dialog, DialogOverlay },
     emits: ['close'],
     props: ['level'],
diff --git a/packages/@headlessui-vue/src/components/transitions/transition.ts b/packages/@headlessui-vue/src/components/transitions/transition.ts
index cdf4500..87748dc 100644
--- a/packages/@headlessui-vue/src/components/transitions/transition.ts
+++ b/packages/@headlessui-vue/src/components/transitions/transition.ts
@@ -13,6 +13,7 @@ import {
   // Types
   InjectionKey,
   Ref,
+  ConcreteComponent,
 } from 'vue'
 
 import { useId } from '../../hooks/use-id'
@@ -341,6 +342,9 @@ export let TransitionChild = defineComponent({
 
 // ---
 
+// This exists to work around typescript circular inference problem
+let _TransitionChild = TransitionChild as ConcreteComponent
+
 export let TransitionRoot = defineComponent({
   inheritAttrs: false,
   props: {
@@ -423,7 +427,7 @@ export let TransitionRoot = defineComponent({
           ...slots,
           default: () => [
             h(
-              TransitionChild,
+              _TransitionChild,
               {
                 onBeforeEnter: () => emit('beforeEnter'),
                 onAfterEnter: () => emit('afterEnter'),