@crimsonsunset/jsg-logger 1.7.0 → 1.7.4

package/CHANGELOG.md

@@ -5,7 +5,32 @@ All notable changes to the JSG Logger project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [1.6.0] - 2025-01-XX 🎯 **Config-Driven Tree-Shaking & Enhanced Logging**
+## [1.7.3] - 2025-11-06 🎛️ **DevTools Logging Cleanup**
+
+### Fixed
+- **Meta-Logger Scope** - Clarified meta-logger is for bootstrap logs only
+  - Removed `'logger'` mode option (now just `true`/`false`)
+  - Updated JSDoc to emphasize "BOOTSTRAP ONLY" usage
+  - Post-init errors now use actual logger if available, fallback to console
+- **DevTools Component-Based Logging** - Fixed DevTools to use proper component logging
+  - Added `devtools-ui` component to `COMPONENT_SCHEME` (🎛️ emoji, purple color)
+  - DevTools controls API (`enableDevPanel`, `disableDevPanel`) now use `devtools-ui` component instead of `core`
+  - All DevTools files now import logger directly instead of using window globals
+  - Removed manual `[JSG-DEVTOOLS]` prefixes from all log messages (logger adds component name automatically)
+  - DevTools logs now show as `🎛️ [DEVTOOLS]` instead of `🎯 [CORE] [JSG-LOGGER]`
+
+### Changed
+- **DevTools Logging Pattern** - Standardized DevTools logging approach
+  - Pattern: `import logger from '../../index.js'; const devtoolsLogger = logger.getComponent('devtools-ui');`
+  - No console fallbacks needed (`getComponent` always returns valid logger)
+  - Clean component-based logging throughout DevTools lifecycle
+
+### Technical Details
+- **Files Modified**: `utils/meta-logger.js`, `index.js`, `config/config-manager.js`, `config/component-schemes.js`
+- **DevTools Files**: `devtools/src/panel-entry.jsx`, `devtools/src/App.jsx`, `devtools/components/GlobalControls.js`, `devtools/components/DevToolsPanel.js`
+- **Result**: Consistent, component-based logging with proper formatting and no manual prefixes
+
+## [1.7.0] - 2025-01-XX 🎯 **Config-Driven Tree-Shaking & Enhanced Logging**
 
 ### Added
 - **Config-Driven Tree-Shaking** - DevTools panel tree-shaking now based on default config at module load time
@@ -56,13 +81,118 @@ No breaking changes. Existing code continues to work.
 - No special Vite config needed for production builds
 - npm link users: add `server.fs.allow: ['..']` to Vite config for dev
 
-## [Unreleased]
+## [1.7.1] - 2025-11-05 🎯 **TypeScript Support & Zero-Optional-Chaining API**
 
