@compilr-dev/cli 0.4.0 → 0.5.0

package/dist/ui/overlay/impl/ask-user-simple-overlay-v2.js

@@ -0,0 +1,204 @@
+/**
+ * Ask User Simple Overlay V2
+ *
+ * Simplified modal overlay for single-question input.
+ * Uses BaseOverlayV2 for TerminalUI integration.
+ *
+ * Features:
+ * - Single question (no tabs, no navigation)
+ * - Options to select from with arrow keys
+ * - Custom text input option
+ * - Simple, clean UI
+ */
+import chalk from 'chalk';
+import { BaseOverlayV2, renderBorder } from '../../base/index.js';
+// =============================================================================
+// Overlay Implementation
+// =============================================================================
+export class AskUserSimpleOverlayV2 extends BaseOverlayV2 {
+    type = 'inline';
+    id = 'ask-user-simple-overlay-v2';
+    question;
+    choices;
+    allowCustom;
+    constructor(options) {
+        // Determine initial state
+        const choices = options.options ?? [];
+        const allowCustom = options.allowCustom ?? true;
+        const autoTyping = choices.length === 0 && allowCustom;
+        super({
+            selectedIndex: 0,
+            inputBuffer: '',
+            isTypingCustom: autoTyping,
+        });
+        this.question = options.question;
+        this.choices = choices;
+        this.allowCustom = allowCustom;
+        this.minHeight = 10; // Prevent jitter
+    }
+    renderContent(context) {
+        const s = context.styles;
+        const lines = [];
+        const border = renderBorder(context.width, s);
+        // Header
+        lines.push(border);
+        lines.push(' ' + s.primaryBold('Question'));
+        lines.push('');
+        // Question
+        lines.push(chalk.bold(` ${this.question}`));
+        lines.push('');
+        // Options
+        const customIndex = this.choices.length;
+        for (let i = 0; i < this.choices.length; i++) {
+            const isCursor = this.state.selectedIndex === i && !this.state.isTypingCustom;
+            const prefix = isCursor ? ' > ' : '   ';
+            const num = `${String(i + 1)}. `;
+            if (isCursor) {
+                lines.push(s.primary(prefix + num + this.choices[i]));
+            }
+            else {
+                lines.push(s.muted(prefix + num + this.choices[i]));
+            }
+        }
+        // Custom input option (if allowed)
+        if (this.allowCustom) {
+            const isCursor = this.state.selectedIndex === customIndex && !this.state.isTypingCustom;
+            const prefix = isCursor ? ' > ' : '   ';
+            const num = `${String(this.choices.length + 1)}. `;
+            if (this.state.isTypingCustom) {
+                // Show input field with cursor
+                lines.push(s.primary(prefix + num + 'Custom: ') + s.primaryBold(this.state.inputBuffer + '_'));
+            }
+            else if (isCursor) {
+                lines.push(s.primary(prefix + num + 'Type something else...'));
+            }
+            else {
+                lines.push(s.muted(prefix + num + 'Type something else...'));
+            }
+        }
+        // Footer
+        lines.push('');
+        if (this.state.isTypingCustom) {
+            lines.push(s.muted(' Enter Submit | Esc Cancel'));
+        }
+        else {
+            lines.push(s.muted(' Up/Down Navigate | Enter Select | s Skip | Esc Cancel'));
+        }
+        // Bottom border
+        lines.push(border);
+        return lines;
+    }
+    handleKey(key) {
+        const customIndex = this.choices.length;
+        const optionCount = this.allowCustom ? this.choices.length + 1 : this.choices.length;
+        // Ctrl+C always cancels
+        if (key.ctrl && key.name === 'c') {
+            return this.close({ answer: '', skipped: true });
+        }
+        // If typing custom input
+        if (this.state.isTypingCustom) {
+            if (key.name === 'escape') {
+                // Cancel custom input, return to navigation
+                this.state.isTypingCustom = false;
+                this.state.inputBuffer = '';
+                return this.rerender();
+            }
+            if (key.name === 'up' && this.choices.length > 0) {
+                // Exit typing mode and navigate up (only if there are other options)
+                this.state.isTypingCustom = false;
+                this.state.inputBuffer = '';
+                this.state.selectedIndex = Math.max(0, this.state.selectedIndex - 1);
+                return this.rerender();
+            }
+            if (key.name === 'down') {
+                // Custom is last option, down arrow does nothing
+                return this.noAction();
+            }
+            if (key.name === 'return') {
+                // Submit custom input
+                const custom = this.state.inputBuffer.trim();
+                if (custom) {
+                    return this.close({ answer: custom, skipped: false });
+                }
+                // Empty - stay in custom mode
+                return this.noAction();
+            }
+            if (key.name === 'backspace') {
+                this.state.inputBuffer = this.state.inputBuffer.slice(0, -1);
+                return this.rerender();
+            }
+            // Printable character
+            if (key.char && key.char.length === 1 && !key.ctrl && !key.meta) {
+                this.state.inputBuffer += key.char;
+                return this.rerender();
+            }
+            return this.noAction();
+        }
+        // Navigation mode
+        if (key.name === 'escape') {
+            return this.close({ answer: '', skipped: true });
+        }
+        // Skip question (s key)
+        if (key.char === 's' || key.char === 'S') {
+            return this.close({ answer: '', skipped: true });
+        }
+        if (key.name === 'up') {
+            this.state.selectedIndex = Math.max(0, this.state.selectedIndex - 1);
+            // Auto-enable typing when navigating to custom option
+            if (this.allowCustom && this.state.selectedIndex === customIndex) {
+                this.state.isTypingCustom = true;
+            }
+            return this.rerender();
+        }
+        if (key.name === 'down') {
+            this.state.selectedIndex = Math.min(optionCount - 1, this.state.selectedIndex + 1);
+            // Auto-enable typing when navigating to custom option
+            if (this.allowCustom && this.state.selectedIndex === customIndex) {
+                this.state.isTypingCustom = true;
+            }
+            return this.rerender();
+        }
+        if (key.name === 'return') {
+            if (this.state.selectedIndex < this.choices.length) {
+                // Selected a predefined option
+                return this.close({ answer: this.choices[this.state.selectedIndex], skipped: false });
+            }
+            else if (this.allowCustom && this.state.selectedIndex === customIndex) {
+                // Enter custom input mode
+                this.state.isTypingCustom = true;
+                return this.rerender();
+            }
+        }
+        // Number keys 1-9
+        if (key.char && key.char >= '1' && key.char <= '9') {
+            const numIndex = parseInt(key.char, 10) - 1; // 0-indexed
+            if (numIndex < optionCount) {
+                if (numIndex < this.choices.length) {
+                    // Select predefined option directly
+                    return this.close({ answer: this.choices[numIndex], skipped: false });
+                }
+                else if (this.allowCustom && numIndex === customIndex) {
+                    // Enter custom mode
+                    this.state.selectedIndex = customIndex;
+                    this.state.isTypingCustom = true;
+                    return this.rerender();
+                }
+            }
+        }
+        return this.noAction();
+    }
+    /**
+     * Summary shown after overlay closes.
+     */
+    getCloseSummary(result) {
+        const s = this.getStyles();
+        if (result.skipped) {
+            return s.muted('Question: ') + s.warning('Skipped');
+        }
+        // Truncate long answers
+        const displayAnswer = result.answer.length > 50
+            ? result.answer.substring(0, 47) + '...'
+            : result.answer;
+        return s.muted('Question: ') + s.success(displayAnswer);
+    }
+}

