@mks2508/mks-ui 0.3.2 → 0.5.0

package/dist/react-ui/blocks/Terminal/parsing/PersistentLogBuffer.js

@@ -0,0 +1,221 @@
+//#region src/react-ui/blocks/Terminal/parsing/PersistentLogBuffer.ts
+/**
+* Persistent circular buffer for log entries.
+*
+* Features:
+* - Circular buffer with automatic cleanup
+* - Pagination support for large datasets
+* - Search by pattern
+* - Memory-efficient storage
+* - Periodic cleanup to prevent memory leaks
+*
+* @example
+* ```ts
+* const buffer = new PersistentLogBuffer({ maxSize: 50000 });
+* buffer.append(entries);
+* const page1 = buffer.getEntries({ offset: 0, limit: 100 });
+* const results = buffer.search(/error/i);
+* ```
+*/
+var PersistentLogBuffer = class {
+	/** Internal storage for entries */
+	buffer = [];
+	/** Buffer configuration */
+	config;
+	/** Cleanup timer reference */
+	cleanupTimer;
+	/** Cleanup scheduled flag */
+	cleanupScheduled = false;
+	/**
+	* Create a new persistent log buffer.
+	*
+	* @param config - Buffer configuration
+	*/
+	constructor(config = {}) {
+		this.config = {
+			maxSize: 5e4,
+			softLimit: 4e4,
+			cleanupBatch: 5e3,
+			cleanupInterval: 3e4,
+			...config
+		};
+		this.startCleanupTimer();
+	}
+	/**
+	* Append entries to the buffer.
+	*
+	* If the buffer exceeds the soft limit, schedules a cleanup.
+	*
+	* @param entries - Entries to append
+	*/
+	append(entries) {
+		if (entries.length === 0) return;
+		this.buffer.push(...entries);
+		if (this.buffer.length > this.config.softLimit && !this.cleanupScheduled) this.scheduleCleanup();
+	}
+	/**
+	* Prepend entries to the buffer (for loading historical logs).
+	*
+	* @param entries - Entries to prepend
+	*/
+	prepend(entries) {
+		if (entries.length === 0) return;
+		this.buffer = [...entries, ...this.buffer];
+		if (this.buffer.length > this.config.maxSize) this.buffer = this.buffer.slice(0, this.config.maxSize);
+	}
+	/**
+	* Get entries from the buffer with pagination.
+	*
+	* @param options - Query options
+	* @returns Array of entries
+	*/
+	getEntries(options = {}) {
+		let { offset = 0, limit, fromLine, toLine } = options;
+		let start = offset;
+		let end;
+		if (fromLine !== void 0) {
+			start = this.buffer.findIndex((e) => e.line_number >= fromLine);
+			if (start === -1) start = this.buffer.length;
+		}
+		if (toLine !== void 0) {
+			end = this.buffer.findIndex((e) => e.line_number > toLine);
+			if (end === -1) end = this.buffer.length;
+		}
+		if (limit !== void 0 && end === void 0) end = start + limit;
+		return this.buffer.slice(start, end);
+	}
+	/**
+	* Get all entries in the buffer.
+	*
+	* @returns All entries
+	*/
+	getAllEntries() {
+		return this.buffer;
+	}
+	/**
+	* Get the total number of entries.
+	*
+	* @returns Entry count
+	*/
+	getSize() {
+		return this.buffer.length;
+	}
+	/**
+	* Search entries by pattern.
+	*
+	* @param pattern - RegExp pattern or string to search
+	* @param options - Search options
+	* @returns Matching entries
+	*/
+	search(pattern, options = {}) {
+		const { fromLine, limit = 100, caseInsensitive = true } = options;
+		const regex = typeof pattern === "string" ? new RegExp(pattern, caseInsensitive ? "i" : void 0) : pattern;
+		const results = [];
+		const start = fromLine !== void 0 ? this.buffer.findIndex((e) => e.line_number >= fromLine) : 0;
+		for (let i = start; i < this.buffer.length && results.length < limit; i++) {
+			const entry = this.buffer[i];
+			if (regex.test(entry.raw) || regex.test(entry.message ?? "")) results.push(entry);
+		}
+		return results;
+	}
+	/**
+	* Find entries by line number.
+	*
+	* @param lineNumbers - Array of line numbers to find
+	* @returns Matching entries
+	*/
+	findByLineNumbers(lineNumbers) {
+		const lineSet = new Set(lineNumbers);
+		return this.buffer.filter((e) => lineSet.has(e.line_number));
+	}
+	/**
+	* Get entries filtered by log level.
+	*
+	* @param level - Log level to filter by
+	* @returns Filtered entries
+	*/
+	getByLevel(level) {
+		return this.buffer.filter((e) => e.level === level);
+	}
+	/**
+	* Clear all entries from the buffer.
+	*/
+	clear() {
+		this.buffer = [];
+		this.cleanupScheduled = false;
+	}
+	/**
+	* Get buffer statistics.
+	*
+	* @returns Buffer statistics
+	*/
+	getStats() {
+		const size = this.buffer.length;
+		let memoryUsage = 0;
+		for (const entry of this.buffer) {
+			memoryUsage += entry.raw.length * 2;
+			if (entry.message) memoryUsage += entry.message.length * 2;
+			if (entry.formatted) memoryUsage += entry.formatted.length * 2;
+		}
+		return {
+			size,
+			maxSize: this.config.maxSize,
+			usage: size / this.config.maxSize,
+			firstLine: this.buffer[0]?.line_number,
+			lastLine: this.buffer[size - 1]?.line_number,
+			memoryUsage
+		};
+	}
+	/**
+	* Schedule a cleanup operation.
+	*/
+	scheduleCleanup() {
+		if (this.cleanupScheduled) return;
+		this.cleanupScheduled = true;
+		setTimeout(() => this.cleanup(), 0);
+	}
+	/**
+	* Perform cleanup of old entries.
+	*
+	* Removes the oldest entries to keep the buffer within limits.
+	*/
+	cleanup() {
+		if (this.buffer.length <= this.config.softLimit) {
+			this.cleanupScheduled = false;
+			return;
+		}
+		const toRemove = Math.min(this.buffer.length - this.config.softLimit, this.config.cleanupBatch);
+		this.buffer = this.buffer.slice(toRemove);
+		this.cleanupScheduled = false;
+	}
+	/**
+	* Start the periodic cleanup timer.
+	*/
+	startCleanupTimer() {
+		this.cleanupTimer = setInterval(() => {
+			this.cleanup();
+		}, this.config.cleanupInterval);
+	}
+	/**
+	* Stop the cleanup timer and clear resources.
+	*/
+	destroy() {
+		if (this.cleanupTimer) {
+			clearInterval(this.cleanupTimer);
+			this.cleanupTimer = void 0;
+		}
+		this.clear();
+	}
+};
+/**
+* Create a new persistent log buffer with default configuration.
+*
+* @param config - Optional configuration overrides
+* @returns New buffer instance
+*/
+function createPersistentLogBuffer(config) {
+	return new PersistentLogBuffer(config);
+}
+
+//#endregion
+export { PersistentLogBuffer, createPersistentLogBuffer };

