<!---โ๏ธ PR title should follow conventional commits (https://conventionalcommits.org) -->
๐ Linked issue
Resolves #1353
โ Type of change
<!-- What types of changes does your code introduce? Put an `x` in all the boxes that apply. -->
๐ Description
This PR adds comprehensive data table examples to improve the beginner-friendliness of shadcn-vue's data table
documentation.
New Components Added:
- DataTableAdvancedPaginationDemo - Client-side pagination with enhanced controls, page size selectors, and
navigation
- DataTableAdvancedFilteringDemo - Multi-level filtering with global search, faceted filters, range
controls, and active filter management
- DataTableCrudActionsDemo - Complete CRUD operations with modal dialogs for create, edit, view, and delete
actions
- DataTableServerSideDemo - Server-side pagination, sorting, and filtering with API integration simulation
and loading states
- DataTableExpandableRowsDemo - Expandable rows with detailed nested content and complex layouts
Documentation Improvements:
- Restructured data-table.md with beginner-friendly organization
- Added complexity-based categorization (Basic โ Intermediate โ Advanced)
- Included "Quick Start" and "Getting Started Guide" sections
- Enhanced Table of Contents with clear learning paths
Features Covered:
- Client-side and server-side data handling
- Advanced pagination controls with page size selection
- Comprehensive filtering (global search, faceted filters, range sliders)
- Full CRUD operations with form validation and toast notifications
- Modal integration for detailed actions
- Row selection and bulk operations
- Expandable rows with rich content layouts
- Loading states and error handling
- Debounced search for performance optimization
While these changes pass all tests for the project, automatically generated JSON registry files were not pushed to this PR to make the changes easier to read.
๐ธ Screenshots (if appropriate)
<!-- Add screenshots to help explain the change. -->
๐ Checklist
<!-- Put an `x` in all the boxes that apply. -->
<!-- If your change requires a documentation PR, please link it appropriately -->
<!-- If you're unsure about any of these, don't hesitate to ask. We're here to help! -->