65 lines
1.5 KiB
Markdown
65 lines
1.5 KiB
Markdown
# Proposal: Content Patterns
|
|
|
|
## Overview
|
|
Create reusable content components for data-dense views: DataTable, FilterBar, EmptyState, and LoadingState.
|
|
|
|
## Goals
|
|
- Create DataTable component wrapping TanStack Table with DaisyUI styling
|
|
- Create FilterBar component for reusable filter patterns
|
|
- Create EmptyState component for no-data placeholders
|
|
- Create LoadingState component with skeleton patterns
|
|
|
|
## Non-Goals
|
|
- Page implementations (done in p05)
|
|
- Specific business logic
|
|
|
|
## Priority
|
|
**MEDIUM** - Reusable patterns for pages
|
|
|
|
## Scope
|
|
|
|
### DataTable Component
|
|
- Wraps @tanstack/svelte-table
|
|
- DaisyUI table styling
|
|
- Sorting support
|
|
- Pagination support
|
|
- Row selection (optional)
|
|
- Loading state
|
|
- Empty state integration
|
|
|
|
### FilterBar Component
|
|
- Search input
|
|
- Filter dropdowns
|
|
- Date range picker integration
|
|
- Clear filters button
|
|
- Slot for custom filters
|
|
|
|
### EmptyState Component
|
|
- Icon display
|
|
- Title and description
|
|
- Optional action button
|
|
- Consistent styling
|
|
|
|
### LoadingState Component
|
|
- Skeleton patterns for different content types
|
|
- Table skeleton
|
|
- Card skeleton
|
|
- Text skeleton
|
|
|
|
## Success Criteria
|
|
- [ ] DataTable created with TanStack integration
|
|
- [ ] FilterBar created with search and dropdowns
|
|
- [ ] EmptyState created with icon and action
|
|
- [ ] LoadingState created with skeletons
|
|
- [ ] All tests pass
|
|
|
|
## Estimated Effort
|
|
3-4 hours
|
|
|
|
## Dependencies
|
|
- p02-app-layout
|
|
- p03-dashboard-enhancement (can start in parallel)
|
|
|
|
## Blocks
|
|
- p05-page-migrations
|