coaia-visualizer 1.6.0 → 1.6.2

package/README_TELESCOPED_NAVIGATION.md

@@ -0,0 +1,247 @@
+# 🎯 Telescoped Chart Navigation - User Guide
+
+## Quick Start
+
+### What are Telescoped Charts?
+
+In structural tension methodology, **every action step is actually a full structural tension chart** with its own:
+- Desired outcome (what you want to create)
+- Current reality (where you actually are)
+- Action steps (which are also charts)
+
+This creates an **infinite fractal structure** where you can zoom into any action and work on it as a complete chart.
+
+### Visual Indicators
+
+When viewing a master chart's actions, you'll see two types:
+
+**Regular Actions** (simple todo items):
+\`\`\`
+┌──────────────────────────┐
+│ ○ Action 1               │
+│   Do something simple    │
+└──────────────────────────┘
+\`\`\`
+
+**Telescoped Charts** (full structural tension charts):
+\`\`\`
+┌─────────────────────────────────────┐
+│ ○ Action 1  📊 Chart  [👁 Open ›] │ ← Gradient background
+│   Complex multi-step task         ▓ │ ← Colored border
+└─────────────────────────────────────┘ ← Hover for shadow
+\`\`\`
+
+Key visual differences:
+- 🎨 **Gradient background** (subtle primary color)
+- 🔲 **Colored border** (primary color, brightens on hover)
+- 📊 **"Chart" badge** (bold, with icon)
+- 👁 **"Open" button** (prominent, with icons)
+
+## How to Use
+
+### 1. Navigate Into a Telescoped Chart
+
+1. Find an action with the **"📊 Chart"** badge
+2. Click the **"👁 Open ›"** button on the right
+3. You'll navigate into that action as a full chart
+
+### 2. Work Within the Sub-Chart
+
+Once inside, you can:
+- ✏️ **Edit the desired outcome** (click the pencil icon)
+- 📝 **Edit current reality** (add observations)
+- ➕ **Add action steps** (these become Level 2 charts)
+- ✅ **Mark complete** (advances parent's current reality)
+- 📅 **Set due dates**
+- 🗑️ **Delete the chart**
+
+### 3. Navigate Deeper
+
+Any action steps you add to the sub-chart can themselves be opened as charts:
+- Add an action to a Level 1 chart → creates Level 2 chart
+- Add an action to a Level 2 chart → creates Level 3 chart
+- Continue infinitely...
+
+### 4. Navigate Back
+
+Click **"← Back to Parent Chart"** at the top to return to the previous level.
+
+The app maintains a navigation stack, so you can:
+\`\`\`
+Level 0 (Master)
+  → Level 1 (First action)
+     → Level 2 (Sub-action)
+        → Level 3 (Sub-sub-action)
+\`\`\`
+
+Press back repeatedly to climb back up the hierarchy.
+
+## Example Workflow
+
+### Creating a Multi-Level Chart
+
+**Step 1: Create Master Chart**
+\`\`\`
+Chart: "Build COAIA Feature"
+Desired Outcome: Complete feature implementation
+Current Reality: Have basic structure, need details
+\`\`\`
+
+**Step 2: Add Action Steps**
+\`\`\`
+Action 1: "Implement core logic"
+  Current Reality: "Have file structure, need methods"
+  → Creates chart_2 as Level 1
+
+Action 2: "Add UI components"
+  Current Reality: "UI design done, need implementation"
+  → Creates chart_3 as Level 1
+\`\`\`
+
+**Step 3: Navigate Into "Implement core logic"**
+
+Click **"👁 Open ›"** on Action 1
+
+Now viewing chart_2 as a full chart:
+\`\`\`
+Chart 2 (Level 1)
+Desired Outcome: Implement core logic
+Current Reality: Have file structure, need methods
+
+You can now add sub-actions:
+  Action 1: "Write parser methods"
+  Action 2: "Add validation logic"
+\`\`\`
+
+**Step 4: Navigate Deeper**
+
+Click **"👁 Open ›"** on "Write parser methods"
+
+Now viewing chart_3 (Level 2):
+\`\`\`
+Chart 3 (Level 2)
+Desired Outcome: Write parser methods
+Current Reality: Have empty functions, need implementation
+\`\`\`
+
+**Step 5: Navigate Back**
+
+- Click **"← Back"** once → returns to chart_2 (Level 1)
+- Click **"← Back"** again → returns to chart_1 (Level 0)
+
+## Design Features
+
+### Color Coding
+
+**Light Mode**:
+- Telescoped charts: Light blue/primary gradient
+- Border: Blue, brightens on hover
+- Badge: Solid blue with white text
+- Button: Blue with white icons
+
+**Dark Mode**:
+- Telescoped charts: Subtle colored gradient
+- Border: Colored, brightens on hover  
+- Badge: Solid color with dark text
+- Button: Colored with appropriate contrast
+
+### Interactive States
+
+**Hover**:
+- Border color intensifies
+- Shadow appears underneath card
+- Button shadow deepens
+
+**Focus** (keyboard navigation):
+- Visible focus ring around buttons
+- High contrast for accessibility
+
+**Completed**:
+- Muted background
+- Text has line-through
+- Can still be opened to view details
+
+## Keyboard Shortcuts
+
+- **Tab**: Navigate between actions
+- **Enter/Space**: Click focused button
+- **Shift+Tab**: Navigate backwards
+
+## Mobile Experience
+
+On mobile devices:
+- **Touch targets** are large enough for easy tapping
+- **Badge wraps** to next line if needed
+- **"Open" button** maintains size for easy access
+- **Scrolling** works smoothly through action lists
+
+## Tips & Tricks
+
+### When to Create Telescoped Charts
+
+Create a telescoped chart (action step) when:
+- ✅ The task has multiple sub-steps
+- ✅ You need to track progress on sub-components
+- ✅ The task has its own structural tension
+- ✅ You want to maintain the advancing pattern at multiple levels
+
+Use simple actions when:
+- ✅ The task is genuinely atomic
+- ✅ No sub-planning needed
+- ✅ Quick checkbox completion is sufficient
+
+### Organizing Deep Hierarchies
+
+For complex projects:
+\`\`\`
+Level 0: Project goal
+Level 1: Major features/phases
+Level 2: Specific implementation tasks
+Level 3: Detailed sub-tasks
+Level 4: Implementation details
+\`\`\`
+
+### Completing Charts at Different Levels
+
+When you mark a Level 2 action complete:
+- ✅ The Level 2 chart's desired outcome is marked complete
+- ✅ The Level 1 chart's current reality gets "Completed: {action}" added
+- ✅ This creates momentum up the hierarchy
+
+## Troubleshooting
+
+**Q: I don't see the "Open" button**
+
+A: The action might not be a telescoped chart. Only actions with the "📊 Chart" badge can be opened. Regular actions don't have this button.
+
+**Q: The "Open" button doesn't work**
+
+A: Make sure you've loaded a file with properly structured telescoped charts. The test file `feat-4-mcp-api/test-telescoped-charts.jsonl` has examples.
+
+**Q: I can't find the back button**
+
+A: The "← Back to Parent Chart" button only appears when you're viewing a sub-chart (Level 1+). It won't show on Level 0 (master) charts.
+
+**Q: How deep can I nest charts?**
+
+A: Infinitely! The system supports unlimited nesting levels (0 → 1 → 2 → 3 → ...).
+
+## Screenshots
+
+Check the `screenshots/` directory for visual examples:
+- `improved-01-actions.png`: Action list with telescoped charts
+- `improved-02-action-detail.png`: Close-up of telescoped action
+- `improved-03-after-open.png`: Sub-chart view after navigation
+
+## Related Documentation
+
+- **UI_GUIDE.md**: Detailed design specifications
+- **TELESCOPED_CHART_NAVIGATION.md**: Technical implementation
+- **IMPLEMENTATION_COMPLETE.md**: Development summary
+- **FEATURE_4_COMPLETE.md**: Full Feature 4 documentation
+
+## Support
+
+The telescoped chart navigation has been fully tested and verified with automated Playwright tests. All functionality is production-ready.
+
+**Version: 1.4.0**

package/STC.md

@@ -0,0 +1,24 @@
+
+## Activity Log Entry (2026-04-17T18:59:43Z)
+- **Bot**: @stcissue
+- **Event**: issues.opened
+- **Issue**: #17
+
+
+## Activity Log Entry (2026-05-09T18:21:47Z)
+- **Bot**: @stcissue
+- **Event**: issues.opened
+- **Issue**: #18
+
+
+## Activity Log Entry (2026-05-13T08:33:56Z)
+- **Bot**: @stcissue
+- **Event**: issues.opened
+- **Issue**: #19
+
+
+## Activity Log Entry (2026-05-19T06:53:31Z)
+- **Bot**: @stcissue
+- **Event**: issues.opened
+- **Issue**: #20
+

package/STCISSUE.md

@@ -0,0 +1,48 @@
+
+## Issue #17 - Parent chart due date not applied before adding action steps
+
+- **Repository**: jgwill/coaia-visualizer
+- **State**: open
+- **Category**: technical
+- **Logged**: 2026-04-17T18:59:43Z
+- **GitHub Link**: https://github.com/jgwill/coaia-visualizer/issues/17
+
+### Current Reality
+Issue being tracked via @stcissue bot.
+
+
+## Issue #18 - Render GitHub Project runtime-memory provenance in a non-breaking way
+
+- **Repository**: jgwill/coaia-visualizer
+- **State**: open
+- **Category**: technical
+- **Logged**: 2026-05-09T18:21:47Z
+- **GitHub Link**: https://github.com/jgwill/coaia-visualizer/issues/18
+
+### Current Reality
+Issue being tracked via @stcissue bot.
+
+
+## Issue #19 - nightly release: coaia-visualizer-mcp@1.6.0
+
+- **Repository**: jgwill/coaia-visualizer
+- **State**: open
+- **Category**: technical
+- **Logged**: 2026-05-13T08:33:56Z
+- **GitHub Link**: https://github.com/jgwill/coaia-visualizer/issues/19
+
+### Current Reality
+Issue being tracked via @stcissue bot.
+
+
+## Issue #20 - Render rich COAIA JSONL metadata with chart/action/beat projections
+
+- **Repository**: jgwill/coaia-visualizer
+- **State**: open
+- **Category**: technical
+- **Logged**: 2026-05-19T06:53:31Z
+- **GitHub Link**: https://github.com/jgwill/coaia-visualizer/issues/20
+
+### Current Reality
+Issue being tracked via @stcissue bot.
+