-## [1.5.2] - 2025-10-25 🐛 **PATCH: CLI Formatter Custom Component Display**
+### Added
+- **TypeScript Definitions** - Full TypeScript support with `index.d.ts`
+  - Complete type definitions for all logger interfaces
+  - `LoggerInstance`, `LoggerComponents`, `LoggerInstanceType` interfaces
+  - Proper exports configuration in `package.json` with `types` field
+- **Safe Component Getters** - Component getters initialized in constructor
+  - `_initializeSafeComponentGetters()` ensures components accessible before initialization
+  - Common components (reactComponents, astroComponents, etc.) always available
+  - Returns no-op logger factories if logger not initialized yet
+
+### Changed
+- **getComponent Always Available** - `getComponent` is now non-optional in TypeScript types
+  - Removed `?` optional marker from `getComponent` in `LoggerInstanceType`
+  - Always returns a logger instance (no-op if not initialized)
+  - Consumers can call `loggerInstance.getComponent('componentName')` without optional chaining
+- **Fallback Logger Enhancement** - `createFallbackLogger()` now includes `getComponent`
+  - Ensures `getComponent` exists even when initialization fails
+  - Returns no-op logger factory for safe fallback behavior
+- **Enhanced getComponent Safety** - Improved error handling and edge cases
+  - Returns no-op logger if instance not initialized
+  - Returns no-op logger if logger creation fails
+  - Prevents crashes when logger unavailable
+
+### Fixed
+- **Optional Chaining Burden** - Eliminated need for `?.` optional chaining in consumer code
+  - Consumers can now use `loggerInstance.getComponent('componentName').debug(...)` directly
+  - No more `loggerInstance?.getComponent?.('componentName')?.debug(...)` chains
+  - TypeScript types guarantee `getComponent` always exists
+
+### Technical Details
+- **File**: `index.d.ts` (NEW)
+  - Complete TypeScript definitions for the logger package
+  - Non-optional `getComponent` method signature
+  - Proper interface documentation
+  
+- **File**: `index.js`
+  - Added `_initializeSafeComponentGetters()` method called in constructor
+  - Enhanced `getComponent()` to always return logger (no-op fallback)
+  - Added `_createNoOpLogger()` private method for safe fallbacks
+  - Updated `createFallbackLogger()` to include `getComponent`
+  - Modified `_createAutoDiscoveryGetters()` to preserve safe getters
+
+- **File**: `package.json`
+  - Added `"types": "./index.d.ts"` field
+  - Added `index.d.ts` to `files` array
+  - Updated `exports` to include proper TypeScript types export
+
+### Migration Notes
+No breaking changes. Existing code continues to work, but optional chaining is now optional (pun intended).
+
+**For consumers:**
+- Can now use `loggerInstance.getComponent('componentName')` without `?.`
+- TypeScript users get full type safety and autocomplete
+- No-op logger returned if logger not initialized (safe to call)
+- Recommended: Use `getInstanceSync()` for synchronous access instead of `getInstance()` when possible
+
+## [1.7.0] - 2025-01-XX 🎯 **Config-Driven Tree-Shaking & Enhanced Logging**
+
+### Added
+- **Config-Driven Tree-Shaking** - DevTools panel tree-shaking now based on default config at module load time
+  - Tree-shaking determined by `defaultConfig.devtools.enabled` (default: `false`)
+  - When disabled, devtools code completely tree-shaken (zero bundle impact)
+  - When enabled via runtime config, loads dynamically on demand
+  - Static import analysis allows bundlers to eliminate unused code paths
+- **Comprehensive DevTools Logging** - Added detailed logging throughout DevTools lifecycle
+  - Module load: logs default config tree-shaking status
+  - Config loading: logs when devtools enabled/disabled via user config
+  - DevTools activation: logs pre-load status, dynamic loading, and initialization steps
+  - Config merge: logs devtools status changes between defaults and user config
+
+### Changed
+- **DevTools Import Strategy** - Simplified to relative path imports
+  - Removed complex Function constructor + package export path logic
+  - Uses simple relative path: `./devtools/dist/panel-entry.js`
+  - Works in production builds, requires `server.fs.allow: ['..']` for npm link dev
+- **Config Loading Logging** - Enhanced visibility into config loading process
+  - Logs config source (file path vs inline object)
+  - Logs devtools status before/after config merge
+  - Logs initialization start with config source information
 
 ### 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
+- **Tree-Shaking Detection** - Bundlers can now properly analyze and eliminate devtools code when disabled
+- **DevTools Pre-loading** - Non-blocking pre-load when default config enables devtools
+- **Runtime Config Override** - Dynamic loading works correctly when runtime config enables devtools but default disabled
+
+### Technical Details
+- **File**: `index.js`
+  - Added conditional static import based on `defaultConfig.devtools.enabled`
+  - Lazy initialization pattern to avoid top-level await
+  - Enhanced `enableDevPanel()` with comprehensive logging
+  - Pre-loads devtools module when default config enables it
+  
+- **File**: `config/config-manager.js`
+  - Added logging for config loading (file vs inline)
+  - Added devtools status logging before/after config merge
+  - Enhanced visibility into config changes
+
+### Migration Notes
+No breaking changes. Existing code continues to work.
+
+**For consumers:**
+- DevTools code tree-shaken by default (zero bundle impact)
+- Enable via runtime config: `{ devtools: { enabled: true } }`
+- DevTools loads dynamically when `enableDevPanel()` called
+- No special Vite config needed for production builds
+- npm link users: add `server.fs.allow: ['..']` to Vite config for dev
+
+## [Unreleased]
+
+## [1.5.2] - 2025-10-25 🐛 **PATCH: CLI Formatter Custom Component Display**
 
 ### Technical Changes
 - `formatters/cli-formatter.js` - Use `configManager.getComponentConfig()` instead of static `COMPONENT_SCHEME`

package/config/component-schemes.js

