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

package/examples/styling-themes.js

@@ -0,0 +1,207 @@
+/**
+ * Styling and Themes Example
+ * 
+ * Demonstrates visual styling capabilities including:
+ * - Theme switching and customization
+ * - Custom style creation with StyleBuilder
+ * - Banner display variations
+ * - SVG background integration
+ * - Pre-built style presets
+ * 
+ * Run: node examples/styling-themes.js
+ * Note: Best viewed in browser console for full visual effects
+ */
+
+import { Logger } from '@mks2508/better-logger';
+import { 
+  setTheme, 
+  showBanner, 
+  createStyle, 
+  stylePresets,
+  logAnimated,
+  logWithSVG 
+} from '@mks2508/better-logger/styling';
+
+console.log('🎨 Better Logger - Styling and Themes Example\n');
+
+const logger = new Logger({ prefix: 'STYLE' });
+
+// Theme demonstration
+console.log('🌈 Testing different themes:');
+
+const themes = ['default', 'dark', 'neon', 'cyberpunk', 'retro'];
+
+for (const theme of themes) {
+  setTheme(theme);
+  logger.info(`Theme changed to: ${theme}`);
+  
+  // Show some logs in this theme
+  logger.success(`${theme} theme is active!`);
+  logger.warn(`Warning message in ${theme} theme`);
+  logger.error(`Error message in ${theme} theme`);
+  
+  console.log(''); // Add spacing
+}
+
+// Banner demonstrations
+console.log('\n🎭 Testing different banner types:');
+
+const bannerTypes = ['simple', 'ascii', 'unicode', 'svg', 'animated'];
+
+bannerTypes.forEach((type, index) => {
+  setTimeout(() => {
+    console.log(`\n--- ${type.toUpperCase()} BANNER ---`);
+    showBanner(type);
+    logger.info(`Showing ${type} banner style`);
+  }, index * 1000);
+});
+
+// Wait for banners, then continue
+setTimeout(() => {
+  console.log('\n✨ Testing custom style creation:');
+
+  // Create custom styles using StyleBuilder
+  const headerStyle = createStyle()
+    .bg('linear-gradient(135deg, #667eea, #764ba2)')
+    .color('white')
+    .padding('12px 24px')
+    .rounded('8px')
+    .bold()
+    .shadow('0 4px 15px rgba(102, 126, 234, 0.3)')
+    .build();
+
+  const alertStyle = createStyle()
+    .bg('linear-gradient(45deg, #ff6b6b, #feca57)')
+    .color('#333')
+    .padding('10px 20px')
+    .border('2px solid #ff5252')
+    .rounded('25px')
+    .bold()
+    .animation('pulse 1s ease-in-out infinite')
+    .build();
+
+  const codeStyle = createStyle()
+    .backgroundColor('#2c3e50')
+    .color('#ecf0f1')
+    .padding('8px 12px')
+    .font('Monaco, Consolas, monospace')
+    .border('1px solid #34495e')
+    .rounded('4px')
+    .build();
+
+  console.log('%cCustom Header Style', headerStyle);
+  console.log('%cCustom Alert Style', alertStyle);
+  console.log('%cCustom Code Style', codeStyle);
+
+  // Using pre-built style presets
+  console.log('\n🎯 Testing style presets:');
+
+  console.log('%c✅ Success Preset', stylePresets.success);
+  console.log('%c❌ Error Preset', stylePresets.error);
+  console.log('%c⚠️ Warning Preset', stylePresets.warning);
+  console.log('%cℹ️ Info Preset', stylePresets.info);
+  console.log('%c🎯 Accent Preset', stylePresets.accent);
+
+  // Advanced styling combinations
+  console.log('\n🔧 Advanced styling combinations:');
+
+  const gradientButton = createStyle()
+    .bg('linear-gradient(45deg, #667eea, #764ba2, #f093fb, #f5576c)')
+    .color('white')
+    .padding('15px 30px')
+    .rounded('50px')
+    .bold()
+    .shadow('0 8px 25px rgba(102, 126, 234, 0.4)')
+    .animation('backgroundMove 3s ease infinite')
+    .css('background-size', '400% 400%')
+    .build();
+
+  console.log('%c🚀 Gradient Button Style', gradientButton);
+
+  const glassMorphism = createStyle()
+    .bg('rgba(255, 255, 255, 0.1)')
+    .color('#333')
+    .padding('20px')
+    .rounded('15px')
+    .border('1px solid rgba(255, 255, 255, 0.2)')
+    .css('backdrop-filter', 'blur(10px)')
+    .shadow('0 8px 32px rgba(0, 0, 0, 0.1)')
+    .build();
+
+  console.log('%c🪟 Glass Morphism Style', glassMorphism);
+
+  // SVG background demonstration (works in browser)
+  if (typeof document !== 'undefined') {
+    console.log('\n🖼️ Testing SVG backgrounds:');
+
+    const brandSVG = `
+      <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 80'>
+        <defs>
+          <linearGradient id='brandGrad' x1='0%' y1='0%' x2='100%' y2='0%'>
+            <stop offset='0%' style='stop-color:#667eea'/>
+            <stop offset='100%' style='stop-color:#764ba2'/>
+          </linearGradient>
+        </defs>
+        <rect width='100%' height='100%' fill='url(#brandGrad)' rx='8'/>
+        <text x='200' y='45' text-anchor='middle' fill='white' 
+              font-family='Arial' font-size='18' font-weight='bold'>
+          BETTER LOGGER
+        </text>
+      </svg>
+    `;
+
+    logWithSVG('Custom SVG Background!', brandSVG, {
+      width: 400,
+      height: 80,
+      padding: '40px 200px'
+    });
+
+    // Animated logging (browser only)
+    console.log('\n✨ Testing animated logging:');
+    
+    logAnimated('🌟 This message has animated gradients!', 3);
+    
+    setTimeout(() => {
+      logAnimated('🎉 Animation completed!', 2);
+    }, 3500);
+  }
+
+  // Style combinations for different contexts
+  console.log('\n📱 Context-specific styling:');
+
+  const mobileStyle = createStyle()
+    .bg('#007AFF')
+    .color('white')
+    .padding('8px 16px')
+    .rounded('18px')
+    .fontSize('14px')
+    .build();
+
+  const desktopStyle = createStyle()
+    .bg('linear-gradient(135deg, #74b9ff, #0984e3)')
+    .color('white')
+    .padding('12px 24px')
+    .rounded('8px')
+    .fontSize('16px')
+    .shadow('0 4px 12px rgba(116, 185, 255, 0.3)')
+    .build();
+
+  const terminalStyle = createStyle()
+    .backgroundColor('#1e1e1e')
+    .color('#00ff00')
+    .padding('6px 12px')
+    .font('Fira Code, Monaco, monospace')
+    .border('1px solid #333')
+    .build();
+
+  console.log('%c📱 Mobile Style', mobileStyle);
+  console.log('%c🖥️ Desktop Style', desktopStyle);
+  console.log('%c💻 Terminal Style', terminalStyle);
+
+  console.log('\n✅ Styling and themes examples completed!');
+  
+  // Reset to default theme
+  setTheme('default');
+  logger.info('Theme reset to default');
+
+}, 6000); // Wait for banner demonstrations

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mks2508/better-logger",
-  "version": "0.0.2-alpha.2",
+  "version": "0.3.0",
   "type": "module",
   "description": "State-of-the-art console logger with advanced CSS styling, SVG support, animations, and CLI interface",
   "main": "dist/index.js",
