@compilr-dev/cli 0.4.0 → 0.5.1

package/dist/ui/overlay/impl/delegations-overlay-v2.js

@@ -0,0 +1,279 @@
+/**
+ * Delegations Overlay V2 - View delegation status and history
+ *
+ * Shows delegations from the coordinator to background specialists.
+ * List view with detail drill-down, clear completed, status indicators.
+ */
+import { BaseOverlayV2 } from '../../base/overlay-base-v2.js';
+import { wrapText, truncate } from '../../base/render-utils.js';
+import { getDelegationTracker, } from '../../../multi-agent/delegation-tracker.js';
+export class DelegationsOverlayV2 extends BaseOverlayV2 {
+    type = 'inline';
+    id = 'delegations-overlay';
+    constructor() {
+        super({
+            selectedIndex: 0,
+            screen: 'list',
+            detailId: null,
+        });
+    }
+    renderContent(context) {
+        this.minHeight = this.state.screen === 'detail' ? 18 : 14;
+        if (this.state.screen === 'detail') {
+            return this.renderDetail(context);
+        }
+        return this.renderList(context);
+    }
+    // ===========================================================================
+    // List View
+    // ===========================================================================
+    renderList(context) {
+        const s = context.styles;
+        const lines = [];
+        const innerWidth = context.width - 4;
+        lines.push(...this.renderHeader('Delegations'));
+        const tracker = getDelegationTracker();
+        const delegations = this.getSortedDelegations();
+        const stats = tracker.getStats();
+        // Stats line
+        const statParts = [];
+        if (stats.pending > 0 || stats.running > 0) {
+            statParts.push(s.warning(`Active: ${String(stats.pending + stats.running)}`));
+        }
+        if (stats.completed > 0) {
+            statParts.push(s.success(`Completed: ${String(stats.completed)}`));
+        }
+        if (stats.failed > 0) {
+            statParts.push(s.error(`Failed: ${String(stats.failed)}`));
+        }
+        if (statParts.length > 0) {
+            lines.push(`  ${statParts.join('  ')}`);
+            lines.push('');
+        }
+        // Ensure selected index is valid
+        if (this.state.selectedIndex >= delegations.length) {
+            this.state.selectedIndex = Math.max(0, delegations.length - 1);
+        }
+        if (delegations.length === 0) {
+            lines.push(s.muted('  No delegations yet.'));
+            lines.push('');
+            lines.push(s.muted('  The coordinator uses delegate_background to'));
+            lines.push(s.muted('  assign tasks to specialist agents.'));
+            lines.push('');
+        }
+        else {
+            for (let i = 0; i < delegations.length; i++) {
+                const d = delegations[i];
+                const isSelected = i === this.state.selectedIndex;
+                const line = this.formatDelegationLine(d, innerWidth - 4, s);
+                if (isSelected) {
+                    lines.push(s.selected(` ${s.primary('›')} ${line} `));
+                }
+                else {
+                    lines.push(`   ${line}`);
+                }
+            }
+            lines.push('');
+        }
+        // Footer
+        if (delegations.length > 0) {
+            lines.push(...this.renderFooter('↑↓ navigate · Enter details · c clear done · q close'));
+        }
+        else {
+            lines.push(...this.renderFooter('q close'));
+        }
+        return lines;
+    }
+    formatDelegationLine(d, maxWidth, s) {
+        const { icon, colorFn } = this.getStatusStyle(d.status, s);
+        const duration = this.formatDuration(d.createdAt, d.completedAt);
+        const agent = `$${d.targetAgentId}`;
+        // Columns: icon(2) + id(12) + agent(8) + task(flex) + status/duration(12)
+        const fixedWidth = 2 + 12 + 8 + 12;
+        const taskMaxLen = Math.max(10, maxWidth - fixedWidth);
+        const task = truncate(d.task, taskMaxLen);
+        const statusText = d.status === 'completed' || d.status === 'failed'
+            ? duration
+            : d.status;
+        return `${colorFn(icon)} ${s.muted(d.id.padEnd(12))}${s.secondary(agent.padEnd(8))}${task.padEnd(taskMaxLen)}${s.muted(statusText)}`;
+    }
+    // ===========================================================================
+    // Detail View
+    // ===========================================================================
+    renderDetail(context) {
+        const s = context.styles;
+        const lines = [];
+        const innerWidth = context.width - 4;
+        const tracker = getDelegationTracker();
+        const d = this.state.detailId ? tracker.get(this.state.detailId) : undefined;
+        lines.push(...this.renderHeader(this.state.detailId ?? 'Delegation'));
+        if (!d) {
+            lines.push(s.error('  Delegation not found.'));
+            lines.push('');
+            lines.push(...this.renderFooter('Esc back'));
+            return lines;
+        }
+        const { icon, colorFn } = this.getStatusStyle(d.status, s);
+        // Info fields
+        lines.push(`  ${s.primaryBold('Status:')}    ${colorFn(`${icon} ${d.status}`)}`);
+        lines.push(`  ${s.primaryBold('Agent:')}     ${s.secondary(`$${d.targetAgentId}`)}`);
+        lines.push(`  ${s.primaryBold('Created:')}   ${s.muted(d.createdAt.toLocaleTimeString())}`);
+        lines.push(`  ${s.primaryBold('Duration:')}  ${s.muted(this.formatDuration(d.createdAt, d.completedAt))}`);
+        if (d.todoIndex !== undefined) {
+            lines.push(`  ${s.primaryBold('Todo:')}      ${s.muted(`#${String(d.todoIndex)}`)}`);
+        }
+        lines.push('');
+        // Task
+        lines.push(`  ${s.primaryBold('Task:')}`);
+        const taskLines = wrapText(d.task, innerWidth - 4);
+        for (const tl of taskLines) {
+            lines.push(`    ${tl}`);
+        }
+        if (d.expectedOutput) {
+            lines.push('');
+            lines.push(`  ${s.primaryBold('Expected Output:')}`);
+            const expectedLines = wrapText(d.expectedOutput, innerWidth - 4);
+            for (const el of expectedLines) {
+                lines.push(`    ${s.muted(el)}`);
+            }
+        }
+        // Result
+        lines.push('');
+        if (d.result) {
+            lines.push(`  ${s.primaryBold('Result:')}`);
+            const summaryLines = wrapText(d.result.summary, innerWidth - 4);
+            for (const sl of summaryLines) {
+                lines.push(`    ${d.result.success ? s.success(sl) : s.error(sl)}`);
+            }
+            if (d.result.artifactIds.length > 0) {
+                lines.push(`  ${s.primaryBold('Artifacts:')} ${s.muted(d.result.artifactIds.join(', '))}`);
+            }
+            if (d.result.error) {
+                lines.push(`  ${s.primaryBold('Error:')}     ${s.error(d.result.error)}`);
+            }
+        }
+        else {
+            lines.push(`  ${s.muted('(still running)')}`);
+        }
+        lines.push('');
+        lines.push(...this.renderFooter('Esc back · q close'));
+        return lines;
+    }
+    // ===========================================================================
+    // Key Handling
+    // ===========================================================================
+    handleKey(key) {
+        if (this.isCloseKey(key)) {
+            if (this.state.screen === 'detail') {
+                this.state.screen = 'list';
+                this.state.detailId = null;
+                return this.rerender();
+            }
+            return this.close(undefined);
+        }
+        if (this.state.screen === 'detail') {
+            return this.noAction();
+        }
+        return this.handleListKey(key);
+    }
+    handleListKey(key) {
+        const delegations = this.getSortedDelegations();
+        if (this.isUpKey(key)) {
+            if (this.state.selectedIndex > 0) {
+                this.state.selectedIndex--;
+            }
+            return this.rerender();
+        }
+        if (this.isDownKey(key)) {
+            if (this.state.selectedIndex < delegations.length - 1) {
+                this.state.selectedIndex++;
+            }
+            return this.rerender();
+        }
+        if (this.isEnterKey(key)) {
+            if (delegations.length > 0 && delegations[this.state.selectedIndex]) {
+                this.state.screen = 'detail';
+                this.state.detailId = delegations[this.state.selectedIndex].id;
+            }
+            return this.rerender();
+        }
+        // 'c' for clear completed/failed/cancelled
+        if (key.name === 'c') {
+            const tracker = getDelegationTracker();
+            const all = tracker.getAll();
+            for (const d of all) {
+                if (d.status === 'completed' || d.status === 'failed' || d.status === 'cancelled') {
+                    // Remove from tracker by clearing and re-adding actives
+                    // DelegationTracker doesn't have a remove method, so we clear all
+                    // Note: This is a simplification — only clear if there are no active delegations
+                }
+            }
+            // For now, clear the entire tracker if no active delegations remain
+            const stats = tracker.getStats();
+            if (stats.pending === 0 && stats.running === 0) {
+                tracker.clear();
+            }
+            this.state.selectedIndex = 0;
+            return this.rerender();
+        }
+        return this.noAction();
+    }
+    // ===========================================================================
+    // Helpers
+    // ===========================================================================
+    getSortedDelegations() {
+        const tracker = getDelegationTracker();
+        const delegations = tracker.getAll();
+        // Sort: running first, then pending, then completed/failed by time desc
+        delegations.sort((a, b) => {
+            const statusOrder = (status) => {
+                switch (status) {
+                    case 'running': return 0;
+                    case 'pending': return 1;
+                    case 'completed': return 2;
+                    case 'failed': return 3;
+                    case 'cancelled': return 4;
+                    default: return 5;
+                }
+            };
+            const orderDiff = statusOrder(a.status) - statusOrder(b.status);
+            if (orderDiff !== 0)
+                return orderDiff;
+            // Within same status, newest first
+            return b.createdAt.getTime() - a.createdAt.getTime();
+        });
+        return delegations;
+    }
+    getStatusStyle(status, s) {
+        switch (status) {
+            case 'running':
+                return { icon: '●', colorFn: s.warning };
+            case 'pending':
+                return { icon: '●', colorFn: s.muted };
+            case 'completed':
+                return { icon: '✓', colorFn: s.success };
+            case 'failed':
+                return { icon: '✗', colorFn: s.error };
+            case 'cancelled':
+                return { icon: '⊘', colorFn: s.muted };
+            default:
+                return { icon: '?', colorFn: s.muted };
+        }
+    }
+    formatDuration(from, to) {
+        const endTime = to ?? new Date();
+        const ms = endTime.getTime() - from.getTime();
+        const seconds = Math.floor(ms / 1000);
+        const minutes = Math.floor(seconds / 60);
+        const hours = Math.floor(minutes / 60);
+        if (hours > 0) {
+            return `${String(hours)}h ${String(minutes % 60)}m`;
+        }
+        else if (minutes > 0) {
+            return `${String(minutes)}m ${String(seconds % 60)}s`;
+        }
+        else {
+            return `${String(seconds)}s`;
+        }
+    }
+}

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

@@ -0,0 +1,45 @@
+/**
+ * Docs Overlay V2
+ *
+ * Document browser for project documents (PRD, architecture, design, notes).
+ * Uses TabbedListOverlayV2 for consistent list/tab/search behavior.
+ *
+ * Features:
+ * - Tabbed filtering by document type
+ * - Search with / toggle
+ * - Paginated list
+ * - Returns selected document for viewing in separate fullscreen overlay
+ */
+import { TabbedListOverlayV2 } from '../../base/tabbed-list-overlay-v2.js';
+import type { OverlayAction, KeyEvent } from '../types.js';
+import { type ProjectDocument } from '../../../db/repositories/document-repository.js';
+export interface DocsOverlayV2Result {
+    /** Selected document to view (if any) */
+    selectedDocument?: ProjectDocument;
+    /** Whether user cancelled (Ctrl+C or Esc) */
+    cancelled: boolean;
+}
+export declare class DocsOverlayV2 extends TabbedListOverlayV2<ProjectDocument, DocsOverlayV2Result> {
+    readonly type: "inline";
+    readonly id = "docs-overlay-v2";
+    private readonly projectName;
+    /**
+     * @param projectId - Optional project ID to view documents for.
+     *                    If not provided, uses the active project.
+     *                    Pass this when opening from workflow overlay for a specific project.
+     */
+    constructor(projectId?: number);
+    /**
+     * Override to render project name in header
+     */
+    protected renderHeader(title: string, subtitle?: string): string[];
+    /**
+     * Override to handle item selection.
+     * Returns the selected document so the command handler can show it in a fullscreen overlay.
+     */
+    protected onItemSelected(doc: ProjectDocument): DocsOverlayV2Result | undefined;
+    /**
+     * Override to return result on close
+     */
+    handleKey(key: KeyEvent): OverlayAction<DocsOverlayV2Result>;
+}

package/dist/ui/overlay/impl/docs-overlay-v2.js

@@ -0,0 +1,117 @@
+/**
+ * Docs Overlay V2
+ *
+ * Document browser for project documents (PRD, architecture, design, notes).
+ * Uses TabbedListOverlayV2 for consistent list/tab/search behavior.
+ *
+ * Features:
+ * - Tabbed filtering by document type
+ * - Search with / toggle
+ * - Paginated list
+ * - Returns selected document for viewing in separate fullscreen overlay
+ */
+import { TabbedListOverlayV2 } from '../../base/tabbed-list-overlay-v2.js';
+import { documentRepository } from '../../../db/repositories/document-repository.js';
+import { getActiveProject } from '../../../tools/project-db.js';
+import { DOC_TYPE_LABELS, PLAN_STATUS_ICONS } from '../../constants/labels.js';
+// =============================================================================
+// Constants
+// =============================================================================
+const PAGE_SIZE = 10;
+// Status badges for plans (icon-only for compact list view)
+const PLAN_STATUS_LABELS = PLAN_STATUS_ICONS;
+const TABS = [
+    { id: 'all', label: 'All' },
+    { id: 'prd', label: 'PRD' },
+    { id: 'architecture', label: 'ARCH' },
+    { id: 'design', label: 'DESIGN' },
+    { id: 'notes', label: 'NOTES' },
+    { id: 'plan', label: 'PLANS' },
+];
+// =============================================================================
+// Docs Overlay V2
+// =============================================================================
+export class DocsOverlayV2 extends TabbedListOverlayV2 {
+    type = 'inline';
+    id = 'docs-overlay-v2';
+    projectName;
+    /**
+     * @param projectId - Optional project ID to view documents for.
+     *                    If not provided, uses the active project.
+     *                    Pass this when opening from workflow overlay for a specific project.
+     */
+    constructor(projectId) {
+        // Use provided projectId, or fall back to active project
+        const activeProject = getActiveProject();
+        const resolvedProjectId = projectId ?? activeProject?.id ?? null;
+        const projectName = projectId
+            ? null // Will be loaded if needed, but we don't have it here
+            : activeProject?.displayName ?? null;
+        // Load documents
+        const documents = resolvedProjectId !== null
+            ? documentRepository.listByProject(resolvedProjectId)
+            : [];
+        super({
+            title: 'Documents',
+            tabs: TABS,
+            items: documents,
+            pageSize: PAGE_SIZE,
+            filterByTab: (doc, tabId) => {
+                if (tabId === 'all')
+                    return true;
+                return doc.docType === tabId;
+            },
+            getSearchText: (doc) => `${doc.title} ${doc.docType}`,
+            renderItem: (doc, isSelected, styles) => {
+                const prefix = isSelected ? styles.primary('❯ ') : '  ';
+                const typeLabel = (DOC_TYPE_LABELS[doc.docType] || doc.docType).padEnd(8);
+                // For plans, show status badge before title
+                let titleDisplay = doc.title.slice(0, 50);
+                if (doc.docType === 'plan' && doc.status) {
+                    const statusBadge = PLAN_STATUS_LABELS[doc.status] || '?';
+                    titleDisplay = `${statusBadge} ${titleDisplay}`;
+                }
+                if (isSelected) {
+                    return `${prefix}${styles.primaryBold(typeLabel)}  ${styles.primary(titleDisplay)}`;
+                }
+                return `${prefix}${styles.muted(typeLabel)}  ${styles.secondary(titleDisplay)}`;
+            },
+            showCount: true,
+            emptyMessage: resolvedProjectId === null
+                ? 'No active project. Use /projects to select one.'
+                : 'No documents found. Use /design or /arch to create documents.',
+            noResultsMessage: 'No documents match the search.',
+        });
+        this.projectName = projectName;
+        this.minHeight = 20;
+    }
+    /**
+     * Override to render project name in header
+     */
+    renderHeader(title, subtitle) {
+        const displaySubtitle = this.projectName || subtitle;
+        return super.renderHeader(title, displaySubtitle);
+    }
+    /**
+     * Override to handle item selection.
+     * Returns the selected document so the command handler can show it in a fullscreen overlay.
+     */
+    onItemSelected(doc) {
+        return { selectedDocument: doc, cancelled: false };
+    }
+    /**
+     * Override to return result on close
+     */
+    handleKey(key) {
+        // Check for close keys first
+        if (this.isInterruptKey(key)) {
+            return this.close({ cancelled: true });
+        }
+        if (this.isCloseKey(key) && !this.state.searchMode) {
+            return this.close({ cancelled: true });
+        }
+        // Let parent handle everything else (including Enter → onItemSelected)
+        // Parent will return the result from onItemSelected, so pass it through
+        return super.handleKey(key);
+    }
+}

package/dist/ui/overlay/impl/document-detail-overlay-v2.d.ts

@@ -0,0 +1,84 @@
+/**
+ * Document Detail Overlay V2
+ *
+ * Fullscreen markdown document viewer AND editor with vim-style navigation.
+ * Separate from DocsOverlayV2 (inline list) to allow proper fullscreen rendering.
+ *
+ * Features:
+ * - Full-screen document viewing with markdown rendering
+ * - Vim-style navigation (j/k, g/G, PgUp/PgDn)
+ * - Edit mode with raw markdown editing
+ * - Save to database (Ctrl+S)
+ * - Dirty check with save prompt on exit
+ */
+import { BaseOverlayV2 } from '../../base/overlay-base-v2.js';
+import type { RenderContext, OverlayAction, KeyEvent } from '../types.js';
+import { type ProjectDocument } from '../../../db/repositories/document-repository.js';
+import type { PlanStatus } from '../../../db/schema.js';
+export interface DocumentDetailResult {
+    /** Whether to go back to the document list */
+    goBack: boolean;
+}
+interface DocumentDetailState {
+    contentLines: string[];
+    scrollOffset: number;
+    isEditMode: boolean;
+    rawLines: string[];
+    cursorLine: number;
+    cursorColumn: number;
+    editScrollOffset: number;
+    isDirty: boolean;
+    originalContent: string;
+    showSavePrompt: boolean;
+    saveMessage: string | null;
+    planStatus: PlanStatus | null;
+    showStatusMenu: boolean;
+    statusMenuIndex: number;
+    availableStatuses: PlanStatus[];
+}
+/**
+ * Fullscreen document viewer and editor overlay.
+ * Shows a single document with vim-style scrolling navigation.
+ * Supports edit mode for modifying raw markdown content.
+ */
+export declare class DocumentDetailOverlayV2 extends BaseOverlayV2<DocumentDetailState, DocumentDetailResult> {
+    private readonly document;
+    readonly type: "inline";
+    readonly id = "document-detail-overlay-v2";
+    readonly usesAlternateScreen = true;
+    constructor(document: ProjectDocument);
+    /**
+     * Enter alternate screen buffer when overlay mounts.
+     * This preserves the main screen content.
+     */
+    onMount(): void;
+    /**
+     * Exit alternate screen buffer when overlay unmounts.
+     * This restores the main screen content.
+     */
+    onUnmount(): void;
+    protected renderContent(context: RenderContext): string[];
+    private renderViewMode;
+    private renderEditMode;
+    private renderLineWithCursor;
+    private ensureCursorVisible;
+    handleKey(key: KeyEvent): OverlayAction<DocumentDetailResult>;
+    private handleViewModeKey;
+    private handleEditModeKey;
+    private handleSavePromptKey;
+    private handleStatusMenuKey;
+    private changeStatus;
+    private moveCursorUp;
+    private moveCursorDown;
+    private moveCursorLeft;
+    private moveCursorRight;
+    private clampCursorColumn;
+    private getCurrentLine;
+    private insertText;
+    private handleBackspace;
+    private handleDelete;
+    private handleEnter;
+    private saveDocument;
+    private exitEditMode;
+}
+export {};