@compilr-dev/cli 0.5.0 → 0.5.2

package/dist/ui/overlay/impl/plan-approval-overlay-v2.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Plan Approval Overlay V2
+ *
+ * Modal overlay for approving plans created in Plan Mode.
+ * Shows plan summary and options to approve, revise, or cancel.
+ */
+import { BaseOverlayV2 } from '../../base/index.js';
+import type { RenderContext, OverlayAction, KeyEvent } from '../index.js';
+import type { Plan } from '../../../db/repositories/plan-repository.js';
+export type PlanApprovalAction = 'approve-auto' | 'approve' | 'revise' | 'cancel' | 'view';
+export interface PlanApprovalResult {
+    action: PlanApprovalAction;
+    planId: number;
+    planName: string;
+}
+export interface PlanApprovalOverlayOptions {
+    planId: number;
+    planName: string;
+    /** Optional summary text extracted from agent message */
+    summary?: string;
+}
+interface PlanApprovalState {
+    selectedIndex: number;
+    plan: Plan | null;
+    error: string | null;
+}
+export declare class PlanApprovalOverlayV2 extends BaseOverlayV2<PlanApprovalState, PlanApprovalResult> {
+    private readonly options;
+    readonly type: "inline";
+    readonly id = "plan-approval-overlay-v2";
+    constructor(options: PlanApprovalOverlayOptions);
+    protected renderContent(context: RenderContext): string[];
+    handleKey(key: KeyEvent): OverlayAction<PlanApprovalResult>;
+}
+export {};

package/dist/ui/overlay/impl/plan-approval-overlay-v2.js

