@compilr-dev/cli 0.5.0 → 0.5.1

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

@@ -0,0 +1,26 @@
+/**
+ * Terminals Overlay V2 - View active terminal sessions
+ *
+ * Shows all CLI instances currently registered in the session registry.
+ * Provides list and detail views for multi-terminal awareness.
+ */
+import { BaseOverlayV2 } from '../../base/overlay-base-v2.js';
+import type { RenderContext, OverlayAction, KeyEvent } from '../index.js';
+interface TerminalsOverlayState {
+    selectedIndex: number;
+    screen: 'list' | 'detail';
+    detailSessionId: string | null;
+}
+export declare class TerminalsOverlayV2 extends BaseOverlayV2<TerminalsOverlayState> {
+    readonly type: "inline";
+    readonly id = "terminals-overlay";
+    constructor();
+    protected renderContent(context: RenderContext): string[];
+    private renderList;
+    private formatSessionLine;
+    private renderDetail;
+    handleKey(key: KeyEvent): OverlayAction<void>;
+    private handleListKey;
+    private handleDetailKey;
+}
+export {};

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

@@ -0,0 +1,217 @@
+/**
+ * Terminals Overlay V2 - View active terminal sessions
+ *
+ * Shows all CLI instances currently registered in the session registry.
+ * Provides list and detail views for multi-terminal awareness.
+ */
+import { BaseOverlayV2 } from '../../base/overlay-base-v2.js';
+import { getSessionRegistry, getActiveTerminalSessionId } from '../../../multi-agent/session-registry.js';
+import { getDb } from '../../../db/index.js';
+/**
+ * Format a relative time string from a SQLite CURRENT_TIMESTAMP datetime.
+ * SQLite stores UTC but without a 'Z' suffix, so we append it.
+ */
+function formatRelativeTime(sqliteDatetime) {
+    const now = Date.now();
+    const utcStr = sqliteDatetime.endsWith('Z') ? sqliteDatetime : sqliteDatetime + 'Z';
+    const then = new Date(utcStr).getTime();
+    const diffMs = now - then;
+    const diffSec = Math.floor(diffMs / 1000);
+    if (diffSec < 60)
+        return `${String(diffSec)}s ago`;
+    const diffMin = Math.floor(diffSec / 60);
+    if (diffMin < 60)
+        return `${String(diffMin)}m ago`;
+    const diffHr = Math.floor(diffMin / 60);
+    return `${String(diffHr)}h ${String(diffMin % 60)}m ago`;
+}
+/**
+ * Cache of project_id → display_name lookups.
+ * Refreshed each time the overlay renders.
+ */
+function getProjectName(projectId) {
+    if (projectId === null)
+        return null;
+    try {
+        const row = getDb().prepare('SELECT display_name FROM projects WHERE id = ?').get(projectId);
+        return row?.display_name ?? null;
+    }
+    catch {
+        return null;
+    }
+}
+export class TerminalsOverlayV2 extends BaseOverlayV2 {
+    type = 'inline';
+    id = 'terminals-overlay';
+    constructor() {
+        super({
+            selectedIndex: 0,
+            screen: 'list',
+            detailSessionId: null,
+        });
+    }
+    renderContent(context) {
+        this.minHeight = this.state.screen === 'detail' ? 18 : 12;
+        if (this.state.screen === 'detail') {
+            return this.renderDetail(context);
+        }
+        return this.renderList(context);
+    }
+    renderList(context) {
+        const s = context.styles;
+        const lines = [];
+        // Header
+        lines.push(...this.renderHeader('Active Terminals'));
+        const registry = getSessionRegistry();
+        const sessions = registry?.getActiveSessions() ?? [];
+        const currentId = getActiveTerminalSessionId();
+        // Ensure selected index is valid
+        if (this.state.selectedIndex >= sessions.length) {
+            this.state.selectedIndex = Math.max(0, sessions.length - 1);
+        }
+        if (sessions.length === 0) {
+            lines.push(s.muted('  No active terminal sessions.'));
+            lines.push('');
+        }
+        else {
+            for (let i = 0; i < sessions.length; i++) {
+                const session = sessions[i];
+                const isSelected = i === this.state.selectedIndex;
+                const line = this.formatSessionLine(session, currentId, s);
+                if (isSelected) {
+                    lines.push(s.selected(` ${s.primary('›')} ${line} `));
+                }
+                else {
+                    lines.push(`   ${line}`);
+                }
+            }
+            lines.push('');
+        }
+        // Footer
+        if (sessions.length > 0) {
+            lines.push(...this.renderFooter('↑↓ navigate · Enter view · Esc close'));
+        }
+        else {
+            lines.push(...this.renderFooter('Esc close'));
+        }
+        return lines;
+    }
+    formatSessionLine(session, currentId, s) {
+        const shortId = session.id.slice(0, 8);
+        const isSelf = session.id === currentId;
+        const selfTag = isSelf ? s.success(' (this)') : '';
+        const age = formatRelativeTime(session.last_heartbeat);
+        // Parse agent count
+        let agentCount = 0;
+        try {
+            const agents = JSON.parse(session.agents_json);
+            agentCount = agents.length;
+        }
+        catch {
+            // Ignore parse errors
+        }
+        const agentInfo = agentCount > 0
+            ? `${String(agentCount)} agents`
+            : session.active_agent;
+        const label = session.label ? s.muted(session.label) : '';
+        // Show project name (muted) if assigned
+        const projectName = getProjectName(session.project_id);
+        const projectTag = projectName ? s.muted(` [${projectName}]`) : '';
+        return `${s.secondary(shortId)}${selfTag}  pid:${String(session.pid)}  ${agentInfo}  ${label}${projectTag}  ${s.muted(age)}`;
+    }
+    renderDetail(context) {
+        const s = context.styles;
+        const lines = [];
+        const registry = getSessionRegistry();
+        const sessions = registry?.getActiveSessions() ?? [];
+        const session = sessions.find(sess => sess.id === this.state.detailSessionId);
+        const currentId = getActiveTerminalSessionId();
+        // Header
+        const shortId = this.state.detailSessionId?.slice(0, 8) ?? 'unknown';
+        lines.push(...this.renderHeader(`Terminal: ${shortId}`));
+        if (!session) {
+            lines.push(s.error('  Session not found (may have expired)'));
+            lines.push('');
+            lines.push(...this.renderFooter('Esc back'));
+            return lines;
+        }
+        const isSelf = session.id === currentId;
+        // Info section
+        const projectName = getProjectName(session.project_id);
+        lines.push(`  ${s.primaryBold('Session ID:')} ${session.id}${isSelf ? s.success(' (this terminal)') : ''}`);
+        lines.push(`  ${s.primaryBold('PID:')}        ${String(session.pid)}`);
+        lines.push(`  ${s.primaryBold('TTY:')}        ${session.tty_path ?? s.muted('unknown')}`);
+        lines.push(`  ${s.primaryBold('Label:')}      ${session.label ?? s.muted('none')}`);
+        lines.push(`  ${s.primaryBold('Project:')}    ${projectName ?? s.muted('none')}`);
+        lines.push(`  ${s.primaryBold('Active:')}     ${session.active_agent}`);
+        lines.push(`  ${s.primaryBold('Started:')}    ${formatRelativeTime(session.started_at)}`);
+        lines.push(`  ${s.primaryBold('Heartbeat:')}  ${formatRelativeTime(session.last_heartbeat)}`);
+        lines.push('');
+        lines.push(this.renderBorder());
+        // Agents section
+        let agents = [];
+        try {
+            agents = JSON.parse(session.agents_json);
+        }
+        catch {
+            // Ignore parse errors
+        }
+        if (agents.length > 0) {
+            lines.push(`  ${s.secondary('Agent Roster:')}`);
+            lines.push('');
+            for (const agent of agents) {
+                const isActive = agent.id === session.active_agent;
+                const activeMarker = isActive ? s.success(' ●') : '';
+                lines.push(`    ${agent.mascot} ${s.primaryBold(agent.displayName)} (${s.muted(agent.id)})${activeMarker}`);
+            }
+        }
+        else {
+            lines.push(`  ${s.muted('  No agents registered')}`);
+        }
+        lines.push('');
+        lines.push(...this.renderFooter('Esc back'));
+        return lines;
+    }
+    handleKey(key) {
+        if (this.isCloseKey(key)) {
+            if (this.state.screen === 'detail') {
+                this.state.screen = 'list';
+                this.state.detailSessionId = null;
+                return this.rerender();
+            }
+            return this.close(undefined);
+        }
+        if (this.state.screen === 'detail') {
+            return this.handleDetailKey(key);
+        }
+        return this.handleListKey(key);
+    }
+    handleListKey(key) {
+        const registry = getSessionRegistry();
+        const sessions = registry?.getActiveSessions() ?? [];
+        if (this.isUpKey(key)) {
+            if (this.state.selectedIndex > 0) {
+                this.state.selectedIndex--;
+            }
+            return this.rerender();
+        }
+        if (this.isDownKey(key)) {
+            if (this.state.selectedIndex < sessions.length - 1) {
+                this.state.selectedIndex++;
+            }
+            return this.rerender();
+        }
+        if (this.isEnterKey(key)) {
+            if (sessions.length > 0 && sessions[this.state.selectedIndex]) {
+                this.state.screen = 'detail';
+                this.state.detailSessionId = sessions[this.state.selectedIndex].id;
+            }
+            return this.rerender();
+        }
+        return this.noAction();
+    }
+    handleDetailKey(_key) {
+        // Detail screen only supports Esc (handled above)
+        return this.noAction();
+    }
+}

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

