Summary
Major TUI overhaul that unifies the editing experience with consistent navigation patterns throughout. What started as a proposal to merge color editing into Edit Lines grew into a comprehensive rethink of TUI navigation.
Problem (original)
Editing a widget's color required navigating: MainMenu → Edit Colors → LineSelector → ColorMenu → (edit) → ESC × 3 → MainMenu. The "Edit Lines" and "Edit Colors" top-level split put the same objects behind different doors.
Additionally, the Rules Editor was a full-screen overlay that removed all context of the widget list. Navigation was inconsistent across screens — some wrapped, some didn't; some used ← Back menu items, some used ESC only; keybinds were case-sensitive in some screens and case-insensitive in others.
What Was Built
1. Unified Color Editing (Tab mode)
- Press Tab to switch between items mode and color mode on any widget
- Inline color editing: ←→ cycle, hex, ANSI256, bold, fg/bg toggle
- Removed separate "Edit Colors" menu entirely
- Deleted
ColorMenu.tsx and color-menu/mutations.ts
2. Accordion Rules Editor
- Press → on a widget to expand its rules inline below it
- Rules use the same interaction patterns as widgets: ↑↓ navigate, Tab for color/property mode, Enter for focus mode
- Deleted full-screen
RulesEditor.tsx overlay — replaced by accordion
- Empty rules show placeholder:
(no rules — press 'a' to add)
3. Consistent Tree Navigation
- → drills in, ← drills out at every level: LineSelector → ItemsEditor → Rules → ConditionEditor
- Enter = focus/edit mode at every level: ↑↓ reorders, ←→ edits properties
- ESC peels back one layer — never skips levels
- ↑↓ wraps at top/bottom everywhere
- Removed all "← Back" menu items — ← arrow handles back navigation
4. Polish
- Exit confirmation when unsaved changes exist
- Case-insensitive keybinds across all screens
- "Enter to edit" replaces "Enter to move" for better discoverability
- PowerlineSeparatorEditor refactored to same Enter/focus pattern
Navigation Model
| Level |
↑↓ |
→ |
← |
Enter |
Tab |
| MainMenu |
Navigate |
Select |
— |
Select |
— |
| LineSelector |
Navigate |
Enter editor |
Back |
Move mode |
— |
| Widget (items) |
Navigate |
Expand rules |
Back/collapse |
Focus (move + type) |
Color mode |
| Rule (property) |
Navigate |
Condition editor |
Collapse |
Focus (move) |
Color mode |
Implementation
All work is on the feat/unified-editing branch. See PR #261 for the full diff.
Tags for rollback points:
unified-editing-phase1 — color mode added, legacy Edit Colors still present
unified-editing-phase2 — legacy Edit Colors removed
accordion-rules-editor — accordion replaces full-screen overlay
Summary
Major TUI overhaul that unifies the editing experience with consistent navigation patterns throughout. What started as a proposal to merge color editing into Edit Lines grew into a comprehensive rethink of TUI navigation.
Problem (original)
Editing a widget's color required navigating: MainMenu → Edit Colors → LineSelector → ColorMenu → (edit) → ESC × 3 → MainMenu. The "Edit Lines" and "Edit Colors" top-level split put the same objects behind different doors.
Additionally, the Rules Editor was a full-screen overlay that removed all context of the widget list. Navigation was inconsistent across screens — some wrapped, some didn't; some used ← Back menu items, some used ESC only; keybinds were case-sensitive in some screens and case-insensitive in others.
What Was Built
1. Unified Color Editing (Tab mode)
ColorMenu.tsxandcolor-menu/mutations.ts2. Accordion Rules Editor
RulesEditor.tsxoverlay — replaced by accordion(no rules — press 'a' to add)3. Consistent Tree Navigation
4. Polish
Navigation Model
Implementation
All work is on the
feat/unified-editingbranch. See PR #261 for the full diff.Tags for rollback points:
unified-editing-phase1— color mode added, legacy Edit Colors still presentunified-editing-phase2— legacy Edit Colors removedaccordion-rules-editor— accordion replaces full-screen overlay