Support type generics for component typings

[AlexandreBonaventure]

What problem does this feature solve?

I don't know if there is already a way to handle type generics for component typings but if not it could be a nice addition. The benefit would be improved typings overall when it comes to generic components, especially when you use emits options and later with the use type-aware template devtool (in IDEs)

Use-case:
Let's say I have a component to list items:
Right now I can do this

<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
  props: {
    items: {
      type: Array as () => unknown[],
      required: true,
    },
  },
  emits: {
    click: (item: unknown) => {
      // type is lost :(
    },
  },
  setup (props, { emit }) {
    
  },
}));
</script>

<template>
<ul>
    <li v-for="item in items" @click="emit('clickItem', item)">{{ item.name }}</li>
</ul>
</template>

What does the proposed API look like?

With generics support it could be like that :

<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent(<T extends []>() => ({
  props: {
    items: {
      type: Array as () => T,
      required: true,
    },
  },
  emits: {
    click: (item: T) => {
      // perform runtime validation
    },
  },
  setup (props, { emit }) {
    const set = computed(() => new Set<T>(props.items))
  },
}));
</script>

<template>
<ul>
    <li v-for="item in items" @click="emit('clickItem', item)">{{ item.name }}</li>
</ul>
</template>

[HcySunYang]

Close this one because it is inactive and is a duplicate of #3102, we can track this in #3102 because it provides a repro and is more active.