Carousel - Improve items prop typing

[vitebo]

Environment

---

• Operating System: Darwin
• Node Version: v20.14.0
• Nuxt Version: 3.11.2
• CLI Version: 3.11.1
• Nitro Version: 2.9.6
• Package Manager: [email protected]
• Builder: -
• User Config: -
• Runtime Modules: -
• Build Modules: -

---

Version

v2.18.4

Reproduction

https://stackblitz.com/edit/nuxt-ui-efufxa?file=app.vue

Description

Currently, the items prop in the carousel component is typed as any:

The issue with typing items as any is that when using v-slot="{ item }", the item will always be typed as any. This can make for a poor developer experience, especially when working with more complex item structures, such as creating a carousel of offer cards.

I believe we can improve this by utilizing Vue's generics:

We could define the generic in the script:

<script lang="ts" generic="Item">

And then use the generic in the prop definition:

items: {
  type: Array as PropType<Item[]>,
  default: () => []
},

If this change makes sense, I’d be happy to help by submitting a PR.

Additional context

No response

Logs

No response

[benjamincanac]

Closing in favor of #2142. All components in v3 are implement with generics by default 😊