chore(task): archive 03-28-table-v2-demo

.trellis/tasks/archive/2026-03/03-28-table-v2-demo/prd.md

@@ -0,0 +1,167 @@
+# Rework table-v2.vue into Comprehensive Demo Page
+
+## Goal
+
+Transform `examples/view/base/table-v2.vue` from a basic demo into a comprehensive, Element Plus-style documentation page that:
+1. Demonstrates every feature/prop of `list-table-v2`
+2. Doubles as automated tests verifying features work correctly and work together
+
+## What list-table-v2 Supports (Feature Inventory)
+
+### Props
+| Prop | Status | Notes |
+|------|--------|-------|
+| `columns` | ✅ | key, dataKey, name, i18n, type, width, minWidth, fixed, align, slot, dict, timestamp, filesize, cellRenderer, headerCellRenderer |
+| `data` | ✅ | Array or page response {data, total} |
+| `page` | ✅ | Pagination |
+| `border` | ✅ | Table borders |
+| `row-key` | ✅ | Row identifier |
+| `height` / `maxHeight` | ✅ | Fixed/max height |
+| `rowHeight` | ✅ | Fixed row height (disables probe) |
+| `estimatedRowHeight` | ✅ | Manual estimate for dynamic height |
+| `headerHeight` | ✅ | Manual header height |
+| `debug` | ✅ | Shows estimated heights |
+| `example` | ✅ | Pagination state {page, size} |
+
+### Events
+| Event | Status | Notes |
+|-------|--------|-------|
+| `@query` | ✅ | Pagination query |
+| `@row-click` | ✅ | Row click |
+| `@cell-click` | ✅ | Cell click |
+| `@selection-change` | ✅ | (interface exists) |
+
+### Slots
+| Slot | Status | Notes |
+|------|--------|-------|
+| `slots[columnKey]` | ✅ | Custom cell content per column |
+| `#default` | ✅ | SearchRow content |
+
+### Custom Renderers
+| Renderer | Status | Notes |
+|----------|--------|-------|
+| `cellRenderer` | ✅ | Per-column JSX function |
+| `headerCellRenderer` | ✅ | Per-column JSX function |
+
+### Auto-probe (Dynamic Height)
+| Feature | Status | Notes |
+|---------|--------|-------|
+| Mini-table probe | ✅ | Measures actual row height |
+| Header height probe | ✅ | Measures actual header height |
+| ResizeObserver | ✅ | Debounced container resize |
+| queueMicrotask | ✅ | Eliminates flicker |
+
+## Demo Sections (Patterned after Element Plus table-v2 docs)
+
+Each section is self-contained with:
+- Clear section title and description
+- Interactive demo
+- Feature validation (pass/fail indicators)
+- Code reference
+
+### Section 1: Basic Usage
+- Data binding (array and page response)
+- Column definition (key, name, i18n, dataKey)
+- Pagination
+- Row click and cell click events
+
+### Section 2: Styling
+- Borders (`border` prop)
+- Column alignment (`align: left/center/right`)
+- Column width distribution (`width`, `minWidth`, flexGrow)
+
+### Section 3: Fixed Columns
+- Fixed left column (`fixed: "left"`)
+- Fixed right column (`fixed: "right"`)
+- Multiple fixed columns
+
+### Section 4: Data Formatting
+- Timestamp formatting (`timestamp: "unix"`)
+- Dictionary lookup (`dict: "key"`)
+- File size formatting (`filesize: true`)
+- Custom formatting function
+
+### Section 5: Custom Cell Renderer
+- Simple text custom cell
+- Rich content (tags, badges)
+- Interactive content (buttons in cells)
+- Custom `cellRenderer` function per column
+- Mini-table synchronization test (CRITICAL: custom renderer must render in probe row)
+
+### Section 6: Custom Header Renderer
+- Simple text header
+- Rich header (with icons)
+- Custom `headerCellRenderer` function per column
+- Mini-table header synchronization test (CRITICAL)
+
+### Section 7: Dynamic Height
+- Auto-probe mode (no rowHeight set)
+- Manual estimate mode (`estimatedRowHeight`)
+- Fixed height mode (`rowHeight` set)
+- Debug info display
+
+### Section 8: Pagination
+- Server-side pagination with `@query`
+- Page size options
+- Total count display
+
+### Section 9: Slot-based Custom Cells
+- `slot: true` per column
+- Parent slot content rendering via `renderSlot`
+
+### Section 10: Combined Features Test
+- All features working together
+- Edge case: custom renderer + fixed columns
+- Edge case: custom renderer + pagination
+- Edge case: custom renderer + dynamic height probe
+
+## Architecture
+
+### File Structure
+```
+examples/view/base/table-v2.vue   # Main demo page
+```
+
+### Demo Organization Strategy
+Use a tabbed or sectioned layout within a single page:
+- Left sidebar with section navigation
+- Main content area with active demo
+- Each section is self-contained
+
+### Data Strategy
+- Generate realistic mock data (100 rows)
+- Each demo section can override columns/data as needed
+- Shared data generator utility within the file
+
+### Test/Validation Strategy
+Each demo section includes:
+1. Visual demo of the feature
+2. `debug` prop enabled to show internal state
+3. Event handlers that log to console AND display on-page
+4. Explicit "Test" buttons to trigger edge cases
+5. Pass/fail indicators where possible (e.g., "Did resize observer fire?")
+
+## Technical Notes
+
+### Dependencies
+- `lorem-ipsum` (already used for data generation)
+- `element-plus` components used: `el-tabs`, `el-tab-pane`, `el-link`, `el-tag`, `el-button`
+- `noob-mengyxu` components: `ListTableV2`, `SearchRow`, `NoobInput`, `NoobSelect`
+
+### Constraints
+- Must work with existing `ListTableV2` API (no code changes to the component)
+- Must build successfully with `bun run build`
+- Demo page should be readable and navigable
+
+## Acceptance Criteria
+
+- [ ] Page loads with 10+ demo sections
+- [ ] Each feature of list-table-v2 is demonstrated
+- [ ] Custom `cellRenderer` works and syncs with mini-table probe
+- [ ] Custom `headerCellRenderer` works and syncs with mini-table probe
+- [ ] Dynamic height auto-probe works correctly
+- [ ] Fixed columns work correctly
+- [ ] Pagination works correctly
+- [ ] All formatting features work (timestamp, dict, filesize)
+- [ ] Page builds without errors
+- [ ] Console has no errors during demo interaction

.trellis/tasks/archive/2026-03/03-28-table-v2-demo/task.json

@@ -0,0 +1,44 @@
+{
+  "id": "table-v2-demo",
+  "name": "table-v2-demo",
+  "title": "Rework table-v2.vue into comprehensive demo page",
+  "description": "",
+  "status": "completed",
+  "dev_type": null,
+  "scope": null,
+  "priority": "P2",
+  "creator": "hechang27-sprt",
+  "assignee": "hechang27-sprt",
+  "createdAt": "2026-03-28",
+  "completedAt": "2026-03-30",
+  "branch": null,
+  "base_branch": "dev",
+  "worktree_path": null,
+  "current_phase": 0,
+  "next_action": [
+    {
+      "phase": 1,
+      "action": "implement"
+    },
+    {
+      "phase": 2,
+      "action": "check"
+    },
+    {
+      "phase": 3,
+      "action": "finish"
+    },
+    {
+      "phase": 4,
+      "action": "create-pr"
+    }
+  ],
+  "commit": null,
+  "pr_url": null,
+  "subtasks": [],
+  "children": [],
+  "parent": null,
+  "relatedFiles": [],
+  "notes": "",
+  "meta": {}
+}