feat(hooks): add setWidget API for multi-line status displays

- ctx.ui.setWidget(key, lines) for multi-line displays above editor
- Widgets appear below 'Working...' indicator, above editor
- Supports ANSI styling including strikethrough
- Added theme.strikethrough() method
- Plan-mode hook now shows todo list with checkboxes
- Completed items show checked box and strikethrough text
This commit is contained in:
Helmut Januschka 2026-01-03 16:01:05 +01:00 committed by Mario Zechner
parent 537d672f17
commit dc44816051
11 changed files with 127 additions and 6 deletions

View file

@ -92,6 +92,7 @@ function createNoOpUIContext(): HookUIContext {
input: async () => undefined,
notify: () => {},
setStatus: () => {},
setWidget: () => {},
custom: async () => undefined as never,
setEditorText: () => {},
getEditorText: () => "",

View file

@ -49,6 +49,7 @@ const noOpUIContext: HookUIContext = {
input: async () => undefined,
notify: () => {},
setStatus: () => {},
setWidget: () => {},
custom: async () => undefined as never,
setEditorText: () => {},
getEditorText: () => "",

View file

@ -74,6 +74,28 @@ export interface HookUIContext {
*/
setStatus(key: string, text: string | undefined): void;
/**
* Set a widget to display in the status area (above the editor, below "Working..." indicator).
* Supports multi-line content. Pass undefined to clear.
* Text can include ANSI escape codes for styling.
*
* @param key - Unique key to identify this widget (e.g., hook name)
* @param lines - Array of lines to display, or undefined to clear
*
* @example
* // Show a todo list
* ctx.ui.setWidget("plan-todos", [
* theme.fg("accent", "Plan Progress:"),
* "☑ " + theme.fg("muted", theme.strikethrough("Step 1: Read files")),
* "☐ Step 2: Modify code",
* "☐ Step 3: Run tests",
* ]);
*
* // Clear the widget
* ctx.ui.setWidget("plan-todos", undefined);
*/
setWidget(key: string, lines: string[] | undefined): void;
/**
* Show a custom component with keyboard focus.
* The factory receives TUI, theme, and a done() callback to close the component.