@compilr-dev/cli 0.4.0 → 0.5.0

package/dist/ui/mascot/expressions.js

@@ -0,0 +1,213 @@
+/**
+ * Mascot Expression Library
+ *
+ * ASCII art expressions for the compilr mascot - a retro CRT monitor
+ * with rabbit-ear antennas and a 3D keyboard.
+ *
+ * Each expression is 6 lines tall and designed to sit alongside the logo.
+ */
+// Full mascot expressions (6 lines each)
+// Design elements:
+// - \|/ - Rabbit-ear antennas (retro TV)
+// - ╭══════════╮ - Rounded top with double-line (CRT bezel)
+// - ║ - Double left border (3D depth effect)
+// - ' - Screen glare/reflection
+// - ▐▌ - Rectangular eyes
+// - ╰─═──────═─╯ - Bottom with feet (═)
+// - \________\ - 3D perspective keyboard
+export const EXPRESSIONS = {
+    // Standard/default - looking at user
+    neutral: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    ║'  ▐▌  ▐▌ │",
+        '    ║          │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Processing, working on something
+    thinking: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    ║'  ▐▌  ▐▌ │",
+        '    ║    ...   │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Glancing left (3D effect switches sides)
+    looking_left: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    │ ▐▌  ▐▌  '║",
+        '    │          ║',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Glancing right (eyes shifted)
+    looking_right: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    ║'  ▐▌  ▐▌ │",
+        '    ║          │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Idle, waiting, inactive
+    sleeping: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    ║'  __  __ │",
+        '    ║    zZ    │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Attention needed, important notification
+    alert: [
+        '     \\|||/',
+        '    ╭══════════╮',
+        "    ║'  ▐▌  ▐▌ │",
+        '    ║     !    │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Error occurred, confused, problem
+    error: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    ║'  ×   ×  │",
+        '    ║    ???   │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Task completed successfully, happy
+    success: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    ║'   ^   ^ │",
+        '    ║      __  │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Success with just happy eyes, no smile
+    success_minimal: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    ║'   ^   ^ │",
+        '    ║          │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Looking for something, scanning
+    searching: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    ║'  ◐   ◐  │",
+        '    ║    ~~~   │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+    // Doubtful, questioning, side-eye
+    skeptical: [
+        '      \\|/',
+        '    ╭══════════╮',
+        "    ║'  >   >  │",
+        '    ║          │',
+        '    ╰─═──────═─╯',
+        '      \\________\\',
+    ],
+};
+// Inline mascot expressions (single line) for status updates
+export const EXPRESSIONS_INLINE = {
+    neutral: '[•_•]',
+    thinking: '[•_•]...',
+    looking_left: '[<_<]',
+    looking_right: '[>_>]',
+    sleeping: '[-_-]zZ',
+    alert: '[•!•]',
+    error: '[×_×]',
+    success: '[^_^]',
+    success_minimal: '[^_^]',
+    searching: '[◐_◐]',
+    skeptical: '[>_>]',
+};
+// All expression codes for iteration
+export const EXPRESSION_CODES = [
+    'neutral',
+    'thinking',
+    'looking_left',
+    'looking_right',
+    'sleeping',
+    'alert',
+    'error',
+    'success',
+    'success_minimal',
+    'searching',
+    'skeptical',
+];
+// All mascot setting options (for config menu)
+export const MASCOT_OPTIONS = [
+    'none',
+    'random',
+    ...EXPRESSION_CODES,
+];
+// Human-readable labels for mascot options
+export const MASCOT_LABELS = {
+    none: 'None',
+    random: 'Random',
+    neutral: 'Neutral',
+    thinking: 'Thinking',
+    looking_left: 'Looking Left',
+    looking_right: 'Looking Right',
+    sleeping: 'Sleeping',
+    alert: 'Alert',
+    error: 'Error',
+    success: 'Success',
+    success_minimal: 'Success (Minimal)',
+    searching: 'Searching',
+    skeptical: 'Skeptical',
+};
+/**
+ * Get a random expression code
+ */
+export function getRandomExpression() {
+    const index = Math.floor(Math.random() * EXPRESSION_CODES.length);
+    return EXPRESSION_CODES[index];
+}
+// Session-level cache for random expression (selected once at startup)
+let sessionRandomExpression = null;
+/**
+ * Get the cached session expression, or generate one if not set
+ */
+function getSessionExpression() {
+    if (sessionRandomExpression === null) {
+        sessionRandomExpression = getRandomExpression();
+    }
+    return sessionRandomExpression;
+}
+/**
+ * Reset the session expression (for next startup or when settings change)
+ */
+export function resetSessionExpression() {
+    sessionRandomExpression = null;
+}
+/**
+ * Get expression lines for a mascot setting
+ * Returns null for 'none', picks random for 'random', otherwise returns the expression
+ */
+export function getExpressionForSetting(setting) {
+    if (setting === 'none') {
+        return null;
+    }
+    if (setting === 'random') {
+        // Use cached session expression for consistency within a session
+        return EXPRESSIONS[getSessionExpression()];
+    }
+    return EXPRESSIONS[setting];
+}
+/**
+ * Get the width of the mascot (for layout calculations)
+ */
+export function getMascotWidth() {
+    // All expressions have the same width - use neutral as reference
+    return Math.max(...EXPRESSIONS.neutral.map((line) => line.length));
+}

package/dist/ui/mascot/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Mascot Module
+ *
+ * Exports for the compilr mascot system.
+ * The mascot is a retro CRT monitor that displays expressions.
+ */
+export { type ExpressionCode, type MascotSetting, EXPRESSIONS, EXPRESSIONS_INLINE, EXPRESSION_CODES, MASCOT_OPTIONS, MASCOT_LABELS, getRandomExpression, getExpressionForSetting, getMascotWidth, resetSessionExpression, } from './expressions.js';
+export { renderMascotWithLogo, combineHorizontally } from './renderer.js';

package/dist/ui/mascot/index.js

@@ -0,0 +1,8 @@
+/**
+ * Mascot Module
+ *
+ * Exports for the compilr mascot system.
+ * The mascot is a retro CRT monitor that displays expressions.
+ */
+export { EXPRESSIONS, EXPRESSIONS_INLINE, EXPRESSION_CODES, MASCOT_OPTIONS, MASCOT_LABELS, getRandomExpression, getExpressionForSetting, getMascotWidth, resetSessionExpression, } from './expressions.js';
+export { renderMascotWithLogo, combineHorizontally } from './renderer.js';

package/dist/ui/mascot/renderer.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Mascot Renderer
+ *
+ * Handles rendering the mascot alongside the logo and applying colors.
+ */
+import { type MascotSetting } from './expressions.js';
+/**
+ * Combine two sets of lines horizontally with a gap
+ */
+export declare function combineHorizontally(left: string[], right: string[], gap: number): string[];
+/**
+ * Render mascot with logo side by side
+ * Returns the combined lines ready for output
+ *
+ * @param mascotSetting - The mascot setting (expression or 'none'/'random')
+ * @param version - Version string to append to logo
+ * @param projectName - Optional active project name to show
+ */
+export declare function renderMascotWithLogo(mascotSetting: MascotSetting, version: string, projectName?: string | null): string[];

package/dist/ui/mascot/renderer.js

@@ -0,0 +1,97 @@
+/**
+ * Mascot Renderer
+ *
+ * Handles rendering the mascot alongside the logo and applying colors.
+ */
+import { getStyles } from '../../themes/index.js';
+import { getExpressionForSetting } from './expressions.js';
+// The compilr logo (6 lines to match mascot height)
+const LOGO_LINES = [
+    "   ___  ___  _ __ ___  _ __ (_) |_ __",
+    "  / __|/ _ \\| '_ ` _ \\| '_ \\| | | '__|",
+    " | (__| (_) | | | | | | |_) | | | |",
+    "  \\___|\\___/|_| |_| |_| .__/|_|_|_|",
+    "                      | | .dev",
+    "                      |_|",
+];
+/**
+ * Combine two sets of lines horizontally with a gap
+ */
+export function combineHorizontally(left, right, gap) {
+    const maxLines = Math.max(left.length, right.length);
+    const leftWidth = Math.max(...left.map((l) => l.length));
+    const result = [];
+    for (let i = 0; i < maxLines; i++) {
+        const leftLine = (left[i] || '').padEnd(leftWidth);
+        const rightLine = right[i] || '';
+        result.push(leftLine + ' '.repeat(gap) + rightLine);
+    }
+    return result;
+}
+/**
+ * Render mascot with logo side by side
+ * Returns the combined lines ready for output
+ *
+ * @param mascotSetting - The mascot setting (expression or 'none'/'random')
+ * @param version - Version string to append to logo
+ * @param projectName - Optional active project name to show
+ */
+export function renderMascotWithLogo(mascotSetting, version, projectName) {
+    const s = getStyles();
+    // Get mascot expression (or null for 'none')
+    const mascotLines = getExpressionForSetting(mascotSetting);
+    // Create logo lines with version
+    const logoWithVersion = [...LOGO_LINES];
+    logoWithVersion[5] = `                      |_| v${version}`;
+    // Add tagline and project info below logo
+    const tagline = '@compilr-dev/cli - AI-powered coding assistant';
+    let result;
+    if (mascotLines) {
+        // Combine mascot + logo horizontally (5 space gap)
+        result = combineHorizontally(mascotLines, logoWithVersion, 5);
+        // Add empty line and tagline
+        result.push('');
+        result.push(tagline);
+    }
+    else {
+        // No mascot - just show logo
+        result = [...logoWithVersion];
+        result.push('');
+        result.push(tagline);
+    }
+    // Add project info if available
+    if (projectName) {
+        result.push('');
+        result.push(`Project: ${projectName}`);
+    }
+    // Apply colors: mascot gets secondary color, logo gets accent
+    return result.map((line, index) => {
+        if (!mascotLines) {
+            // No mascot - color the logo with accent
+            if (index < logoWithVersion.length) {
+                return s.primary(line);
+            }
+            // Tagline and project info get muted color
+            if (line.startsWith('Project:')) {
+                return s.muted(line);
+            }
+            return s.muted(line);
+        }
+        // With mascot - split the line at the gap point
+        const mascotWidth = Math.max(...mascotLines.map((l) => l.length));
+        const gap = 5;
+        if (index < mascotLines.length) {
+            // Lines that have mascot + logo
+            const mascotPart = line.slice(0, mascotWidth);
+            const logoPart = line.slice(mascotWidth + gap);
+            return s.secondary(mascotPart) + ' '.repeat(gap) + s.primary(logoPart);
+        }
+        else if (line.startsWith('Project:')) {
+            return s.muted(line);
+        }
+        else if (line === tagline) {
+            return s.muted(line);
+        }
+        return line;
+    });
+}

package/dist/ui/mascot-overlay-v2.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Mascot Overlay V2
+ *
+ * Mascot selection overlay using the new Overlay interface.
+ * Shows all mascot expressions with live preview.
+ *
+ * Features:
+ * - All mascot expressions
+ * - Live preview
+ * - Persists selection to settings
+ * - Works with TerminalUI's overlay management
+ */
+import { BaseOverlayV2 } from './base/index.js';
+import { type MascotSetting } from './mascot/index.js';
+import type { RenderContext, OverlayAction, KeyEvent } from './overlay/index.js';
+export interface MascotOverlayV2Options {
+    /** Current mascot setting (for highlighting current selection) */
+    currentMascot?: MascotSetting;
+}
+export interface MascotOverlayV2Result {
+    /** Selected mascot (if changed) */
+    mascotChanged?: MascotSetting;
+}
+interface MascotState {
+    /** Selected mascot index */
+    selectedIndex: number;
+    /** Current mascot for checkmark display */
+    currentMascot: MascotSetting;
+}
+/**
+ * Mascot overlay using the new Overlay interface.
+ * Displays mascot options with live preview.
+ */
+export declare class MascotOverlayV2 extends BaseOverlayV2<MascotState, MascotOverlayV2Result> {
+    readonly type: "inline";
+    readonly id = "mascot-overlay-v2";
+    constructor(options?: MascotOverlayV2Options);
+    protected renderContent(context: RenderContext): string[];
+    handleKey(key: KeyEvent): OverlayAction<MascotOverlayV2Result>;
+}
+export {};

package/dist/ui/mascot-overlay-v2.js

@@ -0,0 +1,138 @@
+/**
+ * Mascot Overlay V2
+ *
+ * Mascot selection overlay using the new Overlay interface.
+ * Shows all mascot expressions with live preview.
+ *
+ * Features:
+ * - All mascot expressions
+ * - Live preview
+ * - Persists selection to settings
+ * - Works with TerminalUI's overlay management
+ */
+import { BaseOverlayV2, isEscape, isEnter, isSpace, isCtrlC, isNavigateUp, isNavigateDown, isClose, renderBorder, } from './base/index.js';
+import { getSettings, setSetting } from '../settings/index.js';
+import { MASCOT_OPTIONS, MASCOT_LABELS, EXPRESSIONS, } from './mascot/index.js';
+// =============================================================================
+// Mascot Overlay V2 Class
+// =============================================================================
+/**
+ * Mascot overlay using the new Overlay interface.
+ * Displays mascot options with live preview.
+ */
+export class MascotOverlayV2 extends BaseOverlayV2 {
+    type = 'inline';
+    id = 'mascot-overlay-v2';
+    constructor(options = {}) {
+        const currentMascot = options.currentMascot ?? getSettings().mascot;
+        // Find current mascot in options list
+        let selectedIndex = 0;
+        const mascotIndex = MASCOT_OPTIONS.findIndex(m => m === currentMascot);
+        if (mascotIndex >= 0) {
+            selectedIndex = mascotIndex;
+        }
+        const initialState = {
+            selectedIndex,
+            currentMascot,
+        };
+        super(initialState);
+        this.minHeight = 20;
+    }
+    renderContent(context) {
+        const s = context.styles;
+        const cols = context.width;
+        const border = renderBorder(cols, s);
+        const lines = [];
+        // Get preview lines for side-by-side layout
+        const selectedOption = MASCOT_OPTIONS[this.state.selectedIndex];
+        let previewLines = [];
+        let previewLabel = '';
+        if (selectedOption === 'none') {
+            previewLabel = '(No mascot)';
+            previewLines = ['', '', '', '', '', ''];
+        }
+        else if (selectedOption === 'random') {
+            previewLabel = '(Random on startup)';
+            previewLines = EXPRESSIONS.neutral;
+        }
+        else {
+            previewLabel = MASCOT_LABELS[selectedOption];
+            previewLines = EXPRESSIONS[selectedOption];
+        }
+        // Header
+        lines.push(border);
+        lines.push(`  ${s.primaryBold('Select Mascot')}`);
+        lines.push('');
+        // Column widths
+        const listColWidth = 28;
+        const gap = 4;
+        const previewColStart = listColWidth + gap;
+        // Build side-by-side layout
+        const optionCount = MASCOT_OPTIONS.length;
+        const previewHeight = previewLines.length;
+        const previewStartRow = Math.max(0, Math.floor((optionCount - previewHeight) / 2));
+        for (let i = 0; i < Math.max(optionCount, previewStartRow + previewHeight + 1); i++) {
+            let leftPart = '';
+            let rightPart = '';
+            // Left column: option list
+            if (i < optionCount) {
+                const option = MASCOT_OPTIONS[i];
+                const isSelected = i === this.state.selectedIndex;
+                const isCurrent = option === this.state.currentMascot;
+                const prefix = isSelected ? s.primary('> ') : '  ';
+                const num = `${String(i + 1).padStart(2)}. `;
+                const checkmark = isCurrent ? s.success(' (current)') : '';
+                const label = isSelected ? s.primary(MASCOT_LABELS[option]) : s.muted(MASCOT_LABELS[option]);
+                leftPart = `  ${prefix}${num}${label}${checkmark}`;
+            }
+            // Right column: preview
+            const previewRow = i - previewStartRow;
+            if (previewRow === -1) {
+                rightPart = s.muted(previewLabel);
+            }
+            else if (previewRow >= 0 && previewRow < previewHeight) {
+                rightPart = s.secondary(previewLines[previewRow]);
+            }
+            // Combine columns with proper spacing
+            // eslint-disable-next-line no-control-regex
+            const leftPlain = leftPart.replace(/\x1b\[[0-9;]*m/g, '');
+            const padding = ' '.repeat(Math.max(0, previewColStart - leftPlain.length));
+            lines.push(leftPart + padding + rightPart);
+        }
+        // Footer
+        lines.push('');
+        lines.push(border);
+        lines.push(`  ${s.muted('up/down/jk Navigate . Enter/Space Select . q/Esc Close')}`);
+        lines.push(border);
+        return lines;
+    }
+    handleKey(key) {
+        const data = key.raw;
+        const maxIndex = MASCOT_OPTIONS.length - 1;
+        // Ctrl+C always closes
+        if (isCtrlC(data)) {
+            return this.cancel();
+        }
+        // q or Esc closes
+        if (isEscape(data) || isClose(data)) {
+            return this.cancel();
+        }
+        // Navigation up
+        if (isNavigateUp(data) && this.state.selectedIndex > 0) {
+            this.state.selectedIndex--;
+            return this.rerender();
+        }
+        // Navigation down
+        if (isNavigateDown(data) && this.state.selectedIndex < maxIndex) {
+            this.state.selectedIndex++;
+            return this.rerender();
+        }
+        // Enter/Space to select
+        if (isEnter(data) || isSpace(data)) {
+            const selectedMascot = MASCOT_OPTIONS[this.state.selectedIndex];
+            setSetting('mascot', selectedMascot);
+            return this.close({ mascotChanged: selectedMascot });
+        }
+        return this.noAction();
+    }
+}

package/dist/ui/mascot-overlay.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Mascot Overlay
+ *
+ * Standalone mascot selection overlay.
+ * Accessible via /mascot command or from Config overlay.
+ *
+ * Features:
+ * - All mascot expressions
+ * - Live preview
+ * - Persists selection to settings
+ */
+import { type MascotSetting } from './mascot/index.js';
+export interface MascotOverlayOptions {
+    /** Current mascot setting (for highlighting current selection) */
+    currentMascot?: MascotSetting;
+}
+export interface MascotOverlayResult {
+    /** Selected mascot (if changed) */
+    mascotChanged?: MascotSetting;
+}
+export declare function showMascotOverlay(options?: MascotOverlayOptions): Promise<MascotOverlayResult>;