feat: add 93-tui-designer skill for CLI wizard interfaces

Reusable patterns for building Norton Commander / Gopher style TUI
wizards with Python Rich. Covers architecture, components, keyboard
input, bilingual i18n, ListSelector, and 21 battle-tested gotchas.

Reference implementation: DTM Agent TUI (dintel-gtm-agent/src/dtm/tui/)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Andrew Yim
2026-03-20 18:59:45 +09:00
parent c287ca3340
commit 1fe6f71751
3 changed files with 375 additions and 0 deletions

View File

@@ -0,0 +1,84 @@
# DTM Wizard — Reference Implementation
The DTM Agent TUI wizard is the first project built with this skill's patterns.
## Repository
- **Project**: D.intelligence Tag Manager Agent
- **Location**: `github.com/D-intelligence/dintel-gtm-agent`
- **TUI code**: `src/dtm/tui/` (20 files, ~2500 lines)
- **Tests**: `tools/tests/unit/test_tui_*.py` (29 tests)
## File Inventory
| File | Lines | Purpose |
|------|-------|---------|
| `__init__.py` | 13 | Public API |
| `i18n.py` | 93 | 60+ bilingual EN/KR strings |
| `input.py` | 93 | Escape sequence parser |
| `themes.py` | 48 | Norton Commander color scheme |
| `widgets.py` | 35 | Status icons, mini-tables |
| `breadcrumb.py` | 22 | Navigation path bar |
| `function_bar.py` | 33 | F-key shortcut bar |
| `status_panel.py` | 85 | Left panel health display |
| `menu.py` | 35 | Gopher-style numbered menu |
| `dialog.py` | 70 | Modal overlays |
| `core.py` | 100 | Three-tier layout engine |
| `runner.py` | 170 | Event loop + ScreenStack |
| `selector.py` | 156 | Arrow-key list selector |
| `renderers.py` | ~1100 | 15 leaf screen content renderers |
| `screens/*.py` | ~250 | 21 screen definitions |
## Screen Hierarchy (21 screens)
```
home
setup
setup.credentials
setup.account
setup.account.containers (dynamic sub-screen)
setup.ai
setup.connectivity
operations
ops.workflow
ops.container_analysis
ops.ai_analysis
ops.performance
configuration
config.review
config.change_account
config.change_container
config.export
diagnostics
diag.health
diag.test
diag.recommendations
```
## PRs and Evolution
| PR | Title | Key Changes |
|----|-------|-------------|
| #10 | Core TUI redesign | 19 modules, 28 tests |
| #11 | 7 usability fixes | Panel height, no-color, bilingual icons |
| #12 | Interactive selection | Account/container by number, help screen |
| #13 | Name resolution | Resolve IDs to names from API |
| #14 | Loading spinners | Visual feedback during API calls |
| #15 | AI model selector | Ollama + LM Studio detection |
| #16 | Batch UX fixes | ListSelector, export formats, crash fixes |
## External Service Detection Pattern
```python
def _detect_lm_studio() -> dict:
"""Detect LM Studio on localhost:1234."""
import requests
try:
resp = requests.get("http://localhost:1234/v1/models", timeout=3)
if resp.status_code == 200:
return {"available": True, "models": [m["id"] for m in resp.json().get("data", [])]}
except Exception:
pass
return {"available": False, "models": []}
```
This pattern works for any OpenAI-compatible local LLM server.