package/dist/react-ui/blocks/Terminal/parsing/SyntaxHighlighter.d.ts

@@ -0,0 +1,69 @@
+/**
+ * Syntax highlighter for log messages.
+ *
+ * Applies color highlighting to specific elements within log messages.
+ * Uses standard ANSI SGR codes compatible with xterm.js.
+ *
+ * IMPORTANT: Only highlights plain text - skips lines with existing ANSI codes
+ * to prevent mixing codes and creating visual artifacts.
+ *
+ * @module components/devenv/terminal/parsing/syntax
+ */
+/**
+ * Syntax highlighter class.
+ *
+ * Applies syntax highlighting to plain text messages.
+ * Skips messages that already contain ANSI codes to prevent
+ * visual artifacts from mixed escape sequences.
+ *
+ * @example
+ * ```ts
+ * const highlighter = new SyntaxHighlighter();
+ * const highlighted = highlighter.highlight('GET /api/workspaces { filter: {} }');
+ * ```
+ */
+export declare class SyntaxHighlighter {
+    /**
+     * Apply syntax highlighting to a message.
+     *
+     * Only processes plain text - messages with existing ANSI codes
+     * are returned unchanged to prevent visual artifacts.
+     *
+     * @param message - Message to highlight
+     * @returns Message with ANSI color codes applied, or original if already colored
+     */
+    highlight(message: string): string;
+    /**
+     * Highlight HTTP methods.
+     */
+    private highlightHttpMethods;
+    /**
+     * Highlight URL paths.
+     */
+    private highlightPaths;
+    /**
+     * Highlight braces and brackets.
+     */
+    private highlightBraces;
+    /**
+     * Highlight property keys.
+     */
+    private highlightKeys;
+    /**
+     * Highlight string values.
+     */
+    private highlightStrings;
+    /**
+     * Highlight numeric values.
+     */
+    private highlightNumbers;
+    /**
+     * Highlight boolean values.
+     */
+    private highlightBooleans;
+    /**
+     * Highlight null and undefined.
+     */
+    private highlightNullish;
+}
+//# sourceMappingURL=SyntaxHighlighter.d.ts.map

