@mks2508/better-logger 0.0.2-alpha.2 → 0.3.0

package/packages/nodejs-opentui/src/LogRenderer.ts

@@ -0,0 +1,171 @@
+/**
+ * @fileoverview Basic OpenTUI log renderer for enhanced terminal logging
+ */
+
+import { createCliRenderer, TextRenderable, type Renderable } from '@opentui/core';
+import type { LogLevel } from '@mks2508/better-logger-core';
+import type { OpenTUILogEntry, OpenTUIRendererOptions } from './types.js';
+
+/**
+ * Simple OpenTUI log renderer - Tier 2 Enhanced
+ */
+export class OpenTUILogRenderer {
+    private renderer: any;
+    private initialized = false;
+    private logHistory: OpenTUILogEntry[] = [];
+    private options: Required<OpenTUIRendererOptions>;
+
+    constructor(options: OpenTUIRendererOptions = {}) {
+        this.options = {
+            interactive: false, // Tier 2: Basic for now
+            animated: true,
+            theme: 'auto',
+            dashboard: false, // Save for Tier 3
+            maxHistory: 100,
+            components: {
+                badges: true,
+                progressBars: false, // Tier 2: Keep simple
+                tables: false,
+                charts: false
+            }
+        };
+        
+        Object.assign(this.options, options);
+    }
+
+    /**
+     * Initialize the OpenTUI renderer
+     */
+    async initialize(): Promise<void> {
+        if (this.initialized) return;
+        
+        try {
+            this.renderer = await createCliRenderer();
+            this.initialized = true;
+        } catch (error) {
+            console.warn('OpenTUI not available, falling back to standard logging');
+            this.initialized = false;
+        }
+    }
+
+    /**
+     * Check if OpenTUI is available and initialized
+     */
+    isAvailable(): boolean {
+        return this.initialized;
+    }
+
+    /**
+     * Render a log entry using OpenTUI
+     */
+    async renderLog(entry: OpenTUILogEntry): Promise<void> {
+        if (!this.initialized) {
+            await this.initialize();
+        }
+        
+        if (!this.isAvailable()) {
+            // Fallback to simple console output
+            this.renderFallback(entry);
+            return;
+        }
+
+        // Add to history
+        this.logHistory.push(entry);
+        if (this.logHistory.length > this.options.maxHistory) {
+            this.logHistory.shift();
+        }
+
+        // Create basic styled output
+        const logRenderable = this.createLogRenderable(entry);
+        this.renderer.root.add(logRenderable);
+    }
+
+    /**
+     * Create OpenTUI renderable for log entry
+     */
+    private createLogRenderable(entry: OpenTUILogEntry): Renderable {
+        const levelColor = this.getLevelColor(entry.level);
+        const levelIcon = this.getLevelIcon(entry.level);
+        
+        // Simple badge + message format for Tier 2
+        const badgeText = `${levelIcon} ${entry.level.toUpperCase()}`;
+        const fullMessage = entry.prefix 
+            ? `[${badgeText}] [${entry.prefix}] ${entry.message}`
+            : `[${badgeText}] ${entry.message}`;
+
+        return new TextRenderable(`log-${entry.id}`, {
+            content: fullMessage,
+            style: {
+                color: levelColor,
+                ...(entry.level === 'critical' && { 
+                    fontWeight: 'bold',
+                    textShadow: `0 0 5px ${levelColor}`
+                })
+            }
+        });
+    }
+
+    /**
+     * Get color for log level
+     */
+    private getLevelColor(level: LogLevel): string {
+        const colors: Record<LogLevel, string> = {
+            debug: '#6c757d',
+            info: '#007bff', 
+            warn: '#ffc107',
+            error: '#dc3545',
+            critical: '#8B0000'
+        };
+        return colors[level];
+    }
+
+    /**
+     * Get icon for log level
+     */
+    private getLevelIcon(level: LogLevel): string {
+        const icons: Record<LogLevel, string> = {
+            debug: '🔍',
+            info: 'ℹ️',
+            warn: '⚠️',
+            error: '❌',
+            critical: '🚨'
+        };
+        return icons[level];
+    }
+
+    /**
+     * Fallback rendering when OpenTUI is not available
+     */
+    private renderFallback(entry: OpenTUILogEntry): void {
+        const icon = this.getLevelIcon(entry.level);
+        const timestamp = entry.timestamp.slice(11, 23);
+        const prefix = entry.prefix ? ` [${entry.prefix}]` : '';
+        
+        console.log(`[${timestamp}] ${icon} [${entry.level.toUpperCase()}]${prefix} ${entry.message}`);
+    }
+
+    /**
+     * Get log history
+     */
+    getHistory(): OpenTUILogEntry[] {
+        return [...this.logHistory];
+    }
+
+    /**
+     * Clear log history
+     */
+    clearHistory(): void {
+        this.logHistory = [];
+    }
+
+    /**
+     * Cleanup resources
+     */
+    destroy(): void {
+        if (this.renderer) {
+            // Cleanup renderer if needed
+            this.renderer = null;
+        }
+        this.initialized = false;
+    }
+}