@@ -0,0 +1,181 @@
+/**
+ * Plan Approval Overlay V2
+ *
+ * Modal overlay for approving plans created in Plan Mode.
+ * Shows plan summary and options to approve, revise, or cancel.
+ */
+import { BaseOverlayV2 } from '../../base/index.js';
+import { renderBorder, truncate, isEnter, isEscape, isUpArrow, isDownArrow, isCtrlC } from '../../base/index.js';
+import { planRepository } from '../../../db/repositories/index.js';
+const APPROVAL_OPTIONS = [
+    { action: 'approve-auto', label: 'Approve + Auto-accept', description: 'Implement with auto-approval' },
+    { action: 'approve', label: 'Approve', description: 'Implement with manual approval' },
+    { action: 'revise', label: 'Revise', description: 'Provide feedback, continue planning' },
+    { action: 'cancel', label: 'Cancel', description: 'Abandon this plan' },
+];
+// =============================================================================
+// Plan Approval Overlay
+// =============================================================================
+export class PlanApprovalOverlayV2 extends BaseOverlayV2 {
+    options;
+    type = 'inline';
+    id = 'plan-approval-overlay-v2';
+    constructor(options) {
+        // Load the plan from database
+        let plan = null;
+        let error = null;
+        try {
+            plan = planRepository.getById(options.planId);
+            if (!plan) {
+                error = `Plan with ID ${String(options.planId)} not found`;
+            }
+        }
+        catch (e) {
+            error = e instanceof Error ? e.message : 'Failed to load plan';
+        }
+        super({
+            selectedIndex: 0,
+            plan,
+            error,
+        });
+        this.options = options;
+    }
+    renderContent(context) {
+        const { width } = context;
+        const s = context.styles;
+        const border = renderBorder(width, s);
+        const lines = [];
+        // Header
+        lines.push(border);
+        lines.push(s.primaryBold('  Plan Ready for Review'));
+        lines.push(border);
+        // Error state
+        if (this.state.error) {
+            lines.push('');
+            lines.push(s.error(`  Error: ${this.state.error}`));
+            lines.push('');
+            lines.push(border);
+            lines.push(s.muted('  Press Esc to close'));
+            lines.push(border);
+            return lines;
+        }
+        // Plan not found
+        if (!this.state.plan) {
+            lines.push('');
+            lines.push(s.error('  Plan not found'));
+            lines.push('');
+            lines.push(border);
+            lines.push(s.muted('  Press Esc to close'));
+            lines.push(border);
+            return lines;
+        }
+        const plan = this.state.plan;
+        // Plan info
+        lines.push('');
+        lines.push(s.secondary(`  ${plan.name}`));
+        // Work item link (if any)
+        if (plan.workItemId) {
+            // We don't have the work item details easily, just show ID
+            lines.push(s.muted(`  Linked to work item #${String(plan.workItemId)}`));
+        }
+        lines.push('');
+        // Separator
+        lines.push(s.muted('  ' + '─'.repeat(Math.max(1, width - 4))));
+        lines.push('');
+        // Plan content preview (first ~10 lines)
+        const contentLines = plan.content.split('\n');
+        const previewLines = contentLines.slice(0, 12);
+        for (const line of previewLines) {
+            // Truncate long lines
+            const maxLen = width - 4;
+            const displayLine = truncate(line, maxLen);
+            lines.push(s.muted(`  ${displayLine}`));
+        }
+        if (contentLines.length > 12) {
+            lines.push(s.muted(`  ... (${String(contentLines.length - 12)} more lines)`));
+        }
+        lines.push('');
+        // View full plan hint
+        lines.push(s.info('  [v] View full plan in /docs'));
+        lines.push('');
+        // Separator
+        lines.push(border);
+        // Question
+        lines.push('');
+        lines.push(s.secondary('  How would you like to proceed?'));
+        lines.push('');
+        // Options
+        for (let i = 0; i < APPROVAL_OPTIONS.length; i++) {
+            const opt = APPROVAL_OPTIONS[i];
+            const isSelected = i === this.state.selectedIndex;
+            const prefix = isSelected ? s.primary('❯ ') : '  ';
+            const label = isSelected ? s.primaryBold(opt.label.padEnd(22)) : s.secondary(opt.label.padEnd(22));
+            const desc = s.muted(opt.description);
+            lines.push(`  ${prefix}${label}  ${desc}`);
+        }
+        lines.push('');
+        // Footer
+        lines.push(border);
+        lines.push(s.muted('  ↑↓/jk Navigate   Enter Select   v View Full   Esc Cancel'));
+        lines.push(border);
+        return lines;
+    }
+    handleKey(key) {
+        const data = key.raw;
+        // Ctrl+C - close
+        if (isCtrlC(data)) {
+            return this.close({
+                action: 'cancel',
+                planId: this.options.planId,
+                planName: this.options.planName,
+            });
+        }
+        // Escape - cancel
+        if (isEscape(data)) {
+            return this.close({
+                action: 'cancel',
+                planId: this.options.planId,
+                planName: this.options.planName,
+            });
+        }
+        // Error state - only allow escape
+        if (this.state.error || !this.state.plan) {
+            return this.noAction();
+        }
+        const char = key.name;
+        // Up arrow or k
+        if (isUpArrow(data) || char === 'k') {
+            if (this.state.selectedIndex > 0) {
+                this.state.selectedIndex--;
+                return this.rerender();
+            }
+            return this.noAction();
+        }
+        // Down arrow or j
+        if (isDownArrow(data) || char === 'j') {
+            if (this.state.selectedIndex < APPROVAL_OPTIONS.length - 1) {
+                this.state.selectedIndex++;
+                return this.rerender();
+            }
+            return this.noAction();
+        }
+        // Enter - select option
+        if (isEnter(data)) {
+            const selectedOption = APPROVAL_OPTIONS[this.state.selectedIndex];
+            return this.close({
+                action: selectedOption.action,
+                planId: this.options.planId,
+                planName: this.options.planName,
+            });
+        }
+        // v - view full plan (close overlay, REPL will open /docs)
+        if (char === 'v') {
+            return this.close({
+                action: 'view',
+                planId: this.options.planId,
+                planName: this.options.planName,
+            });
+        }
+        return this.noAction();
+    }
+}

package/dist/ui/overlay/impl/project-edit-overlay-v2.d.ts

