npm - @mks2508/better-logger - Versions diffs - 5.0.0 → 5.0.2 - Mend

@mks2508/better-logger 5.0.0 → 5.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (162) hide show

package/dist/chunks/{Logger-Cbi1f10o.js → Logger-CKqzXDh3.js} +2 -2
package/dist/chunks/{Logger-Cbi1f10o.js.map → Logger-CKqzXDh3.js.map} +1 -1
package/dist/chunks/{Logger-BZ7B7OXE.js → Logger-D_vuKP4l.js} +2 -2
package/dist/chunks/{Logger-BZ7B7OXE.js.map → Logger-D_vuKP4l.js.map} +1 -1
package/dist/chunks/cli-module-B-njrTWb.js +2 -0
package/dist/chunks/cli-module-B-njrTWb.js.map +1 -0
package/dist/chunks/{cli-module-ClIJmaT8.js → cli-module-Cx7qotPY.js} +16 -9
package/dist/chunks/cli-module-Cx7qotPY.js.map +1 -0
package/dist/cli.cjs +1 -1
package/dist/cli.js +1 -1
package/dist/exports.cjs +1 -1
package/dist/exports.js +1 -1
package/dist/index.cjs +1 -1
package/dist/index.js +3 -3
package/dist/styling.cjs +1 -1
package/dist/styling.js +2 -2
package/dist/terminal/formatter.d.ts.map +1 -1
package/package.json +5 -1
package/.claude/settings.local.json +0 -48
package/.github/workflows/ci-quality.yml +0 -357
package/.github/workflows/docs-demo.yml +0 -119
package/.github/workflows/releases-core.yml +0 -512
package/.github/workflows/releases-full.yml +0 -582
package/.github/workflows-backup/ci.yml +0 -221
package/.github/workflows-backup/nightly.yml +0 -196
package/.github/workflows-backup/release-optimized.yml +0 -373
package/.github/workflows-backup/release.yml +0 -269
package/.release-notes-0.2.0.md +0 -129
package/.yamllint +0 -28
package/CHANGELOG.json +0 -1076
package/CHANGELOG.md +0 -209
package/CLAUDE.md +0 -217
package/bun.lock +0 -333
package/demo.html +0 -847
package/dist/chunks/cli-module-CadqgZ1Z.js +0 -2
package/dist/chunks/cli-module-CadqgZ1Z.js.map +0 -1
package/dist/chunks/cli-module-ClIJmaT8.js.map +0 -1
package/docs/API.md +0 -918
package/docs/CORE.md +0 -264
package/docs/DEVELOPMENT.md +0 -731
package/docs/EXPORTS.md +0 -467
package/docs/PACKAGES.md +0 -244
package/docs/STYLING.md +0 -405
package/docs/_config.yml +0 -36
package/docs/index.md +0 -179
package/examples/README.md +0 -208
package/examples/basic-logging.js +0 -75
package/examples/data-export.js +0 -234
package/examples/package.json +0 -16
package/examples/performance-timing.js +0 -170
package/examples/simplified-api.js +0 -124
package/examples/styling-themes.js +0 -207
package/index.html +0 -358
package/packages/core/package.json +0 -57
package/packages/exports/package.json +0 -41
package/packages/nodejs-opentui/README.md +0 -232
package/packages/nodejs-opentui/package.json +0 -72
package/packages/nodejs-opentui/src/LogRenderer.ts +0 -171
package/packages/nodejs-opentui/src/OpenTUILogHandler.ts +0 -178
package/packages/nodejs-opentui/src/components/LogBadge.tsx +0 -131
package/packages/nodejs-opentui/src/index.ts +0 -133
package/packages/nodejs-opentui/src/types.ts +0 -158
package/packages/nodejs-opentui/tsconfig.json +0 -20
package/packages/styling/package.json +0 -41
package/playground/demo-all.ts +0 -95
package/playground/demo-box.ts +0 -85
package/playground/demo-levels.ts +0 -56
package/playground/demo-real-world.ts +0 -98
package/playground/demo-spinner.ts +0 -77
package/playground/demo-steps.ts +0 -72
package/playground/demo-table.ts +0 -83
package/project-utils/README.md +0 -172
package/project-utils/auto-release-gemini.ts +0 -1193
package/project-utils/auto-release-ui.ts +0 -1329
package/project-utils/commit-generator.ts +0 -1385
package/project-utils/commit-ui.ts +0 -264
package/project-utils/git-utils.ts +0 -199
package/project-utils/github-release-manager.ts +0 -466
package/project-utils/project-config.ts +0 -260
package/project-utils/prompt-templates.js +0 -345
package/project-utils/prompt-templates.ts +0 -422
package/project-utils/version-manager.ts +0 -1078
package/public/vite.svg +0 -1
package/src/Logger.ts +0 -1858
package/src/ScopedLogger.ts +0 -256
package/src/cli/CommandProcessor.ts +0 -248
package/src/cli/commands/ConfigCommand.ts +0 -93
package/src/cli/commands/ExportCommand.ts +0 -276
package/src/cli/commands/HistoryCommand.ts +0 -117
package/src/cli/commands/StatusCommand.ts +0 -112
package/src/cli/commands/ThemeCommand.ts +0 -88
package/src/cli/help.ts +0 -127
package/src/cli/index.ts +0 -71
package/src/cli-module.ts +0 -21
package/src/cli-primitives/box.ts +0 -86
package/src/cli-primitives/cli-table.ts +0 -62
package/src/cli-primitives/divider.ts +0 -17
package/src/cli-primitives/header.ts +0 -18
package/src/cli-primitives/index.ts +0 -13
package/src/cli-primitives/server-fallback.ts +0 -54
package/src/cli-primitives/spinner.ts +0 -133
package/src/cli-primitives/step.ts +0 -22
package/src/constants.ts +0 -313
package/src/core.ts +0 -397
package/src/example.ts +0 -210
package/src/exports-module.ts +0 -311
package/src/handlers/AnalyticsLogHandler.ts +0 -22
package/src/handlers/ExportLogHandler.ts +0 -610
package/src/handlers/FileLogHandler.ts +0 -169
package/src/handlers/RemoteLogHandler.ts +0 -42
package/src/handlers/index.ts +0 -8
package/src/hooks/HookManager.ts +0 -177
package/src/hooks/index.ts +0 -1
package/src/index.ts +0 -395
package/src/main.ts +0 -196
package/src/serializers/SerializerRegistry.ts +0 -173
package/src/serializers/index.ts +0 -1
package/src/style.css +0 -96
package/src/styling/LogStyleBuilder.ts +0 -355
package/src/styling/SemanticStyles.ts +0 -380
package/src/styling/SmartPresets.ts +0 -288
package/src/styling/StyleBuilder.ts +0 -319
package/src/styling/StyleCache.ts +0 -131
package/src/styling/banners.ts +0 -168
package/src/styling/index.ts +0 -27
package/src/styling/themes.ts +0 -235
package/src/styling-module.ts +0 -244
package/src/terminal/color-converter.ts +0 -315
package/src/terminal/formatter.ts +0 -236
package/src/terminal/terminal-renderer.ts +0 -342
package/src/transports/ConsoleTransport.ts +0 -28
package/src/transports/FileTransport.ts +0 -53
package/src/transports/HttpTransport.ts +0 -56
package/src/transports/TransportManager.ts +0 -130
package/src/transports/index.ts +0 -4
package/src/types/core.ts +0 -417
package/src/types/handlers.ts +0 -95
package/src/types/hooks.ts +0 -45
package/src/types/index.ts +0 -83
package/src/types/serializers.ts +0 -30
package/src/types/transports.ts +0 -52
package/src/typescript.svg +0 -1
package/src/utils/adapter.ts +0 -291
package/src/utils/ansi-colors.ts +0 -333
package/src/utils/environment-detector.ts +0 -170
package/src/utils/environment.ts +0 -94
package/src/utils/formatting.ts +0 -332
package/src/utils/index.ts +0 -33
package/src/utils/opentui-detection.ts +0 -138
package/src/utils/output.ts +0 -227
package/src/utils/stackTrace.ts +0 -144
package/src/utils/timestamps.ts +0 -80
package/src/vite-env.d.ts +0 -1
package/src/writers/BufferWriter.ts +0 -157
package/src/writers/index.ts +0 -6
package/test-core-browser.html +0 -237
package/test-core-node.js +0 -63
package/tests/test-conflict-resolution.ts +0 -391
package/tests/validate-workflows.sh +0 -131
package/tests/yaml-autofix.sh +0 -146
package/tsconfig.json +0 -50
package/vite.config.ts +0 -256