package/dist/ui/overlay/impl/backlog-overlay-v2.d.ts

@@ -0,0 +1,49 @@
+/**
+ * Backlog Overlay V2
+ *
+ * Modal overlay for viewing and managing the project backlog.
+ * Uses TabbedListOverlayV2 for consistent list/tab/search behavior.
+ *
+ * Features:
+ * - Search by title/description
+ * - Filter tabs by type (All/Feature/Bug/Tech-Debt/Chore)
+ * - Pagination for large backlogs
+ * - Quick status toggle with Space
+ * - Add new items with wizard
+ * - Database-backed with project isolation
+ */
+import { TabbedListOverlayV2, BaseScreen } from '../../base/index.js';
+import type { OverlayAction, KeyEvent } from '../types.js';
+import type { WorkItemType, WorkItemPriority } from '../../../db/schema.js';
+export type BacklogType = WorkItemType;
+export type BacklogPriority = WorkItemPriority;
+export type BacklogStatus = '📋' | '🚧' | '✅';
+export interface BacklogItem {
+    id: string;
+    dbId: number;
+    type: BacklogType;
+    status: BacklogStatus;
+    priority: BacklogPriority;
+    title: string;
+    description: string;
+    commit?: string;
+}
+export interface BacklogOverlayV2Result {
+    modified: boolean;
+}
+export declare class BacklogOverlayV2 extends TabbedListOverlayV2<BacklogItem, BacklogOverlayV2Result> {
+    readonly type: "inline";
+    readonly id = "backlog-overlay-v2";
+    private readonly editState;
+    /**
+     * @param projectId - Optional project ID to view backlog for.
+     *                    If not provided, uses the active project.
+     *                    Pass this when opening from workflow overlay for a specific project.
+     */
+    constructor(projectId?: number);
+    protected createDetailScreen(item: BacklogItem): BaseScreen | null;
+    /**
+     * Override handleKey to add custom behavior (Space toggle, 'a' add).
+     */
+    handleKey(key: KeyEvent): OverlayAction<BacklogOverlayV2Result>;
+}