feat(FN-1470): implement ScreenRouter with tab bar and keyboard navigation

- Add ScreenRouter component for multi-screen navigation in TUI
- Implement tab bar with icon labels and active state indicators
- Support keyboard navigation with arrow keys and Tab/Shift+Tab
- Add mouse click support for tab selection
- Export new screen router components from package index
- Add comprehensive unit tests for navigation behavior
- Update documentation with architecture and gap analysis
- Update TUI README with ScreenRouter usage examples
This commit is contained in:
gsxdsm
2026-04-09 20:59:00 -07:00
parent 10d7842018
commit 00e04c2d05
8 changed files with 551 additions and 19 deletions

View File

@@ -16,7 +16,7 @@ At a high level, Fusion is split into:
- **Dashboard API + SPA** (`@fusion/dashboard`)
- **CLI + Pi extension** (`@gsxdsm/fusion`)
- **Desktop shell** (`@fusion/desktop`)
- **TUI stub** (`@fusion/tui`)
- **TUI** (`@fusion/tui`)
### High-level runtime diagram
@@ -64,7 +64,7 @@ At a high level, Fusion is split into:
| `@fusion/dashboard` | Private | Express API server + React app | `packages/dashboard/src/server.ts`, `routes.ts`, `sse.ts`, `websocket.ts`, `packages/dashboard/app/App.tsx` |
| `@gsxdsm/fusion` | **Published** | CLI binary (`fn`) + Pi extension | `packages/cli/src/bin.ts`, `commands/*`, `project-resolver.ts`, `extension.ts` |
| `@fusion/desktop` | Private | Electron shell around Fusion dashboard/client | `packages/desktop/src/main.ts`, `ipc.ts`, `preload.ts`, `scripts/build.ts` |
| `@fusion/tui` | Private | Ink-based terminal package (currently minimal stub) | `packages/tui/src/index.tsx` |
| `@fusion/tui` | Private | Ink-based terminal package with ScreenRouter and tab navigation | `packages/tui/src/index.tsx`, `packages/tui/src/components/screen-router.tsx` |
> Note: The workspace also contains `@fusion/mobile` (`packages/mobile`), which packages dashboard assets for Capacitor targets.
@@ -97,7 +97,7 @@ At a high level, Fusion is split into:
│ (embeds dashboard client) │
└──────────────────────────────┘
@fusion/tui is currently independent/minimal.
@fusion/tui provides keyboard-navigable screen routing.
```
Concrete references: