fix(Form): conflict on submit event type

docs/app/components/content/examples/form/FormExampleBasic.vue

@@ -14,7 +14,7 @@ const validate = (state: any): FormError[] => {
 }
 
 const toast = useToast()
-async function onSubmit(event: FormSubmitEvent<typeof state>) {
+async function onSubmit(event: FormSubmitEvent<any>) {
   toast.add({ title: 'Success', description: 'The form has been submitted.', color: 'success' })
   console.log(event.data)
 }

docs/app/components/content/examples/form/FormExampleElements.vue

@@ -47,7 +47,7 @@ const items = [
 ]
 
 const toast = useToast()
-async function onSubmit(event: FormSubmitEvent<Schema>) {
+async function onSubmit(event: FormSubmitEvent<any>) {
   toast.add({ title: 'Success', description: 'The form has been submitted.', color: 'success' })
   console.log(event.data)
 }

docs/app/components/content/examples/form/FormExampleJoi.vue

@@ -15,7 +15,7 @@ const state = reactive({
 })
 
 const toast = useToast()
-async function onSubmit(event: FormSubmitEvent<typeof schema>) {
+async function onSubmit(event: FormSubmitEvent<any>) {
   toast.add({ title: 'Success', description: 'The form has been submitted.', color: 'success' })
   console.log(event.data)
 }

docs/app/components/content/examples/form/FormExampleNested.vue

@@ -18,7 +18,7 @@ type NestedSchema = z.output<typeof nestedSchema>
 const state = reactive<Partial<Schema & NestedSchema>>({ })
 
 const toast = useToast()
-async function onSubmit(event: FormSubmitEvent<Schema>) {
+async function onSubmit(event: FormSubmitEvent<any>) {
   toast.add({ title: 'Success', description: 'The form has been submitted.', color: 'success' })
   console.log(event.data)
 }

docs/app/components/content/examples/form/FormExampleNestedList.vue

@@ -34,7 +34,7 @@ function removeItem() {
 
 const toast = useToast()
 
-async function onSubmit(event: FormSubmitEvent<Schema>) {
+async function onSubmit(event: FormSubmitEvent<any>) {
   toast.add({ title: 'Success', description: 'The form has been submitted.', color: 'success' })
   console.log(event.data)
 }

docs/app/components/content/examples/form/FormExampleOnError.vue

@@ -14,7 +14,7 @@ const validate = (state: any): FormError[] => {
 }
 
 const toast = useToast()
-async function onSubmit(event: FormSubmitEvent<typeof state>) {
+async function onSubmit(event: FormSubmitEvent<any>) {
   toast.add({ title: 'Success', description: 'The form has been submitted.', color: 'success' })
   console.log(event.data)
 }

docs/app/pages/pro/activate.vue

@@ -33,7 +33,7 @@ const activating = ref(false)
 const successMessage = ref()
 const errorMessage = ref('')
 
-async function submit(event: FormSubmitEvent<Schema>) {
+async function submit(event: FormSubmitEvent<any>) {
   activating.value = true
   errorMessage.value = ''
   successMessage.value = ''

docs/content/showcase.yml

@@ -15,8 +15,6 @@ items:
     url: https://www.juno.one/
   - name: Kassebil
     url: https://kassebil.dk/
-  - name: LearnVue
-    url: https://learnvue.co/
   - name: Mawrble
     url: https://mawrble.com/
   - name: Meet Sponsors

src/runtime/components/Form.vue

@@ -43,8 +43,7 @@ export interface FormProps<T extends object> {
   onSubmit?: ((event: FormSubmitEvent<T>) => void | Promise<void>) | (() => void | Promise<void>)
 }
 
-export interface FormEmits<T extends object> {
-  (e: 'submit', payload: FormSubmitEvent<T>): void
+export interface FormEmits {
   (e: 'error', payload: FormErrorEvent): void
 }
 
@@ -68,7 +67,7 @@ const props = withDefaults(defineProps<FormProps<T>>(), {
   transform: true
 })
 
-const emits = defineEmits<FormEmits<T>>()
+const emits = defineEmits()
 defineSlots<FormSlots>()
 
 const formId = props.id ?? useId() as string

src/runtime/components/NavigationMenu.vue

@@ -184,7 +184,13 @@ const contentProps = toRef(() => props.content)
 const appConfig = useAppConfig()
 
 const [DefineLinkTemplate, ReuseLinkTemplate] = createReusableTemplate<{ item: NavigationMenuItem, index: number, active?: boolean }>()
-const [DefineItemTemplate, ReuseItemTemplate] = createReusableTemplate<{ item: NavigationMenuItem, index: number, level?: number }>()
+const [DefineItemTemplate, ReuseItemTemplate] = createReusableTemplate<{ item: NavigationMenuItem, index: number, level?: number }>({
+  props: {
+    item: Object,
+    index: Number,
+    level: Number
+  }
+})
 
 const ui = computed(() => navigationMenu({
   orientation: props.orientation,

src/runtime/components/Tree.vue

@@ -112,6 +112,7 @@ export type TreeSlots<
 
 <script setup lang="ts" generic="T extends TreeItem[], VK extends GetItemKeys<T> = 'value', M extends boolean = false">
 import { computed } from 'vue'
+import type { PropType } from 'vue'
 import { TreeRoot, TreeItem, useForwardPropsEmits } from 'reka-ui'
 import { reactivePick, createReusableTemplate } from '@vueuse/core'
 import { get } from '../utils'
@@ -126,14 +127,22 @@ const slots = defineSlots<TreeSlots<T>>()
 
 const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'modelValue', 'defaultValue', 'items', 'multiple', 'expanded', 'disabled', 'propagateSelect'), emits)
 
-const [DefineTreeTemplate, ReuseTreeTemplate] = createReusableTemplate<{ items?: TreeItem[], level: number }, TreeSlots<T>>()
+const [DefineTreeTemplate, ReuseTreeTemplate] = createReusableTemplate<
+  { items?: NestedItem<T>[], level: number },
+  TreeSlots<T>
+>({
+  props: {
+    items: Array as PropType<NestedItem<T>[]>,
+    level: Number
+  }
+})
 
 const ui = computed(() => tree({
   color: props.color,
   size: props.size
 }))
 
-function getItemLabel<Item extends TreeItem = NestedItem<T>>(item: Item): string {
+function getItemLabel(item: NestedItem<T>): string {
   return get(item, props.labelKey as string)
 }
 
@@ -200,7 +209,7 @@ const defaultExpanded = computed(() =>
         </button>
 
         <ul v-if="item.children?.length && isExpanded" :class="ui.listWithChildren({ class: props.ui?.listWithChildren })">
-          <ReuseTreeTemplate :items="item.children" :level="level + 1" />
+          <ReuseTreeTemplate :items="(item.children as NestedItem<T>[])" :level="level + 1" />
         </ul>
       </TreeItem>
     </li>
@@ -213,6 +222,6 @@ const defaultExpanded = computed(() =>
     :default-expanded="defaultExpanded"
     :selection-behavior="selectionBehavior"
   >
-    <ReuseTreeTemplate :items="items" :level="0" />
+    <ReuseTreeTemplate :items="(items as NestedItem<T>[] | undefined)" :level="0" />
   </TreeRoot>
 </template>