All components: Improve type support

[septatrix]

Describe the feature you would like to see added

Vue 3.3 introduced generic components. Using these, it is now possible to provide precise, high-quality types for props, events and slots with generic parameters. (For props this was already possible though quite cumbersome.)

Is your feature request related to a problem?

It is frustrating to deal with untyped or insufficiently typed components in an application. In such cases autocompletion stops working leading to worse DX but also, and for the resulting product more important, it is no longer possible to check correctness of the code.

This is most often the case when working with events, slots and complex components like data tables.

Describe the solution you'd like

It would be great if this project could utilize the new generic capabilities from Vue 3.3. It is possible to use this within .d.ts files, however, in the long term it will likely be beneficial to consider moving to typescript which would automate a lot of this stuff and can also be used for automatic and precise API/documentation generation.

Describe alternatives you have considered

Not adding generic support: This is the status quo which comes with drawbacks in DX and type safety.

Additional context

Vue 3.3 announcement blog post: https://blog.vuejs.org/posts/vue-3-3#script-setup-typescript-dx-improvements

---

I am not sure if/how this can be applied to the current API for data tables where columns are their own component. Other components already have support for typed column definitions as they are passed to the table component and can thus be typed together with knowledge of the passed values. (This is also possible with earlier Vue versions though a bit more convoluted). As the table and columns are different components in primevue I am not sure if this can be supported without API changes.

Regardless, it would still be possible to offer this support for other components.

[m3hari]

@tugcekucukoglu @cagataycivici

What do you think about this request? It will really improve DX, we are struggling with slots type-safety in our project.

I can do PR if you give a green light

[cwdx]

+1 for DataTable/DataView generics support

// DataTable.vue
<script setup lang="ts" generic="T">
defineProps<{
  rows: T[]
}>()
</script>

<!-- MyComponent.vue -->
 <DataTable
    :value="rows"
/>

[louia]

Any news on this ? @tugcekucukoglu @cagataycivici

[hotip]

Any news?

[SakuraBurst]

Any news?

[some-user123]

I only can second/support this issue. It's such a pain, that all type information is lost when passing my data of type T[] into the data table as value. v-model:selection is typed any but should rather be T[]. And when the same data is accessed in templates via #body="{ data }"> , data is unfortunately any again 😔 Which is really a pain... I had many errors that typescript would have been able to catch early.

[TheFinn15]

Any news? Because its really pain when need to use data from slots and this components expect props any[] 💀

[jumika]

Any news?

[LeaderbotX400]

This whole repository is full of a lot of things that seem to break types. I'm currently just trying to do the 'Timeline' (as its relatively simple) and I can't get anything to type properly.

Perhaps some kind of migration to composition rather than options would fix it? though that's no small feat.

[LeaderbotX400]

If anyone is interested, I've started to work on this here

[tugcekucukoglu]

If you share your work with us, you will significantly contribute to open source. PrimeVue also needs contributions from the community. PRs are always welcome.

https://primevue.org/contribution/

[p-kuen]

I would also be happy to contribute improving types. Although it is not easy because the whole codebase uses Options API. Any plans to switch to composition api? It is the standard for Vue 3.