type(NavigationMenu): fix resultable template 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<any>) {
+async function onSubmit(event: FormSubmitEvent<typeof state>) {
   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<any>) {
+async function onSubmit(event: FormSubmitEvent<Schema>) {
   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<any>) {
+async function onSubmit(event: FormSubmitEvent<typeof schema>) {
   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<any>) {
+async function onSubmit(event: FormSubmitEvent<Schema>) {
   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<any>) {
+async function onSubmit(event: FormSubmitEvent<Schema>) {
   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<any>) {
+async function onSubmit(event: FormSubmitEvent<typeof state>) {
   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<any>) {
+async function submit(event: FormSubmitEvent<Schema>) {
   activating.value = true
   errorMessage.value = ''
   successMessage.value = ''

docs/content/showcase.yml

@@ -15,6 +15,8 @@ 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/NavigationMenu.vue

@@ -184,13 +184,7 @@ 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 }>({
-  props: {
-    item: Object,
-    index: Number,
-    level: Number
-  }
-})
+const [DefineItemTemplate, ReuseItemTemplate] = createReusableTemplate<{ item: NavigationMenuItem, index: number, level?: number }>()
 
 const ui = computed(() => navigationMenu({
   orientation: props.orientation,

src/runtime/components/Tree.vue

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