@crimsonsunset/jsg-logger 1.1.7 → 1.4.0

package/examples/advanced-config.json

@@ -11,141 +11,131 @@
     "timestamp": true,
     "emoji": true,
     "component": true,
-    "level": false,
+    "level": true,
     "message": true,
     "jsonPayload": true,
     "stackTrace": true
   },
   "components": {
-    "cacp": { 
+    "core": { 
       "emoji": "🎯", 
       "color": "#4A90E2", 
       "name": "JSG-CORE",
       "level": "debug"
     },
-    "soundcloud": { 
-      "emoji": "🎵", 
+    "api": { 
+      "emoji": "🔌", 
       "color": "#FF5500", 
-      "name": "SoundCloud",
+      "name": "API",
       "level": "trace"
     },
-    "youtube": { 
-      "emoji": "📹", 
+    "database": { 
+      "emoji": "💾", 
       "color": "#FF0000", 
-      "name": "YouTube",
+      "name": "Database",
       "level": "info"
     },
-    "site-detector": { 
-      "emoji": "🔍", 
+    "auth": { 
+      "emoji": "🔐", 
       "color": "#00C896", 
-      "name": "SiteDetector",
+      "name": "Auth",
       "level": "debug"
     },
-    "websocket": { 
-      "emoji": "🌐", 
+    "utils": { 
+      "emoji": "🛠️", 
       "color": "#9B59B6", 
-      "name": "WebSocket",
+      "name": "Utils",
       "level": "warn"
     },
-    "popup": { 
-      "emoji": "🎛️", 
+    "ui": { 
+      "emoji": "🎨", 
       "color": "#FF6B6B", 
-      "name": "Popup",
-      "level": "debug"
-    },
-    "background": { 
-      "emoji": "🔧", 
-      "color": "#4ECDC4", 
-      "name": "Background",
+      "name": "UI",
       "level": "info"
     },
-    "priority-manager": { 
-      "emoji": "⚖️", 
-      "color": "#45B7D1", 
-      "name": "PriorityManager",
-      "level": "warn"
-    },
-    "settings": { 
+    "service": { 
       "emoji": "⚙️", 
-      "color": "#96CEB4", 
-      "name": "Settings",
-      "level": "info"
+      "color": "#4ECDC4", 
+      "name": "Service",
+      "level": "error"
     },
     "test": { 
       "emoji": "🧪", 
       "color": "#FFEAA7", 
       "name": "Test",
-      "level": "trace"
+      "level": "debug"
     }
   },
-  "fileOverrides": {
-    "src/sites/soundcloud.js": { 
-      "level": "trace",
-      "component": "soundcloud",
-      "emoji": "🎵",
+  "environments": {
+    "development": {
+      "globalLevel": "debug",
       "display": {
-        "timestamp": true,
-        "emoji": true,
-        "component": true,
         "level": true,
-        "message": true,
-        "jsonPayload": true,
+        "timestamp": true,
         "stackTrace": true
+      },
+      "components": {
+        "api": "trace",
+        "database": "debug",
+        "auth": "trace"
       }
     },
-    "src/managers/*.js": { 
-      "level": "warn",
+    "test": {
+      "globalLevel": "warn",
       "display": {
-        "jsonPayload": false
+        "emoji": false,
+        "timestamp": false
+      },
+      "components": {
+        "test": "trace",
+        "api": "debug"
       }
     },
-    "src/popup.js": { 
-      "level": "debug",
-      "emoji": "🎛️",
-      "timestampMode": "relative",
+    "production": {
+      "globalLevel": "error",
       "display": {
-        "timestamp": true,
-        "emoji": true,
-        "component": true,
-        "level": false,
-        "message": true,
-        "jsonPayload": false,
+        "emoji": false,
+        "component": false,
+        "stackTrace": false
+      },
+      "components": {
+        "core": "warn",
+        "auth": "info",
+        "api": "warn"
+      }
+    }
+  },
+  "fileOverrides": {
+    "src/api/auth.js": { 
+      "level": "trace",
+      "component": "auth",
+      "description": "Debug auth endpoints",
+      "display": {
+        "jsonPayload": true,
         "stackTrace": true
       }
     },
-    "src/background.js": {
+    "src/database/*.js": {
+      "level": "debug",
+      "component": "database", 
+      "description": "Database operations debugging"
+    },
+    "src/ui/components/**": {
       "level": "info",
+      "component": "ui",
+      "description": "UI component lifecycle",
       "display": {
         "jsonPayload": false,
         "stackTrace": false
       }
     },
-    "src/cacp.js": {
+    "src/core.js": {
       "level": "debug",
       "emoji": "🎯",
       "display": {
         "level": true,
         "jsonPayload": true
       }
-    },
-    "src/sites/youtube.js": {
-      "level": "info",
-      "emoji": "📹",
-      "timestampMode": "readable",
-      "display": {
-        "timestamp": true,
-        "jsonPayload": false
-      }
-    },
-    "src/test-*.js": {
-      "level": "trace",
-      "emoji": "🧪",
-      "timestampMode": "disable",
-      "display": {
-        "timestamp": false,
-        "level": true,
-        "jsonPayload": true
-      }
     }
   }
 }

package/formatters/cli-formatter.js

@@ -25,7 +25,7 @@ export const createCLIFormatter = () => {
           const log = JSON.parse(chunk);
           
           // Get component info
-          const component = COMPONENT_SCHEME[log.name] || COMPONENT_SCHEME['cacp'];
+          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  

package/index.js

@@ -20,6 +20,7 @@ import {LogStore} from './stores/log-store.js';
 class JSGLogger {
     // Static singleton instance
     static _instance = null;
+    static _enhancedLoggers = null;
 
     constructor() {
         this.loggers = {};
@@ -32,27 +33,27 @@ class JSGLogger {
     /**
      * Get singleton instance with auto-initialization
      * @param {Object} options - Initialization options (only used on first call)
-     * @returns {Promise<JSGLogger>} Singleton logger instance
+     * @returns {Promise<Object>} Enhanced logger exports with controls API
      */
     static async getInstance(options = {}) {
         if (!JSGLogger._instance) {
             JSGLogger._instance = new JSGLogger();
-            await JSGLogger._instance.init(options);
+            JSGLogger._enhancedLoggers = await JSGLogger._instance.init(options);
         }
-        return JSGLogger._instance;
+        return JSGLogger._enhancedLoggers;
     }
 
     /**
      * Get singleton instance synchronously (for environments without async support)
      * @param {Object} options - Initialization options (only used on first call) 
-     * @returns {JSGLogger} Singleton logger instance
+     * @returns {Object} Enhanced logger exports with controls API
      */
     static getInstanceSync(options = {}) {
         if (!JSGLogger._instance) {
             JSGLogger._instance = new JSGLogger();
-            JSGLogger._instance.initSync(options);
+            JSGLogger._enhancedLoggers = JSGLogger._instance.initSync(options);
         }
-        return JSGLogger._instance;
+        return JSGLogger._enhancedLoggers;
     }
 
     /**
@@ -86,8 +87,8 @@ class JSGLogger {
             this.initialized = true;
 
             // Log initialization success
-            if (this.loggers.cacp) {
-                this.loggers.cacp.info('JSG Logger initialized', {
+            if (this.loggers.core) {
+                this.loggers.core.info('JSG Logger initialized', {
                     environment: this.environment,
                     components: components.length,
                     projectName: configManager.getProjectName(),
@@ -129,8 +130,8 @@ class JSGLogger {
             this.initialized = true;
 
             // Log initialization success
-            if (this.loggers.cacp) {
-                this.loggers.cacp.info('JSG Logger initialized (sync)', {
+            if (this.loggers.core) {
+                this.loggers.core.info('JSG Logger initialized (sync)', {
                     environment: this.environment,
                     components: components.length,
                     projectName: configManager.getProjectName(),
@@ -184,13 +185,17 @@ class JSGLogger {
     }
 
     /**
-     * Create legacy compatibility aliases
+     * Create component aliases (for camelCase/kebab-case compatibility)
      * @private
      */
     createAliases() {
-        // Legacy compatibility for existing codebase
-        this.loggers.siteDetector = this.loggers['site-detector'];
-        this.loggers.priorityManager = this.loggers['priority-manager'];
+        // Auto-generate camelCase aliases for kebab-case component names
+        Object.keys(this.loggers).forEach(componentName => {
+            if (componentName.includes('-')) {
+                const camelCase = componentName.replace(/-([a-z])/g, (match, letter) => letter.toUpperCase());
+                this.loggers[camelCase] = this.loggers[componentName];
+            }
+        });
     }
 
     /**
@@ -333,6 +338,44 @@ class JSGLogger {
                     return configManager.config.components?.[component]?.level;
                 },
 
+                // DevTools panel controls
+                enableDevPanel: async () => {
+                    if (typeof window === 'undefined') {
+                        console.warn('[JSG-LOGGER] DevTools panel only available in browser environments');
+                        return null;
+                    }
+
+                    try {
+                        // In development: import source files directly for hot reload
+                        // In production: import built bundle
+                        const isDev = import.meta.env?.DEV || window.location.hostname === 'localhost';
+                        
+                        let module;
+                        if (isDev) {
+                            console.log('🔥 DEV MODE: Attempting to load DevTools from SOURCE for hot reload');
+                            try {
+                                // Fix the import path for Vite dev server
+                                const importPath = '/src/panel-entry.jsx';
+                                console.log('🔍 Importing:', importPath);
+                                module = await import(importPath);
+                                console.log('✅ Source import successful:', module);
+                            } catch (sourceError) {
+                                console.error('❌ Source import failed, falling back to bundle:', sourceError);
+                                const cacheBuster = Date.now();
+                                module = await import(`./devtools/dist/panel-entry.js?v=${cacheBuster}`);
+                            }
+                        } else {
+                            console.log('📦 PROD MODE: Loading DevTools from built bundle');
+                            const cacheBuster = Date.now();
+                            module = await import(`./devtools/dist/panel-entry.js?v=${cacheBuster}`);
+                        }
+                        return module.initializePanel();
+                    } catch (error) {
+                        console.error('[JSG-LOGGER] Failed to load DevTools panel:', error);
+                        return null;
+                    }
+                },
+
                 // System controls
                 refresh: () => this.refreshLoggers(),
                 reset: () => {
@@ -428,7 +471,7 @@ class JSGLogger {
         };
 
         return {
-            cacp: fallback,
+            core: fallback,
             createLogger: () => fallback,
             config: {environment: 'fallback'},
             logStore: {getRecent: () => [], clear: () => {}},
@@ -536,12 +579,9 @@ class JSGLogger {
     }
 }
 
-// Create singleton instance
-const logger = new JSGLogger();
-
 // Initialize synchronously with default config for immediate use
 // (Chrome extensions and other environments that don't support top-level await)
-const enhancedLoggers = logger.initSync();
+const enhancedLoggers = JSGLogger.getInstanceSync();
 
 // Make runtime controls available globally in browser for debugging
 if (isBrowser() && typeof window !== 'undefined') {
@@ -556,4 +596,4 @@ enhancedLoggers.JSGLogger = JSGLogger;
 
 // Export both the initialized loggers and the class for advanced usage
 export default enhancedLoggers;
-export {logger as JSGLogger};
+export {JSGLogger};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crimsonsunset/jsg-logger",
-  "version": "1.1.7",
+  "version": "1.4.0",
   "type": "module",
   "description": "JSG Logger - Multi-environment logger with smart detection, file-level overrides, and beautiful console formatting",
   "main": "index.js",
@@ -27,10 +27,15 @@
   },
   "homepage": "https://github.com/crimsonsunset/jsg-logger#readme",
   "dependencies": {
-    "pino": "^9.7.0"
+    "@preact/preset-vite": "^2.10.2",
+    "evergreen-ui": "^7.1.9",
+    "lodash.merge": "^4.6.2",
+    "pino": "^9.7.0",
+    "preact": "^10.27.1"
   },
   "devDependencies": {
-    "pino-colada": "^2.2.2"
+    "pino-colada": "^2.2.2",
+    "vite": "^5.1.3"
   },
   "peerDependencies": {
     "pino-colada": "^2.2.2"
@@ -64,11 +69,20 @@
     "./examples/*": "./examples/*"
   },
   "scripts": {
+    "dev": "vite",
+    "dev:devtools": "vite",
+    "test:devtools": "vite",
+    "build:devtools": "cd devtools && npm run build",
     "release:patch": "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": "npm run release:patch",
     "publish:public": "npm publish --access public",
+    "publish:github": "npm publish --registry=https://npm.pkg.github.com/ --access public",
+    "publish:dual": "npm publish --access public && npm publish --registry=https://npm.pkg.github.com/ --access public",
+    "release:dual:patch": "npm version patch && npm run publish:dual",
+    "release:dual:minor": "npm version minor && npm run publish:dual",
+    "release:dual:major": "npm version major && npm run publish:dual",
     "check": "npm run test && echo 'Package ready for publishing'"
   }
 }