package/packages/nodejs-opentui/src/OpenTUILogHandler.ts

@@ -0,0 +1,178 @@
+/**
+ * @fileoverview OpenTUI Log Handler for integration with core logger
+ */
+
+import type { ILogHandler, LogLevel, LogMetadata } from '@mks2508/better-logger-core';
+import { OpenTUILogRenderer } from './LogRenderer.js';
+import type { OpenTUILogEntry, OpenTUILogHandlerConfig } from './types.js';
+
+/**
+ * Log handler that uses OpenTUI for rich terminal output
+ */
+export class OpenTUILogHandler implements ILogHandler {
+    private renderer: OpenTUILogRenderer;
+    private config: OpenTUILogHandlerConfig;
+    private logCounter = 0;
+
+    constructor(config: OpenTUILogHandlerConfig = {}) {
+        this.config = {
+            renderer: {
+                interactive: false,
+                animated: true,
+                theme: 'auto',
+                dashboard: false,
+                maxHistory: 100,
+                components: {
+                    badges: true,
+                    progressBars: false,
+                    tables: false,
+                    charts: false
+                }
+            },
+            ...config
+        };
+
+        this.renderer = new OpenTUILogRenderer(this.config.renderer);
+    }
+
+    /**
+     * Handle log entry from core logger
+     */
+    async handle(level: LogLevel, message: string, args: any[], metadata: LogMetadata): Promise<void> {
+        // Create OpenTUI log entry
+        const entry: OpenTUILogEntry = {
+            id: this.generateLogId(),
+            timestamp: metadata.timestamp,
+            level,
+            message,
+            args: args.slice(1), // Exclude first message argument
+            prefix: metadata.prefix,
+            stackInfo: metadata.stackInfo,
+            metadata: {
+                originalArgs: args,
+                handlerType: 'opentui'
+            }
+        };
+
+        try {
+            await this.renderer.renderLog(entry);
+        } catch (error) {
+            // Fallback to console if OpenTUI fails
+            console.error('OpenTUI rendering failed:', error);
+            this.fallbackRender(entry);
+        }
+    }
+
+    /**
+     * Initialize the handler (call this early in application lifecycle)
+     */
+    async initialize(): Promise<boolean> {
+        try {
+            await this.renderer.initialize();
+            return this.renderer.isAvailable();
+        } catch (error) {
+            console.warn('Failed to initialize OpenTUI:', error);
+            return false;
+        }
+    }
+
+    /**
+     * Check if OpenTUI is available
+     */
+    isAvailable(): boolean {
+        return this.renderer.isAvailable();
+    }
+
+    /**
+     * Get rendering statistics
+     */
+    getStats() {
+        return {
+            available: this.isAvailable(),
+            logsRendered: this.logCounter,
+            historySize: this.renderer.getHistory().length,
+            config: this.config
+        };
+    }
+
+    /**
+     * Update configuration
+     */
+    updateConfig(newConfig: Partial<OpenTUILogHandlerConfig>): void {
+        Object.assign(this.config, newConfig);
+    }
+
+    /**
+     * Get log history
+     */
+    getHistory(): OpenTUILogEntry[] {
+        return this.renderer.getHistory();
+    }
+
+    /**
+     * Clear log history
+     */
+    clearHistory(): void {
+        this.renderer.clearHistory();
+    }
+
+    /**
+     * Cleanup resources
+     */
+    destroy(): void {
+        this.renderer.destroy();
+    }
+
+    /**
+     * Generate unique log ID
+     */
+    private generateLogId(): string {
+        return `opentui-log-${Date.now()}-${++this.logCounter}`;
+    }
+
+    /**
+     * Fallback rendering when OpenTUI fails
+     */
+    private fallbackRender(entry: OpenTUILogEntry): void {
+        const prefix = entry.prefix ? `[${entry.prefix}] ` : '';
+        const timestamp = entry.timestamp.slice(11, 23);
+        
+        console.log(`[${timestamp}] [${entry.level.toUpperCase()}] ${prefix}${entry.message}`);
+        
+        // Log additional args if present
+        if (entry.args && entry.args.length > 0) {
+            entry.args.forEach(arg => {
+                if (typeof arg === 'object') {
+                    console.log(JSON.stringify(arg, null, 2));
+                } else {
+                    console.log(String(arg));
+                }
+            });
+        }
+
+        // Log stack trace if present and it's an error
+        if (entry.stackInfo && (entry.level === 'error' || entry.level === 'critical')) {
+            console.log(`    at ${entry.stackInfo.file}:${entry.stackInfo.line}:${entry.stackInfo.column}`);
+        }
+    }
+}
+
+/**
+ * Factory function to create OpenTUI log handler
+ */
+export function createOpenTUILogHandler(config?: OpenTUILogHandlerConfig): OpenTUILogHandler {
+    return new OpenTUILogHandler(config);
+}
+
+/**
+ * Utility function to check if OpenTUI is available in the environment
+ */
+export async function isOpenTUIAvailable(): Promise<boolean> {
+    try {
+        // Try to import OpenTUI core
+        await import('@opentui/core');
+        return true;
+    } catch (error) {
+        return false;
+    }
+}

