@composy/log-viewer-core 0.0.1

package/dist/index.js

@@ -0,0 +1,961 @@
+/*!
+* ***********************************
+* @composy/log-viewer-core v0.0.1 *
+* Built with rollup               *
+* Build time: 2024-08-17 11:33:32 *
+* Build mode: production          *
+* Minified: No                    *
+* ***********************************
+*/
+(function(global, factory) {
+	typeof exports === "object" && typeof module !== "undefined" ? factory(exports) : typeof define === "function" && define.amd ? define(["exports"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.LDesignLogViewer = {}));
+})(this, function(exports) {
+	Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+	//#region src/types/index.ts
+	const ACTION_LABELS = {
+		create: "新增",
+		update: "修改",
+		delete: "删除",
+		query: "查询",
+		login: "登录",
+		logout: "登出",
+		export: "导出",
+		import: "导入",
+		approve: "审批",
+		reject: "驳回",
+		other: "其他"
+	};
+	const ACTION_COLORS = {
+		create: "#52c41a",
+		update: "#1890ff",
+		delete: "#ff4d4f",
+		query: "#8c8c8c",
+		login: "#722ed1",
+		logout: "#eb2f96",
+		export: "#fa8c16",
+		import: "#13c2c2",
+		approve: "#52c41a",
+		reject: "#ff4d4f",
+		other: "#d9d9d9"
+	};
+	//#endregion
+	//#region src/core/EventEmitter.ts
+	var EventEmitter = class {
+		constructor() {
+			this.listeners = /* @__PURE__ */ new Map();
+		}
+		on(event, callback) {
+			if (!this.listeners.has(event)) this.listeners.set(event, /* @__PURE__ */ new Set());
+			this.listeners.get(event).add(callback);
+			return () => this.off(event, callback);
+		}
+		off(event, callback) {
+			this.listeners.get(event)?.delete(callback);
+		}
+		emit(event, ...args) {
+			this.listeners.get(event)?.forEach((cb) => {
+				try {
+					cb(...args);
+				} catch (e) {
+					console.error(`[LogViewer] Event handler error (${event}):`, e);
+				}
+			});
+		}
+		removeAllListeners(event) {
+			if (event) this.listeners.delete(event);
+			else this.listeners.clear();
+		}
+	};
+	//#endregion
+	//#region src/filters/FilterEngine.ts
+	var FilterEngine = class {
+		/**
+		* 对日志条目进行多维筛选
+		*/
+		filter(entries, config) {
+			let result = entries;
+			if (config.user) {
+				const keyword = config.user.toLowerCase();
+				result = result.filter((e) => e.user.toLowerCase().includes(keyword) || e.userId && e.userId.toLowerCase().includes(keyword));
+			}
+			if (config.action) {
+				const actions = Array.isArray(config.action) ? config.action : [config.action];
+				result = result.filter((e) => actions.includes(e.action));
+			}
+			if (config.module) {
+				const mod = config.module.toLowerCase();
+				result = result.filter((e) => e.module.toLowerCase().includes(mod));
+			}
+			if (config.ip) {
+				const ip = config.ip.toLowerCase();
+				result = result.filter((e) => e.ip && e.ip.toLowerCase().includes(ip));
+			}
+			if (config.timeRange) {
+				const [start, end] = config.timeRange;
+				const startTime = new Date(start).getTime();
+				const endTime = new Date(end).getTime();
+				result = result.filter((e) => {
+					const t = new Date(e.timestamp).getTime();
+					return t >= startTime && t <= endTime;
+				});
+			}
+			if (config.keyword) {
+				const kw = config.keyword.toLowerCase();
+				result = result.filter((e) => {
+					return [
+						e.user,
+						e.action,
+						e.module,
+						e.detail || "",
+						e.ip || "",
+						e.id
+					].some((t) => t.toLowerCase().includes(kw));
+				});
+			}
+			return result;
+		}
+		/**
+		* 获取所有唯一操作人
+		*/
+		getUniqueUsers(entries) {
+			return [...new Set(entries.map((e) => e.user))].sort();
+		}
+		/**
+		* 获取所有唯一模块
+		*/
+		getUniqueModules(entries) {
+			return [...new Set(entries.map((e) => e.module))].sort();
+		}
+		/**
+		* 获取所有唯一操作类型
+		*/
+		getUniqueActions(entries) {
+			return [...new Set(entries.map((e) => e.action))].sort();
+		}
+	};
+	//#endregion
+	//#region src/utils/index.ts
+	let _uid = 0;
+	function uid(prefix = "lv") {
+		return `${prefix}-${++_uid}-${Math.random().toString(36).slice(2, 8)}`;
+	}
+	function formatDate(value, fmt = "YYYY-MM-DD HH:mm:ss") {
+		const d = value instanceof Date ? value : new Date(value);
+		if (isNaN(d.getTime())) return String(value);
+		const pad = (n) => String(n).padStart(2, "0");
+		const year = String(d.getFullYear());
+		const month = pad(d.getMonth() + 1);
+		const day = pad(d.getDate());
+		const hours = pad(d.getHours());
+		const minutes = pad(d.getMinutes());
+		const seconds = pad(d.getSeconds());
+		return fmt.replace("YYYY", year).replace("MM", month).replace("DD", day).replace("HH", hours).replace("mm", minutes).replace("ss", seconds);
+	}
+	function formatRelativeTime(value) {
+		const d = value instanceof Date ? value : new Date(value);
+		const diff = Date.now() - d.getTime();
+		if (diff < 6e4) return "刚刚";
+		if (diff < 36e5) return `${Math.floor(diff / 6e4)} \u5206\u949F\u524D`;
+		if (diff < 864e5) return `${Math.floor(diff / 36e5)} \u5C0F\u65F6\u524D`;
+		if (diff < 6048e5) return `${Math.floor(diff / 864e5)} \u5929\u524D`;
+		return formatDate(d);
+	}
+	function escapeHtml(str) {
+		const map = {
+			"&": "&amp;",
+			"<": "&lt;",
+			">": "&gt;",
+			"\"": "&quot;",
+			"'": "&#39;"
+		};
+		return str.replace(/[&<>"']/g, (c) => map[c] || c);
+	}
+	function debounce(fn, delay) {
+		let timer = null;
+		return ((...args) => {
+			if (timer) clearTimeout(timer);
+			timer = setTimeout(() => fn(...args), delay);
+		});
+	}
+	function deepClone(obj) {
+		if (obj === null || typeof obj !== "object") return obj;
+		try {
+			return JSON.parse(JSON.stringify(obj));
+		} catch {
+			return obj;
+		}
+	}
+	function formatValue(val) {
+		if (val === null || val === void 0) return "-";
+		if (typeof val === "object") try {
+			return JSON.stringify(val, null, 2);
+		} catch {
+			return String(val);
+		}
+		return String(val);
+	}
+	//#endregion
+	//#region src/renderers/TimelineRenderer.ts
+	const ANOMALY_LABELS = {
+		"off-hours": "非工作时间",
+		sensitive: "敏感操作",
+		"high-frequency": "高频操作",
+		none: ""
+	};
+	var TimelineRenderer = class {
+		/**
+		* 渲染时间线
+		*/
+		render(entries, expandedIds) {
+			const container = document.createElement("div");
+			container.className = "lv-timeline";
+			if (entries.length === 0) {
+				container.innerHTML = `<div class="lv-empty"><div class="lv-empty-icon">--</div><div>\u6682\u65E0\u65E5\u5FD7\u8BB0\u5F55</div></div>`;
+				container.className = "";
+				return container;
+			}
+			for (const entry of entries) container.appendChild(this.renderItem(entry, expandedIds.has(entry.id)));
+			return container;
+		}
+		/**
+		* 渲染单条时间线条目
+		*/
+		renderItem(entry, expanded) {
+			const item = document.createElement("div");
+			item.className = "lv-timeline-item";
+			item.setAttribute("data-id", entry.id);
+			const isAnomaly = entry.anomaly && entry.anomaly !== "none";
+			const dot = document.createElement("div");
+			dot.className = `lv-timeline-dot${isAnomaly ? " lv-timeline-dot--anomaly" : ""}`;
+			item.appendChild(dot);
+			const card = document.createElement("div");
+			card.className = `lv-timeline-card${isAnomaly ? " lv-timeline-card--anomaly" : ""}`;
+			const header = document.createElement("div");
+			header.className = "lv-timeline-header";
+			const time = document.createElement("span");
+			time.className = "lv-timeline-time";
+			time.textContent = formatDate(entry.timestamp);
+			header.appendChild(time);
+			const user = document.createElement("span");
+			user.className = "lv-timeline-user";
+			user.textContent = entry.user;
+			header.appendChild(user);
+			const actionTag = document.createElement("span");
+			actionTag.className = "lv-action-tag";
+			actionTag.textContent = ACTION_LABELS[entry.action] || entry.action;
+			actionTag.style.backgroundColor = ACTION_COLORS[entry.action] || "#8c8c8c";
+			header.appendChild(actionTag);
+			const moduleBadge = document.createElement("span");
+			moduleBadge.className = "lv-timeline-module";
+			moduleBadge.textContent = entry.module;
+			header.appendChild(moduleBadge);
+			if (entry.ip) {
+				const ip = document.createElement("span");
+				ip.className = "lv-timeline-ip";
+				ip.textContent = entry.ip;
+				header.appendChild(ip);
+			}
+			if (isAnomaly) {
+				const badge = document.createElement("span");
+				badge.className = "lv-anomaly-badge";
+				badge.textContent = ANOMALY_LABELS[entry.anomaly];
+				header.appendChild(badge);
+			}
+			card.appendChild(header);
+			if (entry.detail) {
+				const detail = document.createElement("div");
+				detail.className = "lv-timeline-detail";
+				detail.textContent = entry.detail;
+				card.appendChild(detail);
+			}
+			if (entry.changes && entry.changes.length > 0) {
+				const hint = document.createElement("div");
+				hint.className = "lv-timeline-expand-hint";
+				hint.textContent = expanded ? "[ 收起变更详情 ]" : `[ \u67E5\u770B\u53D8\u66F4\u8BE6\u60C5 (${entry.changes.length} \u4E2A\u5B57\u6BB5) ]`;
+				card.appendChild(hint);
+			}
+			item.appendChild(card);
+			return item;
+		}
+		/**
+		* 渲染分页
+		*/
+		renderPagination(page, pageSize, total) {
+			const container = document.createElement("div");
+			container.className = "lv-pagination";
+			const totalPages = Math.ceil(total / pageSize);
+			if (totalPages <= 1) return container;
+			const prev = document.createElement("button");
+			prev.className = "lv-pagination-btn";
+			prev.textContent = "<";
+			prev.disabled = page <= 1;
+			prev.setAttribute("data-page", String(page - 1));
+			container.appendChild(prev);
+			const maxVisible = 7;
+			let startPage = Math.max(1, page - Math.floor(maxVisible / 2));
+			const endPage = Math.min(totalPages, startPage + maxVisible - 1);
+			if (endPage - startPage < maxVisible - 1) startPage = Math.max(1, endPage - maxVisible + 1);
+			for (let i = startPage; i <= endPage; i++) {
+				const btn = document.createElement("button");
+				btn.className = `lv-pagination-btn${i === page ? " lv-pagination-btn--active" : ""}`;
+				btn.textContent = String(i);
+				btn.setAttribute("data-page", String(i));
+				container.appendChild(btn);
+			}
+			const next = document.createElement("button");
+			next.className = "lv-pagination-btn";
+			next.textContent = ">";
+			next.disabled = page >= totalPages;
+			next.setAttribute("data-page", String(page + 1));
+			container.appendChild(next);
+			const info = document.createElement("span");
+			info.className = "lv-pagination-info";
+			info.textContent = `\u5171 ${total} \u6761`;
+			container.appendChild(info);
+			return container;
+		}
+	};
+	//#endregion
+	//#region src/renderers/DiffRenderer.ts
+	var DiffRenderer = class {
+		/**
+		* 渲染详情面板（包含 diff 表格和 metadata）
+		*/
+		renderDetail(entry) {
+			const container = document.createElement("div");
+			container.className = "lv-detail";
+			if (entry.changes && entry.changes.length > 0) container.appendChild(this.renderDiffTable(entry.changes));
+			if (entry.metadata && Object.keys(entry.metadata).length > 0) {
+				const meta = document.createElement("div");
+				meta.className = "lv-metadata";
+				meta.textContent = JSON.stringify(entry.metadata, null, 2);
+				container.appendChild(meta);
+			}
+			return container;
+		}
+		/**
+		* 渲染 Diff 表格
+		*/
+		renderDiffTable(changes) {
+			const table = document.createElement("table");
+			table.className = "lv-diff-table";
+			const thead = document.createElement("thead");
+			thead.innerHTML = `<tr><th>\u5B57\u6BB5</th><th>\u53D8\u66F4\u524D</th><th>\u53D8\u66F4\u540E</th></tr>`;
+			table.appendChild(thead);
+			const tbody = document.createElement("tbody");
+			for (const change of changes) {
+				const tr = document.createElement("tr");
+				const tdField = document.createElement("td");
+				tdField.textContent = change.label || change.field;
+				tr.appendChild(tdField);
+				const tdOld = document.createElement("td");
+				tdOld.className = "lv-diff-old";
+				tdOld.textContent = formatValue(change.oldValue);
+				tr.appendChild(tdOld);
+				const tdNew = document.createElement("td");
+				tdNew.className = "lv-diff-new";
+				tdNew.textContent = formatValue(change.newValue);
+				tr.appendChild(tdNew);
+				tbody.appendChild(tr);
+			}
+			table.appendChild(tbody);
+			return table;
+		}
+	};
+	//#endregion
+	//#region src/styles/index.ts
+	const STYLE_ID = "ldesign-log-viewer-styles";
+	function injectStyles() {
+		if (typeof document === "undefined") return;
+		if (document.getElementById(STYLE_ID)) return;
+		const style = document.createElement("style");
+		style.id = STYLE_ID;
+		style.textContent = CSS_TEXT;
+		document.head.appendChild(style);
+	}
+	const CSS_TEXT = `
+/* ===== CSS Variables ===== */
+.lv-root {
+  --lv-bg: #ffffff;
+  --lv-bg-secondary: #f7f8fa;
+  --lv-bg-hover: #f0f3ff;
+  --lv-border: #ebedf0;
+  --lv-text: #1a1a2e;
+  --lv-text-secondary: #666;
+  --lv-text-muted: #999;
+  --lv-primary: #4f6ef7;
+  --lv-primary-light: #edf0ff;
+  --lv-shadow: rgba(0, 0, 0, 0.04);
+  --lv-timeline-line: #e0e0e0;
+  --lv-timeline-dot: #4f6ef7;
+  --lv-diff-add-bg: #f0fff4;
+  --lv-diff-add-text: #22863a;
+  --lv-diff-del-bg: #fff5f5;
+  --lv-diff-del-text: #cb2431;
+  --lv-anomaly-bg: #fff2e8;
+  --lv-anomaly-border: #ffbb96;
+  --lv-radius: 8px;
+  --lv-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
+  --lv-font-mono: 'Fira Code', 'SF Mono', Consolas, monospace;
+}
+
+.lv-root[data-theme="dark"] {
+  --lv-bg: #1a1a2e;
+  --lv-bg-secondary: #16213e;
+  --lv-bg-hover: #1e2a4a;
+  --lv-border: #2a2a4a;
+  --lv-text: #e0e0e0;
+  --lv-text-secondary: #a0a0b0;
+  --lv-text-muted: #666680;
+  --lv-primary: #6b85f9;
+  --lv-primary-light: #252545;
+  --lv-shadow: rgba(0, 0, 0, 0.2);
+  --lv-timeline-line: #333355;
+  --lv-timeline-dot: #6b85f9;
+  --lv-diff-add-bg: #0d2818;
+  --lv-diff-add-text: #85e89d;
+  --lv-diff-del-bg: #2d1214;
+  --lv-diff-del-text: #f97583;
+  --lv-anomaly-bg: #2d1a0a;
+  --lv-anomaly-border: #8b5e3c;
+}
+
+/* ===== Root ===== */
+.lv-root {
+  font-family: var(--lv-font);
+  font-size: 14px;
+  color: var(--lv-text);
+  background: var(--lv-bg);
+  line-height: 1.6;
+}
+
+/* ===== Filter Bar ===== */
+.lv-filter {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  padding: 16px;
+  background: var(--lv-bg);
+  border: 1px solid var(--lv-border);
+  border-radius: var(--lv-radius);
+  margin-bottom: 16px;
+  align-items: center;
+}
+
+.lv-filter-item {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-size: 13px;
+}
+
+.lv-filter-label {
+  color: var(--lv-text-secondary);
+  font-size: 12px;
+  white-space: nowrap;
+}
+
+.lv-filter-input {
+  padding: 5px 10px;
+  border: 1px solid var(--lv-border);
+  border-radius: 6px;
+  font-size: 13px;
+  background: var(--lv-bg);
+  color: var(--lv-text);
+  outline: none;
+  transition: border-color 0.2s;
+  min-width: 120px;
+}
+
+.lv-filter-input:focus {
+  border-color: var(--lv-primary);
+}
+
+.lv-filter-select {
+  padding: 5px 10px;
+  border: 1px solid var(--lv-border);
+  border-radius: 6px;
+  font-size: 13px;
+  background: var(--lv-bg);
+  color: var(--lv-text);
+  outline: none;
+  cursor: pointer;
+}
+
+.lv-filter-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 5px 14px;
+  font-size: 13px;
+  border: 1px solid var(--lv-border);
+  border-radius: 6px;
+  background: var(--lv-bg);
+  color: var(--lv-text);
+  cursor: pointer;
+  transition: all 0.15s;
+}
+
+.lv-filter-btn:hover {
+  border-color: var(--lv-primary);
+  color: var(--lv-primary);
+}
+
+.lv-filter-btn--primary {
+  background: var(--lv-primary);
+  border-color: var(--lv-primary);
+  color: #fff;
+}
+
+.lv-filter-btn--primary:hover {
+  opacity: 0.85;
+}
+
+/* ===== Timeline ===== */
+.lv-timeline {
+  position: relative;
+  padding-left: 28px;
+}
+
+.lv-timeline::before {
+  content: '';
+  position: absolute;
+  left: 9px;
+  top: 0;
+  bottom: 0;
+  width: 2px;
+  background: var(--lv-timeline-line);
+}
+
+.lv-timeline-item {
+  position: relative;
+  padding: 0 0 20px 0;
+}
+
+.lv-timeline-dot {
+  position: absolute;
+  left: -25px;
+  top: 6px;
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  background: var(--lv-bg);
+  border: 2px solid var(--lv-timeline-dot);
+  z-index: 1;
+}
+
+.lv-timeline-dot--anomaly {
+  border-color: #ff4d4f;
+  background: #fff1f0;
+}
+
+.lv-timeline-card {
+  background: var(--lv-bg);
+  border: 1px solid var(--lv-border);
+  border-radius: var(--lv-radius);
+  padding: 14px 18px;
+  cursor: pointer;
+  transition: all 0.2s;
+  box-shadow: 0 1px 3px var(--lv-shadow);
+}
+
+.lv-timeline-card:hover {
+  border-color: var(--lv-primary);
+  box-shadow: 0 2px 8px var(--lv-shadow);
+}
+
+.lv-timeline-card--anomaly {
+  border-left: 3px solid var(--lv-anomaly-border);
+  background: var(--lv-anomaly-bg);
+}
+
+.lv-timeline-header {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  flex-wrap: wrap;
+  margin-bottom: 4px;
+}
+
+.lv-timeline-time {
+  font-size: 12px;
+  color: var(--lv-text-muted);
+  font-family: var(--lv-font-mono);
+}
+
+.lv-timeline-user {
+  font-weight: 600;
+  font-size: 14px;
+}
+
+.lv-action-tag {
+  display: inline-block;
+  padding: 1px 8px;
+  font-size: 12px;
+  border-radius: 4px;
+  font-weight: 500;
+  color: #fff;
+}
+
+.lv-timeline-module {
+  font-size: 12px;
+  color: var(--lv-text-secondary);
+  background: var(--lv-bg-secondary);
+  padding: 1px 8px;
+  border-radius: 4px;
+}
+
+.lv-timeline-ip {
+  font-size: 12px;
+  color: var(--lv-text-muted);
+  font-family: var(--lv-font-mono);
+}
+
+.lv-anomaly-badge {
+  font-size: 11px;
+  padding: 1px 6px;
+  border-radius: 3px;
+  background: #fff2e8;
+  color: #d46b08;
+  border: 1px solid #ffd591;
+}
+
+.lv-timeline-detail {
+  font-size: 13px;
+  color: var(--lv-text-secondary);
+  margin-top: 6px;
+}
+
+.lv-timeline-expand-hint {
+  font-size: 12px;
+  color: var(--lv-primary);
+  margin-top: 6px;
+  cursor: pointer;
+}
+
+/* ===== Detail Panel ===== */
+.lv-detail {
+  margin-top: 12px;
+  padding-top: 12px;
+  border-top: 1px dashed var(--lv-border);
+  animation: lv-slide-down 0.2s ease;
+}
+
+@keyframes lv-slide-down {
+  from { opacity: 0; transform: translateY(-8px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+/* ===== Diff Table ===== */
+.lv-diff-table {
+  width: 100%;
+  border-collapse: collapse;
+  font-size: 13px;
+  border: 1px solid var(--lv-border);
+  border-radius: 6px;
+  overflow: hidden;
+}
+
+.lv-diff-table th {
+  background: var(--lv-bg-secondary);
+  padding: 8px 12px;
+  text-align: left;
+  font-weight: 600;
+  font-size: 12px;
+  color: var(--lv-text-secondary);
+  border-bottom: 1px solid var(--lv-border);
+}
+
+.lv-diff-table td {
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--lv-border);
+  vertical-align: top;
+}
+
+.lv-diff-table tr:last-child td {
+  border-bottom: none;
+}
+
+.lv-diff-old {
+  background: var(--lv-diff-del-bg);
+  color: var(--lv-diff-del-text);
+  text-decoration: line-through;
+  font-family: var(--lv-font-mono);
+  font-size: 12px;
+}
+
+.lv-diff-new {
+  background: var(--lv-diff-add-bg);
+  color: var(--lv-diff-add-text);
+  font-family: var(--lv-font-mono);
+  font-size: 12px;
+}
+
+/* ===== Metadata ===== */
+.lv-metadata {
+  margin-top: 10px;
+  background: var(--lv-bg-secondary);
+  border-radius: 6px;
+  padding: 10px 14px;
+  font-size: 12px;
+  font-family: var(--lv-font-mono);
+  white-space: pre-wrap;
+  word-break: break-all;
+  color: var(--lv-text-secondary);
+}
+
+/* ===== Pagination ===== */
+.lv-pagination {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  padding: 16px 0;
+}
+
+.lv-pagination-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  border: 1px solid var(--lv-border);
+  border-radius: 6px;
+  background: var(--lv-bg);
+  color: var(--lv-text);
+  font-size: 13px;
+  cursor: pointer;
+  transition: all 0.15s;
+}
+
+.lv-pagination-btn:hover {
+  border-color: var(--lv-primary);
+  color: var(--lv-primary);
+}
+
+.lv-pagination-btn--active {
+  background: var(--lv-primary);
+  border-color: var(--lv-primary);
+  color: #fff;
+}
+
+.lv-pagination-btn:disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+}
+
+.lv-pagination-info {
+  font-size: 13px;
+  color: var(--lv-text-secondary);
+  margin: 0 8px;
+}
+
+/* ===== Empty state ===== */
+.lv-empty {
+  text-align: center;
+  padding: 48px 16px;
+  color: var(--lv-text-muted);
+  font-size: 14px;
+}
+
+.lv-empty-icon {
+  font-size: 48px;
+  margin-bottom: 12px;
+  opacity: 0.3;
+}
+`;
+	//#endregion
+	//#region src/core/LogViewer.ts
+	var LogViewer = class {
+		constructor(config) {
+			this.emitter = new EventEmitter();
+			this.filterEngine = new FilterEngine();
+			this.timelineRenderer = new TimelineRenderer();
+			this.diffRenderer = new DiffRenderer();
+			this.data = [];
+			this.filteredData = [];
+			this.filter = {};
+			this.pagination = {
+				page: 1,
+				pageSize: 20
+			};
+			this.theme = "light";
+			this.expandedIds = /* @__PURE__ */ new Set();
+			this.timelineEl = null;
+			this.paginationEl = null;
+			this.destroyed = false;
+			this.config = config;
+			const container = typeof config.container === "string" ? document.querySelector(config.container) : config.container;
+			if (!container) throw new Error(`[LogViewer] Container not found: ${config.container}`);
+			injectStyles();
+			this.root = document.createElement("div");
+			this.root.className = "lv-root";
+			container.appendChild(this.root);
+			this.theme = config.theme || "light";
+			this.root.setAttribute("data-theme", this.theme);
+			if (config.pageSize) this.pagination.pageSize = config.pageSize;
+			if (config.pagination) Object.assign(this.pagination, config.pagination);
+			if (config.filter) this.filter = deepClone(config.filter);
+			if (config.data) this.data = [...config.data];
+			this.applyFilterAndRender();
+			this.bindEvents();
+		}
+		getData() {
+			return [...this.data];
+		}
+		setData(entries) {
+			this.data = [...entries];
+			this.pagination.page = 1;
+			this.applyFilterAndRender();
+			this.emitter.emit("data:change", this.data);
+		}
+		appendData(entries) {
+			this.data.push(...entries);
+			this.applyFilterAndRender();
+			this.emitter.emit("data:change", this.data);
+		}
+		getFilter() {
+			return deepClone(this.filter);
+		}
+		setFilter(filter) {
+			this.filter = deepClone(filter);
+			this.pagination.page = 1;
+			this.applyFilterAndRender();
+			this.emitter.emit("filter:change", this.filter);
+			this.config.onFilterChange?.(this.filter);
+		}
+		resetFilter() {
+			this.filter = {};
+			this.pagination.page = 1;
+			this.applyFilterAndRender();
+			this.emitter.emit("filter:change", this.filter);
+		}
+		getTheme() {
+			return this.theme;
+		}
+		setTheme(theme) {
+			this.theme = theme;
+			this.root.setAttribute("data-theme", theme);
+			this.emitter.emit("theme:change", theme);
+			this.config.onThemeChange?.(theme);
+		}
+		expandEntry(id) {
+			this.expandedIds.add(id);
+			const entry = this.data.find((e) => e.id === id);
+			if (entry) this.emitter.emit("entry:expand", entry);
+			this.renderTimeline();
+		}
+		collapseEntry(id) {
+			this.expandedIds.delete(id);
+			const entry = this.data.find((e) => e.id === id);
+			if (entry) this.emitter.emit("entry:collapse", entry);
+			this.renderTimeline();
+		}
+		collapseAll() {
+			this.expandedIds.clear();
+			this.renderTimeline();
+		}
+		goToPage(page) {
+			const totalPages = Math.ceil(this.filteredData.length / this.pagination.pageSize);
+			if (page < 1 || page > totalPages) return;
+			this.pagination.page = page;
+			this.emitter.emit("page:change", page);
+			this.renderTimeline();
+		}
+		getPagination() {
+			return {
+				...this.pagination,
+				total: this.filteredData.length
+			};
+		}
+		on(event, callback) {
+			return this.emitter.on(event, callback);
+		}
+		refresh() {
+			this.applyFilterAndRender();
+		}
+		destroy() {
+			if (this.destroyed) return;
+			this.destroyed = true;
+			this.emitter.removeAllListeners();
+			this.root.remove();
+		}
+		applyFilterAndRender() {
+			this.filteredData = this.filterEngine.filter(this.data, this.filter);
+			this.filteredData.sort((a, b) => new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime());
+			this.pagination.total = this.filteredData.length;
+			this.renderTimeline();
+		}
+		getPageData() {
+			const { page, pageSize } = this.pagination;
+			const start = (page - 1) * pageSize;
+			return this.filteredData.slice(start, start + pageSize);
+		}
+		renderTimeline() {
+			if (this.destroyed) return;
+			const pageData = this.getPageData();
+			const newTimeline = this.timelineRenderer.render(pageData, this.expandedIds);
+			for (const entry of pageData) if (this.expandedIds.has(entry.id)) {
+				const itemEl = newTimeline.querySelector(`[data-id="${entry.id}"] .lv-timeline-card`);
+				if (itemEl) itemEl.appendChild(this.diffRenderer.renderDetail(entry));
+			}
+			if (this.timelineEl) this.root.removeChild(this.timelineEl);
+			this.timelineEl = newTimeline;
+			this.root.appendChild(this.timelineEl);
+			const newPagination = this.timelineRenderer.renderPagination(this.pagination.page, this.pagination.pageSize, this.filteredData.length);
+			if (this.paginationEl) this.root.removeChild(this.paginationEl);
+			this.paginationEl = newPagination;
+			this.root.appendChild(this.paginationEl);
+		}
+		bindEvents() {
+			this.root.addEventListener("click", (e) => {
+				const target = e.target;
+				const card = target.closest(".lv-timeline-card");
+				if (card) {
+					const id = card.closest(".lv-timeline-item")?.getAttribute("data-id");
+					if (!id) return;
+					const entry = this.filteredData.find((en) => en.id === id);
+					if (!entry) return;
+					if (target.classList.contains("lv-timeline-expand-hint")) {
+						if (this.expandedIds.has(id)) this.collapseEntry(id);
+						else this.expandEntry(id);
+						return;
+					}
+					this.emitter.emit("entry:click", entry);
+					this.config.onEntryClick?.(entry);
+				}
+				const pageBtn = target.closest(".lv-pagination-btn");
+				if (pageBtn && !pageBtn.disabled) {
+					const page = parseInt(pageBtn.getAttribute("data-page") || "1", 10);
+					this.goToPage(page);
+				}
+			});
+		}
+	};
+	//#endregion
+	//#region src/index.ts
+	const VERSION = "0.1.0";
+	function createLogViewer(config) {
+		return new LogViewer(config);
+	}
+	//#endregion
+	exports.ACTION_COLORS = ACTION_COLORS;
+	exports.ACTION_LABELS = ACTION_LABELS;
+	exports.DiffRenderer = DiffRenderer;
+	exports.EventEmitter = EventEmitter;
+	exports.FilterEngine = FilterEngine;
+	exports.LogViewer = LogViewer;
+	exports.TimelineRenderer = TimelineRenderer;
+	exports.VERSION = VERSION;
+	exports.createLogViewer = createLogViewer;
+	exports.debounce = debounce;
+	exports.deepClone = deepClone;
+	exports.escapeHtml = escapeHtml;
+	exports.formatDate = formatDate;
+	exports.formatRelativeTime = formatRelativeTime;
+	exports.formatValue = formatValue;
+	exports.injectStyles = injectStyles;
+	exports.uid = uid;
+});
+/*! End of @composy/log-viewer-core | Powered by @composy/builder */
+//# sourceMappingURL=index.js.map