@@ -27,37 +27,53 @@
     "url": "https://github.com/MKS2508/advanced-logger/issues"
   },
   "homepage": "https://mks2508.github.io/advanced-logger/",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  },
   "scripts": {
     "dev": "vite",
-    "build": "tsc && vite build",
-    "build:watch": "vite build --watch",
-    "build:analyze": "vite build --mode analyze",
-    "preview": "vite preview",
+    "build": "tsc && BUILD_MODE=full vite build",
+    "build:full": "tsc && BUILD_MODE=full vite build",
+    "build:core": "tsc && BUILD_MODE=core vite build",
+    "build:styling": "tsc && BUILD_MODE=styling vite build",
+    "build:exports": "tsc && BUILD_MODE=exports vite build",
+    "build:all": "npm run build:full && npm run build:core && npm run build:styling && npm run build:exports",
     "clean": "rm -rf dist node_modules/.vite",
     "type-check": "tsc --noEmit",
-    "lint": "echo 'Linting with ESLint...' && exit 0",
-    "lint:fix": "echo 'Fixing with ESLint...' && exit 0",
     "test": "echo 'Running tests...' && exit 0",
-    "test:watch": "echo 'Running tests in watch mode...' && exit 0",
-    "test:coverage": "echo 'Running tests with coverage...' && exit 0",
     "test:performance": "echo 'Running performance benchmarks...' && exit 0",
     "test:visual": "echo 'Running visual tests...' && exit 0",
-    "prepublishOnly": "npm run clean && npm run type-check && npm run build",
-    "release": "npm version patch && npm publish --access public",
-    "release:minor": "npm version minor && npm publish --access public",
-    "release:major": "npm version major && npm publish --access public",
-    "release:alpha": "npm version prerelease --preid=alpha && npm publish --access public --tag alpha",
-    "release:beta": "npm version prerelease --preid=beta && npm publish --access public --tag beta",
-    "demo:serve": "python3 -m http.server 8080",
+    "test:workflows": "bun tests/test-conflict-resolution.ts",
+    "lint:yaml": "yamllint -c .yamllint .github/workflows/",
+    "fix:yaml": "./tests/yaml-autofix.sh",
+    "validate:workflows": "./tests/validate-workflows.sh",
     "size-limit": "echo 'Checking bundle sizes...' && ls -la dist/",
     "ci:install": "npm ci",
-    "ci:build": "npm run build",
+    "ci:build": "npm run build:all",
     "ci:test": "npm run test",
     "ci:publish": "npm publish --access public --ignore-scripts",
-    "ci:publish:github": "npm publish --registry=https://npm.pkg.github.com --access public --ignore-scripts"
+    "ci:publish:github": "npm publish --registry=https://npm.pkg.github.com --access public --ignore-scripts",
+    "commit:auto": "bun project-utils/commit-generator.ts --auto-approve --quiet",
+    "commit:ui": "bun project-utils/commit-ui.ts",
+    "version:auto": "bun project-utils/version-manager.ts --auto-approve",
+    "version:patch": "bun project-utils/version-manager.ts --type patch --auto-approve",
+    "version:minor": "bun project-utils/version-manager.ts --type minor --auto-approve",
+    "version:major": "bun project-utils/version-manager.ts --type major --auto-approve",
+    "version:alpha": "bun project-utils/version-manager.ts --prefix alpha --auto-approve",
+    "version:beta": "bun project-utils/version-manager.ts --prefix beta --auto-approve",
+    "version:stable": "bun project-utils/version-manager.ts --prefix '' --auto-approve",
+    "release:github": "bun project-utils/github-release-manager.ts --auto-approve",
+    "release:full": "npm run version:auto && npm run build:all && npm run release:github && npm run ci:publish",
+    "release:auto": "bun project-utils/auto-release-gemini.ts --ai --auto-approve",
+    "release:ui": "bun project-utils/auto-release-ui.ts",
+    "release:hotfix": "bun project-utils/auto-release-ui.ts --hotfix",
+    "release:feature": "bun project-utils/auto-release-ui.ts --feature",
+    "release:alpha": "bun project-utils/auto-release-ui.ts --alpha",
+    "release:major": "bun project-utils/auto-release-ui.ts --major",
+    "publish:core": "cd packages/core && npm publish --access public",
+    "publish:styling": "cd packages/styling && npm publish --access public",
+    "publish:exports": "cd packages/exports && npm publish --access public",
+    "publish:all-packages": "npm run publish:core && npm run publish:styling && npm run publish:exports",
+    "workflow:full": "npm run commit:auto && npm run release:full",
+    "workflow:commit": "npm run commit:auto",
+    "workflow:release": "npm run version:auto && npm run build:all && npm run release:github"
   },
   "devDependencies": {
     "terser": "^5.43.1",

package/packages/core/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "@mks2508/better-logger-core",
+  "version": "0.13.0-alpha.1",
+  "type": "module",
+  "description": "Universal core logging functionality for Better Logger - Works in both Node.js and browser environments",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "browser": "dist/index.umd.js",
+  "types": "dist/types/core.d.ts",
+  "exports": {
+    ".": {
+      "node": {
+        "import": "./dist/index.js",
+        "require": "./dist/index.cjs"
+      },
+      "browser": {
+        "import": "./dist/index.js",
+        "require": "./dist/index.umd.js"
+      },
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "keywords": [
+    "logger",
+    "console",
+    "core",
+    "typescript",
+    "browser",
+    "nodejs",
+    "universal",
+    "debug",
+    "isomorphic"
+  ],
+  "author": "MKS2508",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/MKS2508/advanced-logger.git",
+    "directory": "packages/core"
+  },
+  "bugs": {
+    "url": "https://github.com/MKS2508/advanced-logger/issues"
+  },
+  "homepage": "https://mks2508.github.io/advanced-logger/",
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "engines": {
+    "node": ">=14.0.0"
+  }
+}

package/packages/exports/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "@mks2508/better-logger-exports",
+  "version": "0.13.0-alpha.1",
+  "type": "module",
+  "description": "Export handlers for Better Logger - File, Remote, Analytics and custom log destinations",
+  "main": "dist/index.js",
+  "types": "dist/types/exports-module.d.ts",
+  "keywords": [
+    "logger",
+    "console",
+    "exports",
+    "handlers",
+    "file",
+    "remote",
+    "analytics",
+    "typescript",
+    "browser"
+  ],
+  "author": "MKS2508",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/MKS2508/advanced-logger.git",
+    "directory": "packages/exports"
+  },
+  "bugs": {
+    "url": "https://github.com/MKS2508/advanced-logger/issues"
+  },
+  "homepage": "https://mks2508.github.io/advanced-logger/",
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "@mks2508/better-logger-core": "^0.13.0-alpha.1"
+  }
+}