package/packages/nodejs-opentui/src/components/LogBadge.tsx

@@ -0,0 +1,131 @@
+/**
+ * @fileoverview Log Badge component with animations and styling
+ */
+
+import React from 'react';
+import type { LogLevel } from '@mks2508/better-logger-core';
+import type { LogComponentStyle } from '../types.js';
+
+interface LogBadgeProps {
+    level: LogLevel;
+    animated?: boolean;
+    style?: LogComponentStyle;
+}
+
+/**
+ * Get default styling for log level
+ */
+function getDefaultLevelStyle(level: LogLevel): LogComponentStyle {
+    const styles: Record<LogLevel, LogComponentStyle> = {
+        debug: {
+            backgroundColor: '#6c757d',
+            color: '#ffffff',
+            animation: 'none'
+        },
+        info: {
+            backgroundColor: '#007bff',
+            color: '#ffffff',
+            animation: 'none'
+        },
+        warn: {
+            backgroundColor: '#ffc107',
+            color: '#000000',
+            animation: 'pulse'
+        },
+        error: {
+            backgroundColor: '#dc3545',
+            color: '#ffffff', 
+            animation: 'shake'
+        },
+        critical: {
+            backgroundColor: '#8B0000',
+            color: '#ffffff',
+            animation: 'pulse',
+            duration: 1000
+        }
+    };
+    
+    return styles[level];
+}
+
+/**
+ * Get emoji icon for log level
+ */
+function getLevelIcon(level: LogLevel): string {
+    const icons: Record<LogLevel, string> = {
+        debug: '🔍',
+        info: 'ℹ️',
+        warn: '⚠️',
+        error: '❌',
+        critical: '🚨'
+    };
+    
+    return icons[level];
+}
+
+/**
+ * Log badge component with styling and animations
+ */
+export function LogBadge({ level, animated = true, style = {} }: LogBadgeProps) {
+    const defaultStyle = getDefaultLevelStyle(level);
+    const finalStyle = { ...defaultStyle, ...style };
+    const icon = getLevelIcon(level);
+    
+    // Convert our style to OpenTUI box style
+    const boxStyle = {
+        backgroundColor: finalStyle.backgroundColor,
+        color: finalStyle.color,
+        padding: finalStyle.padding || 1,
+        margin: finalStyle.margin || 0,
+        border: finalStyle.border || 'none',
+        ...(animated && finalStyle.animation !== 'none' && {
+            animation: `${finalStyle.animation} ${finalStyle.duration || 500}ms ease-in-out`
+        })
+    };
+    
+    return (
+        <box style={boxStyle}>
+            <text bold fg={finalStyle.color}>
+                {icon} {level.toUpperCase()}
+            </text>
+        </box>
+    );
+}
+
+/**
+ * Compact log badge (icon only)
+ */
+export function CompactLogBadge({ level, animated = true }: Omit<LogBadgeProps, 'style'>) {
+    const style = getDefaultLevelStyle(level);
+    const icon = getLevelIcon(level);
+    
+    return (
+        <text 
+            fg={style.color}
+            style={{
+                ...(animated && style.animation !== 'none' && {
+                    animation: `${style.animation} ${style.duration || 500}ms ease-in-out`
+                })
+            }}
+        >
+            {icon}
+        </text>
+    );
+}
+
+/**
+ * Inline log badge (for embedded use)
+ */
+export function InlineLogBadge({ level }: Pick<LogBadgeProps, 'level'>) {
+    const style = getDefaultLevelStyle(level);
+    const icon = getLevelIcon(level);
+    
+    return (
+        <text 
+            fg={style.color}
+            bold
+        >
+            [{icon} {level.toUpperCase()}]
+        </text>
+    );
+}

