@crimsonsunset/jsg-logger 1.4.0 → 1.5.2

package/CHANGELOG.md

@@ -16,6 +16,155 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 - None
 
+## [1.5.2] - 2025-10-25 🐛 **PATCH: CLI Formatter Custom Component Display**
+
+### Fixed
+- **CLI formatter custom component names** - Formatter was using hardcoded `COMPONENT_SCHEME` instead of `configManager`, causing custom component names to display as `[JSG-CORE]` instead of user-defined names like `[SETUP]`
+- **Browser formatter** - Removed redundant component name transformation
+
+### Technical Changes
+- `formatters/cli-formatter.js` - Use `configManager.getComponentConfig()` instead of static `COMPONENT_SCHEME`
+- `formatters/browser-formatter.js` - Remove redundant name transformation
+- `tests/custom-components.test.js` - Added Test 6 for formatter output validation
+
+## [1.5.1] - 2025-10-25 🔧 **PATCH: Component Initialization Optimization**
+
+### Fixed
+- **Component initialization pollution** - `getAvailableComponents()` no longer initializes all 13 default COMPONENT_SCHEME components when user defines custom components (3 defined → 3 initialized instead of 16)
+- **Component name formatting** - Changed from PascalCase (`MyComponent`) to uppercase with separators (`MY-COMPONENT`)
+
+### Technical Changes
+- `config/config-manager.js` - Return only user components when defined, fallback to COMPONENT_SCHEME if empty; components replaced instead of merged; enhanced `_formatComponentName()`
+- `index.js` - Clean reinitialization: reset config, clear loggers, normalize inline config
+- `tests/custom-components.test.js` - New comprehensive test suite (5 tests)
+
+## [1.5.0] - 2025-10-25 🎯 **CRITICAL FIX: CLI Tool Support**
+
+### 🚨 **Critical Fixes**
+These fixes resolve major blockers for CLI tool usage reported in production.
+
+#### **Fixed: CLI Formatter Context Data Display** (Critical)
+- **Replaced pino-colada** with custom formatter that displays context data
+- Context objects now render as indented tree format in terminal
+- Example output:
+  ```
+  21:32:11.6 ✨ [SYSTEM] ✓ macOS version compatible
+     ├─ version: 14.2
+     ├─ build: 23C64
+     └─ command: sw_vers
+  ```
+- **Problem solved**: Context data was being silently ignored by pino-colada
+- **Impact**: Terminal applications now show full diagnostic information, not just messages
+
+#### **Fixed: Environment Detection for CLI Tools** (Critical)
+- **Enhanced `isCLI()` detection** - Now checks multiple signals:
+  - `process.stdout.isTTY` OR `process.stderr.isTTY` (not just stdout)
+  - `process.env.TERM` or `process.env.COLORTERM` environment variables
+  - Not running in CI/GitHub Actions context
+- **Problem solved**: CLI tools were being detected as "server" mode → outputting JSON instead of pretty terminal formatting
+- **Impact**: Terminal applications now properly display colored, formatted output instead of raw JSON blobs
+
+#### **Added: Force Environment Override** (Critical)
+- **New config option**: `forceEnvironment: 'cli' | 'browser' | 'server'`
+- Allows explicit environment override when auto-detection fails
+- Works in both inline config and `logger-config.json`
+- **Use case**: Essential for CLI tools in non-TTY contexts (piped output, automation scripts, etc.)
+
+#### **Added: Custom Component Name Support** (High Priority)
+- **Auto-create loggers for ANY component name** - No longer restricted to `COMPONENT_SCHEME` 
+- Components not in config get auto-generated with sensible defaults:
+  - Default emoji: 📦
+  - Default color: #999999
+  - Uppercase display name
+  - Global level inheritance
+- **Problem solved**: Custom components like 'system', 'installer', 'nvm' now work without pre-definition
+- **Impact**: True zero-configuration for component names
+
+### ✨ **API Enhancements**
+
+#### **Updated: `getComponent()` Method**
+- Now auto-creates loggers for undefined components instead of returning error loggers
+- Adds new components to auto-discovery getters dynamically
+- Seamless experience for custom component names
+
+#### **Updated: `getComponentConfig()` Method**
+- Added 3-tier priority system:
+  1. Config components (project-defined)
+  2. COMPONENT_SCHEME defaults (built-in)
+  3. Auto-generated (for custom components)
+- Always returns valid config, never null/undefined
+
+#### **Updated: `init()` and `initSync()` Methods**
+- Now load config BEFORE environment detection
+- Apply `forceEnvironment` config before determining environment
+- `initSync()` properly handles inline config objects
+
+### 📚 **Documentation**
+- **Updated README** - New v1.5.0 Quick Start section highlighting CLI tool fixes
+- **Added Force Environment docs** - When and how to override environment detection
+- **Added Custom Components docs** - Examples of using arbitrary component names
+- **Updated Environment Detection section** - Document enhanced CLI detection logic
+
+### 🎯 **Real-World Impact**
+**Before v1.5.0 (Broken for CLI tools):**
+```javascript
+const logger = JSGLogger.getInstanceSync({ components: { system: {...} } });
+logger.getComponent('system').info('✓ macOS compatible', { version: '14.2', build: '23C64' });
+// Output: {"level":30,"time":...,"msg":"✓ macOS compatible"}  ❌ JSON blob
+// Component 'system' not found error ❌
+// Context data not visible ❌
+```
+
+**After v1.5.0 (All Fixed!):**
+```javascript
+const logger = JSGLogger.getInstanceSync({ 
+  forceEnvironment: 'cli',
+  components: { system: { emoji: '⚙️' } }
+});
+logger.getComponent('system').info('✓ macOS compatible', { version: '14.2', build: '23C64' });
+// Output: 
+// 21:32:11.6 ⚙️ [SYSTEM] ✓ macOS compatible  ✅ Pretty formatted
+//    ├─ version: 14.2                        ✅ Context data visible
+//    └─ build: 23C64                         ✅ Tree formatting
+// Custom component works ✅
+```
+
+### 🔧 **Technical Changes**
+- **File**: `formatters/cli-formatter.js` ⭐ NEW FIX
+  - Removed pino-colada dependency (wasn't showing context data)
+  - Implemented custom formatter with context tree rendering
+  - Context data now displays with tree formatting (├─ and └─)
+  - Filters out pino internal fields (level, time, msg, pid, hostname, name, v, environment)
+  
+- **File**: `utils/environment-detector.js`
+  - Added `forceEnvironment()` function for manual override
+  - Enhanced `isCLI()` with multi-signal detection
+  - All detection functions now respect forced environment
+  
+- **File**: `config/config-manager.js`
+  - `getComponentConfig()` now has 3-tier fallback with auto-generation
+  
+- **File**: `index.js`
+  - Import `forceEnvironment` from environment detector
+  - Config loading moved BEFORE environment detection
+  - `getComponent()` auto-creates loggers instead of error loggers
+  - Added dynamic auto-discovery getter registration
+
+- **File**: `package.json`
+  - Removed pino-colada from dependencies (no longer required)
+
+### 📋 **Migration Guide**
+**No breaking changes** - This is a backward-compatible enhancement.
+
+**Recommended for CLI tools:**
+```javascript
+// Add this to your config for reliable terminal output
+const logger = JSGLogger.getInstanceSync({
+  forceEnvironment: 'cli',  // ← Add this line
+  // ... rest of your config
+});
+```
+
 ## [1.2.0] - 2025-08-21 🎯 **MAJOR: Fully Generic Logger**
 
 ### 🚀 **BREAKING CHANGES**

package/README.md

@@ -11,7 +11,9 @@ A sophisticated, fully generic logging system that automatically detects its env
 - 🔧 **Auto-Discovery Components** - Both camelCase and kebab-case component access  
 - ⚡ **Built-in Performance Logging** - Static utilities with auto-getInstance
 - 🛡️ **Non-Destructive Error Handling** - Missing components log but don't break apps
-- 🧠 **Smart Environment Detection** - Auto-adapts to browser, CLI, or server
+- 🎨 **Custom Component Names** - *New in v1.5.0!* Use ANY component name, auto-generated styling
+- 🔧 **Force Environment Override** - *New in v1.5.0!* Override auto-detection for CLI tools
+- 🧠 **Enhanced Environment Detection** - *New in v1.5.0!* Robust CLI detection with fallbacks
 - 🎨 **Beautiful Visual Output** - Emoji, colors, and structured context display
 - 📱 **Multi-Environment** - Browser console, terminal, and production JSON
 - 🏪 **Log Store** - In-memory storage for debugging and popup interfaces
@@ -25,6 +27,41 @@ A sophisticated, fully generic logging system that automatically detects its env
 
 ## 🚀 Quick Start
 
+### **v1.5.0: Custom Components & Force Environment - Perfect for CLI Tools!**
+
+> **✨ New in v1.5.0:** Use ANY component name (not just pre-defined ones) and force CLI mode for terminal applications!
+
+```javascript
+import JSGLogger from '@crimsonsunset/jsg-logger';
+
+// ✨ NEW: Force environment for CLI tools (fixes terminal detection)
+const logger = JSGLogger.getInstanceSync({
+  forceEnvironment: 'cli',  // Forces pretty terminal output
+  globalLevel: 'info',
+  components: {
+    system: { emoji: '⚙️', level: 'info' },      // Custom component names!
+    installer: { emoji: '📦', level: 'info' },   // No need to pre-define
+    ssh: { emoji: '🔑', level: 'info' },         // Auto-generated styling
+    nvm: { emoji: '🟢', level: 'info' }
+  }
+});
+
+// ✨ NEW: Custom components work immediately
+const sysLog = logger.getComponent('system');
+sysLog.info('✓ macOS version compatible', { version: '14.2', build: '23C64' });
+// Output: Pretty formatted terminal output with colors AND context data!
+// 21:32:11.6 ⚙️ [SYSTEM] ✓ macOS version compatible
+//    ├─ version: 14.2
+//    └─ build: 23C64
+
+const installLog = logger.getComponent('installer');
+installLog.info('✓ Applications installed', { installed: 25, duration: '5m' });
+// 21:32:11.8 📦 [INSTALLER] ✓ Applications installed
+//    ├─ installed: 25
+//    └─ duration: 5m
+// No more JSON blobs in terminal! 🎉
+```
+
 ### **v1.2.0: Fully Generic Design - Works with Any Project!**  
 
 > **⚠️ Breaking Change:** v1.2.0 requires defining components in your logger-config.json. The logger is now 100% generic with no hardcoded assumptions. 
@@ -47,7 +84,7 @@ const startTime = performance.now();
 // ... do work ...
 JSGLogger.logPerformance('Page Generation', startTime, 'api');
 
-// Non-destructive error handling - missing components auto-created
+// ✨ NEW: Custom components auto-created on demand
 const dynamicLogger = logger.getComponent('new-feature');
 dynamicLogger.info('Auto-created component!'); // Works immediately
 ```
@@ -82,10 +119,68 @@ This allows surgical debugging - you can turn on trace logging for just one prob
 
 ## ⚙️ **Advanced Configuration**
 
+### **Force Environment Override** ✨ *New in v1.5.0*
+
+Perfect for CLI tools that get mis-detected as "server" mode:
+
+```javascript
+// Inline config approach (recommended for CLI tools)
+const logger = JSGLogger.getInstanceSync({
+  forceEnvironment: 'cli',  // Options: 'browser', 'cli', 'server'
+  globalLevel: 'info',
+  components: {
+    system: { emoji: '⚙️', level: 'info' }
+  }
+});
+```
+
+Or in `logger-config.json`:
+
+```json
+{
+  "forceEnvironment": "cli",
+  "projectName": "My CLI Tool",
+  "globalLevel": "info",
+  "components": {
+    "system": { "emoji": "⚙️", "level": "info" }
+  }
+}
+```
+
+**When to use `forceEnvironment`:**
+- CLI tools running in non-TTY contexts (CI, piped output, etc.)
+- Override incorrect environment detection
+- Testing different output formats
+- Production deployments with specific requirements
+
+### **Custom Component Names** ✨ *New in v1.5.0*
+
+Use ANY component name - no need to pre-define in COMPONENT_SCHEME:
+
+```javascript
+const logger = JSGLogger.getInstanceSync({
+  components: {
+    'my-custom-component': { emoji: '🎯', level: 'debug' },
+    'another-one': { emoji: '🚀', level: 'info' },
+    'system-checker': { emoji: '⚙️', level: 'trace' }
+  }
+});
+
+// All these work immediately - auto-created with sensible defaults
+const log1 = logger.getComponent('my-custom-component');
+const log2 = logger.getComponent('another-one');
+const log3 = logger.getComponent('system-checker');
+
+// Even undefined components work (auto-generated with 📦 emoji)
+const log4 = logger.getComponent('undefined-component');
+log4.info('This works!'); // Uses auto-generated styling
+```
+
 ### **Full Configuration Example**
 
 ```json
 {
+  "forceEnvironment": "cli",
   "projectName": "My Advanced Project",
   "globalLevel": "info",
   "timestampMode": "absolute",
@@ -255,6 +350,9 @@ logger.controls.addFileOverride('src/popup.js', {
 ```
 
 ### **Context Data**
+
+✨ **New in v1.5.0:** Context data now displays in CLI/terminal mode with tree formatting!
+
 ```javascript
 logger.api.error('Request failed', {
   url: window.location.href,
@@ -267,7 +365,15 @@ logger.api.error('Request failed', {
   userAgent: navigator.userAgent
 });
 
-// With file override for src/sites/soundcloud.js level: "trace":
+// CLI/Terminal output (v1.5.0+):
+// 22:15:30.1 🚨 [API] Request failed
+//    ├─ url: https://soundcloud.com/track/example
+//    ├─ selectors: {"title":".track-title","artist":".track-artist"}
+//    ├─ retryCount: 3
+//    ├─ lastError: Element not found
+//    └─ userAgent: Mozilla/5.0...
+
+// Browser Console output:
 // 22:15:30.123 🚨 [API] Request failed
 //    ├─ url: https://soundcloud.com/track/example
 //    ├─ selectors: {title: ".track-title", artist: ".track-artist"}
@@ -393,7 +499,7 @@ const stats = logger.controls.getStats();
 npm install @crimsonsunset/jsg-logger
 ```
 
-**Latest**: v1.1.0 includes major project simplification enhancements!
+**Latest**: v1.5.0 includes critical CLI tool fixes and custom component support!
 
 ## 🎯 Environment Detection
 
@@ -403,6 +509,26 @@ The logger automatically detects its environment and uses optimal implementation
 - **CLI**: Uses pino-colada for beautiful terminal output  
 - **Server**: Uses structured JSON for production logging
 
+### **Enhanced CLI Detection** ✨ *Improved in v1.5.0*
+
+The CLI detection now checks multiple signals:
+1. **TTY Check**: `process.stdout.isTTY` or `process.stderr.isTTY`
+2. **Terminal Environment**: `process.env.TERM` or `process.env.COLORTERM`
+3. **Non-CI Context**: Not running in CI/GitHub Actions
+
+This fixes detection issues in various terminal contexts where `isTTY` may be undefined.
+
+### **Force Environment Override** ✨ *New in v1.5.0*
+
+If auto-detection fails, you can force the environment:
+
+```javascript
+const logger = JSGLogger.getInstanceSync({
+  forceEnvironment: 'cli',  // Override auto-detection
+  // ... rest of config
+});
+```
+
 **Why Browser is Different:**
 Our testing revealed that Pino's browser detection was interfering with custom formatters, especially in Chrome extensions. By creating a custom direct browser logger that bypasses Pino entirely, we achieved:
 - Perfect emoji and color display

package/config/config-manager.js

@@ -292,10 +292,16 @@ export class ConfigManager {
      * @private
      */
     _formatComponentName(componentName) {
+        // If already uppercase, return as-is
+        if (componentName === componentName.toUpperCase()) {
+            return componentName;
+        }
+        
+        // Convert to uppercase and preserve separators for readability
         return componentName
-            .split('-')
-            .map(word => word.charAt(0).toUpperCase() + word.slice(1))
-            .join('');
+            .replace(/([a-z])([A-Z])/g, '$1-$2')  // camelCase → kebab-case
+            .replace(/_/g, '-')  // snake_case → kebab-case
+            .toUpperCase();
     }
 
     /**
@@ -315,7 +321,11 @@ export class ConfigManager {
 
         for (const key in override) {
             if (override.hasOwnProperty(key)) {
-                if (typeof override[key] === 'object' && !Array.isArray(override[key])) {
+                // Special case: 'components' should be replaced, not merged
+                // This allows users to define their own components without getting defaults
+                if (key === 'components' && typeof override[key] === 'object') {
+                    merged[key] = override[key];
+                } else if (typeof override[key] === 'object' && !Array.isArray(override[key])) {
                     merged[key] = this.mergeConfigs(merged[key] || {}, override[key]);
                 } else {
                     merged[key] = override[key];
@@ -406,7 +416,23 @@ export class ConfigManager {
      * @returns {Object} Component configuration
      */
     getComponentConfig(componentName, filePath = null) {
-        const baseComponent = this.config.components?.[componentName] || COMPONENT_SCHEME[componentName] || COMPONENT_SCHEME['core'];
+        // Priority 1: Config components
+        let baseComponent = this.config.components?.[componentName];
+        
+        // Priority 2: COMPONENT_SCHEME defaults
+        if (!baseComponent) {
+            baseComponent = COMPONENT_SCHEME[componentName];
+        }
+        
+        // Priority 3: Auto-generate for custom components
+        if (!baseComponent) {
+            baseComponent = {
+                emoji: '📦',
+                color: '#999999',
+                name: this._formatComponentName(componentName),
+                level: this.config.globalLevel || 'info'
+            };
+        }
 
         // Check for file-specific overrides
         const checkFile = filePath || this.currentFile;
@@ -523,10 +549,14 @@ export class ConfigManager {
      */
     getAvailableComponents() {
         const configComponents = Object.keys(this.config.components || {});
-        const schemeComponents = Object.keys(COMPONENT_SCHEME);
-
-        // Combine and deduplicate
-        return [...new Set([...configComponents, ...schemeComponents])];
+        
+        // If user has defined components, only return those
+        if (configComponents.length > 0) {
+            return configComponents;
+        }
+        
+        // Fallback to COMPONENT_SCHEME if no components configured (backward compatibility)
+        return Object.keys(COMPONENT_SCHEME);
     }
 
     /**

package/config/default-config.json

@@ -29,8 +29,7 @@
     "core": { 
       "emoji": "🎯", 
       "color": "#4A90E2", 
-      "name": "JSG-CORE",
-      "level": "info"
+      "name": "JSG-CORE"
     }
   },
   "fileOverrides": {

package/docs/next-session.md

@@ -14,12 +14,44 @@
 
 ---
 
-**Date:** October 24, 2025  
-**Session Goal:** 🎯 **Phase 2 DevTools - Fix Integration Blockers** - Resolve import/API compatibility  
-**Status:** 🎉 **MAJOR BREAKTHROUGH** - Panel loads, floating button renders, minor theme issues remain
+**Date:** October 25, 2025  
+**Session Goal:** 🎯 **Critical CLI Tool Fixes** - Resolve environment detection and custom component blockers  
+**Status:** ✅ **COMPLETE** - v1.5.0 shipped with all critical fixes
 
 ## 🎉 MAJOR ACCOMPLISHMENTS THIS SESSION
 
+### ✅ Critical CLI Tool Fixes Complete (October 25, 2025) 🚨→✅
+- **🎨 CLI Context Data Display Fixed** - Replaced pino-colada with custom formatter
+  - Context data now renders as indented tree in terminal
+  - Shows all diagnostic information, not just messages
+  - Example: version, build, command data visible with ├─ and └─ formatting
+- **🔧 Environment Detection Fixed** - Enhanced `isCLI()` with multi-signal detection
+  - Now checks TTY, TERM env vars, and CI context
+  - CLI tools no longer mis-detected as "server" mode
+  - Fixes JSON output in terminal applications
+- **✨ Force Environment Override** - New `forceEnvironment` config option
+  - Allows manual override of auto-detection
+  - Works in inline config and logger-config.json
+  - Essential for non-TTY contexts (piped output, automation)
+- **🎯 Custom Component Names** - Any component name now works
+  - Auto-creation for undefined components
+  - Sensible default styling (📦 emoji, gray color)
+  - No longer restricted to COMPONENT_SCHEME
+- **📦 Version Bump** - Published v1.5.0 with all fixes
+- **🗑️ Dependency Cleanup** - Removed pino-colada (no longer needed)
+- **📚 Comprehensive Documentation** - Updated README, CHANGELOG
+  - New Quick Start section for v1.5.0
+  - Detailed forceEnvironment examples
+  - Custom component usage patterns
+  - Context data rendering examples
+
+### **Real-World Impact**
+Fixed production blocker in macOS setup automation tool:
+- **Before**: JSON blobs in 30-minute terminal script → unusable
+- **After**: Pretty colored output with component organization → perfect UX
+
+## 🎉 PREVIOUS SESSION ACCOMPLISHMENTS
+
 ### ✅ DevTools Integration Blocker RESOLVED (October 24, 2025)
 - **🔧 Import Path Fixed** - Installed JSG Logger as local file dependency
 - **📦 Dependencies Complete** - All parent dependencies installed (pino, pino-colada)
@@ -70,17 +102,28 @@
 
 ## 📋 IMMEDIATE PRIORITIES
 
-### **🔧 Theme Fixes (Minor):**
+### **🚀 Ready to Publish v1.5.0:**
+- [x] **Environment Detection** - Enhanced CLI detection with multi-signal check
+- [x] **Force Environment** - Config option to override auto-detection
+- [x] **Custom Components** - Auto-create loggers for any component name
+- [x] **Documentation** - README, CHANGELOG updated with v1.5.0 features
+- [x] **Version Bump** - Package version updated to 1.5.0
+- [ ] **Publish to NPM** - `npm run release:minor` when ready
+
+### **🔧 DevTools Theme Fixes (Optional, Low Priority):**
 - [ ] **Fix Text Components** - Pass theme data correctly to Evergreen UI Text components
 - [ ] **Test Panel Interaction** - Click floating button and verify panel opens
 - [ ] **Verify Filtering** - Test component toggles affect console output
 - [ ] **Apply Custom Theme** - Implement devtools-theme.js once basic theme works
 
-### **✅ COMPLETED:**
-- [x] **Import Resolution** - JSG Logger loads via `@crimsonsunset/jsg-logger` (file: dependency)
-- [x] **Dependencies** - Installed parent package dependencies (pino, pino-colada)
-- [x] **ThemeProvider** - Fixed Evergreen UI ThemeProvider configuration
-- [x] **Panel Initialization** - DevTools panel successfully renders floating button
+### **✅ COMPLETED THIS SESSION:**
+- [x] **CLI Context Data Display** - Custom formatter with tree rendering
+- [x] **Environment Detection Fixed** - Multi-signal CLI detection (TTY, TERM, CI check)
+- [x] **forceEnvironment Config** - Override auto-detection via config
+- [x] **Custom Component Names** - getComponent() auto-creates loggers
+- [x] **Config Loading Order** - Load config BEFORE environment detection
+- [x] **Dependency Cleanup** - Removed pino-colada from package
+- [x] **Documentation Complete** - README, CHANGELOG, version bump
 
 ## 🔮 Future Possibilities (Phase 10)
 

package/formatters/browser-formatter.js

@@ -57,7 +57,7 @@ export const createBrowserFormatter = (componentName, logStore = null) => {
 
                 // 3. Component name
                 if (displayConfig.component) {
-                    const componentName = component.name.toUpperCase().replace(/([a-z])([A-Z])/g, '$1-$2');
+                    const componentName = component.name;  // Already formatted by configManager
                     logParts.push(`%c[${componentName}]`);
                     logStyles.push(`color: ${component.color}; font-weight: bold;`);
                 }

package/formatters/cli-formatter.js

@@ -1,56 +1,79 @@
 /**
  * CLI/Terminal Formatter for JSG Logger
- * Uses pino-colada for beautiful terminal output with fallbacks
+ * Custom formatter with context data display
  */
 
-import { COMPONENT_SCHEME, LEVEL_SCHEME } from '../config/component-schemes.js';
-import pinoColada from 'pino-colada';
-// Note: pino-pretty imported conditionally to avoid browser bundle issues
+import { LEVEL_SCHEME } from '../config/component-schemes.js';
+import { configManager } from '../config/config-manager.js';
 
 /**
- * Create CLI formatter using pino-colada or pino-pretty
+ * Format a value for display in context tree
+ * @param {*} value - Value to format
+ * @returns {string} Formatted value
+ */
+const formatValue = (value) => {
+  if (value === null) return 'null';
+  if (value === undefined) return 'undefined';
+  if (typeof value === 'string') return value;
+  if (typeof value === 'number' || typeof value === 'boolean') return String(value);
+  if (typeof value === 'object') {
+    // For objects/arrays, show compact JSON
+    try {
+      return JSON.stringify(value);
+    } catch {
+      return String(value);
+    }
+  }
+  return String(value);
+};
+
+/**
+ * Create CLI formatter with context data support
  * @returns {Object} Stream-like object for Pino
  */
 export const createCLIFormatter = () => {
-  try {
-    // Try pino-colada first (best formatting)
-    const colada = pinoColada();
-    colada.pipe(process.stdout);
-    return colada;
-  } catch (error) {
-    // Ultimate fallback - basic formatted output (works in all environments)
-    return {
-      write: (chunk) => {
-        try {
-          const log = JSON.parse(chunk);
-          
-          // Get component info
-          const component = COMPONENT_SCHEME[log.name] || COMPONENT_SCHEME['core'];
-          const componentName = component.name.toUpperCase().replace(/([a-z])([A-Z])/g, '$1-$2');
-          
-          // Get level info  
-          const level = LEVEL_SCHEME[log.level] || LEVEL_SCHEME[30];
-          
-          // Format timestamp like pino-pretty
-          const timestamp = new Date(log.time).toLocaleTimeString('en-US', {
-            hour12: false,
-            hour: '2-digit', 
-            minute: '2-digit',
-            second: '2-digit',
-            fractionalSecondDigits: 1
+  return {
+    write: (chunk) => {
+      try {
+        const log = JSON.parse(chunk);
+        
+        // Get component info from configManager (supports custom components)
+        const component = configManager.getComponentConfig(log.name);
+        const componentName = component.name;
+        
+        // Get level info  
+        const level = LEVEL_SCHEME[log.level] || LEVEL_SCHEME[30];
+        
+        // Format timestamp
+        const timestamp = new Date(log.time).toLocaleTimeString('en-US', {
+          hour12: false,
+          hour: '2-digit', 
+          minute: '2-digit',
+          second: '2-digit',
+          fractionalSecondDigits: 1
+        });
+        
+        // Format main message
+        const message = `${level.emoji} [${componentName}] ${log.msg || ''}`;
+        console.log(`${timestamp} ${message}`);
+        
+        // Display context data (exclude pino internal fields)
+        const internalFields = ['level', 'time', 'msg', 'pid', 'hostname', 'name', 'v', 'environment'];
+        const contextKeys = Object.keys(log).filter(key => !internalFields.includes(key));
+        
+        if (contextKeys.length > 0) {
+          contextKeys.forEach((key, index) => {
+            const isLast = index === contextKeys.length - 1;
+            const prefix = isLast ? '   └─' : '   ├─';
+            const value = formatValue(log[key]);
+            console.log(`${prefix} ${key}: ${value}`);
           });
-          
-          // Format message like pino-pretty messageFormat
-          const message = `${level.emoji} [${componentName}] ${log.msg || ''}`;
-          
-          // Output with timestamp prefix
-          console.log(`${timestamp} ${message}`);
-          
-        } catch (error) {
-          // Raw fallback
-          console.log(chunk);
         }
+        
+      } catch (error) {
+        // Raw fallback for malformed JSON
+        console.log(chunk);
       }
-    };
-  }
+    }
+  };
 };

package/index.js

@@ -7,7 +7,7 @@ import pino from 'pino';
 import {configManager} from './config/config-manager.js';
 import {COMPONENT_SCHEME} from './config/component-schemes.js';
 import defaultConfig from './config/default-config.json' with { type: 'json' };
-import {getEnvironment, isBrowser, isCLI} from './utils/environment-detector.js';
+import {getEnvironment, isBrowser, isCLI, forceEnvironment} from './utils/environment-detector.js';
 import {createBrowserFormatter} from './formatters/browser-formatter.js';
 import {createCLIFormatter} from './formatters/cli-formatter.js';
 import {createServerFormatter, getServerConfig} from './formatters/server-formatter.js';
@@ -25,7 +25,7 @@ class JSGLogger {
     constructor() {
         this.loggers = {};
         this.logStore = new LogStore();
-        this.environment = getEnvironment();
+        this.environment = null; // Will be set after config loads
         this.initialized = false;
         this.components = {}; // Auto-discovery getters
     }
@@ -49,10 +49,17 @@ class JSGLogger {
      * @returns {Object} Enhanced logger exports with controls API
      */
     static getInstanceSync(options = {}) {
+        const hasOptions = options && Object.keys(options).length > 0;
+        
         if (!JSGLogger._instance) {
+            // First time initialization
             JSGLogger._instance = new JSGLogger();
             JSGLogger._enhancedLoggers = JSGLogger._instance.initSync(options);
+        } else if (hasOptions) {
+            // Instance exists but new options provided - reinitialize
+            JSGLogger._enhancedLoggers = JSGLogger._instance.initSync(options);
         }
+        
         return JSGLogger._enhancedLoggers;
     }
 
@@ -63,11 +70,22 @@ class JSGLogger {
      */
     async init(options = {}) {
         try {
-            // Load configuration
+            // Load configuration FIRST (before environment detection)
             if (options.configPath || options.config) {
                 await configManager.loadConfig(options.configPath || options.config);
+            } else if (options) {
+                // Support inline config passed as options
+                await configManager.loadConfig(options);
             }
 
+            // Apply forceEnvironment if specified in config
+            if (configManager.config.forceEnvironment) {
+                forceEnvironment(configManager.config.forceEnvironment);
+            }
+
+            // NOW determine environment (after config is loaded and forceEnvironment is applied)
+            this.environment = getEnvironment();
+
             // Create loggers for all available components
             const components = configManager.getAvailableComponents();
 
@@ -107,15 +125,42 @@ class JSGLogger {
 
     /**
      * Initialize synchronously with default configuration
+     * @param {Object} options - Initialization options
      * @returns {Object} Logger instance with all components
      */
-    initSync() {
+    initSync(options = {}) {
         try {
+            // Load inline config if provided (sync loading for objects)
+            if (options && Object.keys(options).length > 0) {
+                // Reset to default config for clean reinitialization
+                // This ensures each reinit starts from a known state
+                configManager.config = {...defaultConfig};
+                
+                // Normalize the inline config first
+                const normalizedOptions = configManager._normalizeConfigStructure(options);
+                // Merge inline config with default config
+                configManager.config = configManager.mergeConfigs(configManager.config, normalizedOptions);
+            }
+
+            // Apply forceEnvironment if specified in config
+            if (configManager.config.forceEnvironment) {
+                forceEnvironment(configManager.config.forceEnvironment);
+            }
+
+            // NOW determine environment (after config is loaded and forceEnvironment is applied)
+            this.environment = getEnvironment();
+
+            // Clear existing loggers for clean reinitialization
+            this.loggers = {};
+            this.components = {};
+
             // Create loggers for all available components using default config
             const components = configManager.getAvailableComponents();
 
             components.forEach(componentName => {
-                this.loggers[componentName] = this.createLogger(componentName);
+                // Use original createLogger to bypass utility method caching
+                const createFn = this._createLoggerOriginal || this.createLogger.bind(this);
+                this.loggers[componentName] = createFn(componentName);
             });
 
             // Create legacy compatibility aliases
@@ -181,7 +226,54 @@ class JSGLogger {
         logger._componentName = component.name;
         logger._effectiveLevel = configManager.getEffectiveLevel(componentName);
 
-        return logger;
+        // Wrap pino logger to support (message, context) syntax
+        const wrappedLogger = this._wrapPinoLogger(logger);
+
+        return wrappedLogger;
+    }
+
+    /**
+     * Wrap Pino logger to support (message, context) syntax
+     * Transforms calls from logger.info('msg', {ctx}) to pino's logger.info({ctx}, 'msg')
+     * @param {Object} pinoLogger - Original pino logger instance
+     * @returns {Object} Wrapped logger with enhanced syntax
+     * @private
+     */
+    _wrapPinoLogger(pinoLogger) {
+        const levels = ['trace', 'debug', 'info', 'warn', 'error', 'fatal'];
+        const wrapped = {};
+
+        levels.forEach(level => {
+            wrapped[level] = (first, ...args) => {
+                // Handle different argument patterns
+                if (typeof first === 'string') {
+                    // Pattern: logger.info('message', {context})
+                    const message = first;
+                    if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null) {
+                        // Has context object
+                        pinoLogger[level](args[0], message);
+                    } else {
+                        // Just message
+                        pinoLogger[level](message);
+                    }
+                } else if (typeof first === 'object' && first !== null) {
+                    // Pattern: logger.info({context}, 'message') - already pino format
+                    pinoLogger[level](first, ...args);
+                } else {
+                    // Fallback: just pass through
+                    pinoLogger[level](first, ...args);
+                }
+            };
+        });
+
+        // Copy over all other properties from original logger
+        Object.keys(pinoLogger).forEach(key => {
+            if (!wrapped[key]) {
+                wrapped[key] = pinoLogger[key];
+            }
+        });
+
+        return wrapped;
     }
 
     /**
@@ -203,13 +295,19 @@ class JSGLogger {
      * @private
      */
     addUtilityMethods() {
-        // Create logger on demand
+        // Store reference to original createLogger before overriding
+        const originalCreateLogger = this.createLogger.bind(this);
+        
+        // Create logger on demand (reuses existing loggers)
         this.createLogger = (componentName) => {
             if (!this.loggers[componentName]) {
-                this.loggers[componentName] = this.createLogger(componentName);
+                this.loggers[componentName] = originalCreateLogger(componentName);
             }
             return this.loggers[componentName];
         };
+        
+        // Store the original for internal use
+        this._createLoggerOriginal = originalCreateLogger;
     }
 
     /**
@@ -506,23 +604,33 @@ class JSGLogger {
     }
 
     /**
-     * Get a specific component logger with non-destructive error handling
+     * Get a specific component logger with auto-creation for custom components
      * @param {string} componentName - Component name to retrieve
-     * @returns {Object} Logger instance or error-context logger
+     * @returns {Object} Logger instance (auto-created if needed)
      */
     getComponent(componentName) {
+        // If logger doesn't exist, auto-create it for custom components
         if (!this.loggers[componentName]) {
-            const available = Object.keys(this.loggers).join(', ');
+            // Check if this is a configured component or custom component
+            const hasConfig = configManager.config.components?.[componentName];
+            const hasScheme = COMPONENT_SCHEME[componentName];
             
-            // Log the error using the config logger if available
-            if (this.loggers.config) {
-                this.loggers.config.warn(`Component '${componentName}' not found. Available: ${available}`);
-            } else {
-                console.warn(`[JSG-LOGGER] Component '${componentName}' not found. Available: ${available}`);
+            if (!hasConfig && !hasScheme) {
+                // Custom component - log info and auto-create
+                if (this.loggers.core) {
+                    this.loggers.core.debug(`Auto-creating custom component logger: ${componentName}`);
+                }
             }
             
-            // Return non-destructive error logger
-            return this._createErrorLogger(componentName);
+            // Create the logger (getComponentConfig will auto-generate config for custom components)
+            this.loggers[componentName] = this.createLogger(componentName);
+            
+            // Also add to auto-discovery getters
+            this.components[componentName] = () => this.getComponent(componentName);
+            const camelName = componentName.replace(/-([a-z])/g, (match, letter) => letter.toUpperCase());
+            if (camelName !== componentName) {
+                this.components[camelName] = () => this.getComponent(componentName);
+            }
         }
         
         return this.loggers[componentName];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crimsonsunset/jsg-logger",
-  "version": "1.4.0",
+  "version": "1.5.2",
   "type": "module",
   "description": "JSG Logger - Multi-environment logger with smart detection, file-level overrides, and beautiful console formatting",
   "main": "index.js",
@@ -34,12 +34,8 @@
     "preact": "^10.27.1"
   },
   "devDependencies": {
-    "pino-colada": "^2.2.2",
     "vite": "^5.1.3"
   },
-  "peerDependencies": {
-    "pino-colada": "^2.2.2"
-  },
   "files": [
     "index.js",
     "config/",
@@ -69,6 +65,8 @@
     "./examples/*": "./examples/*"
   },
   "scripts": {
+    "test": "node tests/run-all.js",
+    "test:watch": "nodemon --watch . --ext js --exec 'npm test'",
     "dev": "vite",
     "dev:devtools": "vite",
     "test:devtools": "vite",

package/utils/environment-detector.js

@@ -3,20 +3,50 @@
  * Smart detection of browser, CLI, and server environments
  */
 
+// Store forced environment override
+let forcedEnvironment = null;
+
+/**
+ * Force environment detection to a specific value
+ * @param {'browser'|'cli'|'server'|null} env - Environment to force, or null to reset
+ */
+export const forceEnvironment = (env) => {
+  if (env !== null && !['browser', 'cli', 'server'].includes(env)) {
+    console.warn(`[JSG-LOGGER] Invalid environment "${env}". Must be 'browser', 'cli', 'server', or null.`);
+    return;
+  }
+  forcedEnvironment = env;
+};
+
 /**
  * Check if running in browser environment
  * @returns {boolean}
  */
 export const isBrowser = () => {
+  if (forcedEnvironment) return forcedEnvironment === 'browser';
   return typeof window !== 'undefined' && typeof document !== 'undefined';
 };
 
 /**
  * Check if running in CLI/terminal environment
+ * Enhanced detection for various terminal contexts
  * @returns {boolean}
  */
 export const isCLI = () => {
-  return typeof process !== 'undefined' && process.stdout && process.stdout.isTTY;
+  if (forcedEnvironment) return forcedEnvironment === 'cli';
+  
+  if (typeof process === 'undefined') return false;
+  
+  // Check multiple signals for TTY/terminal environment
+  const hasTTY = process.stdout?.isTTY || process.stderr?.isTTY;
+  const hasTermEnv = process.env.TERM || process.env.COLORTERM;
+  const notCI = !process.env.CI && !process.env.GITHUB_ACTIONS;
+  
+  // Consider it CLI if:
+  // 1. Has TTY (traditional check)
+  // 2. Has TERM/COLORTERM environment variables (terminal detected)
+  // 3. Not running in CI/automation environment
+  return hasTTY || (hasTermEnv && notCI);
 };
 
 /**
@@ -24,6 +54,7 @@ export const isCLI = () => {
  * @returns {boolean}
  */
 export const isServer = () => {
+  if (forcedEnvironment) return forcedEnvironment === 'server';
   return !isBrowser() && !isCLI();
 };
 
@@ -32,6 +63,7 @@ export const isServer = () => {
  * @returns {'browser'|'cli'|'server'}
  */
 export const getEnvironment = () => {
+  if (forcedEnvironment) return forcedEnvironment;
   if (isBrowser()) return 'browser';
   if (isCLI()) return 'cli';
   return 'server';