@@ -16,7 +16,8 @@ export const COMPONENT_SCHEME = {
   'websocket': { emoji: '🔗', color: '#1ABC9C', name: 'WEBSOCKET' },
   'notification': { emoji: '🔔', color: '#E74C3C', name: 'NOTIFICATION' },
   'router': { emoji: '🛣️', color: '#3498DB', name: 'ROUTER' },
-  'cache': { emoji: '💨', color: '#95A5A6', name: 'CACHE' }
+  'cache': { emoji: '💨', color: '#95A5A6', name: 'CACHE' },
+  'devtools-ui': { emoji: '🎛️', color: '#8E44AD', name: 'DEVTOOLS' }
 };
 
 export const LEVEL_SCHEME = {

package/config/config-manager.js

@@ -6,6 +6,7 @@
 
 import defaultConfig from './default-config.json' with { type: 'json' };
 import {COMPONENT_SCHEME, LEVEL_SCHEME} from './component-schemes.js';
+import {metaLog} from '../utils/meta-logger.js';
 
 export class ConfigManager {
     constructor() {
@@ -25,11 +26,11 @@ export class ConfigManager {
 
             if (typeof configSource === 'string') {
                 // Load from file path - handle all path formats
-                console.log(`[JSG-LOGGER] Loading config from file: ${configSource}`);
+                metaLog(`[JSG-LOGGER] Loading config from file: ${configSource}`);
                 externalConfig = await this._loadConfigFromPath(configSource);
             } else if (typeof configSource === 'object') {
                 // Direct config object
-                console.log('[JSG-LOGGER] Loading inline config object:', Object.keys(configSource));
+                metaLog('[JSG-LOGGER] Loading inline config object:', Object.keys(configSource));
                 externalConfig = configSource;
             }
 
@@ -46,17 +47,17 @@ export class ConfigManager {
             // Log devtools activation status
             const finalDevtoolsEnabled = this.config.devtools?.enabled ?? false;
             if (finalDevtoolsEnabled !== devtoolsBefore) {
-                console.log(`[JSG-LOGGER] DevTools ${finalDevtoolsEnabled ? 'ENABLED' : 'DISABLED'} via user config (was ${devtoolsBefore ? 'enabled' : 'disabled'} in defaults)`);
+                metaLog(`[JSG-LOGGER] DevTools ${finalDevtoolsEnabled ? 'ENABLED' : 'DISABLED'} via user config (was ${devtoolsBefore ? 'enabled' : 'disabled'} in defaults)`);
                 if (finalDevtoolsEnabled) {
-                    console.log('[JSG-LOGGER] DevTools will be available when enableDevPanel() is called');
+                    metaLog('[JSG-LOGGER] DevTools will be available when enableDevPanel() is called');
                 }
             } else {
-                console.log(`[JSG-LOGGER] DevTools status: ${finalDevtoolsEnabled ? 'ENABLED' : 'DISABLED'} (using default config)`);
+                metaLog(`[JSG-LOGGER] DevTools status: ${finalDevtoolsEnabled ? 'ENABLED' : 'DISABLED'} (using default config)`);
             }
 
             return this.config;
         } catch (error) {
-            console.error('ConfigManager: Error loading configuration:', error);
+            metaError('ConfigManager: Error loading configuration:', error);
             return this.config; // Return default config on error
         }
     }
@@ -92,14 +93,14 @@ export class ConfigManager {
             
             if (config) {
                 this.loadedPaths.push(configPath);
-                console.log(`[JSG-LOGGER] Successfully loaded config from: ${configPath}`);
+                metaLog(`[JSG-LOGGER] Successfully loaded config from: ${configPath}`);
                 return config;
             } else {
-                console.warn(`[JSG-LOGGER] Could not load config from: ${configPath} - using defaults`);
+                metaLog(`[JSG-LOGGER] Could not load config from: ${configPath} - using defaults`);
                 return {};
             }
         } catch (error) {
-            console.warn(`[JSG-LOGGER] Failed to load config from ${configPath}:`, error.message);
+            metaLog(`[JSG-LOGGER] Failed to load config from ${configPath}:`, error.message);
             return {};
         }
     }
@@ -199,7 +200,7 @@ export class ConfigManager {
         if (config.environments) {
             // For now, just log that environment configs exist
             // TODO: Implement environment-based config selection
-            console.log(`[JSG-LOGGER] Found environment configs for: ${Object.keys(config.environments).join(', ')}`);
+            metaLog(`[JSG-LOGGER] Found environment configs for: ${Object.keys(config.environments).join(', ')}`);
         }
         
         // Normalize component configurations

package/config/default-config.json

@@ -2,6 +2,7 @@
   "projectName": "JSG Logger",
   "globalLevel": "info",
   "autoRegister": true,
+  "metaLogging": true,
   "format": {
     "style": "brackets",
     "componentCase": "upper",

package/devtools/dist/__vite-browser-external-2Ng8QIWW.js

@@ -0,0 +1,5 @@
+const __viteBrowserExternal = {};
+export {
+  __viteBrowserExternal as default
+};
+//# sourceMappingURL=__vite-browser-external-2Ng8QIWW.js.map

package/devtools/dist/__vite-browser-external-2Ng8QIWW.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"__vite-browser-external-2Ng8QIWW.js","sources":["../__vite-browser-external"],"sourcesContent":["export default {}"],"names":[],"mappings":"AAAA,MAAA,wBAAe,CAAA;"}