Skip to content

[Feature]: Request: Add More Data Table Examples to Improve Beginner-Friendliness (Inspired by Nuxt UI / PrimeVue) #1353

@InfernalAzazel

Description

@InfernalAzazel

Describe the feature

  • First of all, thank you for the great work on shadcn-vue 🙏. The project is elegant, modern, and well-structured.

However, after reviewing the shadcn-vue Data Table documentation, I noticed that the examples are currently very limited, especially when compared to more established libraries like PrimeVue’s DataTable.

Key Example Gaps (shadcn-vue vs PrimeVue)

PrimeVue offers dozens of real-world scenarios that make it extremely beginner-friendly, including:
• ✅ Client-side & server-side pagination and sorting
• ✅ Column filtering and global search
• ✅ Custom cell templates
• ✅ Selection modes (single, multiple, checkbox)
• ✅ Expandable rows
• ✅ Inline cell/row editing
• ✅ Row grouping
• ✅ Virtual scrolling and lazy loading
• ✅ Integration with dialog actions (e.g., edit/delete in a modal)

In contrast, shadcn-vue currently includes only one basic example of a data table, and lacks:
• ❌ Pagination (client or server)
• ❌ Filtering or searching
• ❌ Action columns (edit/delete)
• ❌ Row selection (checkboxes, radio, etc.)
• ❌ Integration with modals, forms, or dialogs
• ❌ Advanced customization (grouping, expandable rows, etc.)

Suggestions
1. Add multiple usage examples showing how to integrate common features like sorting, pagination, row actions, selection, filtering, etc.
2. Group examples by complexity level, e.g., basic usage, API integration, advanced customization.
3. Consider adopting a structure similar to PrimeVue’s documentation: one page showcasing all features with working code snippets.
4. Provide a live preview or playground where users can test and modify the examples interactively.

Having these improvements would make shadcn-vue much more accessible for newcomers and increase adoption in production projects.

Thanks again for your efforts — really looking forward to future updates!

Additional information

  • I intend to submit a PR for this feature.
  • I have already implemented and/or tested this feature.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions