@loglayer/transport-pretty-terminal 1.0.0 → 2.0.0

package/dist/index.cjs

@@ -1,11 +1,13 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2; var _class3;// src/PrettyTerminalTransport.ts
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2; var _class3; var _class4;// src/PrettyTerminalTransport.ts
 var _transport = require('@loglayer/transport');
-var _chalk = require('chalk'); var chalk6 = _interopRequireWildcard(_chalk);
+var _chalk = require('chalk'); var chalk8 = _interopRequireWildcard(_chalk);
 
-// src/LogRenderer.ts
+// src/views/SimpleView.ts
+var _wrapansi = require('wrap-ansi'); var _wrapansi2 = _interopRequireDefault(_wrapansi);
+
+// src/views/utils.ts
 
 var _clitruncate = require('cli-truncate'); var _clitruncate2 = _interopRequireDefault(_clitruncate);
-var _wrapansi = require('wrap-ansi'); var _wrapansi2 = _interopRequireDefault(_wrapansi);
 
 // src/vendor/prettyjson.js
 
@@ -177,14 +179,14 @@ var renderToArray = (data, options, indentation) => {
 var validateOptionsAndSetDefaults = (options) => {
   options = options || {};
   options.emptyArrayMsg = options.emptyArrayMsg || "(empty array)";
-  options.keysColor = options.keysColor || chalk6.default.green;
-  options.dashColor = options.dashColor || chalk6.default.green;
-  options.booleanColor = options.booleanColor || chalk6.default.cyan;
-  options.nullUndefinedColor = options.nullUndefinedColor || chalk6.default.grey;
-  options.numberColor = options.numberColor || chalk6.default.blue;
+  options.keysColor = options.keysColor || chalk8.default.green;
+  options.dashColor = options.dashColor || chalk8.default.green;
+  options.booleanColor = options.booleanColor || chalk8.default.cyan;
+  options.nullUndefinedColor = options.nullUndefinedColor || chalk8.default.grey;
+  options.numberColor = options.numberColor || chalk8.default.blue;
   options.positiveNumberColor = options.positiveNumberColor || options.numberColor;
   options.negativeNumberColor = options.negativeNumberColor || options.numberColor;
-  options.dateColor = options.dateColor || chalk6.default.magenta;
+  options.dateColor = options.dateColor || chalk8.default.magenta;
   options.defaultIndentation = options.defaultIndentation || 2;
   options.noColor = !!options.noColor;
   options.noAlign = !!options.noAlign;
@@ -201,193 +203,204 @@ function render(data, options, indentation) {
   return renderToArray(data, options, indentation).join("\n");
 }
 
-// src/LogRenderer.ts
-var LogRenderer = (_class = class {
-  /** Current terminal width in characters */
-  
-  /** Maximum depth for displaying nested objects inline */
-  
-  /** Maximum length for inline data before truncating */
-  
-  /** Whether arrays are currently collapsed in detail view */
-  __init() {this.isArraysCollapsed = false}
-  /** Color and formatting config for simple log view */
+// src/views/utils.ts
+function formatTimestamp(timestamp, colorFn) {
+  const date = new Date(timestamp);
+  return colorFn(
+    `${date.getHours().toString().padStart(2, "0")}:${date.getMinutes().toString().padStart(2, "0")}:${date.getSeconds().toString().padStart(2, "0")}.${date.getMilliseconds().toString().padStart(3, "0")}`
+  );
+}
+function getLevelColor(level, colors) {
+  return colors[level] || chalk8.default.white;
+}
+function formatValue(value, expanded = false) {
+  if (typeof value === "string") return value;
+  if (typeof value === "number" || typeof value === "boolean") return value.toString();
+  if (value === null) return "null";
+  if (value === void 0) return "undefined";
+  if (Array.isArray(value)) return expanded ? JSON.stringify(value) : "[...]";
+  if (typeof value === "object") return expanded ? JSON.stringify(value) : "{...}";
+  return value.toString();
+}
+function formatInlineData(data, config, maxDepth, maxLength, expanded = false) {
+  if (!data) return "";
+  const pairs = [];
+  const traverse = (obj, prefix = "", depth = 0) => {
+    if (!expanded && depth >= maxDepth) return;
+    for (const [key, value] of Object.entries(obj)) {
+      const fullKey = prefix ? `${prefix}.${key}` : key;
+      if (value && typeof value === "object" && !Array.isArray(value)) {
+        if (expanded) {
+          pairs.push(`${config.dataKeyColor(fullKey)}=${config.dataValueColor(JSON.stringify(value))}`);
+        } else {
+          traverse(value, fullKey, depth + 1);
+        }
+      } else {
+        pairs.push(`${config.dataKeyColor(fullKey)}=${config.dataValueColor(formatValue(value, expanded))}`);
+      }
+    }
+  };
+  traverse(data);
+  const result = pairs.join(" ");
+  return expanded ? result : _clitruncate2.default.call(void 0, result, maxLength);
+}
+
+// src/views/SimpleView.ts
+var SimpleView = class {
   
-  /** Color and formatting config for detailed view */
   
-  /** Current scroll position in detailed view */
-  __init2() {this.detailViewScrollPos = 0}
-  /** Cached content lines for detailed view */
-  __init3() {this.detailViewContent = []}
-  /**
-   * Creates a new LogRenderer instance.
-   *
-   * @param simpleViewConfig - Configuration for simple log view
-   * @param detailedViewConfig - Configuration for detailed view
-   * @param maxInlineDepth - Maximum depth for inline object display
-   * @param maxInlineLength - Maximum length before truncation
-   */
-  constructor(simpleViewConfig, detailedViewConfig, maxInlineDepth, maxInlineLength) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);
-    this.simpleViewConfig = simpleViewConfig;
-    this.detailedViewConfig = detailedViewConfig;
-    this.maxInlineDepth = maxInlineDepth;
-    this.maxInlineLength = maxInlineLength;
+  constructor(config) {
+    this.config = config;
     this.termWidth = process.stdout.columns || 80;
-    process.stdout.on("resize", () => {
-      this.termWidth = process.stdout.columns || 80;
-    });
-  }
-  /**
-   * Gets the appropriate color for a log level.
-   * Handles both simple and detailed view color schemes.
-   *
-   * @param level - Log level (trace, debug, info, etc.)
-   * @param isDetailView - Whether to use detailed view colors
-   * @returns Chalk instance for the color
-   */
-  getLevelColor(level, isDetailView = false) {
-    const colors = isDetailView ? this.detailedViewConfig.colors : this.simpleViewConfig.colors;
-    return colors[level] || chalk6.default.white;
   }
-  /**
-   * Formats a timestamp into a human-readable string.
-   * Format: HH:MM:SS.mmm
-   *
-   * @param timestamp - Unix timestamp in milliseconds
-   * @returns Formatted and colored timestamp string
-   */
-  formatTimestamp(timestamp) {
-    const date = new Date(timestamp);
-    return this.simpleViewConfig.logIdColor(
-      `${date.getHours().toString().padStart(2, "0")}:${date.getMinutes().toString().padStart(2, "0")}:${date.getSeconds().toString().padStart(2, "0")}.${date.getMilliseconds().toString().padStart(3, "0")}`
-    );
+  updateTerminalWidth(width) {
+    this.termWidth = width;
   }
   /**
-   * Formats structured data for inline display.
-   * Handles nested objects, arrays, and primitive values.
-   * Truncates output to maintain readability.
-   *
-   * @param data - Data to format
-   * @returns Formatted string with color coding
-   */
-  formatInlineData(data) {
-    if (!data) return "";
-    const formatValue = (value) => {
-      if (typeof value === "string") return value;
-      if (typeof value === "number" || typeof value === "boolean") return value.toString();
-      if (value === null) return "null";
-      if (value === void 0) return "undefined";
-      if (Array.isArray(value)) return "[...]";
-      if (typeof value === "object") return "{...}";
-      return value.toString();
-    };
-    const pairs = [];
-    const traverse = (obj, prefix = "", depth = 0) => {
-      if (depth >= this.maxInlineDepth) return;
-      for (const [key, value] of Object.entries(obj)) {
-        const fullKey = prefix ? `${prefix}.${key}` : key;
-        if (value && typeof value === "object" && !Array.isArray(value)) {
-          traverse(value, fullKey, depth + 1);
-        } else {
-          pairs.push(
-            `${this.simpleViewConfig.dataKeyColor(fullKey)}=${this.simpleViewConfig.dataValueColor(formatValue(value))}`
-          );
-        }
-      }
-    };
-    traverse(data);
-    const result = pairs.join(" ");
-    return _clitruncate2.default.call(void 0, result, this.maxInlineLength);
-  }
-  /**
-   * Renders a single log line in simple view format.
-   * Format: [timestamp] LEVEL [id] message data
-   *
-   * @param entry - Log entry to render
+   * Renders a single log entry based on the current view mode
    */
   renderLogLine(entry) {
-    const levelColor = this.getLevelColor(entry.level);
-    const timestamp = this.formatTimestamp(entry.timestamp);
+    const levelColor = getLevelColor(entry.level, this.config.config.colors);
     const chevron = levelColor(`\u25B6 ${entry.level.toUpperCase()} `);
-    const logId = this.simpleViewConfig.logIdColor(`[${entry.id}]`);
-    const message = entry.message;
-    const data = entry.data ? this.formatInlineData(JSON.parse(entry.data)) : "";
-    const line = `${timestamp} ${chevron}${logId} ${message}${data ? ` ${data}` : ""}`;
-    console.log(_wrapansi2.default.call(void 0, line, this.termWidth, { hard: true }));
+    const message = entry.message || "(no message)";
+    const timestamp = formatTimestamp(entry.timestamp, this.config.config.logIdColor);
+    switch (this.config.viewMode) {
+      case "condensed": {
+        const condensedLine = `${timestamp} ${chevron}${message}`;
+        console.log(_wrapansi2.default.call(void 0, condensedLine, this.termWidth, { hard: true }));
+        break;
+      }
+      case "full": {
+        const logId = this.config.config.logIdColor(`[${entry.id}]`);
+        const fullData = entry.data ? formatInlineData(
+          JSON.parse(entry.data),
+          this.config.config,
+          this.config.maxInlineDepth,
+          this.config.maxInlineLength,
+          true
+        ) : "";
+        const expandedLine = `${timestamp} ${chevron}${logId} ${message}${fullData ? ` ${fullData}` : ""}`;
+        console.log(_wrapansi2.default.call(void 0, expandedLine, this.termWidth, { hard: true }));
+        break;
+      }
+      default: {
+        const logId = this.config.config.logIdColor(`[${entry.id}]`);
+        const normalData = entry.data ? formatInlineData(
+          JSON.parse(entry.data),
+          this.config.config,
+          this.config.maxInlineDepth,
+          this.config.maxInlineLength
+        ) : "";
+        const normalLine = `${timestamp} ${chevron}${logId} ${message}${normalData ? ` ${normalData}` : ""}`;
+        console.log(_wrapansi2.default.call(void 0, normalLine, this.termWidth, { hard: true }));
+        break;
+      }
+    }
+  }
+  render() {
+    throw new Error("SimpleView.render() should not be called directly. Use renderLogLine() instead.");
+  }
+};
+
+// src/views/DetailView.ts
+
+
+var DetailView = (_class = class {
+  
+  
+  __init() {this.detailViewContent = []}
+  constructor(config) {;_class.prototype.__init.call(this);
+    this.config = config;
+    this.termWidth = process.stdout.columns || 80;
+  }
+  updateTerminalWidth(width) {
+    this.termWidth = width;
   }
   /**
-   * Formats a compact single-line version of a log entry.
-   * Used for showing context in detailed view.
-   *
-   * @param entry - Log entry to render
-   * @param prefix - Optional prefix (e.g., "←" for previous entry)
-   * @returns Formatted log line
+   * Formats a compact single-line version of a log entry
    */
   formatCompactLogLine(entry, prefix = "") {
     if (!entry) return "";
-    const levelColor = this.getLevelColor(entry.level, true);
-    const logId = this.detailedViewConfig.logIdColor(`[${entry.id}]`);
+    const levelColor = getLevelColor(entry.level, this.config.config.colors);
+    const logId = this.config.config.logIdColor(`[${entry.id}]`);
     const line = `${prefix}${levelColor(entry.level.toUpperCase())} ${logId} ${entry.message}`;
-    return this.detailedViewConfig.separatorColor(_wrapansi2.default.call(void 0, line, this.termWidth, { hard: true }));
+    return this.config.config.separatorColor(_wrapansi2.default.call(void 0, line, this.termWidth, { hard: true }));
   }
   /**
-   * Renders the detailed view of a log entry.
-   * Shows full entry details with context and formatted data.
-   *
-   * @param entry - Log entry to show in detail
-   * @param prevEntry - Previous entry for context
-   * @param nextEntry - Next entry for context
-   * @param scrollPos - Current scroll position
+   * Formats a timestamp into a human-readable relative time
    */
-  renderDetailView(entry, prevEntry, nextEntry, scrollPos = 0) {
+  formatRelativeTime(timestamp) {
+    const now = /* @__PURE__ */ new Date();
+    const diffMs = now.getTime() - timestamp.getTime();
+    const diffSecs = Math.floor(diffMs / 1e3);
+    const diffMins = Math.floor(diffSecs / 60);
+    const diffHours = Math.floor(diffMins / 60);
+    const diffDays = Math.floor(diffHours / 24);
+    if (diffSecs < 60) return `${diffSecs}s ago`;
+    if (diffMins < 60) return `${diffMins}m ago`;
+    if (diffHours < 24) return `${diffHours}h ago`;
+    if (diffDays === 1) return "yesterday";
+    if (diffDays < 30) return `${diffDays}d ago`;
+    return timestamp.toLocaleDateString();
+  }
+  render() {
     console.clear();
-    if (this.isJsonView) {
-      if (entry.data) {
-        console.log(JSON.stringify(JSON.parse(entry.data)));
+    if (this.config.isJsonView) {
+      if (this.config.entry.data) {
+        console.log(JSON.stringify(JSON.parse(this.config.entry.data)));
       } else {
         console.log("{}");
       }
       console.log(`
-${this.detailedViewConfig.separatorColor("TAB to return to detailed view")}`);
+${this.config.config.separatorColor("TAB to return to detailed view")}`);
       return;
     }
     const headerContent = [];
-    if (prevEntry) {
-      const prevLine = this.formatCompactLogLine(prevEntry, "\u2190 ");
+    if (this.config.prevEntry) {
+      const prevLine = this.formatCompactLogLine(this.config.prevEntry, "\u2190 ");
       headerContent.push(prevLine);
-      headerContent.push(this.detailedViewConfig.separatorColor("\u2500".repeat(this.termWidth)));
+      headerContent.push(this.config.config.separatorColor("\u2500".repeat(this.termWidth)));
     }
     const footerContent = [];
-    if (nextEntry) {
-      footerContent.push(this.detailedViewConfig.separatorColor("\u2500".repeat(this.termWidth)));
-      const nextLine = this.formatCompactLogLine(nextEntry, "\u2192 ");
+    if (this.config.nextEntry) {
+      footerContent.push(this.config.config.separatorColor("\u2500".repeat(this.termWidth)));
+      const nextLine = this.formatCompactLogLine(this.config.nextEntry, "\u2192 ");
       footerContent.push(nextLine);
     }
     footerContent.push("");
-    footerContent.push(
-      this.detailedViewConfig.separatorColor("TAB to exit \u2022 \u2191/\u2193 scroll \u2022 Q/W page up/down \u2022 J raw JSON")
-    );
-    footerContent.push(this.detailedViewConfig.separatorColor("\u2190/\u2192 navigate \u2022 A/S first/last log \u2022 C toggle arrays"));
+    footerContent.push(this.config.config.separatorColor("TAB to exit \u2022 \u2191/\u2193 scroll \u2022 Q/W page up/down \u2022 J raw JSON"));
+    footerContent.push(this.config.config.separatorColor("\u2190/\u2192 navigate \u2022 A/S first/last log \u2022 C toggle arrays"));
     const mainContent = [];
-    const levelColor = this.getLevelColor(entry.level, true);
-    const header = levelColor(`=== Log Detail [${entry.id}] ===`);
+    const levelColor = getLevelColor(this.config.entry.level, this.config.config.colors);
+    let headerText = `=== Log Detail [${this.config.entry.id}] (${this.config.currentLogIndex} / ${this.config.totalLogs})`;
+    if (this.config.filterText) {
+      headerText += ` [Filter: ${this.config.filterText}]`;
+    }
+    headerText += " ===";
+    const header = levelColor(headerText);
     mainContent.push(header);
-    const timestamp = new Date(entry.timestamp);
-    const isoTime = timestamp.toISOString();
+    const timestamp = new Date(this.config.entry.timestamp);
+    const isoTime = formatTimestamp(this.config.entry.timestamp, this.config.config.dataValueColor);
     const relativeTime = this.formatRelativeTime(timestamp);
+    mainContent.push(`${this.config.config.labelColor("Timestamp:")} ${isoTime} (${relativeTime})`);
     mainContent.push(
-      `${this.detailedViewConfig.labelColor("Timestamp:")} ${this.detailedViewConfig.dataValueColor(isoTime)} (${relativeTime})`
-    );
-    mainContent.push(`${this.detailedViewConfig.labelColor("Level:")} ${levelColor.bold(entry.level.toUpperCase())}`);
-    mainContent.push(
-      `${this.detailedViewConfig.labelColor("Message:")} ${this.detailedViewConfig.dataValueColor(entry.message)}`
+      `${this.config.config.labelColor("Level:")} ${levelColor.bold(this.config.entry.level.toUpperCase())}`
     );
-    if (entry.data) {
-      mainContent.push(this.detailedViewConfig.labelColor("\nData:"));
-      const jsonLines = render(JSON.parse(entry.data), {
-        ...this.detailedViewConfig.jsonColors,
+    if (this.config.entry.message) {
+      mainContent.push(
+        `${this.config.config.labelColor("Message:")} ${this.config.config.dataValueColor(this.config.entry.message)}`
+      );
+    } else {
+      mainContent.push(
+        `${this.config.config.labelColor("Message:")} ${this.config.config.dataValueColor.dim("(no message)")}`
+      );
+    }
+    if (this.config.entry.data) {
+      mainContent.push(this.config.config.labelColor("\nData:"));
+      const jsonLines = render(JSON.parse(this.config.entry.data), {
+        ...this.config.config.jsonColors,
         defaultIndentation: 2,
-        collapseArrays: this.isArraysCollapsed
+        collapseArrays: this.config.isArraysCollapsed
       }).split("\n");
       mainContent.push(...jsonLines);
     }
@@ -395,36 +408,34 @@ ${this.detailedViewConfig.separatorColor("TAB to return to detailed view")}`);
     const headerHeight = headerContent.length;
     const footerHeight = footerContent.length;
     const scrollIndicatorLines = 2;
-    const bufferSpace = 2;
+    const bufferSpace = 4;
     const availableHeight = Math.max(
       0,
       process.stdout.rows - headerHeight - footerHeight - scrollIndicatorLines - bufferSpace
     );
-    this.detailViewScrollPos = Math.max(0, Math.min(scrollPos, mainContent.length - availableHeight));
     for (const line of headerContent) {
       console.log(line);
     }
-    if (this.detailViewScrollPos > 0) {
-      console.log(chalk6.default.dim("\u2191 More content above"));
+    if (this.config.scrollPos > 0) {
+      console.log(chalk8.default.dim("\u2191 More content above"));
     }
-    const startIndex = this.detailViewScrollPos;
+    const startIndex = this.config.scrollPos;
     const visibleContent = mainContent.slice(startIndex, startIndex + availableHeight);
     for (const line of visibleContent) {
       console.log(line);
     }
-    if (this.detailViewScrollPos + availableHeight < mainContent.length) {
-      console.log(chalk6.default.dim("\u2193 More content below"));
+    if (this.config.scrollPos + availableHeight < mainContent.length) {
+      console.log(chalk8.default.dim("\u2193 More content below"));
     }
     for (const line of footerContent) {
       console.log(line);
     }
   }
   /**
-   * Updates the scroll position in detailed view
-   * @param delta - Number of lines to scroll (positive for down, negative for up)
+   * Gets the maximum scroll position based on current content and window size
    */
-  scrollDetailView(delta) {
-    const headerHeight = 2;
+  getMaxScrollPosition() {
+    const headerHeight = this.config.prevEntry ? 2 : 0;
     const footerHeight = 5;
     const scrollIndicatorLines = 2;
     const bufferSpace = 2;
@@ -432,100 +443,210 @@ ${this.detailedViewConfig.separatorColor("TAB to return to detailed view")}`);
       0,
       process.stdout.rows - headerHeight - footerHeight - scrollIndicatorLines - bufferSpace
     );
-    const maxScroll = Math.max(0, this.detailViewContent.length - availableHeight);
-    this.detailViewScrollPos = Math.max(0, Math.min(maxScroll, this.detailViewScrollPos + delta));
+    return Math.max(0, this.detailViewContent.length - availableHeight);
   }
-  /**
-   * Gets the current scroll position
-   */
-  getDetailViewScrollPos() {
-    return this.detailViewScrollPos;
+}, _class);
+
+// src/views/SelectionView.ts
+
+
+var SelectionView = class {
+  
+  
+  constructor(config) {
+    this.config = config;
+    this.termWidth = process.stdout.columns || 80;
   }
-  /**
-   * Renders the interactive selection view.
-   * Shows a scrollable list of logs with current selection.
-   *
-   * Features:
-   * - Pagination for large log sets
-   * - Active filter display
-   * - Scroll indicators
-   * - Selected item highlighting
-   *
-   * @param logs - Array of log entries to display
-   * @param selectedIndex - Index of currently selected log
-   * @param filterText - Current filter text (if any)
-   * @param newLogCount - Number of new logs since last render (optional)
-   */
-  renderSelectionView(logs, selectedIndex, filterText, newLogCount = 0) {
+  updateTerminalWidth(width) {
+    this.termWidth = width;
+  }
+  render() {
     console.clear();
-    const headerHeight = filterText ? 2 : 0;
+    const headerHeight = this.config.filterText ? 2 : 0;
     const footerHeight = 2;
     const availableHeight = process.stdout.rows - headerHeight - footerHeight;
-    if (filterText) {
-      console.log(chalk6.default.cyan("Filter:"), chalk6.default.white(filterText));
-      console.log(chalk6.default.dim("\u2500".repeat(this.termWidth)));
+    if (this.config.filterText) {
+      console.log(chalk8.default.cyan("Filter:"), chalk8.default.white(this.config.filterText));
+      console.log(chalk8.default.dim("\u2500".repeat(this.termWidth)));
     }
-    if (logs.length === 0) {
-      console.log(chalk6.default.yellow("No matching logs found"));
+    if (this.config.logs.length === 0) {
+      console.log(chalk8.default.yellow("No matching logs found"));
     } else {
       const visibleLines = Math.min(availableHeight, 20);
       const bottomPadding = 2;
-      let startIdx = Math.max(0, selectedIndex - (visibleLines - bottomPadding - 1));
-      const endIdx = Math.min(logs.length, startIdx + visibleLines);
-      if (endIdx - startIdx < visibleLines && endIdx < logs.length) {
+      let startIdx = Math.max(0, this.config.selectedIndex - (visibleLines - bottomPadding - 1));
+      const endIdx = Math.min(this.config.logs.length, startIdx + visibleLines);
+      if (endIdx - startIdx < visibleLines && endIdx < this.config.logs.length) {
         startIdx = Math.max(0, endIdx - visibleLines);
       }
       if (startIdx > 0) {
-        console.log(chalk6.default.dim("  \u2191 More logs above"));
+        console.log(chalk8.default.dim("  \u2191 More logs above"));
       }
-      logs.slice(startIdx, endIdx).forEach((entry, index) => {
+      this.config.logs.slice(startIdx, endIdx).forEach((entry, index) => {
         const actualIndex = startIdx + index;
-        const isSelected = actualIndex === selectedIndex;
-        const prefix = isSelected ? this.simpleViewConfig.selectorColor("\u25BA ") : "  ";
-        const timestamp = this.formatTimestamp(entry.timestamp);
-        const levelColor = this.getLevelColor(entry.level);
+        const isSelected = actualIndex === this.config.selectedIndex;
+        const prefix = isSelected ? this.config.config.selectorColor("\u25BA ") : "  ";
+        const timestamp = formatTimestamp(entry.timestamp, this.config.config.logIdColor);
+        const levelColor = getLevelColor(entry.level, this.config.config.colors);
         const chevron = levelColor(`${entry.level.toUpperCase()} `);
-        const logId = chalk6.default.dim(`[${entry.id}]`);
+        const logId = chalk8.default.dim(`[${entry.id}]`);
         const message = entry.message;
-        const data = entry.data ? this.formatInlineData(JSON.parse(entry.data)) : "";
-        const mainLine = `${prefix}${timestamp} ${chevron}${logId} ${message}`;
+        const data = entry.data ? ` ${formatInlineData(JSON.parse(entry.data), this.config.config, 0, 0, true)}` : "";
+        const mainLine = `${prefix}${timestamp} ${chevron}${logId} ${message}${data}`;
         console.log(_wrapansi2.default.call(void 0, mainLine, this.termWidth - 2, { hard: true }));
-        if (data) {
-          const wrappedData = _wrapansi2.default.call(void 0, data, this.termWidth - (isSelected ? 6 : 2), { hard: true });
-          const indentedLines = wrappedData.split("\n").map((line) => isSelected ? `    ${line}` : line);
-          console.log(indentedLines.join("\n"));
-        }
       });
-      if (endIdx < logs.length || newLogCount > 0) {
-        const moreLogsText = newLogCount > 0 ? this.simpleViewConfig.selectorColor(
-          `  \u2193 ${newLogCount} new log${newLogCount === 1 ? "" : "s"} available (press \u2193 to view)`
-        ) : chalk6.default.dim("  \u2193 More logs below");
+      if (endIdx < this.config.logs.length || this.config.newLogCount > 0) {
+        const moreLogsText = this.config.newLogCount > 0 ? this.config.config.selectorColor(
+          `  \u2193 ${this.config.newLogCount} new log${this.config.newLogCount === 1 ? "" : "s"} available (press \u2193 to view)`
+        ) : chalk8.default.dim("  \u2193 More logs below");
         console.log(moreLogsText);
       }
     }
-    console.log(chalk6.default.dim("\nType to filter \u2022 Enter to view details \u2022 TAB to exit"));
+    console.log(chalk8.default.dim("\nType to filter \u2022 Enter to view details \u2022 TAB to exit"));
+  }
+};
+
+// src/LogRenderer.ts
+var LogRenderer = (_class2 = class {
+  /** Current terminal width in characters */
+  
+  /** Maximum depth for displaying nested objects inline */
+  
+  /** Maximum length for inline data before truncating */
+  
+  /** Whether arrays are currently collapsed in detail view */
+  __init2() {this.isArraysCollapsed = true}
+  /** Current view mode in simple mode */
+  __init3() {this.viewMode = "full"}
+  /** Color and formatting config for simple log view */
+  
+  /** Color and formatting config for detailed view */
+  
+  /** Whether we're showing raw JSON view */
+  __init4() {this.isJsonView = false}
+  /** Current scroll position in detailed view */
+  __init5() {this.detailViewScrollPos = 0}
+  /** View instances */
+  
+  __init6() {this.detailView = null}
+  __init7() {this.selectionView = null}
+  /**
+   * Creates a new LogRenderer instance.
+   *
+   * @param simpleViewConfig - Configuration for simple log view
+   * @param detailedViewConfig - Configuration for detailed view
+   * @param maxInlineDepth - Maximum depth for inline object display
+   * @param maxInlineLength - Maximum length before truncation
+   */
+  constructor(simpleViewConfig, detailedViewConfig, maxInlineDepth, maxInlineLength) {;_class2.prototype.__init2.call(this);_class2.prototype.__init3.call(this);_class2.prototype.__init4.call(this);_class2.prototype.__init5.call(this);_class2.prototype.__init6.call(this);_class2.prototype.__init7.call(this);
+    this.simpleViewConfig = simpleViewConfig;
+    this.detailedViewConfig = detailedViewConfig;
+    this.maxInlineDepth = maxInlineDepth;
+    this.maxInlineLength = maxInlineLength;
+    this.termWidth = process.stdout.columns || 80;
+    this.simpleView = new SimpleView({
+      viewMode: this.viewMode,
+      maxInlineDepth: this.maxInlineDepth,
+      maxInlineLength: this.maxInlineLength,
+      config: this.simpleViewConfig
+    });
+    this.detailView = null;
+    this.selectionView = null;
+    process.stdout.on("resize", () => {
+      this.termWidth = process.stdout.columns || 80;
+      this.simpleView.updateTerminalWidth(this.termWidth);
+      if (this.detailView) {
+        this.detailView.updateTerminalWidth(this.termWidth);
+      }
+      if (this.selectionView) {
+        this.selectionView.updateTerminalWidth(this.termWidth);
+      }
+    });
+  }
+  /**
+   * Renders a single log line in simple view format.
+   * Format: [timestamp] LEVEL [id] message data
+   * Condensed Format: [timestamp] LEVEL message
+   * Expanded Format: [timestamp] LEVEL [id] message full_data
+   *
+   * @param entry - Log entry to render
+   */
+  renderLogLine(entry) {
+    this.simpleView.renderLogLine(entry);
+  }
+  /**
+   * Renders the detailed view of a log entry.
+   * Shows full entry details with context and formatted data.
+   *
+   * @param entry - Log entry to show in detail
+   * @param prevEntry - Previous entry for context
+   * @param nextEntry - Next entry for context
+   * @param scrollPos - Current scroll position
+   * @param currentLogIndex - Current log index (optional)
+   * @param totalLogs - Total logs count (optional)
+   * @param filterText - Current filter text (if any)
+   */
+  renderDetailView(entry, prevEntry, nextEntry, scrollPos = 0, currentLogIndex, totalLogs, filterText = "") {
+    const config = {
+      entry,
+      prevEntry,
+      nextEntry,
+      scrollPos,
+      isArraysCollapsed: this.isArraysCollapsed,
+      isJsonView: this.isJsonView,
+      currentLogIndex: _nullishCoalesce(currentLogIndex, () => ( (prevEntry ? 2 : nextEntry ? 1 : 1))),
+      // Use provided index or fallback
+      totalLogs: _nullishCoalesce(totalLogs, () => ( 1)),
+      // Use provided total or fallback
+      filterText,
+      config: this.detailedViewConfig
+    };
+    if (!this.detailView) {
+      this.detailView = new DetailView(config);
+    } else {
+      this.detailView = new DetailView(config);
+    }
+    this.detailView.render();
   }
   /**
-   * Formats a timestamp into a human-readable relative time
-   * @param timestamp - Date to format
-   * @returns Formatted relative time string
+   * Updates the scroll position in detailed view
+   * @param delta - Number of lines to scroll
    */
-  formatRelativeTime(timestamp) {
-    const now = /* @__PURE__ */ new Date();
-    const diffMs = now.getTime() - timestamp.getTime();
-    const diffSecs = Math.floor(diffMs / 1e3);
-    const diffMins = Math.floor(diffSecs / 60);
-    const diffHours = Math.floor(diffMins / 60);
-    const diffDays = Math.floor(diffHours / 24);
-    if (diffSecs < 60) return `${diffSecs}s ago`;
-    if (diffMins < 60) return `${diffMins}m ago`;
-    if (diffHours < 24) return `${diffHours}h ago`;
-    if (diffDays === 1) return "yesterday";
-    if (diffDays < 30) return `${diffDays}d ago`;
-    return timestamp.toLocaleDateString();
+  scrollDetailView(delta) {
+    if (!this.detailView) return;
+    const maxScroll = this.detailView.getMaxScrollPosition();
+    this.detailViewScrollPos = Math.max(0, Math.min(maxScroll, this.detailViewScrollPos + delta));
+  }
+  /**
+   * Gets the current scroll position
+   */
+  getDetailViewScrollPos() {
+    return this.detailViewScrollPos;
+  }
+  /**
+   * Renders the selection view with a list of logs.
+   * Shows filtered logs with selection highlight and data preview.
+   *
+   * @param logs - Array of logs to display
+   * @param selectedIndex - Index of currently selected log
+   * @param filterText - Current filter text (if any)
+   * @param newLogCount - Number of new logs available
+   */
+  renderSelectionView(logs, selectedIndex, filterText, newLogCount) {
+    const config = {
+      logs,
+      selectedIndex,
+      filterText,
+      newLogCount,
+      config: this.detailedViewConfig
+    };
+    if (!this.selectionView) {
+      this.selectionView = new SelectionView(config);
+    } else {
+      this.selectionView = new SelectionView(config);
+    }
+    this.selectionView.render();
   }
-  /** Whether we're showing raw JSON view */
-  __init4() {this.isJsonView = false}
   /**
    * Toggles JSON view state
    */
@@ -544,7 +665,36 @@ ${this.detailedViewConfig.separatorColor("TAB to return to detailed view")}`);
   toggleArrayCollapse() {
     this.isArraysCollapsed = !this.isArraysCollapsed;
   }
-}, _class);
+  /**
+   * Cycles through view modes: full -> truncated -> condensed
+   */
+  cycleViewMode() {
+    switch (this.viewMode) {
+      case "full":
+        this.viewMode = "truncated";
+        break;
+      case "truncated":
+        this.viewMode = "condensed";
+        break;
+      case "condensed":
+        this.viewMode = "full";
+        break;
+    }
+    this.simpleView = new SimpleView({
+      viewMode: this.viewMode,
+      maxInlineDepth: this.maxInlineDepth,
+      maxInlineLength: this.maxInlineLength,
+      config: this.simpleViewConfig
+    });
+    return this.viewMode;
+  }
+  /**
+   * Gets current view mode
+   */
+  getViewMode() {
+    return this.viewMode;
+  }
+}, _class2);
 
 // src/LogStorage.ts
 var _path = require('path');
@@ -636,6 +786,34 @@ var LogStorage = class {
     const pattern = `%${searchText}%`;
     return this.db.prepare(query).all(pattern, pattern, pattern);
   }
+  /**
+   * Gets the total number of logs in the database.
+   * Uses an efficient COUNT query instead of loading all logs.
+   *
+   * @returns Total number of log entries
+   */
+  getLogCount() {
+    const result = this.db.prepare("SELECT COUNT(*) as count FROM logs").get();
+    return result.count;
+  }
+  /**
+   * Gets the total number of logs matching a search query.
+   * Uses an efficient COUNT query instead of loading all logs.
+   *
+   * @param searchText - Text to search for
+   * @returns Number of matching log entries
+   */
+  getFilteredLogCount(searchText) {
+    const query = `
+      SELECT COUNT(*) as count FROM logs 
+      WHERE id LIKE ? 
+      OR message LIKE ? 
+      OR data LIKE ?
+    `;
+    const pattern = `%${searchText}%`;
+    const result = this.db.prepare(query).get(pattern, pattern, pattern);
+    return result.count;
+  }
   /**
    * Closes the database connection and performs cleanup.
    * Should be called when the application exits or the transport is destroyed.
@@ -648,18 +826,22 @@ var LogStorage = class {
 // src/UIManager.ts
 
 var _keypress = require('keypress'); var _keypress2 = _interopRequireDefault(_keypress);
-var UIManager = (_class2 = class {
+var UIManager = (_class3 = class {
   /**
    * Creates a new UIManager instance.
    * Sets up keyboard handling and cleanup handlers.
    *
    * @param renderer - Instance for handling log display
    * @param storage - Instance for log persistence
+   * @param disableInteractiveMode - Whether to disable interactive mode
    */
-  constructor(renderer, storage) {;_class2.prototype.__init5.call(this);_class2.prototype.__init6.call(this);_class2.prototype.__init7.call(this);_class2.prototype.__init8.call(this);_class2.prototype.__init9.call(this);_class2.prototype.__init10.call(this);_class2.prototype.__init11.call(this);_class2.prototype.__init12.call(this);_class2.prototype.__init13.call(this);_class2.prototype.__init14.call(this);_class2.prototype.__init15.call(this);
+  constructor(renderer, storage, disableInteractiveMode = false) {;_class3.prototype.__init8.call(this);_class3.prototype.__init9.call(this);_class3.prototype.__init10.call(this);_class3.prototype.__init11.call(this);_class3.prototype.__init12.call(this);_class3.prototype.__init13.call(this);_class3.prototype.__init14.call(this);_class3.prototype.__init15.call(this);_class3.prototype.__init16.call(this);_class3.prototype.__init17.call(this);_class3.prototype.__init18.call(this);
     this.renderer = renderer;
     this.storage = storage;
-    this.setupKeyboardHandling();
+    this.isInteractiveDisabled = disableInteractiveMode;
+    if (!this.isInteractiveDisabled) {
+      this.setupKeyboardHandling();
+    }
     process.stdout.on("resize", () => {
       this.termWidth = process.stdout.columns || 80;
       if (this.isDetailView) {
@@ -673,27 +855,29 @@ var UIManager = (_class2 = class {
     });
   }
   /** Whether the UI is in log selection mode */
-  __init5() {this.isSelectionMode = false}
+  __init8() {this.isSelectionMode = false}
   /** Whether the UI is showing detailed log view */
-  __init6() {this.isDetailView = false}
+  __init9() {this.isDetailView = false}
   /** Whether log streaming is paused */
-  __init7() {this.isPaused = false}
+  __init10() {this.isPaused = false}
+  /** Whether interactive mode is disabled */
+  
   /** Buffer for logs received while paused */
-  __init8() {this.pauseBuffer = []}
+  __init11() {this.pauseBuffer = []}
   /** Buffer for new logs in selection mode */
-  __init9() {this.selectionBuffer = []}
+  __init12() {this.selectionBuffer = []}
   /** Index of currently selected log entry */
-  __init10() {this.selectedIndex = 0}
+  __init13() {this.selectedIndex = 0}
   /** Current filter text for log searching */
-  __init11() {this.filterText = ""}
+  __init14() {this.filterText = ""}
   /** Cached array of filtered log entries */
-  __init12() {this.logs = []}
+  __init15() {this.logs = []}
   /** Polling interval for checking new logs in detail view */
-  __init13() {this.detailViewPollInterval = null}
+  __init16() {this.detailViewPollInterval = null}
   /** Polling interval for checking new logs in selection view */
-  __init14() {this.selectionViewPollInterval = null}
+  __init17() {this.selectionViewPollInterval = null}
   /** Current terminal width in characters */
-  __init15() {this.termWidth = process.stdout.columns || 80}
+  __init18() {this.termWidth = process.stdout.columns || 80}
   /**
    * Sets up keyboard input handling and cleanup.
    * Configures raw mode for immediate key processing.
@@ -753,13 +937,22 @@ var UIManager = (_class2 = class {
         this.detailViewPollInterval = null;
         return;
       }
-      const currentLogs = this.storage.getAllLogs();
-      if (currentLogs.length > this.logs.length && this.selectedIndex === this.logs.length - 1) {
-        this.logs = currentLogs;
+      const totalCount = this.filterText ? this.storage.getFilteredLogCount(this.filterText) : this.storage.getLogCount();
+      if (totalCount !== this.logs.length) {
+        const storedLogs = this.filterText ? this.storage.searchLogs(this.filterText) : this.storage.getAllLogs();
+        this.logs = storedLogs;
         const entry = this.logs[this.selectedIndex];
         const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
         const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-        this.renderer.renderDetailView(entry, prevEntry, nextEntry, this.renderer.getDetailViewScrollPos());
+        this.renderer.renderDetailView(
+          entry,
+          prevEntry,
+          nextEntry,
+          this.renderer.getDetailViewScrollPos(),
+          this.selectedIndex + 1,
+          totalCount,
+          this.filterText
+        );
       }
     }, 2e3);
   }
@@ -770,18 +963,22 @@ var UIManager = (_class2 = class {
    * @private
    */
   updateFilteredLogs() {
-    const storedLogs = this.filterText ? this.storage.searchLogs(this.filterText) : this.storage.getAllLogs();
-    this.logs = storedLogs.slice(0, storedLogs.length - this.selectionBuffer.length);
-    if (this.logs.length > 0) {
-      this.selectedIndex = Math.min(this.selectedIndex, Math.max(0, this.logs.length - 1));
-    } else {
-      this.selectedIndex = 0;
+    const totalCount = this.filterText ? this.storage.getFilteredLogCount(this.filterText) : this.storage.getLogCount();
+    const effectiveCount = totalCount - this.selectionBuffer.length;
+    if (effectiveCount !== this.logs.length) {
+      const storedLogs = this.filterText ? this.storage.searchLogs(this.filterText) : this.storage.getAllLogs();
+      this.logs = storedLogs.slice(0, storedLogs.length - this.selectionBuffer.length);
+      if (this.logs.length > 0) {
+        this.selectedIndex = Math.min(this.selectedIndex, Math.max(0, this.logs.length - 1));
+      } else {
+        this.selectedIndex = 0;
+      }
     }
   }
   updateNewLogsNotification() {
     if (!this.isSelectionMode || !this.selectionBuffer.length) return;
     process.stdout.write(`\x1B[2A\r${" ".repeat(this.termWidth)}\r`);
-    const notification = chalk6.default.dim(
+    const notification = chalk8.default.dim(
       `${this.selectionBuffer.length} new log${this.selectionBuffer.length === 1 ? "" : "s"} available (press \u2193 to view)`
     );
     process.stdout.write(`${notification}
@@ -796,6 +993,10 @@ var UIManager = (_class2 = class {
    */
   handleNewLog(entry) {
     this.storage.store(entry);
+    if (this.isInteractiveDisabled) {
+      this.renderer.renderLogLine(entry);
+      return;
+    }
     if (this.isSelectionMode) {
       this.selectionBuffer.push(entry);
       this.renderer.renderSelectionView(this.logs, this.selectedIndex, this.filterText, this.selectionBuffer.length);
@@ -804,7 +1005,7 @@ var UIManager = (_class2 = class {
     if (!this.isDetailView) {
       if (this.isPaused) {
         this.pauseBuffer.push(entry);
-        process.stdout.write(`\r${chalk6.default.yellow(`\u23F8  Paused (${this.pauseBuffer.length} new logs)`)}${" ".repeat(20)}`);
+        process.stdout.write(`\r${chalk8.default.yellow(`\u23F8  Paused (${this.pauseBuffer.length} new logs)`)}${" ".repeat(20)}`);
       } else {
         this.renderer.renderLogLine(entry);
       }
@@ -845,19 +1046,39 @@ var UIManager = (_class2 = class {
         }
         this.pauseBuffer = [];
       } else if (this.isPaused) {
-        process.stdout.write(`\r${chalk6.default.yellow("\u23F8  Paused (0 new logs)")}${" ".repeat(20)}`);
+        process.stdout.write(`\r${chalk8.default.yellow("\u23F8  Paused (0 new logs)")}${" ".repeat(20)}`);
+      }
+      return;
+    }
+    if (!this.isSelectionMode && !this.isDetailView && ch === "c") {
+      const newMode = this.renderer.cycleViewMode();
+      console.clear();
+      const logs = this.storage.getAllLogs();
+      for (const entry of logs) {
+        this.renderer.renderLogLine(entry);
       }
+      const modeDescriptions = {
+        full: "Full view enabled (all data shown without truncation)",
+        truncated: "Truncated view enabled (timestamp, ID, level, message, truncated data)",
+        condensed: "Condensed view enabled (timestamp, level and message only)"
+      };
+      process.stdout.write(`\r${chalk8.default.cyan(`\u2139  ${modeDescriptions[newMode]}`)}${" ".repeat(20)}`);
+      setTimeout(() => {
+        process.stdout.write(`\r${" ".repeat(100)}\r`);
+      }, 3e3);
       return;
     }
     if (!this.isSelectionMode && !this.isDetailView && _optionalChain([key, 'optionalAccess', _3 => _3.name]) === "tab") {
+      this.isSelectionMode = true;
+      this.filterText = "";
       if (this.isPaused) {
-        this.isPaused = false;
+        this.selectionBuffer = [...this.pauseBuffer];
         this.pauseBuffer = [];
-        process.stdout.write(`\r${" ".repeat(50)}\r`);
+        const storedLogs = this.storage.getAllLogs();
+        this.logs = storedLogs.slice(0, storedLogs.length - this.selectionBuffer.length);
+      } else {
+        this.updateFilteredLogs();
       }
-      this.isSelectionMode = true;
-      this.filterText = "";
-      this.updateFilteredLogs();
       this.selectedIndex = Math.max(0, this.logs.length - 1);
       this.renderer.renderSelectionView(this.logs, this.selectedIndex, this.filterText, this.selectionBuffer.length);
       this.startSelectionViewPolling();
@@ -898,7 +1119,15 @@ var UIManager = (_class2 = class {
               const selectedEntry = this.logs[this.selectedIndex];
               const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
               const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-              this.renderer.renderDetailView(selectedEntry, prevEntry, nextEntry);
+              this.renderer.renderDetailView(
+                selectedEntry,
+                prevEntry,
+                nextEntry,
+                0,
+                this.selectedIndex + 1,
+                this.logs.length,
+                this.filterText
+              );
               this.startDetailViewPolling();
             }
             return;
@@ -924,7 +1153,7 @@ var UIManager = (_class2 = class {
             }
             this.filterText = "";
             console.clear();
-            const logs = [...this.storage.getAllLogs()].reverse();
+            const logs = this.storage.getAllLogs();
             for (const entry of logs) {
               this.renderer.renderLogLine(entry);
             }
@@ -947,7 +1176,15 @@ var UIManager = (_class2 = class {
             const entry = this.logs[this.selectedIndex];
             const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
             const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-            this.renderer.renderDetailView(entry, prevEntry, nextEntry, this.renderer.getDetailViewScrollPos());
+            this.renderer.renderDetailView(
+              entry,
+              prevEntry,
+              nextEntry,
+              this.renderer.getDetailViewScrollPos(),
+              this.selectedIndex + 1,
+              this.logs.length,
+              this.filterText
+            );
             break;
           }
           case "down": {
@@ -955,7 +1192,15 @@ var UIManager = (_class2 = class {
             const entry = this.logs[this.selectedIndex];
             const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
             const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-            this.renderer.renderDetailView(entry, prevEntry, nextEntry, this.renderer.getDetailViewScrollPos());
+            this.renderer.renderDetailView(
+              entry,
+              prevEntry,
+              nextEntry,
+              this.renderer.getDetailViewScrollPos(),
+              this.selectedIndex + 1,
+              this.logs.length,
+              this.filterText
+            );
             break;
           }
           case "left": {
@@ -964,7 +1209,15 @@ var UIManager = (_class2 = class {
               const entry = this.logs[this.selectedIndex];
               const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
               const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-              this.renderer.renderDetailView(entry, prevEntry, nextEntry);
+              this.renderer.renderDetailView(
+                entry,
+                prevEntry,
+                nextEntry,
+                0,
+                this.selectedIndex + 1,
+                this.logs.length,
+                this.filterText
+              );
             }
             break;
           }
@@ -974,7 +1227,15 @@ var UIManager = (_class2 = class {
               const entry = this.logs[this.selectedIndex];
               const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
               const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-              this.renderer.renderDetailView(entry, prevEntry, nextEntry);
+              this.renderer.renderDetailView(
+                entry,
+                prevEntry,
+                nextEntry,
+                0,
+                this.selectedIndex + 1,
+                this.logs.length,
+                this.filterText
+              );
             }
             break;
           }
@@ -984,7 +1245,15 @@ var UIManager = (_class2 = class {
               const entry = this.logs[this.selectedIndex];
               const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
               const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-              this.renderer.renderDetailView(entry, prevEntry, nextEntry, this.renderer.getDetailViewScrollPos());
+              this.renderer.renderDetailView(
+                entry,
+                prevEntry,
+                nextEntry,
+                this.renderer.getDetailViewScrollPos(),
+                this.selectedIndex + 1,
+                this.logs.length,
+                this.filterText
+              );
               break;
             }
             this.isDetailView = false;
@@ -1011,7 +1280,14 @@ var UIManager = (_class2 = class {
             const entry = this.logs[this.selectedIndex];
             const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
             const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-            this.renderer.renderDetailView(entry, prevEntry, nextEntry, this.renderer.getDetailViewScrollPos());
+            this.renderer.renderDetailView(
+              entry,
+              prevEntry,
+              nextEntry,
+              this.renderer.getDetailViewScrollPos(),
+              this.selectedIndex + 1,
+              this.logs.length
+            );
             break;
           }
           case "q": {
@@ -1019,7 +1295,14 @@ var UIManager = (_class2 = class {
             const entry = this.logs[this.selectedIndex];
             const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
             const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-            this.renderer.renderDetailView(entry, prevEntry, nextEntry, this.renderer.getDetailViewScrollPos());
+            this.renderer.renderDetailView(
+              entry,
+              prevEntry,
+              nextEntry,
+              this.renderer.getDetailViewScrollPos(),
+              this.selectedIndex + 1,
+              this.logs.length
+            );
             break;
           }
           case "a": {
@@ -1028,7 +1311,7 @@ var UIManager = (_class2 = class {
               const entry = this.logs[this.selectedIndex];
               const prevEntry = null;
               const nextEntry = this.logs.length > 1 ? this.logs[1] : null;
-              this.renderer.renderDetailView(entry, prevEntry, nextEntry);
+              this.renderer.renderDetailView(entry, prevEntry, nextEntry, 0, 1, this.logs.length);
             }
             break;
           }
@@ -1039,7 +1322,7 @@ var UIManager = (_class2 = class {
               const entry = this.logs[this.selectedIndex];
               const prevEntry = lastIndex > 0 ? this.logs[lastIndex - 1] : null;
               const nextEntry = null;
-              this.renderer.renderDetailView(entry, prevEntry, nextEntry);
+              this.renderer.renderDetailView(entry, prevEntry, nextEntry, 0, this.logs.length, this.logs.length);
             }
             break;
           }
@@ -1048,7 +1331,14 @@ var UIManager = (_class2 = class {
             const entry = this.logs[this.selectedIndex];
             const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
             const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-            this.renderer.renderDetailView(entry, prevEntry, nextEntry, this.renderer.getDetailViewScrollPos());
+            this.renderer.renderDetailView(
+              entry,
+              prevEntry,
+              nextEntry,
+              this.renderer.getDetailViewScrollPos(),
+              this.selectedIndex + 1,
+              this.logs.length
+            );
             break;
           }
           case "j": {
@@ -1056,304 +1346,304 @@ var UIManager = (_class2 = class {
             const entry = this.logs[this.selectedIndex];
             const prevEntry = this.selectedIndex > 0 ? this.logs[this.selectedIndex - 1] : null;
             const nextEntry = this.selectedIndex < this.logs.length - 1 ? this.logs[this.selectedIndex + 1] : null;
-            this.renderer.renderDetailView(entry, prevEntry, nextEntry);
+            this.renderer.renderDetailView(entry, prevEntry, nextEntry, 0, this.selectedIndex + 1, this.logs.length);
             break;
           }
         }
       }
     }
   }
-}, _class2);
+}, _class3);
 
 // src/themes.ts
 
 var moonlight = {
   simpleView: {
     colors: {
-      trace: chalk6.default.rgb(114, 135, 153),
+      trace: chalk8.default.rgb(114, 135, 153),
       // Muted blue-grey for less important info
-      debug: chalk6.default.rgb(130, 170, 255),
+      debug: chalk8.default.rgb(130, 170, 255),
       // Soft blue that pops but doesn't strain
-      info: chalk6.default.rgb(195, 232, 141),
+      info: chalk8.default.rgb(195, 232, 141),
       // Sage green for good readability
-      warn: chalk6.default.rgb(255, 203, 107),
+      warn: chalk8.default.rgb(255, 203, 107),
       // Warm yellow, less harsh than pure yellow
-      error: chalk6.default.rgb(247, 118, 142),
+      error: chalk8.default.rgb(247, 118, 142),
       // Soft red that stands out without being aggressive
-      fatal: chalk6.default.bgRgb(247, 118, 142).white
+      fatal: chalk8.default.bgRgb(247, 118, 142).white
       // Inverted soft red for maximum visibility
     },
-    logIdColor: chalk6.default.rgb(84, 98, 117),
+    logIdColor: chalk8.default.rgb(84, 98, 117),
     // Darker blue-grey for secondary information
-    dataValueColor: chalk6.default.rgb(209, 219, 231),
+    dataValueColor: chalk8.default.rgb(209, 219, 231),
     // Light grey-blue for primary content
-    dataKeyColor: chalk6.default.rgb(130, 170, 255),
+    dataKeyColor: chalk8.default.rgb(130, 170, 255),
     // Matching debug blue for consistency
-    selectorColor: chalk6.default.rgb(137, 221, 255)
+    selectorColor: chalk8.default.rgb(137, 221, 255)
     // Ice blue for selection indicators
   },
   detailedView: {
     colors: {
-      trace: chalk6.default.rgb(114, 135, 153),
-      debug: chalk6.default.rgb(130, 170, 255),
-      info: chalk6.default.rgb(195, 232, 141),
-      warn: chalk6.default.rgb(255, 203, 107),
-      error: chalk6.default.rgb(247, 118, 142),
-      fatal: chalk6.default.bgRgb(247, 118, 142).white
+      trace: chalk8.default.rgb(114, 135, 153),
+      debug: chalk8.default.rgb(130, 170, 255),
+      info: chalk8.default.rgb(195, 232, 141),
+      warn: chalk8.default.rgb(255, 203, 107),
+      error: chalk8.default.rgb(247, 118, 142),
+      fatal: chalk8.default.bgRgb(247, 118, 142).white
     },
-    logIdColor: chalk6.default.rgb(84, 98, 117),
-    dataValueColor: chalk6.default.rgb(209, 219, 231),
-    dataKeyColor: chalk6.default.rgb(130, 170, 255),
-    selectorColor: chalk6.default.rgb(137, 221, 255),
+    logIdColor: chalk8.default.rgb(84, 98, 117),
+    dataValueColor: chalk8.default.rgb(209, 219, 231),
+    dataKeyColor: chalk8.default.rgb(130, 170, 255),
+    selectorColor: chalk8.default.rgb(137, 221, 255),
     // Ice blue for selection indicators
-    headerColor: chalk6.default.rgb(137, 221, 255),
-    labelColor: chalk6.default.rgb(137, 221, 255).bold,
-    separatorColor: chalk6.default.rgb(84, 98, 117),
+    headerColor: chalk8.default.rgb(137, 221, 255),
+    labelColor: chalk8.default.rgb(137, 221, 255).bold,
+    separatorColor: chalk8.default.rgb(84, 98, 117),
     jsonColors: {
-      keysColor: chalk6.default.rgb(130, 170, 255),
-      dashColor: chalk6.default.rgb(209, 219, 231),
-      numberColor: chalk6.default.rgb(247, 140, 108),
-      stringColor: chalk6.default.rgb(195, 232, 141),
-      multilineStringColor: chalk6.default.rgb(195, 232, 141),
-      positiveNumberColor: chalk6.default.rgb(195, 232, 141),
-      negativeNumberColor: chalk6.default.rgb(247, 118, 142),
-      booleanColor: chalk6.default.rgb(255, 203, 107),
-      nullUndefinedColor: chalk6.default.rgb(114, 135, 153),
-      dateColor: chalk6.default.rgb(199, 146, 234)
+      keysColor: chalk8.default.rgb(130, 170, 255),
+      dashColor: chalk8.default.rgb(209, 219, 231),
+      numberColor: chalk8.default.rgb(247, 140, 108),
+      stringColor: chalk8.default.rgb(195, 232, 141),
+      multilineStringColor: chalk8.default.rgb(195, 232, 141),
+      positiveNumberColor: chalk8.default.rgb(195, 232, 141),
+      negativeNumberColor: chalk8.default.rgb(247, 118, 142),
+      booleanColor: chalk8.default.rgb(255, 203, 107),
+      nullUndefinedColor: chalk8.default.rgb(114, 135, 153),
+      dateColor: chalk8.default.rgb(199, 146, 234)
     }
   }
 };
 var sunlight = {
   simpleView: {
     colors: {
-      trace: chalk6.default.rgb(110, 110, 110),
+      trace: chalk8.default.rgb(110, 110, 110),
       // Dark grey for subtle information
-      debug: chalk6.default.rgb(32, 96, 159),
+      debug: chalk8.default.rgb(32, 96, 159),
       // Deep blue for strong contrast on white
-      info: chalk6.default.rgb(35, 134, 54),
+      info: chalk8.default.rgb(35, 134, 54),
       // Forest green, easier on the eyes than bright green
-      warn: chalk6.default.rgb(176, 95, 0),
+      warn: chalk8.default.rgb(176, 95, 0),
       // Brown-orange for natural warning color
-      error: chalk6.default.rgb(191, 0, 0),
+      error: chalk8.default.rgb(191, 0, 0),
       // Deep red for clear visibility on light backgrounds
-      fatal: chalk6.default.bgRgb(191, 0, 0).white
+      fatal: chalk8.default.bgRgb(191, 0, 0).white
       // White on deep red for critical issues
     },
-    logIdColor: chalk6.default.rgb(110, 110, 110),
-    dataValueColor: chalk6.default.rgb(0, 0, 0),
-    dataKeyColor: chalk6.default.rgb(32, 96, 159),
-    selectorColor: chalk6.default.rgb(0, 91, 129)
+    logIdColor: chalk8.default.rgb(110, 110, 110),
+    dataValueColor: chalk8.default.rgb(0, 0, 0),
+    dataKeyColor: chalk8.default.rgb(32, 96, 159),
+    selectorColor: chalk8.default.rgb(0, 91, 129)
     // Deep blue for strong contrast
   },
   detailedView: {
     colors: {
-      trace: chalk6.default.rgb(110, 110, 110),
-      debug: chalk6.default.rgb(32, 96, 159),
-      info: chalk6.default.rgb(35, 134, 54),
-      warn: chalk6.default.rgb(176, 95, 0),
-      error: chalk6.default.rgb(191, 0, 0),
-      fatal: chalk6.default.bgRgb(191, 0, 0).white
+      trace: chalk8.default.rgb(110, 110, 110),
+      debug: chalk8.default.rgb(32, 96, 159),
+      info: chalk8.default.rgb(35, 134, 54),
+      warn: chalk8.default.rgb(176, 95, 0),
+      error: chalk8.default.rgb(191, 0, 0),
+      fatal: chalk8.default.bgRgb(191, 0, 0).white
     },
-    logIdColor: chalk6.default.rgb(110, 110, 110),
-    dataValueColor: chalk6.default.rgb(0, 0, 0),
-    dataKeyColor: chalk6.default.rgb(32, 96, 159),
-    selectorColor: chalk6.default.rgb(0, 91, 129),
+    logIdColor: chalk8.default.rgb(110, 110, 110),
+    dataValueColor: chalk8.default.rgb(0, 0, 0),
+    dataKeyColor: chalk8.default.rgb(32, 96, 159),
+    selectorColor: chalk8.default.rgb(0, 91, 129),
     // Deep blue for strong contrast
-    headerColor: chalk6.default.rgb(0, 91, 129),
-    labelColor: chalk6.default.rgb(0, 91, 129).bold,
-    separatorColor: chalk6.default.rgb(110, 110, 110),
+    headerColor: chalk8.default.rgb(0, 91, 129),
+    labelColor: chalk8.default.rgb(0, 91, 129).bold,
+    separatorColor: chalk8.default.rgb(110, 110, 110),
     jsonColors: {
-      keysColor: chalk6.default.rgb(32, 96, 159),
-      dashColor: chalk6.default.rgb(0, 0, 0),
-      numberColor: chalk6.default.rgb(170, 55, 49),
-      stringColor: chalk6.default.rgb(35, 134, 54),
-      multilineStringColor: chalk6.default.rgb(35, 134, 54),
-      positiveNumberColor: chalk6.default.rgb(46, 125, 50),
-      negativeNumberColor: chalk6.default.rgb(183, 28, 28),
-      booleanColor: chalk6.default.rgb(176, 95, 0),
-      nullUndefinedColor: chalk6.default.rgb(110, 110, 110),
-      dateColor: chalk6.default.rgb(123, 31, 162)
+      keysColor: chalk8.default.rgb(32, 96, 159),
+      dashColor: chalk8.default.rgb(0, 0, 0),
+      numberColor: chalk8.default.rgb(170, 55, 49),
+      stringColor: chalk8.default.rgb(35, 134, 54),
+      multilineStringColor: chalk8.default.rgb(35, 134, 54),
+      positiveNumberColor: chalk8.default.rgb(46, 125, 50),
+      negativeNumberColor: chalk8.default.rgb(183, 28, 28),
+      booleanColor: chalk8.default.rgb(176, 95, 0),
+      nullUndefinedColor: chalk8.default.rgb(110, 110, 110),
+      dateColor: chalk8.default.rgb(123, 31, 162)
     }
   }
 };
 var neon = {
   simpleView: {
     colors: {
-      trace: chalk6.default.rgb(108, 108, 255),
+      trace: chalk8.default.rgb(108, 108, 255),
       // Electric blue
-      debug: chalk6.default.rgb(255, 82, 246),
+      debug: chalk8.default.rgb(255, 82, 246),
       // Hot pink
-      info: chalk6.default.rgb(0, 255, 163),
+      info: chalk8.default.rgb(0, 255, 163),
       // Cyber green
-      warn: chalk6.default.rgb(255, 231, 46),
+      warn: chalk8.default.rgb(255, 231, 46),
       // Electric yellow
-      error: chalk6.default.rgb(255, 53, 91),
+      error: chalk8.default.rgb(255, 53, 91),
       // Neon red
-      fatal: chalk6.default.bgRgb(255, 53, 91).rgb(0, 255, 163)
+      fatal: chalk8.default.bgRgb(255, 53, 91).rgb(0, 255, 163)
       // Neon red bg with cyber green text
     },
-    logIdColor: chalk6.default.rgb(187, 134, 252),
+    logIdColor: chalk8.default.rgb(187, 134, 252),
     // Bright purple
-    dataValueColor: chalk6.default.rgb(255, 255, 255),
+    dataValueColor: chalk8.default.rgb(255, 255, 255),
     // Pure white
-    dataKeyColor: chalk6.default.rgb(0, 255, 240),
+    dataKeyColor: chalk8.default.rgb(0, 255, 240),
     // Cyan
-    selectorColor: chalk6.default.rgb(0, 255, 240)
+    selectorColor: chalk8.default.rgb(0, 255, 240)
     // Electric cyan for cyberpunk feel
   },
   detailedView: {
     colors: {
-      trace: chalk6.default.rgb(108, 108, 255),
-      debug: chalk6.default.rgb(255, 82, 246),
-      info: chalk6.default.rgb(0, 255, 163),
-      warn: chalk6.default.rgb(255, 231, 46),
-      error: chalk6.default.rgb(255, 53, 91),
-      fatal: chalk6.default.bgRgb(255, 53, 91).rgb(0, 255, 163)
+      trace: chalk8.default.rgb(108, 108, 255),
+      debug: chalk8.default.rgb(255, 82, 246),
+      info: chalk8.default.rgb(0, 255, 163),
+      warn: chalk8.default.rgb(255, 231, 46),
+      error: chalk8.default.rgb(255, 53, 91),
+      fatal: chalk8.default.bgRgb(255, 53, 91).rgb(0, 255, 163)
     },
-    logIdColor: chalk6.default.rgb(187, 134, 252),
-    dataValueColor: chalk6.default.rgb(255, 255, 255),
-    dataKeyColor: chalk6.default.rgb(0, 255, 240),
-    selectorColor: chalk6.default.rgb(0, 255, 240),
+    logIdColor: chalk8.default.rgb(187, 134, 252),
+    dataValueColor: chalk8.default.rgb(255, 255, 255),
+    dataKeyColor: chalk8.default.rgb(0, 255, 240),
+    selectorColor: chalk8.default.rgb(0, 255, 240),
     // Electric cyan for cyberpunk feel
-    headerColor: chalk6.default.rgb(255, 82, 246),
-    labelColor: chalk6.default.rgb(255, 82, 246).bold,
-    separatorColor: chalk6.default.rgb(108, 108, 255),
+    headerColor: chalk8.default.rgb(255, 82, 246),
+    labelColor: chalk8.default.rgb(255, 82, 246).bold,
+    separatorColor: chalk8.default.rgb(108, 108, 255),
     jsonColors: {
-      keysColor: chalk6.default.rgb(0, 255, 240),
-      dashColor: chalk6.default.rgb(255, 255, 255),
-      numberColor: chalk6.default.rgb(255, 82, 246),
-      stringColor: chalk6.default.rgb(0, 255, 163),
-      multilineStringColor: chalk6.default.rgb(0, 255, 163),
-      positiveNumberColor: chalk6.default.rgb(0, 255, 163),
-      negativeNumberColor: chalk6.default.rgb(255, 53, 91),
-      booleanColor: chalk6.default.rgb(255, 231, 46),
-      nullUndefinedColor: chalk6.default.rgb(108, 108, 255),
-      dateColor: chalk6.default.rgb(187, 134, 252)
+      keysColor: chalk8.default.rgb(0, 255, 240),
+      dashColor: chalk8.default.rgb(255, 255, 255),
+      numberColor: chalk8.default.rgb(255, 82, 246),
+      stringColor: chalk8.default.rgb(0, 255, 163),
+      multilineStringColor: chalk8.default.rgb(0, 255, 163),
+      positiveNumberColor: chalk8.default.rgb(0, 255, 163),
+      negativeNumberColor: chalk8.default.rgb(255, 53, 91),
+      booleanColor: chalk8.default.rgb(255, 231, 46),
+      nullUndefinedColor: chalk8.default.rgb(108, 108, 255),
+      dateColor: chalk8.default.rgb(187, 134, 252)
     }
   }
 };
 var nature = {
   simpleView: {
     colors: {
-      trace: chalk6.default.rgb(121, 85, 72),
+      trace: chalk8.default.rgb(121, 85, 72),
       // Wooden brown
-      debug: chalk6.default.rgb(46, 125, 50),
+      debug: chalk8.default.rgb(46, 125, 50),
       // Forest green
-      info: chalk6.default.rgb(0, 105, 92),
+      info: chalk8.default.rgb(0, 105, 92),
       // Deep teal
-      warn: chalk6.default.rgb(175, 115, 0),
+      warn: chalk8.default.rgb(175, 115, 0),
       // Golden amber
-      error: chalk6.default.rgb(183, 28, 28),
+      error: chalk8.default.rgb(183, 28, 28),
       // Autumn red
-      fatal: chalk6.default.bgRgb(183, 28, 28).rgb(255, 250, 240)
+      fatal: chalk8.default.bgRgb(183, 28, 28).rgb(255, 250, 240)
       // Red bg with soft white
     },
-    logIdColor: chalk6.default.rgb(93, 64, 55),
+    logIdColor: chalk8.default.rgb(93, 64, 55),
     // Deep bark brown
-    dataValueColor: chalk6.default.rgb(27, 27, 27),
+    dataValueColor: chalk8.default.rgb(27, 27, 27),
     // Near black
-    dataKeyColor: chalk6.default.rgb(56, 142, 60),
+    dataKeyColor: chalk8.default.rgb(56, 142, 60),
     // Leaf green
-    selectorColor: chalk6.default.rgb(0, 105, 92)
+    selectorColor: chalk8.default.rgb(0, 105, 92)
     // Deep teal for natural feel
   },
   detailedView: {
     colors: {
-      trace: chalk6.default.rgb(121, 85, 72),
-      debug: chalk6.default.rgb(46, 125, 50),
-      info: chalk6.default.rgb(0, 105, 92),
-      warn: chalk6.default.rgb(175, 115, 0),
-      error: chalk6.default.rgb(183, 28, 28),
-      fatal: chalk6.default.bgRgb(183, 28, 28).rgb(255, 250, 240)
+      trace: chalk8.default.rgb(121, 85, 72),
+      debug: chalk8.default.rgb(46, 125, 50),
+      info: chalk8.default.rgb(0, 105, 92),
+      warn: chalk8.default.rgb(175, 115, 0),
+      error: chalk8.default.rgb(183, 28, 28),
+      fatal: chalk8.default.bgRgb(183, 28, 28).rgb(255, 250, 240)
     },
-    logIdColor: chalk6.default.rgb(93, 64, 55),
-    dataValueColor: chalk6.default.rgb(27, 27, 27),
-    dataKeyColor: chalk6.default.rgb(56, 142, 60),
-    selectorColor: chalk6.default.rgb(0, 105, 92),
+    logIdColor: chalk8.default.rgb(93, 64, 55),
+    dataValueColor: chalk8.default.rgb(27, 27, 27),
+    dataKeyColor: chalk8.default.rgb(56, 142, 60),
+    selectorColor: chalk8.default.rgb(0, 105, 92),
     // Deep teal for natural feel
-    headerColor: chalk6.default.rgb(0, 77, 64),
-    labelColor: chalk6.default.rgb(0, 77, 64).bold,
-    separatorColor: chalk6.default.rgb(121, 85, 72),
+    headerColor: chalk8.default.rgb(0, 77, 64),
+    labelColor: chalk8.default.rgb(0, 77, 64).bold,
+    separatorColor: chalk8.default.rgb(121, 85, 72),
     jsonColors: {
-      keysColor: chalk6.default.rgb(56, 142, 60),
-      dashColor: chalk6.default.rgb(27, 27, 27),
-      numberColor: chalk6.default.rgb(230, 81, 0),
-      stringColor: chalk6.default.rgb(0, 105, 92),
-      multilineStringColor: chalk6.default.rgb(0, 105, 92),
-      positiveNumberColor: chalk6.default.rgb(46, 125, 50),
-      negativeNumberColor: chalk6.default.rgb(183, 28, 28),
-      booleanColor: chalk6.default.rgb(175, 115, 0),
-      nullUndefinedColor: chalk6.default.rgb(121, 85, 72),
-      dateColor: chalk6.default.rgb(123, 31, 162)
+      keysColor: chalk8.default.rgb(56, 142, 60),
+      dashColor: chalk8.default.rgb(27, 27, 27),
+      numberColor: chalk8.default.rgb(230, 81, 0),
+      stringColor: chalk8.default.rgb(0, 105, 92),
+      multilineStringColor: chalk8.default.rgb(0, 105, 92),
+      positiveNumberColor: chalk8.default.rgb(46, 125, 50),
+      negativeNumberColor: chalk8.default.rgb(183, 28, 28),
+      booleanColor: chalk8.default.rgb(175, 115, 0),
+      nullUndefinedColor: chalk8.default.rgb(121, 85, 72),
+      dateColor: chalk8.default.rgb(123, 31, 162)
     }
   }
 };
 var pastel = {
   simpleView: {
     colors: {
-      trace: chalk6.default.rgb(179, 189, 203),
+      trace: chalk8.default.rgb(179, 189, 203),
       // Soft slate blue
-      debug: chalk6.default.rgb(189, 178, 255),
+      debug: chalk8.default.rgb(189, 178, 255),
       // Gentle lavender
-      info: chalk6.default.rgb(170, 236, 205),
+      info: chalk8.default.rgb(170, 236, 205),
       // Mint green
-      warn: chalk6.default.rgb(255, 223, 186),
+      warn: chalk8.default.rgb(255, 223, 186),
       // Peach
-      error: chalk6.default.rgb(255, 188, 188),
+      error: chalk8.default.rgb(255, 188, 188),
       // Soft coral
-      fatal: chalk6.default.bgRgb(255, 188, 188).rgb(76, 40, 40)
+      fatal: chalk8.default.bgRgb(255, 188, 188).rgb(76, 40, 40)
       // Coral bg with deep brown
     },
-    logIdColor: chalk6.default.rgb(203, 195, 227),
+    logIdColor: chalk8.default.rgb(203, 195, 227),
     // Dusty lavender
-    dataValueColor: chalk6.default.rgb(236, 236, 236),
+    dataValueColor: chalk8.default.rgb(236, 236, 236),
     // Soft white
-    dataKeyColor: chalk6.default.rgb(186, 207, 255),
+    dataKeyColor: chalk8.default.rgb(186, 207, 255),
     // Baby blue
-    selectorColor: chalk6.default.rgb(189, 178, 255)
+    selectorColor: chalk8.default.rgb(189, 178, 255)
     // Soft lavender for gentle highlighting
   },
   detailedView: {
     colors: {
-      trace: chalk6.default.rgb(179, 189, 203),
-      debug: chalk6.default.rgb(189, 178, 255),
-      info: chalk6.default.rgb(170, 236, 205),
-      warn: chalk6.default.rgb(255, 223, 186),
-      error: chalk6.default.rgb(255, 188, 188),
-      fatal: chalk6.default.bgRgb(255, 188, 188).rgb(76, 40, 40)
+      trace: chalk8.default.rgb(179, 189, 203),
+      debug: chalk8.default.rgb(189, 178, 255),
+      info: chalk8.default.rgb(170, 236, 205),
+      warn: chalk8.default.rgb(255, 223, 186),
+      error: chalk8.default.rgb(255, 188, 188),
+      fatal: chalk8.default.bgRgb(255, 188, 188).rgb(76, 40, 40)
     },
-    logIdColor: chalk6.default.rgb(203, 195, 227),
-    dataValueColor: chalk6.default.rgb(236, 236, 236),
-    dataKeyColor: chalk6.default.rgb(186, 207, 255),
-    selectorColor: chalk6.default.rgb(189, 178, 255),
+    logIdColor: chalk8.default.rgb(203, 195, 227),
+    dataValueColor: chalk8.default.rgb(236, 236, 236),
+    dataKeyColor: chalk8.default.rgb(186, 207, 255),
+    selectorColor: chalk8.default.rgb(189, 178, 255),
     // Soft lavender for gentle highlighting
-    headerColor: chalk6.default.rgb(255, 198, 255),
+    headerColor: chalk8.default.rgb(255, 198, 255),
     // Cotton candy pink
-    labelColor: chalk6.default.rgb(255, 198, 255).bold,
-    separatorColor: chalk6.default.rgb(179, 189, 203),
+    labelColor: chalk8.default.rgb(255, 198, 255).bold,
+    separatorColor: chalk8.default.rgb(179, 189, 203),
     jsonColors: {
-      keysColor: chalk6.default.rgb(186, 207, 255),
+      keysColor: chalk8.default.rgb(186, 207, 255),
       // Baby blue
-      dashColor: chalk6.default.rgb(236, 236, 236),
+      dashColor: chalk8.default.rgb(236, 236, 236),
       // Soft white
-      numberColor: chalk6.default.rgb(255, 198, 255),
+      numberColor: chalk8.default.rgb(255, 198, 255),
       // Cotton candy pink
-      stringColor: chalk6.default.rgb(170, 236, 205),
+      stringColor: chalk8.default.rgb(170, 236, 205),
       // Mint green
-      multilineStringColor: chalk6.default.rgb(170, 236, 205),
-      positiveNumberColor: chalk6.default.rgb(170, 236, 205),
-      negativeNumberColor: chalk6.default.rgb(255, 188, 188),
-      booleanColor: chalk6.default.rgb(255, 223, 186),
+      multilineStringColor: chalk8.default.rgb(170, 236, 205),
+      positiveNumberColor: chalk8.default.rgb(170, 236, 205),
+      negativeNumberColor: chalk8.default.rgb(255, 188, 188),
+      booleanColor: chalk8.default.rgb(255, 223, 186),
       // Peach
-      nullUndefinedColor: chalk6.default.rgb(179, 189, 203),
-      dateColor: chalk6.default.rgb(189, 178, 255)
+      nullUndefinedColor: chalk8.default.rgb(179, 189, 203),
+      dateColor: chalk8.default.rgb(189, 178, 255)
       // Gentle lavender
     }
   }
 };
 
 // src/PrettyTerminalTransport.ts
-var PrettyTerminalTransport = (_class3 = class _PrettyTerminalTransport extends _transport.LoggerlessTransport {
+var PrettyTerminalTransport = (_class4 = class _PrettyTerminalTransport extends _transport.LoggerlessTransport {
   /** Singleton instance of the transport */
   static __initStatic() {this.instance = null}
   /** Handles all rendering and formatting of logs */
@@ -1387,70 +1677,70 @@ var PrettyTerminalTransport = (_class3 = class _PrettyTerminalTransport extends
     const logFile = config.logFile;
     const simpleViewConfig = {
       colors: {
-        trace: chalk6.default.gray,
+        trace: chalk8.default.gray,
         // Lowest level, used for verbose output
-        debug: chalk6.default.blue,
+        debug: chalk8.default.blue,
         // Debug information
-        info: chalk6.default.green,
+        info: chalk8.default.green,
         // Normal operation
-        warn: chalk6.default.yellow,
+        warn: chalk8.default.yellow,
         // Warning conditions
-        error: chalk6.default.red,
+        error: chalk8.default.red,
         // Error conditions
-        fatal: chalk6.default.bgRed.white,
+        fatal: chalk8.default.bgRed.white,
         // Critical errors
         ...theme.simpleView.colors
       },
-      logIdColor: theme.simpleView.logIdColor || chalk6.default.dim,
-      dataValueColor: theme.simpleView.dataValueColor || chalk6.default.white,
-      dataKeyColor: theme.simpleView.dataKeyColor || chalk6.default.dim,
-      selectorColor: theme.simpleView.selectorColor || chalk6.default.cyan
+      logIdColor: theme.simpleView.logIdColor || chalk8.default.dim,
+      dataValueColor: theme.simpleView.dataValueColor || chalk8.default.white,
+      dataKeyColor: theme.simpleView.dataKeyColor || chalk8.default.dim,
+      selectorColor: theme.simpleView.selectorColor || chalk8.default.cyan
     };
     const detailedViewConfig = {
       colors: {
-        trace: chalk6.default.gray,
-        debug: chalk6.default.blue,
-        info: chalk6.default.green,
-        warn: chalk6.default.yellow,
-        error: chalk6.default.red,
-        fatal: chalk6.default.bgRed.white,
+        trace: chalk8.default.gray,
+        debug: chalk8.default.blue,
+        info: chalk8.default.green,
+        warn: chalk8.default.yellow,
+        error: chalk8.default.red,
+        fatal: chalk8.default.bgRed.white,
         ..._optionalChain([theme, 'access', _5 => _5.detailedView, 'optionalAccess', _6 => _6.colors])
       },
-      logIdColor: _optionalChain([theme, 'access', _7 => _7.detailedView, 'optionalAccess', _8 => _8.logIdColor]) || chalk6.default.dim,
-      dataValueColor: _optionalChain([theme, 'access', _9 => _9.detailedView, 'optionalAccess', _10 => _10.dataValueColor]) || chalk6.default.white,
-      dataKeyColor: _optionalChain([theme, 'access', _11 => _11.detailedView, 'optionalAccess', _12 => _12.dataKeyColor]) || chalk6.default.dim,
-      selectorColor: _optionalChain([theme, 'access', _13 => _13.detailedView, 'optionalAccess', _14 => _14.selectorColor]) || chalk6.default.cyan,
-      headerColor: _optionalChain([theme, 'access', _15 => _15.detailedView, 'optionalAccess', _16 => _16.headerColor]) || chalk6.default.cyan,
-      labelColor: _optionalChain([theme, 'access', _17 => _17.detailedView, 'optionalAccess', _18 => _18.labelColor]) || chalk6.default.cyan.bold,
-      separatorColor: _optionalChain([theme, 'access', _19 => _19.detailedView, 'optionalAccess', _20 => _20.separatorColor]) || chalk6.default.dim,
+      logIdColor: _optionalChain([theme, 'access', _7 => _7.detailedView, 'optionalAccess', _8 => _8.logIdColor]) || chalk8.default.dim,
+      dataValueColor: _optionalChain([theme, 'access', _9 => _9.detailedView, 'optionalAccess', _10 => _10.dataValueColor]) || chalk8.default.white,
+      dataKeyColor: _optionalChain([theme, 'access', _11 => _11.detailedView, 'optionalAccess', _12 => _12.dataKeyColor]) || chalk8.default.dim,
+      selectorColor: _optionalChain([theme, 'access', _13 => _13.detailedView, 'optionalAccess', _14 => _14.selectorColor]) || chalk8.default.cyan,
+      headerColor: _optionalChain([theme, 'access', _15 => _15.detailedView, 'optionalAccess', _16 => _16.headerColor]) || chalk8.default.cyan,
+      labelColor: _optionalChain([theme, 'access', _17 => _17.detailedView, 'optionalAccess', _18 => _18.labelColor]) || chalk8.default.cyan.bold,
+      separatorColor: _optionalChain([theme, 'access', _19 => _19.detailedView, 'optionalAccess', _20 => _20.separatorColor]) || chalk8.default.dim,
       // JSON formatting colors for detailed data view
       jsonColors: {
-        keysColor: chalk6.default.yellow,
+        keysColor: chalk8.default.yellow,
         // Object property names
-        dashColor: chalk6.default.white,
+        dashColor: chalk8.default.white,
         // Array bullets
-        numberColor: chalk6.default.yellow,
+        numberColor: chalk8.default.yellow,
         // Default number color
-        stringColor: chalk6.default.white,
+        stringColor: chalk8.default.white,
         // Single-line strings
-        multilineStringColor: chalk6.default.white,
+        multilineStringColor: chalk8.default.white,
         // Multi-line strings
-        positiveNumberColor: chalk6.default.green,
+        positiveNumberColor: chalk8.default.green,
         // Numbers > 0
-        negativeNumberColor: chalk6.default.red,
+        negativeNumberColor: chalk8.default.red,
         // Numbers < 0
-        booleanColor: chalk6.default.cyan,
+        booleanColor: chalk8.default.cyan,
         // true/false values
-        nullUndefinedColor: chalk6.default.grey,
+        nullUndefinedColor: chalk8.default.grey,
         // null/undefined
-        dateColor: chalk6.default.magenta,
+        dateColor: chalk8.default.magenta,
         // Date objects
         ..._optionalChain([theme, 'access', _21 => _21.detailedView, 'optionalAccess', _22 => _22.jsonColors])
       }
     };
     this.storage = new LogStorage(logFile);
     this.renderer = new LogRenderer(simpleViewConfig, detailedViewConfig, maxInlineDepth, maxInlineLength);
-    this.uiManager = new UIManager(this.renderer, this.storage);
+    this.uiManager = new UIManager(this.renderer, this.storage, config.disableInteractiveMode);
     _PrettyTerminalTransport.instance = this;
   }
   /**
@@ -1505,7 +1795,7 @@ var PrettyTerminalTransport = (_class3 = class _PrettyTerminalTransport extends
     this.uiManager.handleNewLog(entry);
     return messages;
   }
-}, _class3.__initStatic(), _class3);
+}, _class4.__initStatic(), _class4);
 
 // src/index.ts
 
@@ -1521,5 +1811,5 @@ function getPrettyTerminal(config = {}) {
 
 
 
-exports.PrettyTerminalTransport = PrettyTerminalTransport; exports.chalk = chalk6; exports.getPrettyTerminal = getPrettyTerminal; exports.moonlight = moonlight; exports.nature = nature; exports.neon = neon; exports.pastel = pastel; exports.sunlight = sunlight;
+exports.PrettyTerminalTransport = PrettyTerminalTransport; exports.chalk = chalk8; exports.getPrettyTerminal = getPrettyTerminal; exports.moonlight = moonlight; exports.nature = nature; exports.neon = neon; exports.pastel = pastel; exports.sunlight = sunlight;
 //# sourceMappingURL=index.cjs.map