@@ -11,7 +11,7 @@
  * - Works with TerminalUI's overlay management
  */
 import * as terminal from '../../terminal.js';
-import { TabbedListOverlayV2, BaseScreen, stay, popScreen, closeOverlay, isEscape, isCtrlC, isClose, renderBorder, wrapText, } from '../../base/index.js';
+import { TabbedListOverlayV2, BaseScreen, stay, popScreen, closeOverlay, isEscape, isCtrlC, isClose, renderBorder, wrapText, truncate, } from '../../base/index.js';
 // =============================================================================
 // Tab Definitions & Tool Categories
 // =============================================================================
@@ -108,9 +108,7 @@ class ToolDetailScreen extends BaseScreen {
         // Description (normalize newlines for proper wrapping)
         lines.push(`  ${s.muted('Description:')}`);
         let description = normalizeText(this.tool.description ?? 'No description available.');
-        if (description.length > MAX_DESCRIPTION_LENGTH) {
-            description = description.slice(0, MAX_DESCRIPTION_LENGTH).trim() + '...';
-        }
+        description = truncate(description, MAX_DESCRIPTION_LENGTH);
         const wrappedDesc = wrapText(description, cols - 6);
         for (const line of wrappedDesc) {
             lines.push(`    ${s.secondary(line)}`);
@@ -196,9 +194,7 @@ export class ToolsOverlayV2 extends TabbedListOverlayV2 {
                     : styles.muted(tool.name.padEnd(NAME_WIDTH));
                 // Normalize and truncate description
                 const normalizedDesc = normalizeText(tool.description ?? '');
-                const desc = normalizedDesc.length > descWidth
-                    ? normalizedDesc.slice(0, descWidth - 1) + '...'
-                    : normalizedDesc;
+                const desc = truncate(normalizedDesc, descWidth);
                 const descColor = isSelected ? styles.secondary(desc) : styles.muted(desc);
                 return `  ${cursor}${name}  ${descColor}`;
             },

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

@@ -1,31 +1,45 @@
 /**
  * Tutorial Overlay V2
  *
- * Interactive tutorial using the new Overlay interface.
- * Supports guided sequential tour and topic-based navigation.
+ * Interactive tutorial with guided walkthroughs.
+ * Extends TabbedListOverlayV2 for consistent UI with other overlays.
+ *
+ * Features:
+ * - 5 tabs: Basics, Projects, Planning, Teams, Config
+ * - Searchable tutorial list
+ * - Multi-page detail view for each tutorial
  */
-import { BaseOverlayV2 } from '../../base/index.js';
-import type { RenderContext, OverlayAction, KeyEvent } from '../index.js';
+import { TabbedListOverlayV2, BaseScreen } from '../../base/index.js';
+import { type TutorialItem } from '../data/tutorial-content.js';
 export interface TutorialOverlayV2Result {
     completed: boolean;
 }
-interface TutorialState {
-    topicListIndex: number;
-    currentTopicIndex: number;
-    currentPageIndex: number;
-    isGuidedMode: boolean;
+/**
+ * Extended tutorial item with tab association for filtering.
+ */
+interface TutorialListItem extends TutorialItem {
+    tabId: string;
 }
 /**
- * Tutorial overlay using the new Overlay interface.
- * Multi-screen overlay for interactive tutorial.
+ * Tutorial overlay with tabbed topics and multi-page walkthroughs.
+ * Extends TabbedListOverlayV2 for consistent look with other overlays.
  */
-export declare class TutorialOverlayV2 extends BaseOverlayV2<TutorialState, TutorialOverlayV2Result> {
+export declare class TutorialOverlayV2 extends TabbedListOverlayV2<TutorialListItem, TutorialOverlayV2Result> {
     readonly type: "inline";
     readonly id = "tutorial-overlay-v2";
-    private readonly screenStack;
-    private topics;
     constructor();
-    protected renderContent(context: RenderContext): string[];
-    handleKey(key: KeyEvent): OverlayAction<TutorialOverlayV2Result>;
+    /**
+     * Build items on first render when styles are available.
+     * This is a workaround since we need styles to build styled content.
+     */
+    private buildItemsIfNeeded;
+    /**
+     * Override render to build items on first call.
+     */
+    render(context: import('../index.js').RenderContext): {
+        lines: string[];
+        minHeight?: number;
+    };
+    protected createDetailScreen(item: TutorialListItem): BaseScreen | null;
 }
 export {};