feat(plan): create generic Checklist component and refactor Todo (#17741)

packages/cli/src/ui/components/__snapshots__/Checklist.test.tsx.snap

@@ -0,0 +1,21 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`<Checklist /> > renders expanded view correctly 1`] = `
+"────────────────────────────────────────────────────────────────────────────────────────────────────
+ Test List  1/3 completed (toggle me)
+
+ ✓ Task 1
+ » Task 2
+ ☐ Task 3
+ ✗ Task 4"
+`;
+
+exports[`<Checklist /> > renders summary view correctly (collapsed) 1`] = `
+"────────────────────────────────────────────────────────────────────────────────────────────────────
+ Test List  1/3 completed (toggle me) » Task 2"
+`;
+
+exports[`<Checklist /> > renders summary view without in-progress item if none exists 1`] = `
+"────────────────────────────────────────────────────────────────────────────────────────────────────
+ Test List  1/2 completed"
+`;

packages/cli/src/ui/components/__snapshots__/ChecklistItem.test.tsx.snap

@@ -0,0 +1,17 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`<ChecklistItem /> > renders { status: 'cancelled', label: 'Skipped this' } item correctly 1`] = `"✗ Skipped this"`;
+
+exports[`<ChecklistItem /> > renders { status: 'completed', label: 'Done this' } item correctly 1`] = `"✓ Done this"`;
+
+exports[`<ChecklistItem /> > renders { status: 'in_progress', label: 'Doing this' } item correctly 1`] = `"» Doing this"`;
+
+exports[`<ChecklistItem /> > renders { status: 'pending', label: 'Do this' } item correctly 1`] = `"☐ Do this"`;
+
+exports[`<ChecklistItem /> > truncates long text when wrap="truncate" 1`] = `"» This is a very long text th…"`;
+
+exports[`<ChecklistItem /> > wraps long text by default 1`] = `
+"» This is a very long text
+  that should wrap because the
+  default behavior is wrapping"
+`;