package/packages/nodejs-opentui/README.md

@@ -0,0 +1,232 @@
+# @mks2508/better-logger-nodejs-opentui
+
+Rich terminal logging with OpenTUI - Enhanced Tier 2 Package
+
+## Overview
+
+This package extends the Advanced Logger with [OpenTUI](https://github.com/sst/opentui) capabilities, providing beautiful, interactive terminal user interfaces for your logs. While OpenTUI is still experimental, it offers cutting-edge terminal UI features that transform console logging into rich visual experiences.
+
+## Features
+
+- 🎨 **Rich Visual Components**: Beautiful badges, styled text, and visual elements
+- ⚡ **Performance**: Built on OpenTUI's high-performance rendering engine
+- 🔧 **Easy Integration**: Drop-in enhancement for existing loggers
+- 🎯 **Tier 2 Enhanced**: Focused on essential rich logging without complexity
+- 📱 **Auto-fallback**: Gracefully falls back to standard logging if OpenTUI unavailable
+
+## Installation
+
+```bash
+npm install @mks2508/better-logger-nodejs-opentui
+```
+
+**Dependencies:**
+- `@opentui/core ^0.1.2`
+- `@opentui/react ^0.1.2` (for future components)
+- `@mks2508/better-logger-core ^0.12.0` (peer dependency)
+
+## Quick Start
+
+### Option 1: Quick Setup (Recommended)
+
+```typescript
+import { quickSetup } from '@mks2508/better-logger-nodejs-opentui';
+
+// One line setup - enhances default logger
+const logger = await quickSetup();
+
+logger?.info('🚀 OpenTUI enhanced logging is ready!');
+logger?.warn('⚠️ This will look amazing in terminal');
+logger?.error('❌ Rich error display with badges');
+logger?.critical('🚨 Critical alerts with animations');
+```
+
+### Option 2: Manual Integration
+
+```typescript
+import logger from '@mks2508/better-logger-core';
+import { createOpenTUILogger } from '@mks2508/better-logger-nodejs-opentui';
+
+// Create and add OpenTUI handler
+const openTUIHandler = await createOpenTUILogger({
+  renderer: {
+    animated: true,
+    theme: 'auto',
+    components: {
+      badges: true
+    }
+  }
+});
+
+if (openTUIHandler) {
+  logger.addHandler(openTUIHandler);
+  logger.info('Rich terminal logging enabled!');
+} else {
+  logger.info('Fallback to standard logging');
+}
+```
+
+### Option 3: Enhance Existing Logger
+
+```typescript
+import { enhanceLoggerWithOpenTUI } from '@mks2508/better-logger-nodejs-opentui';
+import myLogger from './my-logger';
+
+// Enhance any logger that has addHandler method
+const enhanced = await enhanceLoggerWithOpenTUI(myLogger, {
+  renderer: { animated: true, theme: 'dark' }
+});
+
+if (enhanced) {
+  myLogger.info('Now with OpenTUI superpowers! 💫');
+}
+```
+
+## Configuration
+
+### OpenTUIRendererOptions
+
+```typescript
+interface OpenTUIRendererOptions {
+  interactive?: boolean;     // false (Tier 2 - basic for now)
+  animated?: boolean;        // true - Enable animations
+  theme?: 'light' | 'dark' | 'auto'; // 'auto' - Adapt to terminal
+  dashboard?: boolean;       // false (reserved for Tier 3)
+  maxHistory?: number;       // 100 - Max log entries to keep
+  components?: {
+    badges?: boolean;        // true - Show level badges
+    progressBars?: boolean;  // false (Tier 2 - keeping simple)
+    tables?: boolean;        // false (Tier 2)
+    charts?: boolean;        // false (Tier 2)
+  };
+}
+```
+
+### Examples
+
+**Animated Logging:**
+```typescript
+const handler = await createOpenTUILogger({
+  renderer: {
+    animated: true,
+    theme: 'dark'
+  }
+});
+
+logger.addHandler(handler);
+
+logger.critical('🚨 This badge pulses with animation!');
+logger.error('❌ Error badges shake to grab attention');
+logger.warn('⚠️ Warning badges pulse subtly');
+```
+
+**Scoped Logging with Prefixes:**
+```typescript
+const apiLogger = logger.scope('API');
+const dbLogger = logger.scope('DATABASE');
+
+apiLogger.info('Request started');    // [ℹ️ INFO] [API] Request started
+dbLogger.error('Connection failed');  // [❌ ERROR] [DATABASE] Connection failed
+```
+
+## Visual Features
+
+### Log Level Badges
+
+Each log level gets a distinctive badge with icon and styling:
+
+- 🔍 **DEBUG** - Gray badge, subtle
+- ℹ️ **INFO** - Blue badge, informative  
+- ⚠️ **WARN** - Yellow badge, pulses
+- ❌ **ERROR** - Red badge, shakes
+- 🚨 **CRITICAL** - Dark red badge, strong pulse
+
+### Animations (Tier 2)
+
+- **Pulse**: Warning and critical levels
+- **Shake**: Error level for attention
+- **None**: Debug and info for clean output
+
+### Auto-Fallback
+
+If OpenTUI is not available, the handler automatically falls back to enhanced plain text:
+
+```
+[10:30:45] 🚨 [CRITICAL] [API] Database connection lost
+[10:30:46] ❌ [ERROR] [AUTH] Login failed for user@example.com
+    at AuthService.validateUser (auth.js:45:12)
+```
+
+## API Reference
+
+### Classes
+
+- **`OpenTUILogHandler`** - Main log handler implementing `ILogHandler`
+- **`OpenTUILogRenderer`** - Core rendering engine using OpenTUI
+
+### Functions
+
+- **`createOpenTUILogger(config?)`** - Factory function for handlers
+- **`enhanceLoggerWithOpenTUI(logger, config?)`** - Enhance existing logger
+- **`quickSetup()`** - One-line setup for default logger
+- **`isOpenTUIAvailable()`** - Check if OpenTUI is available
+
+### Types
+
+All TypeScript interfaces are exported for custom implementations:
+- `OpenTUILogEntry`, `OpenTUIRendererOptions`, `LogComponentStyle`, etc.
+
+## Performance
+
+- **Graceful Degradation**: Zero impact if OpenTUI unavailable
+- **Efficient Rendering**: Leverages OpenTUI's optimized terminal rendering
+- **Memory Management**: Configurable log history limits
+- **Fast Fallback**: Instant fallback to console logging if needed
+
+## Troubleshooting
+
+### OpenTUI Not Available
+
+If you see "OpenTUI not available, falling back to standard logging":
+
+1. **Check Installation**: Ensure `@opentui/core` is installed
+2. **Node Version**: Requires Node.js ≥16.0.0
+3. **Terminal Support**: Some terminals may not fully support OpenTUI features
+4. **Permissions**: Ensure terminal has proper rendering permissions
+
+### Debugging
+
+```typescript
+// Check handler status
+const handler = await createOpenTUILogger();
+console.log('Handler stats:', handler?.getStats());
+
+// Enable debug logging
+process.env.DEBUG = 'opentui:*';
+```
+
+## Roadmap
+
+### Current: Tier 2 Enhanced ✅
+- Rich badges with icons and animations
+- Auto-fallback to plain text
+- Basic OpenTUI integration
+
+### Future: Tier 3 Interactive
+- Live dashboard with filtering
+- Real-time log statistics
+- Interactive components (click, select)
+- Progress bars and charts
+- 3D log visualizations
+
+## Contributing
+
+This package is part of the Advanced Logger ecosystem. See the main repository for contributing guidelines.
+
+## License
+
+MIT - See LICENSE file for details
+
+---
+
+**Note**: OpenTUI is experimental and not production-ready. This package provides fallback mechanisms to ensure reliability in all environments.

package/packages/nodejs-opentui/package.json

@@ -0,0 +1,72 @@
+{
+  "name": "@mks2508/better-logger-nodejs-opentui",
+  "version": "0.1.0",
+  "type": "module",
+  "description": "OpenTUI-powered rich terminal logging with interactive components and animations",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/types/index.d.ts"
+    },
+    "./components": {
+      "import": "./dist/components.js", 
+      "types": "./dist/types/components.d.ts"
+    },
+    "./package.json": "./package.json"
+  },
+  "keywords": [
+    "logger",
+    "terminal",
+    "tui",
+    "opentui",
+    "interactive",
+    "animated",
+    "console",
+    "nodejs",
+    "rich-logging",
+    "dashboard"
+  ],
+  "author": "MKS2508",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/MKS2508/advanced-logger.git",
+    "directory": "packages/nodejs-opentui"
+  },
+  "bugs": {
+    "url": "https://github.com/MKS2508/advanced-logger/issues"
+  },
+  "homepage": "https://mks2508.github.io/advanced-logger/",
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "engines": {
+    "node": ">=16.0.0"
+  },
+  "dependencies": {
+    "@opentui/core": "^0.1.2",
+    "@opentui/react": "^0.1.2"
+  },
+  "devDependencies": {
+    "@types/react": "^18.0.0",
+    "react": "^18.0.0"
+  },
+  "peerDependencies": {
+    "@mks2508/better-logger-core": "^0.12.0"
+  },
+  "scripts": {
+    "build": "tsc && npm run build:rollup",
+    "build:rollup": "echo 'Rollup build placeholder'",
+    "dev": "tsc --watch",
+    "clean": "rm -rf dist",
+    "type-check": "tsc --noEmit"
+  }
+}