@@ -0,0 +1,36 @@
+/**
+ * Project Edit Overlay V2
+ *
+ * Standalone overlay for editing project attributes.
+ * Can be used from /projects (via 'e' key) or /workflow (via Manage → Edit)
+ */
+import { BaseOverlayV2 } from '../../base/index.js';
+import type { RenderContext, OverlayAction, KeyEvent } from '../types.js';
+import { type Project } from '../../../db/repositories/index.js';
+interface EditableField {
+    key: 'displayName' | 'description' | 'gitRemote' | 'gitBranch' | 'path';
+    label: string;
+    value: string;
+    placeholder?: string;
+}
+interface ProjectEditState {
+    project: Project;
+    fields: EditableField[];
+    selectedFieldIndex: number;
+    editingField: boolean;
+    inputBuffer: string;
+    error: string | null;
+}
+export interface ProjectEditResult {
+    saved: boolean;
+    projectId: number;
+}
+export declare class ProjectEditOverlayV2 extends BaseOverlayV2<ProjectEditState, ProjectEditResult> {
+    readonly type: "inline";
+    readonly id = "project-edit-overlay-v2";
+    constructor(project: Project);
+    protected renderContent(context: RenderContext): string[];
+    handleKey(key: KeyEvent): OverlayAction<ProjectEditResult>;
+    private saveAndClose;
+}
+export {};

package/dist/ui/overlay/impl/project-edit-overlay-v2.js