package/demo.html DELETED Viewed

@@ -1,847 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Better Logger - Professional Console Logging</title>
-    <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>📊</text></svg>">
-    <!-- Import Better Logger from jsDelivr CDN with local fallback -->
-    <script type="module">
-        try {
-            await import('https://cdn.jsdelivr.net/npm/@mks2508/better-logger@latest/dist/index.js');
-        } catch (e) {
-            console.log('Using local fallback');
-            await import('./dist/index.js');
-        }
-    </script>
-    <style>
-        * {
-            margin: 0;
-            padding: 0;
-            box-sizing: border-box;
-        }
-        body {
-            font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-            min-height: 100vh;
-            color: #333;
-        }
-        .container {
-            max-width: 1200px;
-            margin: 0 auto;
-            padding: 20px;
-        }
-        .header {
-            text-align: center;
-            margin-bottom: 40px;
-            padding: 40px 20px;
-            background: rgba(255, 255, 255, 0.95);
-            border-radius: 20px;
-            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
-            backdrop-filter: blur(10px);
-        }
-        .logo {
-            font-size: 4rem;
-            margin-bottom: 20px;
-            background: linear-gradient(135deg, #667eea, #764ba2);
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
-            background-clip: text;
-        }
-        .title {
-            font-size: 3rem;
-            font-weight: 700;
-            margin-bottom: 10px;
-            background: linear-gradient(135deg, #667eea, #764ba2);
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
-            background-clip: text;
-        }
-        .subtitle {
-            font-size: 1.3rem;
-            color: #666;
-            margin-bottom: 30px;
-        }
-        .badges {
-            display: flex;
-            justify-content: center;
-            gap: 15px;
-            flex-wrap: wrap;
-            margin-bottom: 30px;
-        }
-        .badge {
-            display: inline-flex;
-            align-items: center;
-            padding: 8px 16px;
-            background: linear-gradient(135deg, #4facfe, #00f2fe);
-            color: white;
-            border-radius: 25px;
-            font-weight: 600;
-            text-decoration: none;
-            transition: all 0.3s ease;
-            font-size: 0.9rem;
-        }
-        .badge:hover {
-            transform: translateY(-2px);
-            box-shadow: 0 8px 25px rgba(79, 172, 254, 0.4);
-        }
-        .npm-badge { background: linear-gradient(135deg, #CB3837, #FF4D6D); }
-        .github-badge { background: linear-gradient(135deg, #333, #24292e); }
-        .docs-badge { background: linear-gradient(135deg, #00C851, #00E676); }
-        .demo-grid {
-            display: grid;
-            grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
-            gap: 30px;
-            margin-bottom: 40px;
-        }
-        .demo-section {
-            background: rgba(255, 255, 255, 0.95);
-            border-radius: 15px;
-            padding: 30px;
-            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
-            backdrop-filter: blur(10px);
-            transition: transform 0.3s ease;
-        }
-        .demo-section:hover {
-            transform: translateY(-5px);
-        }
-        .section-title {
-            font-size: 1.5rem;
-            font-weight: 700;
-            margin-bottom: 15px;
-            color: #333;
-            display: flex;
-            align-items: center;
-            gap: 10px;
-        }
-        .section-description {
-            color: #666;
-            margin-bottom: 20px;
-            line-height: 1.6;
-        }
-        .button-group {
-            display: flex;
-            flex-wrap: wrap;
-            gap: 10px;
-            margin-top: 20px;
-        }
-        .demo-btn {
-            padding: 12px 24px;
-            border: none;
-            border-radius: 8px;
-            font-weight: 600;
-            cursor: pointer;
-            transition: all 0.3s ease;
-            color: white;
-            font-size: 0.9rem;
-        }
-        .demo-btn:hover {
-            transform: translateY(-2px);
-            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
-        }
-        .btn-primary { background: linear-gradient(135deg, #667eea, #764ba2); }
-        .btn-success { background: linear-gradient(135deg, #4CAF50, #45a049); }
-        .btn-warning { background: linear-gradient(135deg, #FF9800, #F57C00); }
-        .btn-error { background: linear-gradient(135deg, #F44336, #D32F2F); }
-        .btn-info { background: linear-gradient(135deg, #2196F3, #1976D2); }
-        .btn-critical { background: linear-gradient(135deg, #9C27B0, #7B1FA2); }
-        .features-grid {
-            display: grid;
-            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
-            gap: 20px;
-            margin-bottom: 40px;
-        }
-        .feature-card {
-            background: rgba(255, 255, 255, 0.9);
-            border-radius: 12px;
-            padding: 25px;
-            text-align: center;
-            transition: transform 0.3s ease;
-        }
-        .feature-card:hover {
-            transform: translateY(-3px);
-        }
-        .feature-icon {
-            font-size: 2.5rem;
-            margin-bottom: 15px;
-        }
-        .feature-title {
-            font-weight: 700;
-            margin-bottom: 10px;
-            color: #333;
-        }
-        .feature-desc {
-            color: #666;
-            font-size: 0.9rem;
-        }
-        .console-notice {
-            background: rgba(255, 255, 255, 0.95);
-            border-radius: 15px;
-            padding: 25px;
-            text-align: center;
-            margin-bottom: 40px;
-            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
-        }
-        .console-notice h3 {
-            color: #333;
-            margin-bottom: 10px;
-            font-size: 1.3rem;
-        }
-        .console-notice p {
-            color: #666;
-            margin-bottom: 15px;
-        }
-        .console-shortcut {
-            display: inline-flex;
-            align-items: center;
-            gap: 5px;
-            background: #f5f5f5;
-            padding: 8px 12px;
-            border-radius: 8px;
-            font-family: 'Monaco', 'Consolas', monospace;
-            font-weight: 600;
-        }
-        .footer {
-            text-align: center;
-            padding: 40px 20px;
-            background: rgba(255, 255, 255, 0.9);
-            border-radius: 15px;
-            margin-top: 40px;
-        }
-        .footer-links {
-            display: flex;
-            justify-content: center;
-            gap: 30px;
-            flex-wrap: wrap;
-            margin-bottom: 20px;
-        }
-        .footer-link {
-            color: #667eea;
-            text-decoration: none;
-            font-weight: 600;
-            transition: color 0.3s ease;
-        }
-        .footer-link:hover {
-            color: #764ba2;
-        }
-        @media (max-width: 768px) {
-            .title { font-size: 2rem; }
-            .subtitle { font-size: 1.1rem; }
-            .demo-grid { grid-template-columns: 1fr; }
-            .badges { justify-content: center; }
-            .button-group { justify-content: center; }
-        }
-    </style>
-</head>
-<body>
-    <div class="container">
-        <!-- Header -->
-        <div class="header">
-            <div class="logo">📊</div>
-            <h1 class="title">Better Logger</h1>
-            <p class="subtitle">State-of-the-art console logging with advanced CSS styling, SVG support, and animations</p>
-            <div class="badges">
-                <a href="https://www.npmjs.com/package/@mks2508/better-logger" class="badge npm-badge">📦 NPM Package</a>
-                <a href="https://github.com/MKS2508/advanced-logger" class="badge github-badge">⭐ GitHub</a>
-                <a href="https://github.com/MKS2508/advanced-logger/blob/main/README.md" class="badge docs-badge">📚 Documentation</a>
-            </div>
-        </div>
-        <!-- Console Notice -->
-        <div class="console-notice">
-            <h3>🔍 Open Developer Console</h3>
-            <p>To see the magical console output, open your browser's Developer Console:</p>
-            <div class="console-shortcut">
-                <span>Press</span>
-                <kbd>F12</kbd>
-                <span>or</span>
-                <kbd>Ctrl+Shift+I</kbd>
-                <span>(Windows/Linux)</span>
-                <kbd>Cmd+Opt+I</kbd>
-                <span>(Mac)</span>
-            </div>
-        </div>
-        <!-- Features Overview -->
-        <div class="features-grid">
-            <div class="feature-card">
-                <div class="feature-icon">🎨</div>
-                <div class="feature-title">Advanced Styling</div>
-                <div class="feature-desc">CSS gradients, shadows, and modern visual effects</div>
-            </div>
-            <div class="feature-card">
-                <div class="feature-icon">🖼️</div>
-                <div class="feature-title">SVG Support</div>
-                <div class="feature-desc">Custom graphics and branded console messages</div>
-            </div>
-            <div class="feature-card">
-                <div class="feature-icon">✨</div>
-                <div class="feature-title">Animations</div>
-                <div class="feature-desc">CSS keyframe animations in console output</div>
-            </div>
-            <div class="feature-card">
-                <div class="feature-icon">📊</div>
-                <div class="feature-title">Performance</div>
-                <div class="feature-desc">Built-in timing and performance monitoring</div>
-            </div>
-            <div class="feature-card">
-                <div class="feature-icon">🔧</div>
-                <div class="feature-title">Modular</div>
-                <div class="feature-desc">Import only what you need - Core, Styling, or Exports</div>
-            </div>
-            <div class="feature-card">
-                <div class="feature-icon">🌈</div>
-                <div class="feature-title">Themes</div>
-                <div class="feature-desc">5 built-in themes: Default, Dark, Neon, Cyberpunk, Retro</div>
-            </div>
-        </div>
-        <!-- Demo Sections -->
-        <div class="demo-grid">
-            <!-- Core Logging -->
-            <div class="demo-section">
-                <h2 class="section-title">🚀 Core Logging</h2>
-                <p class="section-description">Essential logging features with beautiful styling and performance monitoring.</p>
-                <div class="button-group">
-                    <button class="demo-btn btn-info" onclick="demoBasicLogging()">Basic Levels</button>
-                    <button class="demo-btn btn-primary" onclick="demoPerformanceTiming()">Performance</button>
-                    <button class="demo-btn btn-success" onclick="demoScopedLogger()">Scoped Logger</button>
-                </div>
-            </div>
-            <!-- Visual Features -->
-            <div class="demo-section">
-                <h2 class="section-title">🎨 Visual Features</h2>
-                <p class="section-description">Advanced styling with themes, banners, SVG backgrounds, and CSS animations.</p>
-                <div class="button-group">
-                    <button class="demo-btn btn-primary" onclick="demoThemes()">Themes</button>
-                    <button class="demo-btn btn-success" onclick="demoBanners()">Banners</button>
-                    <button class="demo-btn btn-warning" onclick="demoSVGBackgrounds()">SVG Graphics</button>
-                    <button class="demo-btn btn-error" onclick="demoAnimations()">Animations</button>
-                </div>
-            </div>
-            <!-- Data Export -->
-            <div class="demo-section">
-                <h2 class="section-title">📤 Data Export</h2>
-                <p class="section-description">Export logs to CSV, JSON, XML formats and send to remote endpoints.</p>
-                <div class="button-group">
-                    <button class="demo-btn btn-info" onclick="demoLogBuffer()">Log Buffer</button>
-                    <button class="demo-btn btn-primary" onclick="demoExportCSV()">Export CSV</button>
-                    <button class="demo-btn btn-success" onclick="demoExportJSON()">Export JSON</button>
-                    <button class="demo-btn btn-warning" onclick="demoRemoteLogging()">Remote Logging</button>
-                </div>
-            </div>
-            <!-- Advanced Features -->
-            <div class="demo-section">
-                <h2 class="section-title">⚡ Advanced Features</h2>
-                <p class="section-description">Table display, grouping, stack traces, and custom styling APIs.</p>
-                <div class="button-group">
-                    <button class="demo-btn btn-primary" onclick="demoTableDisplay()">Tables</button>
-                    <button class="demo-btn btn-success" onclick="demoGrouping()">Grouping</button>
-                    <button class="demo-btn btn-info" onclick="demoStackTraces()">Stack Traces</button>
-                    <button class="demo-btn btn-critical" onclick="demoCustomStyles()">Custom Styles</button>
-                </div>
-            </div>
-            <!-- CLI Interface -->
-            <div class="demo-section">
-                <h2 class="section-title">💻 CLI Interface</h2>
-                <p class="section-description">Interactive command-line interface with configuration, help, and enumeration.</p>
-                <div class="button-group">
-                    <button class="demo-btn btn-info" onclick="demoCLIHelp()">Help</button>
-                    <button class="demo-btn btn-primary" onclick="demoCLIConfig()">Config</button>
-                    <button class="demo-btn btn-success" onclick="demoCLIFeatures()">Enumerate All</button>
-                    <button class="demo-btn btn-warning" onclick="demoCLIStatus()">Status</button>
-                </div>
-            </div>
-            <!-- Bundle Information -->
-            <div class="demo-section">
-                <h2 class="section-title">📦 Bundle Information</h2>
-                <p class="section-description">Optimized bundle sizes for different use cases and selective imports.</p>
-                <div class="button-group">
-                    <button class="demo-btn btn-info" onclick="showBundleSizes()">Bundle Sizes</button>
-                    <button class="demo-btn btn-primary" onclick="showModularImports()">Modular Imports</button>
-                    <button class="demo-btn btn-success" onclick="showCompatibility()">Compatibility</button>
-                </div>
-            </div>
-        </div>
-        <!-- Footer -->
-        <div class="footer">
-            <div class="footer-links">
-                <a href="https://github.com/MKS2508/advanced-logger" class="footer-link">GitHub Repository</a>
-                <a href="https://www.npmjs.com/package/@mks2508/better-logger" class="footer-link">NPM Package</a>
-                <a href="https://github.com/MKS2508/advanced-logger/blob/main/README.md" class="footer-link">Documentation</a>
-                <a href="https://github.com/MKS2508/advanced-logger/issues" class="footer-link">Issues & Support</a>
-                <a href="https://github.com/MKS2508/advanced-logger/blob/main/LICENSE" class="footer-link">MIT License</a>
-            </div>
-            <p style="color: #666; margin-top: 20px;">
-                Made with ❤️ by <strong>MKS2508</strong> • Better Logger v0.0.1
-            </p>
-        </div>
-    </div>
-    <script type="module">
-        // Import from CDN will be available globally after load
-        // Wait for module to load
-        setTimeout(() => {
-            if (window.BetterLogger) {
-                console.log('%c🎉 Better Logger loaded successfully!', 'background: linear-gradient(135deg, #667eea, #764ba2); color: white; padding: 10px 20px; border-radius: 8px; font-weight: bold;');
-            }
-        }, 1000);
-        // Demo Functions
-        window.demoBasicLogging = function() {
-            console.log('%c🚀 Basic Logging Demo', 'background: linear-gradient(135deg, #4facfe, #00f2fe); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            // Simulate different log levels
-            console.log('%c🔷 DEBUG: Application initialized', 'background: linear-gradient(135deg, #9E9E9E, #757575); color: white; padding: 6px 12px; border-radius: 4px;');
-            console.log('%cℹ️ INFO: User logged in successfully', 'background: linear-gradient(135deg, #2196F3, #1976D2); color: white; padding: 6px 12px; border-radius: 4px;');
-            console.log('%c⚠️ WARN: API rate limit approaching', 'background: linear-gradient(135deg, #FF9800, #F57C00); color: white; padding: 6px 12px; border-radius: 4px;');
-            console.log('%c❌ ERROR: Payment processing failed', 'background: linear-gradient(135deg, #F44336, #D32F2F); color: white; padding: 6px 12px; border-radius: 4px;');
-            console.log('%c🚨 CRITICAL: Database connection lost', 'background: linear-gradient(135deg, #9C27B0, #7B1FA2); color: white; padding: 6px 12px; border-radius: 4px;');
-        };
-        window.demoPerformanceTiming = function() {
-            console.log('%c⏱️ Performance Timing Demo', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const start = performance.now();
-            // Simulate some work
-            setTimeout(() => {
-                const end = performance.now();
-                const duration = (end - start).toFixed(2);
-                console.log(`%c📊 Operation completed in ${duration}ms`, 'background: linear-gradient(135deg, #00C851, #00E676); color: white; padding: 6px 12px; border-radius: 4px;');
-                // Show performance data
-                console.table({
-                    'Start Time': start.toFixed(2) + 'ms',
-                    'End Time': end.toFixed(2) + 'ms',
-                    'Duration': duration + 'ms',
-                    'Status': '✅ Success'
-                });
-            }, 100);
-        };
-        window.demoScopedLogger = function() {
-            console.log('%c🎯 Scoped Logger Demo', 'background: linear-gradient(135deg, #667eea, #764ba2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            console.log('%c[API] 🌐 Making HTTP request...', 'background: linear-gradient(135deg, #2196F3, #1976D2); color: white; padding: 6px 12px; border-radius: 4px;');
-            console.log('%c[AUTH] 🔐 Validating token...', 'background: linear-gradient(135deg, #FF9800, #F57C00); color: white; padding: 6px 12px; border-radius: 4px;');
-            console.log('%c[DB] 🗄️ Querying user data...', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 6px 12px; border-radius: 4px;');
-            console.log('%c[CACHE] ⚡ Cache hit for user:123', 'background: linear-gradient(135deg, #9C27B0, #7B1FA2); color: white; padding: 6px 12px; border-radius: 4px;');
-        };
-        window.demoThemes = function() {
-            console.log('%c🌈 Theme System Demo', 'background: linear-gradient(135deg, #667eea, #764ba2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const themes = [
-                { name: 'Default', colors: ['#667eea', '#764ba2'] },
-                { name: 'Dark', colors: ['#2c3e50', '#34495e'] },
-                { name: 'Neon', colors: ['#ff006e', '#fb8500'] },
-                { name: 'Cyberpunk', colors: ['#b224ef', '#7209b7'] },
-                { name: 'Retro', colors: ['#f72585', '#b5179e'] }
-            ];
-            themes.forEach((theme, index) => {
-                setTimeout(() => {
-                    const style = `background: linear-gradient(135deg, ${theme.colors[0]}, ${theme.colors[1]}); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;`;
-                    console.log(`%c🎨 ${theme.name} Theme Applied`, style);
-                }, index * 500);
-            });
-        };
-        window.demoBanners = function() {
-            console.log('%c🎭 Banner System Demo', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            // ASCII Banner
-            console.log('%c╔══════════════════════════════════╗\n║         BETTER LOGGER            ║\n║    Advanced Console Logging      ║\n╚══════════════════════════════════╝', 'color: #667eea; font-family: monospace; font-weight: bold;');
-            // Unicode Banner
-            setTimeout(() => {
-                console.log('%c▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓\n▓                                ▓\n▓        🚀 BETTER LOGGER        ▓\n▓     Professional Logging       ▓\n▓                                ▓\n▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓', 'background: linear-gradient(135deg, #667eea, #764ba2); color: white; padding: 10px; border-radius: 8px; font-family: monospace; font-weight: bold;');
-            }, 1000);
-        };
-        window.demoSVGBackgrounds = function() {
-            console.log('%c🖼️ SVG Graphics Demo', 'background: linear-gradient(135deg, #FF9800, #F57C00); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            // SVG with gradient background
-            const svgStyle = "background-image: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 400 80\"><defs><linearGradient id=\"bg\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\"><stop offset=\"0%\" style=\"stop-color:%23667eea\"/><stop offset=\"100%\" style=\"stop-color:%23764ba2\"/></linearGradient></defs><rect width=\"100%\" height=\"100%\" fill=\"url(%23bg)\" 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>'); background-size: 400px 80px; background-repeat: no-repeat; color: transparent; padding: 40px 200px; border-radius: 8px;";
-            console.log('%c ', svgStyle);
-            console.log('%c✨ Custom SVG graphics in console!', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 6px 12px; border-radius: 4px; margin-top: 10px;');
-        };
-        window.demoAnimations = function() {
-            console.log('%c✨ CSS Animations Demo', 'background: linear-gradient(135deg, #9C27B0, #7B1FA2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            // Add CSS animation keyframes
-            const style = document.createElement('style');
-            style.textContent = `
-                @keyframes loggerPulse {
-                    0%, 100% { background-position: 0% 50%; }
-                    50% { background-position: 100% 50%; }
-                }
-            `;
-            document.head.appendChild(style);
-            const animatedStyle = 'background: linear-gradient(270deg, #ff006e, #fb8500, #ff006e); background-size: 400% 100%; animation: loggerPulse 2s ease-in-out infinite; color: white; padding: 10px 20px; border-radius: 8px; font-weight: bold;';
-            setTimeout(() => {
-                console.log('%c🌟 Animated gradient background!', animatedStyle);
-                console.log('%c⚡ Watch the colors flow...', animatedStyle);
-            }, 500);
-        };
-        window.demoLogBuffer = function() {
-            console.log('%c📊 Log Buffer Demo', 'background: linear-gradient(135deg, #2196F3, #1976D2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            console.log('%c📝 Collecting logs in buffer...', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 6px 12px; border-radius: 4px;');
-            // Simulate buffer data
-            const bufferData = [
-                { timestamp: new Date().toISOString(), level: 'info', message: 'User login', data: { userId: 123 } },
-                { timestamp: new Date().toISOString(), level: 'warn', message: 'Cache miss', data: { key: 'user:123' } },
-                { timestamp: new Date().toISOString(), level: 'error', message: 'API timeout', data: { endpoint: '/api/users' } }
-            ];
-            setTimeout(() => {
-                console.table(bufferData);
-                console.log('%c✅ Buffer contains 3 log entries', 'background: linear-gradient(135deg, #00C851, #00E676); color: white; padding: 6px 12px; border-radius: 4px;');
-            }, 1000);
-        };
-        window.demoExportCSV = function() {
-            console.log('%c📄 CSV Export Demo', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const csvData = `timestamp,level,prefix,message,location
-2024-01-15T10:30:00.123Z,error,API,"Payment timeout","api.js:45:12"
-2024-01-15T10:31:15.456Z,info,DB,"Query completed","database.js:23:8"
-2024-01-15T10:32:30.789Z,warn,CACHE,"Cache expiry","cache.js:67:5"`;
-            console.log('%c📋 CSV Export Preview:', 'background: #f5f5f5; color: #333; padding: 6px 12px; border-radius: 4px; font-family: monospace;');
-            console.log(csvData);
-            setTimeout(() => {
-                console.log('%c✅ CSV export completed', 'background: linear-gradient(135deg, #00C851, #00E676); color: white; padding: 6px 12px; border-radius: 4px;');
-            }, 1500);
-        };
-        window.demoExportJSON = function() {
-            console.log('%c📋 JSON Export Demo', 'background: linear-gradient(135deg, #FF9800, #F57C00); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const jsonData = {
-                metadata: {
-                    exportTime: new Date().toISOString(),
-                    totalLogs: 3,
-                    filters: { level: 'all' }
-                },
-                logs: [
-                    {
-                        id: 'log_001',
-                        timestamp: '2024-01-15T10:30:00.123Z',
-                        level: 'error',
-                        prefix: 'API',
-                        message: 'Payment timeout',
-                        location: { file: 'api.js', line: 45, column: 12 }
-                    },
-                    {
-                        id: 'log_002',
-                        timestamp: '2024-01-15T10:31:15.456Z',
-                        level: 'info',
-                        prefix: 'DB',
-                        message: 'Query completed',
-                        location: { file: 'database.js', line: 23, column: 8 }
-                    }
-                ]
-            };
-            setTimeout(() => {
-                console.log('%c📊 JSON Export Data:', 'background: #f5f5f5; color: #333; padding: 6px 12px; border-radius: 4px;');
-                console.log(jsonData);
-                console.log('%c✅ JSON export completed', 'background: linear-gradient(135deg, #00C851, #00E676); color: white; padding: 6px 12px; border-radius: 4px;');
-            }, 1000);
-        };
-        window.demoRemoteLogging = function() {
-            console.log('%c📡 Remote Logging Demo', 'background: linear-gradient(135deg, #9C27B0, #7B1FA2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            console.log('%c🔗 Connecting to remote endpoint...', 'background: linear-gradient(135deg, #2196F3, #1976D2); color: white; padding: 6px 12px; border-radius: 4px;');
-            setTimeout(() => {
-                console.log('%c📤 Sending log batch (5 entries)...', 'background: linear-gradient(135deg, #FF9800, #F57C00); color: white; padding: 6px 12px; border-radius: 4px;');
-            }, 1000);
-            setTimeout(() => {
-                console.log('%c✅ Remote logging successful', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 6px 12px; border-radius: 4px;');
-                console.log('%c📊 Endpoint: https://api.logs.company.com', 'background: #f5f5f5; color: #333; padding: 4px 8px; border-radius: 4px; font-family: monospace;');
-            }, 2000);
-        };
-        window.demoTableDisplay = function() {
-            console.log('%c📊 Table Display Demo', 'background: linear-gradient(135deg, #667eea, #764ba2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const userData = [
-                { id: 1, name: 'John Doe', email: 'john@example.com', status: '✅ Active', lastLogin: '2024-01-15' },
-                { id: 2, name: 'Jane Smith', email: 'jane@example.com', status: '⚠️ Pending', lastLogin: '2024-01-14' },
-                { id: 3, name: 'Bob Wilson', email: 'bob@example.com', status: '❌ Inactive', lastLogin: '2024-01-10' }
-            ];
-            setTimeout(() => {
-                console.table(userData);
-                console.log('%c✨ Formatted data tables in console!', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 6px 12px; border-radius: 4px;');
-            }, 500);
-        };
-        window.demoGrouping = function() {
-            console.log('%c📁 Console Grouping Demo', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            console.group('🚀 Application Startup');
-            console.log('%c⚙️ Loading configuration...', 'background: linear-gradient(135deg, #2196F3, #1976D2); color: white; padding: 4px 8px; border-radius: 4px;');
-            console.log('%c🔌 Connecting to database...', 'background: linear-gradient(135deg, #FF9800, #F57C00); color: white; padding: 4px 8px; border-radius: 4px;');
-            console.log('%c✅ Server ready on port 3000', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 4px 8px; border-radius: 4px;');
-            console.groupEnd();
-            setTimeout(() => {
-                console.group('👤 User Authentication');
-                console.log('%c🔐 Validating credentials...', 'background: linear-gradient(135deg, #9C27B0, #7B1FA2); color: white; padding: 4px 8px; border-radius: 4px;');
-                console.log('%c✅ Login successful', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 4px 8px; border-radius: 4px;');
-                console.groupEnd();
-            }, 1500);
-        };
-        window.demoStackTraces = function() {
-            console.log('%c🔍 Stack Trace Demo', 'background: linear-gradient(135deg, #F44336, #D32F2F); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            function level3() {
-                console.trace('%c📍 Stack trace from level 3', 'background: linear-gradient(135deg, #FF9800, #F57C00); color: white; padding: 6px 12px; border-radius: 4px;');
-            }
-            function level2() {
-                level3();
-            }
-            function level1() {
-                level2();
-            }
-            setTimeout(() => {
-                console.log('%c🔗 Tracing function call hierarchy:', 'background: #f5f5f5; color: #333; padding: 6px 12px; border-radius: 4px;');
-                level1();
-            }, 500);
-        };
-        window.demoCustomStyles = function() {
-            console.log('%c🎨 Custom Styles Demo', 'background: linear-gradient(135deg, #9C27B0, #7B1FA2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const styles = [
-                'background: linear-gradient(45deg, #ff6b6b, #feca57); color: white; padding: 12px 24px; border-radius: 25px; font-weight: bold; text-shadow: 0 2px 4px rgba(0,0,0,0.3);',
-                'background: #2c3e50; color: #ecf0f1; padding: 10px 20px; border-radius: 8px; border-left: 4px solid #3498db; font-family: monospace;',
-                'background: radial-gradient(circle, #667eea, #764ba2); color: white; padding: 15px 30px; border-radius: 50px; box-shadow: 0 8px 20px rgba(102, 126, 234, 0.4);'
-            ];
-            const messages = [
-                '🌟 Gradient with rounded corners',
-                '💻 Monospace with left border',
-                '🔮 Radial gradient with shadow'
-            ];
-            styles.forEach((style, index) => {
-                setTimeout(() => {
-                    console.log(`%c${messages[index]}`, style);
-                }, (index + 1) * 500);
-            });
-        };
-        window.demoCLIHelp = function() {
-            console.log('%c💻 CLI Help System', 'background: linear-gradient(135deg, #667eea, #764ba2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const helpText = `
-🔧 Better Logger CLI Commands:
-━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
-📋 Information Commands:
-  /help              Show this help message
-  /version           Display version information
-  /status            Show logger status and statistics
-  /enumerate         List all available features
-🎨 Configuration Commands:
-  /config            Show current configuration
-  /theme [name]      Change theme (default, dark, neon, cyberpunk, retro)
-  /banner [type]     Set banner type (simple, ascii, unicode, svg, animated)
-  /reset             Reset to default configuration
-🚀 Action Commands:
-  /clear             Clear console and log buffer
-  /export [format]   Export logs (csv, json, xml)
-  /demo [feature]    Run feature demonstration
-  /benchmark         Run performance benchmarks
-`;
-            console.log('%c' + helpText, 'background: #f8f9fa; color: #333; padding: 15px; border-radius: 8px; font-family: monospace; line-height: 1.6;');
-        };
-        window.demoCLIConfig = function() {
-            console.log('%c⚙️ CLI Configuration Demo', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            setTimeout(() => {
-                console.log('%c/theme cyberpunk', 'background: #2c3e50; color: #00ff41; padding: 8px 12px; border-radius: 4px; font-family: monospace;');
-            }, 500);
-            setTimeout(() => {
-                console.log('%c🌈 Theme changed to Cyberpunk!', 'background: linear-gradient(135deg, #b224ef, #7209b7); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            }, 1500);
-            setTimeout(() => {
-                console.log('%c/banner animated', 'background: #2c3e50; color: #00ff41; padding: 8px 12px; border-radius: 4px; font-family: monospace;');
-            }, 2500);
-            setTimeout(() => {
-                console.log('%c✨ Banner type set to animated!', 'background: linear-gradient(135deg, #FF9800, #F57C00); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            }, 3500);
-        };
-        window.demoCLIFeatures = function() {
-            console.log('%c📚 CLI Feature Enumeration', 'background: linear-gradient(135deg, #2196F3, #1976D2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const features = [
-                { category: '🚀 Core Features', items: ['Multi-level logging', 'Performance timing', 'Scoped loggers', 'Stack trace analysis'] },
-                { category: '🎨 Visual Features', items: ['5 Built-in themes', 'CSS animations', 'SVG backgrounds', 'Custom styling API'] },
-                { category: '📤 Export Features', items: ['CSV export', 'JSON export', 'XML export', 'Remote logging'] },
-                { category: '⚡ Advanced Features', items: ['Table display', 'Console grouping', 'Log buffering', 'Real-time filtering'] }
-            ];
-            features.forEach((category, index) => {
-                setTimeout(() => {
-                    console.group(`%c${category.category}`, 'background: linear-gradient(135deg, #667eea, #764ba2); color: white; padding: 6px 12px; border-radius: 4px; font-weight: bold;');
-                    category.items.forEach(item => {
-                        console.log(`%c✅ ${item}`, 'color: #4CAF50; padding: 2px 8px;');
-                    });
-                    console.groupEnd();
-                }, index * 1000);
-            });
-        };
-        window.demoCLIStatus = function() {
-            console.log('%c📊 CLI Status Information', 'background: linear-gradient(135deg, #FF9800, #F57C00); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const status = {
-                version: '0.0.1',
-                theme: 'Default',
-                bannerType: 'SVG',
-                logBuffer: '142 entries',
-                performance: '⚡ Optimized',
-                remoteEndpoints: '2 active',
-                lastExport: '2024-01-15T10:30:00Z'
-            };
-            setTimeout(() => {
-                console.table(status);
-                console.log('%c🟢 All systems operational', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 6px 12px; border-radius: 4px;');
-            }, 1000);
-        };
-        window.showBundleSizes = function() {
-            console.log('%c📦 Bundle Size Information', 'background: linear-gradient(135deg, #9C27B0, #7B1FA2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const bundleData = [
-                { module: 'Full Library', size: '64KB', gzipped: '13KB', description: 'Complete feature set' },
-                { module: 'Core Module', size: '6KB', gzipped: '2KB', description: 'Essential logging only' },
-                { module: 'Styling Module', size: '26KB', gzipped: '5KB', description: 'Visual features & themes' },
-                { module: 'Exports Module', size: '12KB', gzipped: '3KB', description: 'Data export & remote logging' }
-            ];
-            setTimeout(() => {
-                console.table(bundleData);
-                console.log('%c💡 Use selective imports to minimize bundle size!', 'background: linear-gradient(135deg, #00C851, #00E676); color: white; padding: 6px 12px; border-radius: 4px;');
-            }, 500);
-        };
-        window.showModularImports = function() {
-            console.log('%c🔧 Modular Import Examples', 'background: linear-gradient(135deg, #4CAF50, #45a049); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const importExamples = `
-// 📦 Full library (64KB)
-import { Logger } from '@mks2508/better-logger';
-// 🚀 Core only (6KB)
-import { Logger } from '@mks2508/better-logger/core';
-// 🎨 Styling features (26KB)
-import { setTheme, logWithSVG } from '@mks2508/better-logger/styling';
-// 📤 Export features (12KB)
-import { ExportLogger } from '@mks2508/better-logger/exports';
-// 🎯 Mix and match
-import { Logger } from '@mks2508/better-logger/core';
-import { setTheme } from '@mks2508/better-logger/styling';
-            `;
-            setTimeout(() => {
-                console.log('%c' + importExamples, 'background: #f8f9fa; color: #333; padding: 15px; border-radius: 8px; font-family: monospace; line-height: 1.6;');
-            }, 500);
-        };
-        window.showCompatibility = function() {
-            console.log('%c🌐 Browser Compatibility', 'background: linear-gradient(135deg, #2196F3, #1976D2); color: white; padding: 8px 16px; border-radius: 6px; font-weight: bold;');
-            const compatibility = [
-                { feature: 'CSS Styling', chrome: '✅', firefox: '✅', safari: '✅', node: '❌' },
-                { feature: 'SVG Backgrounds', chrome: '✅', firefox: '✅', safari: '✅', node: '❌' },
-                { feature: 'Animations', chrome: '✅', firefox: '✅', safari: '✅', node: '❌' },
-                { feature: 'Unicode Banners', chrome: '✅', firefox: '✅', safari: '✅', node: '✅' },
-                { feature: 'Performance API', chrome: '✅', firefox: '✅', safari: '✅', node: '✅' },
-                { feature: 'Core Logging', chrome: '✅', firefox: '✅', safari: '✅', node: '✅' }
-            ];
-            setTimeout(() => {
-                console.table(compatibility);
-                console.log('%c💡 Automatic fallbacks for Node.js environments', 'background: linear-gradient(135deg, #00C851, #00E676); color: white; padding: 6px 12px; border-radius: 4px;');
-            }, 500);
-        };
-    </script>
-</body>
-</html>