diff --git a/.trellis/tasks/archive/2026-03/03-26-list-table-v2-mini-table/prd.md b/.trellis/tasks/archive/2026-03/03-26-list-table-v2-mini-table/prd.md new file mode 100644 index 0000000..fe4de41 --- /dev/null +++ b/.trellis/tasks/archive/2026-03/03-26-list-table-v2-mini-table/prd.md @@ -0,0 +1,32 @@ +# list-table-v2 Hidden Mini Table for Row Height + +## Goal +Replace the current probe row approach with a hidden mini table that uses flex boxes (not el-table-v2) to measure row height without causing visual flickering during resize/scroll. + +## Requirements +1. Render a hidden container with 3-5 sample rows using pure flex boxes +2. Width must respond to viewport changes (use container queries or width percentage) +3. Row height from mini table used as `estimatedRowHeight` for el-table-v2 +4. No window resize event listeners - use container-based sizing +5. No visual flickering during resize or scroll + +## Approach +Instead of using a single hidden probe row that gets measured repeatedly on resize: +- Create a mini hidden div that mimics the table's cell layout +- The mini table's width is tied to its container (no explicit resize listener needed) +- CSS-based layout that automatically reflows with container width +- Use ResizeObserver ONLY on the mini table container (not window) + +## Technical Notes +- Use `display: flex; flex-direction: column;` for row structure +- Each "row" is a flex container with same padding/styling as actual table cells +- Use `container-type: inline-size` CSS for container queries (or simple width: 100%) +- ResizeObserver on the mini table wrapper to detect width changes +- Only re-measure when width actually changes (debounced) + +## Acceptance Criteria +- [ ] No flickering when resizing window +- [ ] No flickering when scrolling +- [ ] Row height updates correctly when container width changes (column flex distribution changes) +- [ ] Hidden mini table doesn't affect layout or cause scrollbar issues +- [ ] Build passes without errors diff --git a/.trellis/tasks/archive/2026-03/03-26-list-table-v2-mini-table/task.json b/.trellis/tasks/archive/2026-03/03-26-list-table-v2-mini-table/task.json new file mode 100644 index 0000000..bd2cfd7 --- /dev/null +++ b/.trellis/tasks/archive/2026-03/03-26-list-table-v2-mini-table/task.json @@ -0,0 +1,44 @@ +{ + "id": "list-table-v2-mini-table", + "name": "list-table-v2-mini-table", + "title": "list-table-v2 hidden mini table for row height", + "description": "", + "status": "completed", + "dev_type": null, + "scope": null, + "priority": "P2", + "creator": "hechang27-sprt", + "assignee": "hechang27-sprt", + "createdAt": "2026-03-26", + "completedAt": "2026-03-26", + "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": {} +} \ No newline at end of file