@@ -0,0 +1,195 @@
+/**
+ * Project Edit Overlay V2
+ *
+ * Standalone overlay for editing project attributes.
+ * Can be used from /projects (via 'e' key) or /workflow (via Manage → Edit)
+ */
+import { BaseOverlayV2, renderBorder } from '../../base/index.js';
+import { projectRepository } from '../../../db/repositories/index.js';
+import * as terminal from '../../terminal.js';
+// =============================================================================
+// Status Labels
+// =============================================================================
+const STATUS_LABELS = {
+    active: 'Active',
+    paused: 'Paused',
+    completed: 'Complete',
+    archived: 'Archived',
+};
+// =============================================================================
+// Project Edit Overlay V2
+// =============================================================================
+export class ProjectEditOverlayV2 extends BaseOverlayV2 {
+    type = 'inline';
+    id = 'project-edit-overlay-v2';
+    constructor(project) {
+        super({
+            project,
+            fields: [
+                { key: 'displayName', label: 'Display Name', value: project.displayName, placeholder: 'Project display name' },
+                { key: 'description', label: 'Description', value: project.description || '', placeholder: 'Brief description' },
+                { key: 'path', label: 'Path', value: project.path || '', placeholder: '/path/to/project' },
+                { key: 'gitRemote', label: 'Git Remote', value: project.gitRemote || '', placeholder: 'https://github.com/...' },
+                { key: 'gitBranch', label: 'Git Branch', value: project.gitBranch || '', placeholder: 'main' },
+            ],
+            selectedFieldIndex: 0,
+            editingField: false,
+            inputBuffer: '',
+            error: null,
+        });
+        this.minHeight = 20;
+    }
+    // ===========================================================================
+    // Rendering
+    // ===========================================================================
+    renderContent(context) {
+        const s = context.styles;
+        const cols = terminal.getTerminalWidth();
+        const border = renderBorder(cols, s);
+        const project = this.state.project;
+        const lines = [];
+        lines.push(border);
+        lines.push(`  ${s.primaryBold('EDIT PROJECT')}`);
+        lines.push('');
+        lines.push(s.muted(`  ID: ${String(project.id)} · Name: ${project.name}`));
+        lines.push(s.muted(`  Status: ${STATUS_LABELS[project.status] || project.status} · Type: ${project.type}`));
+        lines.push(s.muted(`  Created: ${new Date(project.createdAt).toLocaleDateString()}`));
+        lines.push('');
+        lines.push(s.muted('  ' + '─'.repeat(cols - 6)));
+        lines.push('');
+        // Render fields
+        for (let i = 0; i < this.state.fields.length; i++) {
+            const field = this.state.fields[i];
+            const isSelected = i === this.state.selectedFieldIndex;
+            const isEditing = isSelected && this.state.editingField;
+            const cursor = isSelected ? s.primary('❯ ') : '  ';
+            const label = field.label.padEnd(14);
+            if (isEditing) {
+                // Show input buffer with cursor
+                const inputDisplay = this.state.inputBuffer || '';
+                lines.push(`${cursor}${s.muted(label)} ${s.primary(inputDisplay)}█`);
+            }
+            else {
+                const value = field.value || s.muted(field.placeholder || '(not set)');
+                if (isSelected) {
+                    lines.push(`${cursor}${s.primary(label)} ${value}`);
+                }
+                else {
+                    lines.push(`${cursor}${s.muted(label)} ${value}`);
+                }
+            }
+        }
+        if (this.state.error) {
+            lines.push('');
+            lines.push(s.error(`  ${this.state.error}`));
+        }
+        lines.push('');
+        lines.push(border);
+        if (this.state.editingField) {
+            lines.push(s.muted('  Enter Save field · Esc Cancel edit'));
+        }
+        else {
+            lines.push(s.muted('  ↑↓/jk Navigate · Enter Edit field · s Save & close · Esc Cancel'));
+        }
+        lines.push(border);
+        return lines;
+    }
+    // ===========================================================================
+    // Key Handling
+    // ===========================================================================
+    handleKey(key) {
+        // Ctrl+C always closes
+        if (this.isInterruptKey(key)) {
+            return this.close({ saved: false, projectId: this.state.project.id });
+        }
+        // Handle field editing mode
+        if (this.state.editingField) {
+            if (key.name === 'escape') {
+                // Cancel field edit - restore original value
+                const field = this.state.fields[this.state.selectedFieldIndex];
+                this.state.inputBuffer = field.value;
+                this.state.editingField = false;
+                return this.rerender();
+            }
+            if (this.isEnterKey(key)) {
+                // Save field value
+                const field = this.state.fields[this.state.selectedFieldIndex];
+                field.value = this.state.inputBuffer;
+                this.state.editingField = false;
+                return this.rerender();
+            }
+            if (key.name === 'backspace') {
+                this.state.inputBuffer = this.state.inputBuffer.slice(0, -1);
+                return this.rerender();
+            }
+            // Regular character input
+            if (key.char && key.char.length === 1 && key.char >= ' ' && key.char <= '~') {
+                this.state.inputBuffer += key.char;
+                return this.rerender();
+            }
+            return this.noAction();
+        }
+        // Handle navigation mode
+        if (key.name === 'escape') {
+            return this.close({ saved: false, projectId: this.state.project.id });
+        }
+        // Navigate up
+        if (this.isUpKey(key) || key.char === 'k') {
+            if (this.state.selectedFieldIndex > 0) {
+                this.state.selectedFieldIndex--;
+                return this.rerender();
+            }
+            return this.noAction();
+        }
+        // Navigate down
+        if (this.isDownKey(key) || key.char === 'j') {
+            if (this.state.selectedFieldIndex < this.state.fields.length - 1) {
+                this.state.selectedFieldIndex++;
+                return this.rerender();
+            }
+            return this.noAction();
+        }
+        // Enter to edit field
+        if (this.isEnterKey(key)) {
+            const field = this.state.fields[this.state.selectedFieldIndex];
+            this.state.inputBuffer = field.value;
+            this.state.editingField = true;
+            return this.rerender();
+        }
+        // 's' to save and close
+        if (key.char === 's' || key.char === 'S') {
+            return this.saveAndClose();
+        }
+        return this.noAction();
+    }
+    saveAndClose() {
+        // Build update object from fields
+        const updates = {};
+        for (const field of this.state.fields) {
+            if (field.key === 'displayName') {
+                updates.display_name = field.value || undefined;
+            }
+            else if (field.key === 'description') {
+                updates.description = field.value || undefined;
+            }
+            else if (field.key === 'gitRemote') {
+                updates.git_remote = field.value || undefined;
+            }
+            else if (field.key === 'gitBranch') {
+                updates.git_branch = field.value || undefined;
+            }
+            else {
+                // field.key === 'path'
+                updates.path = field.value || undefined;
+            }
+        }
+        try {
+            projectRepository.update(this.state.project.id, updates);
+            return this.close({ saved: true, projectId: this.state.project.id });
+        }
+        catch (err) {
+            this.state.error = err.message;
+            return this.rerender();
+        }
+    }
+}

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

@@ -24,6 +24,7 @@ export declare class ProjectsOverlayV2 extends TabbedListOverlayV2<Project, Proj
     readonly type: "inline";
     readonly id = "projects-overlay-v2";
     private readonly confirmState;
+    private readonly editState;
     constructor();
     /**
      * Refresh projects from database after archive/delete