package/packages/nodejs-opentui/src/index.ts

@@ -0,0 +1,133 @@
+/**
+ * @fileoverview OpenTUI Logger - Tier 2 Enhanced Terminal Logging
+ */
+
+// Core exports
+export { OpenTUILogHandler, createOpenTUILogHandler, isOpenTUIAvailable } from './OpenTUILogHandler.js';
+export { OpenTUILogRenderer } from './LogRenderer.js';
+
+// Types
+export type {
+    OpenTUILogEntry,
+    LogAnimation,
+    LogComponentStyle,
+    InteractiveLogConfig,
+    LogDashboardConfig,
+    ProgressLogEntry,
+    TableLogEntry,
+    LogStatistics,
+    LogFilter,
+    OpenTUIRendererOptions,
+    LogLevelStyling,
+    OpenTUILogHandlerConfig
+} from './types.js';
+
+// Convenience function to create and initialize OpenTUI logger
+import { OpenTUILogHandler } from './OpenTUILogHandler.js';
+import type { OpenTUILogHandlerConfig } from './types.js';
+
+/**
+ * Create and initialize OpenTUI log handler
+ * 
+ * @example
+ * ```typescript
+ * import { createOpenTUILogger } from '@mks2508/better-logger-nodejs-opentui';
+ * import logger from '@mks2508/better-logger-core';
+ * 
+ * const openTUIHandler = await createOpenTUILogger({
+ *   animated: true,
+ *   components: { badges: true }
+ * });
+ * 
+ * if (openTUIHandler) {
+ *   logger.addHandler(openTUIHandler);
+ *   logger.info('Rich terminal logging enabled!');
+ * }
+ * ```
+ */
+export async function createOpenTUILogger(
+    config?: OpenTUILogHandlerConfig
+): Promise<OpenTUILogHandler | null> {
+    try {
+        const handler = new OpenTUILogHandler(config);
+        const initialized = await handler.initialize();
+        
+        if (initialized) {
+            return handler;
+        } else {
+            console.warn('OpenTUI not available, using fallback logging');
+            return null;
+        }
+    } catch (error) {
+        console.error('Failed to create OpenTUI logger:', error);
+        return null;
+    }
+}
+
+/**
+ * Utility to enhance existing logger with OpenTUI capabilities
+ * 
+ * @example
+ * ```typescript
+ * import logger from '@mks2508/better-logger-core';
+ * import { enhanceLoggerWithOpenTUI } from '@mks2508/better-logger-nodejs-opentui';
+ * 
+ * await enhanceLoggerWithOpenTUI(logger, {
+ *   animated: true,
+ *   theme: 'dark'
+ * });
+ * 
+ * logger.info('Now with OpenTUI superpowers!');
+ * ```
+ */
+export async function enhanceLoggerWithOpenTUI(
+    logger: any, // Accept any logger with addHandler method
+    config?: OpenTUILogHandlerConfig
+): Promise<boolean> {
+    const handler = await createOpenTUILogger(config);
+    
+    if (handler && logger.addHandler) {
+        logger.addHandler(handler);
+        return true;
+    }
+    
+    return false;
+}
+
+/**
+ * Quick setup function for common use cases
+ */
+export async function quickSetup() {
+    try {
+        // Try to import and enhance the default core logger
+        const { default: logger } = await import('@mks2508/better-logger-core');
+        
+        const enhanced = await enhanceLoggerWithOpenTUI(logger, {
+            renderer: {
+                animated: true,
+                theme: 'auto',
+                components: {
+                    badges: true,
+                    progressBars: false,
+                    tables: false,
+                    charts: false
+                }
+            }
+        });
+        
+        if (enhanced) {
+            console.log('🚀 OpenTUI enhanced logging activated!');
+            return logger;
+        } else {
+            console.warn('⚠️ OpenTUI not available, using standard logging');
+            return logger;
+        }
+    } catch (error) {
+        console.error('❌ Failed to setup OpenTUI logging:', error);
+        return null;
+    }
+}
+
+// Package info
+export const version = '0.1.0';
+export const name = '@mks2508/better-logger-nodejs-opentui';