package/dist/react-ui/blocks/Terminal/parsing/SyntaxHighlighter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SyntaxHighlighter.d.ts","sourceRoot":"","sources":["../../../../../src/react-ui/blocks/Terminal/parsing/SyntaxHighlighter.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AA6CH;;;;;;;;;;;;GAYG;AACH,qBAAa,iBAAiB;IAC5B;;;;;;;;OAQG;IACH,SAAS,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM;IAyBlC;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAK5B;;OAEG;IACH,OAAO,CAAC,cAAc;IAKtB;;OAEG;IACH,OAAO,CAAC,eAAe;IAIvB;;OAEG;IACH,OAAO,CAAC,aAAa;IAMrB;;OAEG;IACH,OAAO,CAAC,gBAAgB;IAKxB;;OAEG;IACH,OAAO,CAAC,gBAAgB;IAKxB;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAKzB;;OAEG;IACH,OAAO,CAAC,gBAAgB;CAIzB"}

package/dist/react-ui/blocks/Terminal/parsing/SyntaxHighlighter.js

@@ -0,0 +1,142 @@
+//#region src/react-ui/blocks/Terminal/parsing/SyntaxHighlighter.ts
+/**
+* Syntax highlighter for log messages.
+*
+* Applies color highlighting to specific elements within log messages.
+* Uses standard ANSI SGR codes compatible with xterm.js.
+*
+* IMPORTANT: Only highlights plain text - skips lines with existing ANSI codes
+* to prevent mixing codes and creating visual artifacts.
+*
+* @module components/devenv/terminal/parsing/syntax
+*/
+/**
+* ANSI color codes for syntax highlighting.
+*
+* Uses standard SGR (Select Graphic Rendition) codes for compatibility.
+*/
+const SYNTAX_COLORS = {
+	httpMethod: "\x1B[35m",
+	path: "\x1B[36m",
+	brace: "\x1B[33m",
+	key: "\x1B[32m",
+	string: "\x1B[92m",
+	number: "\x1B[93m",
+	boolean: "\x1B[34m",
+	nullish: "\x1B[90m",
+	reset: "\x1B[0m"
+};
+/**
+* HTTP method patterns.
+*/
+const HTTP_METHODS = [
+	"GET",
+	"POST",
+	"PUT",
+	"DELETE",
+	"PATCH",
+	"HEAD",
+	"OPTIONS",
+	"CONNECT",
+	"TRACE"
+];
+/**
+* Pattern to detect existing ANSI escape codes.
+*/
+const ANSI_PATTERN = /\x1b\[[0-9;]*m/g;
+/**
+* Check if text contains ANSI escape codes.
+*/
+function hasAnsiCodes(text) {
+	return ANSI_PATTERN.test(text);
+}
+/**
+* Syntax highlighter class.
+*
+* Applies syntax highlighting to plain text messages.
+* Skips messages that already contain ANSI codes to prevent
+* visual artifacts from mixed escape sequences.
+*
+* @example
+* ```ts
+* const highlighter = new SyntaxHighlighter();
+* const highlighted = highlighter.highlight('GET /api/workspaces { filter: {} }');
+* ```
+*/
+var SyntaxHighlighter = class {
+	/**
+	* Apply syntax highlighting to a message.
+	*
+	* Only processes plain text - messages with existing ANSI codes
+	* are returned unchanged to prevent visual artifacts.
+	*
+	* @param message - Message to highlight
+	* @returns Message with ANSI color codes applied, or original if already colored
+	*/
+	highlight(message) {
+		if (!message || message.length === 0) return message;
+		if (hasAnsiCodes(message)) return message;
+		let result = message;
+		result = this.highlightStrings(result);
+		result = this.highlightNumbers(result);
+		result = this.highlightBooleans(result);
+		result = this.highlightNullish(result);
+		result = this.highlightKeys(result);
+		result = this.highlightPaths(result);
+		result = this.highlightHttpMethods(result);
+		result = this.highlightBraces(result);
+		return result;
+	}
+	/**
+	* Highlight HTTP methods.
+	*/
+	highlightHttpMethods(text) {
+		const methodPattern = new RegExp(`\\b(${HTTP_METHODS.join("|")})\\b`, "g");
+		return text.replace(methodPattern, `${SYNTAX_COLORS.httpMethod}$1${SYNTAX_COLORS.reset}`);
+	}
+	/**
+	* Highlight URL paths.
+	*/
+	highlightPaths(text) {
+		return text.replace(/(^|[\s(])\/[a-zA-Z0-9_/-]+/g, `$1${SYNTAX_COLORS.path}$2${SYNTAX_COLORS.reset}`);
+	}
+	/**
+	* Highlight braces and brackets.
+	*/
+	highlightBraces(text) {
+		return text.replace(/([{}[\]])/g, `${SYNTAX_COLORS.brace}$1${SYNTAX_COLORS.reset}`);
+	}
+	/**
+	* Highlight property keys.
+	*/
+	highlightKeys(text) {
+		return text.replace(/(^|[\s])([a-zA-Z_][a-zA-Z0-9_]*)(\s*:)/g, `$1${SYNTAX_COLORS.key}$2${SYNTAX_COLORS.reset}$3`);
+	}
+	/**
+	* Highlight string values.
+	*/
+	highlightStrings(text) {
+		return text.replace(/([:=,]\s*)(['"])(.*?)\2/g, `$1${SYNTAX_COLORS.string}$2$3$2${SYNTAX_COLORS.reset}`);
+	}
+	/**
+	* Highlight numeric values.
+	*/
+	highlightNumbers(text) {
+		return text.replace(/(?<!\w)(-?\d+(?:\.\d+)?)(?!\w)/g, `${SYNTAX_COLORS.number}$1${SYNTAX_COLORS.reset}`);
+	}
+	/**
+	* Highlight boolean values.
+	*/
+	highlightBooleans(text) {
+		return text.replace(/\b(true|false)\b/g, `${SYNTAX_COLORS.boolean}$1${SYNTAX_COLORS.reset}`);
+	}
+	/**
+	* Highlight null and undefined.
+	*/
+	highlightNullish(text) {
+		return text.replace(/\b(null|undefined)\b/g, `${SYNTAX_COLORS.nullish}$1${SYNTAX_COLORS.reset}`);
+	}
+};
+
+//#endregion
+export { SyntaxHighlighter };

package/dist/react-ui/blocks/Terminal/parsing/TableParser.d.ts

@@ -0,0 +1,125 @@
+/**
+ * Table parser for box-drawing character tables.
+ *
+ * Detects and parses tables created with box-drawing characters
+ * (├─│└┌) commonly found in CLI output.
+ *
+ * @module components/devenv/terminal/parsing/TableParser
+ */
+import type { IParsedLogEntry } from './LogParser.types';
+/**
+ * Box-drawing characters used for table borders.
+ * Unicode range: U+2500-U+257F
+ */
+export declare const TABLE_CHARS: readonly ["─", "│", "┌", "┐", "└", "┘", "├", "┤", "┬", "┴", "┼", "═", "║", "╔", "╗", "╚", "╝", "╠", "╣", "╦", "╩", "╬", "╒", "╓", "╕", "╖", "╘", "╙", "╛", "╜", "╢", "╡", "╤", "╧", "╟", "╞", "╡", "╢", "╪", "╫"];
+/**
+ * Table row type.
+ */
+export type TTableRowType = 'top' | 'header' | 'separator' | 'data' | 'bottom' | 'unknown';
+/**
+ * Parsed table row.
+ */
+export interface ITableRow {
+    /** Raw line */
+    raw: string;
+    /** Row type */
+    type: TTableRowType;
+    /** Cells extracted from the row (for data rows) */
+    cells?: string[];
+    /** Line number */
+    lineNumber: number;
+}
+/**
+ * Parsed table data.
+ */
+export interface ITableData {
+    /** All rows in the table */
+    rows: ITableRow[];
+    /** Number of columns */
+    columnCount: number;
+    /** Header row if present */
+    headers?: string[];
+    /** Data rows (excluding borders) */
+    dataRows: string[][];
+    /** Line number of first row */
+    startLine: number;
+    /** Line number of last row */
+    endLine: number;
+}
+/**
+ * Table parser class.
+ *
+ * Detects and parses tables created with box-drawing characters.
+ * Groups consecutive table lines and extracts cell data.
+ *
+ * @example
+ * ```ts
+ * const parser = new TableParser();
+ * const isTable = parser.isTableLine('├──────────┼──────────┤');
+ * const table = parser.parseTable(lines);
+ * ```
+ */
+export declare class TableParser {
+    /** Minimum box-drawing characters to consider a line a table */
+    private readonly MIN_TABLE_CHARS;
+    /**
+     * Check if a line is a table line.
+     *
+     * A line is considered a table line if it contains multiple
+     * box-drawing characters.
+     *
+     * @param line - Line to check
+     * @returns true if line is part of a table
+     */
+    isTableLine(line: string): boolean;
+    /**
+     * Determine the type of a table row.
+     *
+     * @param line - Table row line
+     * @returns Row type
+     */
+    getRowType(line: string): TTableRowType;
+    /**
+     * Extract cells from a table row.
+     *
+     * Splits the row by │ characters and trims each cell.
+     *
+     * @param line - Table row line
+     * @returns Array of cell contents
+     */
+    extractCells(line: string): string[];
+    /**
+     * Parse a complete table from an array of lines.
+     *
+     * Groups consecutive table lines and extracts structured data.
+     *
+     * @param lines - Array of table lines
+     * @param startLine - Starting line number
+     * @returns Parsed table data
+     */
+    parseTable(lines: string[], startLine: number): ITableData;
+    /**
+     * Parse table entries from a log stream.
+     *
+     * Scans through lines, grouping table lines into entries.
+     *
+     * @param lines - Array of log lines
+     * @param startLine - Starting line number
+     * @returns Array of parsed log entries
+     */
+    parseTableEntries(lines: string[], startLine: number): IParsedLogEntry[];
+    /**
+     * Get CSS class for a table row type.
+     *
+     * @param type - Row type
+     * @returns CSS class string
+     */
+    getRowClass(type: TTableRowType): string;
+}
+/**
+ * Create a new table parser instance.
+ *
+ * @returns New TableParser instance
+ */
+export declare function createTableParser(): TableParser;
+//# sourceMappingURL=TableParser.d.ts.map

package/dist/react-ui/blocks/Terminal/parsing/TableParser.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableParser.d.ts","sourceRoot":"","sources":["../../../../../src/react-ui/blocks/Terminal/parsing/TableParser.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEzD;;;GAGG;AACH,eAAO,MAAM,WAAW,mNAQd,CAAC;AAEX;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,QAAQ,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE3F;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,eAAe;IACf,GAAG,EAAE,MAAM,CAAC;IAEZ,eAAe;IACf,IAAI,EAAE,aAAa,CAAC;IAEpB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IAEjB,kBAAkB;IAClB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB,4BAA4B;IAC5B,IAAI,EAAE,SAAS,EAAE,CAAC;IAElB,wBAAwB;IACxB,WAAW,EAAE,MAAM,CAAC;IAEpB,4BAA4B;IAC5B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IAEnB,oCAAoC;IACpC,QAAQ,EAAE,MAAM,EAAE,EAAE,CAAC;IAErB,+BAA+B;IAC/B,SAAS,EAAE,MAAM,CAAC;IAElB,8BAA8B;IAC9B,OAAO,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;;;;;GAYG;AACH,qBAAa,WAAW;IACtB,gEAAgE;IAChE,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAK;IAErC;;;;;;;;OAQG;IACH,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAelC;;;;;OAKG;IACH,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,aAAa;IAoCvC;;;;;;;OAOG;IACH,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE;IAQpC;;;;;;;;OAQG;IACH,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,SAAS,EAAE,MAAM,GAAG,UAAU;IAwC1D;;;;;;;;OAQG;IACH,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,SAAS,EAAE,MAAM,GAAG,eAAe,EAAE;IA0FxE;;;;;OAKG;IACH,WAAW,CAAC,IAAI,EAAE,aAAa,GAAG,MAAM;CAezC;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,IAAI,WAAW,CAE/C"}