# 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