@wakastellar/ui 4.0.0 → 4.0.1

package/dist/components/waka-audit-log/index.es.js

@@ -0,0 +1,829 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import { localDateKey as t } from "../../utils/local-date.es.js";
+import * as n from "react";
+import { Activity as r, AlertCircle as i, AlertTriangle as a, Calendar as o, ChevronDown as s, ChevronUp as c, CreditCard as l, Database as u, Download as d, Edit as f, Eye as p, FileText as m, Filter as h, Globe as g, Info as _, Key as v, Loader2 as y, Lock as b, LogIn as x, LogOut as S, MapPin as C, Plus as w, RefreshCw as T, Search as E, Server as D, Settings as O, Shield as k, Trash2 as A, Unlock as j, Upload as M, UserMinus as N, UserPlus as P, X as F } from "lucide-react";
+import { Fragment as I, jsx as L, jsxs as R } from "react/jsx-runtime";
+//#region src/components/waka-audit-log/index.tsx
+var z = {
+	login: {
+		icon: x,
+		color: "text-green-600 dark:text-green-400",
+		bgColor: "bg-green-100 dark:bg-green-900/30",
+		label: "Login"
+	},
+	logout: {
+		icon: S,
+		color: "text-gray-600 dark:text-gray-400",
+		bgColor: "bg-gray-100 dark:bg-gray-900/30",
+		label: "Logout"
+	},
+	create: {
+		icon: w,
+		color: "text-blue-600 dark:text-blue-400",
+		bgColor: "bg-blue-100 dark:bg-blue-900/30",
+		label: "Create"
+	},
+	update: {
+		icon: f,
+		color: "text-amber-600 dark:text-amber-400",
+		bgColor: "bg-amber-100 dark:bg-amber-900/30",
+		label: "Update"
+	},
+	delete: {
+		icon: A,
+		color: "text-red-600 dark:text-red-400",
+		bgColor: "bg-red-100 dark:bg-red-900/30",
+		label: "Delete"
+	},
+	view: {
+		icon: p,
+		color: "text-purple-600 dark:text-purple-400",
+		bgColor: "bg-purple-100 dark:bg-purple-900/30",
+		label: "View"
+	},
+	export: {
+		icon: d,
+		color: "text-indigo-600 dark:text-indigo-400",
+		bgColor: "bg-indigo-100 dark:bg-indigo-900/30",
+		label: "Export"
+	},
+	import: {
+		icon: M,
+		color: "text-indigo-600 dark:text-indigo-400",
+		bgColor: "bg-indigo-100 dark:bg-indigo-900/30",
+		label: "Import"
+	},
+	settings_change: {
+		icon: O,
+		color: "text-slate-600 dark:text-slate-400",
+		bgColor: "bg-slate-100 dark:bg-slate-900/30",
+		label: "Settings"
+	},
+	permission_change: {
+		icon: k,
+		color: "text-orange-600 dark:text-orange-400",
+		bgColor: "bg-orange-100 dark:bg-orange-900/30",
+		label: "Permission"
+	},
+	password_change: {
+		icon: v,
+		color: "text-yellow-600 dark:text-yellow-400",
+		bgColor: "bg-yellow-100 dark:bg-yellow-900/30",
+		label: "Password"
+	},
+	user_invite: {
+		icon: P,
+		color: "text-teal-600 dark:text-teal-400",
+		bgColor: "bg-teal-100 dark:bg-teal-900/30",
+		label: "Invite"
+	},
+	user_remove: {
+		icon: N,
+		color: "text-rose-600 dark:text-rose-400",
+		bgColor: "bg-rose-100 dark:bg-rose-900/30",
+		label: "Remove"
+	},
+	api_key_create: {
+		icon: v,
+		color: "text-cyan-600 dark:text-cyan-400",
+		bgColor: "bg-cyan-100 dark:bg-cyan-900/30",
+		label: "API Key Create"
+	},
+	api_key_revoke: {
+		icon: v,
+		color: "text-red-600 dark:text-red-400",
+		bgColor: "bg-red-100 dark:bg-red-900/30",
+		label: "API Key Revoke"
+	},
+	mfa_enable: {
+		icon: b,
+		color: "text-emerald-600 dark:text-emerald-400",
+		bgColor: "bg-emerald-100 dark:bg-emerald-900/30",
+		label: "MFA Enable"
+	},
+	mfa_disable: {
+		icon: j,
+		color: "text-orange-600 dark:text-orange-400",
+		bgColor: "bg-orange-100 dark:bg-orange-900/30",
+		label: "MFA Disable"
+	},
+	session_revoke: {
+		icon: T,
+		color: "text-pink-600 dark:text-pink-400",
+		bgColor: "bg-pink-100 dark:bg-pink-900/30",
+		label: "Session Revoke"
+	},
+	file_upload: {
+		icon: M,
+		color: "text-violet-600 dark:text-violet-400",
+		bgColor: "bg-violet-100 dark:bg-violet-900/30",
+		label: "Upload"
+	},
+	file_download: {
+		icon: d,
+		color: "text-violet-600 dark:text-violet-400",
+		bgColor: "bg-violet-100 dark:bg-violet-900/30",
+		label: "Download"
+	},
+	payment: {
+		icon: l,
+		color: "text-green-600 dark:text-green-400",
+		bgColor: "bg-green-100 dark:bg-green-900/30",
+		label: "Payment"
+	},
+	subscription_change: {
+		icon: l,
+		color: "text-blue-600 dark:text-blue-400",
+		bgColor: "bg-blue-100 dark:bg-blue-900/30",
+		label: "Subscription"
+	},
+	data_export: {
+		icon: u,
+		color: "text-fuchsia-600 dark:text-fuchsia-400",
+		bgColor: "bg-fuchsia-100 dark:bg-fuchsia-900/30",
+		label: "Data Export"
+	},
+	backup: {
+		icon: D,
+		color: "text-sky-600 dark:text-sky-400",
+		bgColor: "bg-sky-100 dark:bg-sky-900/30",
+		label: "Backup"
+	},
+	restore: {
+		icon: T,
+		color: "text-sky-600 dark:text-sky-400",
+		bgColor: "bg-sky-100 dark:bg-sky-900/30",
+		label: "Restore"
+	}
+}, B = {
+	info: {
+		icon: _,
+		color: "text-blue-600 dark:text-blue-400",
+		bgColor: "bg-blue-100 dark:bg-blue-900/30",
+		borderColor: "border-blue-200 dark:border-blue-800",
+		label: "Info"
+	},
+	warning: {
+		icon: a,
+		color: "text-amber-600 dark:text-amber-400",
+		bgColor: "bg-amber-100 dark:bg-amber-900/30",
+		borderColor: "border-amber-200 dark:border-amber-800",
+		label: "Warning"
+	},
+	critical: {
+		icon: i,
+		color: "text-red-600 dark:text-red-400",
+		bgColor: "bg-red-100 dark:bg-red-900/30",
+		borderColor: "border-red-200 dark:border-red-800",
+		label: "Critical"
+	}
+};
+function V(e) {
+	let t = Math.floor(((/* @__PURE__ */ new Date()).getTime() - e.getTime()) / 1e3);
+	if (t < 60) return "just now";
+	let n = Math.floor(t / 60);
+	if (n < 60) return `${n}m ago`;
+	let r = Math.floor(n / 60);
+	if (r < 24) return `${r}h ago`;
+	let i = Math.floor(r / 24);
+	if (i < 7) return `${i}d ago`;
+	let a = Math.floor(i / 7);
+	return a < 4 ? `${a}w ago` : e.toLocaleDateString();
+}
+function H(e) {
+	return e.toLocaleString(void 0, {
+		year: "numeric",
+		month: "short",
+		day: "numeric",
+		hour: "2-digit",
+		minute: "2-digit",
+		second: "2-digit"
+	});
+}
+function U(e) {
+	if (!e) return null;
+	let t = [];
+	return e.city && t.push(e.city), e.country && t.push(e.country), t.length > 0 ? t.join(", ") : null;
+}
+function W({ user: t, size: n = "md", className: r }) {
+	return /* @__PURE__ */ L("div", {
+		className: e("relative flex items-center justify-center rounded-full font-semibold flex-shrink-0", {
+			sm: "h-6 w-6 text-[10px]",
+			md: "h-10 w-10 text-sm",
+			lg: "h-12 w-12 text-base"
+		}[n], t.avatar ? "" : "bg-muted text-muted-foreground", r),
+		children: t.avatar ? /* @__PURE__ */ L("img", {
+			src: t.avatar,
+			alt: t.name,
+			className: "h-full w-full rounded-full object-cover"
+		}) : ((e) => e.split(" ").map((e) => e[0]).join("").toUpperCase().slice(0, 2))(t.name)
+	});
+}
+function G({ type: t, severity: n, className: r }) {
+	let i = z[t], a = i.icon, o = n === "info" ? i.color : B[n].color;
+	return /* @__PURE__ */ L("div", {
+		className: e("flex h-9 w-9 items-center justify-center rounded-full flex-shrink-0", n === "info" ? i.bgColor : B[n].bgColor, r),
+		children: /* @__PURE__ */ L(a, { className: e("h-4 w-4", o) })
+	});
+}
+function K({ severity: t, className: n }) {
+	let r = B[t];
+	return /* @__PURE__ */ L("span", {
+		className: e("inline-flex items-center gap-1 px-2 py-0.5 rounded-full text-xs font-medium", r.bgColor, r.color, n),
+		children: r.label
+	});
+}
+function q({ event: e }) {
+	let t = U(e.location);
+	return /* @__PURE__ */ R("div", {
+		className: "mt-3 p-3 bg-muted/50 rounded-lg text-sm space-y-2 animate-in slide-in-from-top-2 fade-in duration-200",
+		children: [
+			/* @__PURE__ */ R("div", {
+				className: "flex items-center gap-2 text-muted-foreground",
+				children: [/* @__PURE__ */ L(o, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ L("span", { children: H(new Date(e.timestamp)) })]
+			}),
+			e.ipAddress && /* @__PURE__ */ R("div", {
+				className: "flex items-center gap-2 text-muted-foreground",
+				children: [/* @__PURE__ */ L(g, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ R("span", { children: ["IP: ", e.ipAddress] })]
+			}),
+			t && /* @__PURE__ */ R("div", {
+				className: "flex items-center gap-2 text-muted-foreground",
+				children: [/* @__PURE__ */ L(C, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ L("span", { children: t })]
+			}),
+			e.resource && /* @__PURE__ */ R("div", {
+				className: "flex items-center gap-2 text-muted-foreground",
+				children: [/* @__PURE__ */ L(m, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ R("span", { children: ["Resource: ", e.resource] })]
+			}),
+			e.sessionId && /* @__PURE__ */ R("div", {
+				className: "flex items-center gap-2 text-muted-foreground",
+				children: [/* @__PURE__ */ L(v, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ R("span", {
+					className: "font-mono text-xs",
+					children: ["Session: ", e.sessionId]
+				})]
+			}),
+			e.requestId && /* @__PURE__ */ R("div", {
+				className: "flex items-center gap-2 text-muted-foreground",
+				children: [/* @__PURE__ */ L(r, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ R("span", {
+					className: "font-mono text-xs",
+					children: ["Request: ", e.requestId]
+				})]
+			}),
+			e.userAgent && /* @__PURE__ */ L("div", {
+				className: "text-muted-foreground",
+				children: /* @__PURE__ */ L("span", {
+					className: "text-xs break-all",
+					children: e.userAgent
+				})
+			}),
+			e.details && Object.keys(e.details).length > 0 && /* @__PURE__ */ R("div", {
+				className: "pt-2 border-t border-border",
+				children: [/* @__PURE__ */ L("div", {
+					className: "text-xs font-medium text-muted-foreground mb-2",
+					children: "Details"
+				}), /* @__PURE__ */ L("div", {
+					className: "space-y-1",
+					children: Object.entries(e.details).map(([e, t]) => /* @__PURE__ */ R("div", {
+						className: "flex items-start gap-2 text-xs",
+						children: [/* @__PURE__ */ R("span", {
+							className: "text-muted-foreground font-medium min-w-[80px]",
+							children: [e, ":"]
+						}), /* @__PURE__ */ L("span", {
+							className: "text-foreground break-all",
+							children: typeof t == "object" ? JSON.stringify(t) : String(t)
+						})]
+					}, e))
+				})]
+			})
+		]
+	});
+}
+function J({ event: t, onEventClick: r, isNew: i }) {
+	let [a, o] = n.useState(!1), l = z[t.type];
+	B[t.severity];
+	let u = U(t.location), d = t.details || t.ipAddress || t.userAgent || t.sessionId || t.requestId || t.location;
+	return /* @__PURE__ */ R("div", {
+		className: e("relative flex gap-3 p-4 rounded-lg border bg-card transition-all duration-300", "hover:bg-accent/50 hover:shadow-sm", t.severity === "critical" && "border-l-4 border-l-red-500", t.severity === "warning" && "border-l-4 border-l-amber-500", i && "animate-in slide-in-from-left-5 fade-in duration-500"),
+		children: [
+			/* @__PURE__ */ R("div", {
+				className: "flex flex-col items-center gap-2",
+				children: [/* @__PURE__ */ L(G, {
+					type: t.type,
+					severity: t.severity
+				}), /* @__PURE__ */ L("div", { className: "flex-1 w-px bg-border" })]
+			}),
+			/* @__PURE__ */ R("div", {
+				className: "flex-1 min-w-0",
+				children: [
+					/* @__PURE__ */ R("div", {
+						className: "flex items-start justify-between gap-2 mb-1",
+						children: [/* @__PURE__ */ R("div", {
+							className: "flex items-center gap-2 flex-wrap",
+							children: [/* @__PURE__ */ L("span", {
+								className: e("inline-flex items-center gap-1 px-2 py-0.5 rounded-full text-xs font-medium", l.bgColor, l.color),
+								children: l.label
+							}), t.severity !== "info" && /* @__PURE__ */ L(K, { severity: t.severity })]
+						}), /* @__PURE__ */ L("span", {
+							className: "flex-shrink-0 text-xs text-muted-foreground",
+							children: V(new Date(t.timestamp))
+						})]
+					}),
+					/* @__PURE__ */ L("p", {
+						className: "text-sm text-foreground mb-2",
+						children: t.description
+					}),
+					/* @__PURE__ */ R("div", {
+						className: "flex items-center gap-2 mb-2",
+						children: [
+							/* @__PURE__ */ L(W, {
+								user: t.user,
+								size: "sm"
+							}),
+							/* @__PURE__ */ R("div", {
+								className: "flex flex-col",
+								children: [/* @__PURE__ */ L("span", {
+									className: "text-sm font-medium",
+									children: t.user.name
+								}), t.user.email && /* @__PURE__ */ L("span", {
+									className: "text-xs text-muted-foreground",
+									children: t.user.email
+								})]
+							}),
+							t.user.role && /* @__PURE__ */ L("span", {
+								className: "ml-2 text-xs text-muted-foreground bg-muted px-2 py-0.5 rounded",
+								children: t.user.role
+							})
+						]
+					}),
+					/* @__PURE__ */ R("div", {
+						className: "flex items-center gap-3 text-xs text-muted-foreground flex-wrap",
+						children: [
+							t.ipAddress && /* @__PURE__ */ R("span", {
+								className: "inline-flex items-center gap-1",
+								children: [/* @__PURE__ */ L(g, { className: "h-3 w-3" }), t.ipAddress]
+							}),
+							u && /* @__PURE__ */ R("span", {
+								className: "inline-flex items-center gap-1",
+								children: [/* @__PURE__ */ L(C, { className: "h-3 w-3" }), u]
+							}),
+							t.resource && /* @__PURE__ */ R("span", {
+								className: "inline-flex items-center gap-1",
+								children: [/* @__PURE__ */ L(m, { className: "h-3 w-3" }), t.resource]
+							})
+						]
+					}),
+					d && /* @__PURE__ */ R("div", {
+						className: "mt-2",
+						children: [/* @__PURE__ */ R("button", {
+							type: "button",
+							className: "flex items-center gap-1 text-xs text-muted-foreground hover:text-foreground transition-colors",
+							onClick: (e) => {
+								e.stopPropagation(), o(!a);
+							},
+							children: [L(a ? c : s, { className: "h-3 w-3" }), a ? "Hide details" : "Show details"]
+						}), a && /* @__PURE__ */ L(q, { event: t })]
+					})
+				]
+			}),
+			r && /* @__PURE__ */ L("button", {
+				type: "button",
+				className: "absolute inset-0 opacity-0",
+				onClick: () => r(t),
+				"aria-label": `View details for ${t.description}`
+			})
+		]
+	});
+}
+function Y({ filters: r, onFilterChange: i, users: a, showSearch: o }) {
+	let [s, c] = n.useState(!1), [l, u] = n.useState(r.search || ""), d = (e) => {
+		let t = e.target.value;
+		u(t), i({
+			...r,
+			search: t || void 0
+		});
+	}, f = (e) => {
+		let t = r.eventTypes || [], n = t.includes(e) ? t.filter((t) => t !== e) : [...t, e];
+		i({
+			...r,
+			eventTypes: n.length > 0 ? n : void 0
+		});
+	}, p = (e) => {
+		let t = r.severities || [], n = t.includes(e) ? t.filter((t) => t !== e) : [...t, e];
+		i({
+			...r,
+			severities: n.length > 0 ? n : void 0
+		});
+	}, m = (e) => {
+		let t = r.userIds || [], n = t.includes(e) ? t.filter((t) => t !== e) : [...t, e];
+		i({
+			...r,
+			userIds: n.length > 0 ? n : void 0
+		});
+	}, g = () => {
+		u(""), i({});
+	}, _ = r.eventTypes && r.eventTypes.length > 0 || r.severities && r.severities.length > 0 || r.userIds && r.userIds.length > 0 || r.search || r.startDate || r.endDate;
+	return /* @__PURE__ */ R("div", {
+		className: "space-y-3 mb-4",
+		children: [/* @__PURE__ */ R("div", {
+			className: "flex items-center gap-2",
+			children: [
+				o && /* @__PURE__ */ R("div", {
+					className: "relative flex-1",
+					children: [/* @__PURE__ */ L(E, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" }), /* @__PURE__ */ L("input", {
+						type: "text",
+						placeholder: "Search audit logs...",
+						"aria-label": "Search audit logs",
+						value: l,
+						onChange: d,
+						className: "w-full pl-9 pr-4 py-2 text-sm rounded-lg border bg-background focus:outline-none focus:ring-2 focus:ring-ring"
+					})]
+				}),
+				/* @__PURE__ */ R("button", {
+					type: "button",
+					className: e("inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-lg border transition-colors", s || _ ? "bg-primary text-primary-foreground" : "bg-background hover:bg-muted"),
+					onClick: () => c(!s),
+					children: [
+						/* @__PURE__ */ L(h, { className: "h-4 w-4" }),
+						"Filters",
+						_ && /* @__PURE__ */ L("span", {
+							className: "inline-flex items-center justify-center h-5 w-5 rounded-full bg-primary-foreground text-primary text-xs",
+							children: (r.eventTypes?.length || 0) + (r.severities?.length || 0) + (r.userIds?.length || 0)
+						})
+					]
+				}),
+				_ && /* @__PURE__ */ R("button", {
+					type: "button",
+					className: "inline-flex items-center gap-1 px-3 py-2 text-sm font-medium rounded-lg border bg-background hover:bg-muted transition-colors",
+					onClick: g,
+					children: [/* @__PURE__ */ L(F, { className: "h-4 w-4" }), "Clear"]
+				})
+			]
+		}), s && /* @__PURE__ */ R("div", {
+			className: "p-4 bg-muted/50 rounded-lg border space-y-4 animate-in slide-in-from-top-2 fade-in duration-200",
+			children: [
+				/* @__PURE__ */ R("div", { children: [/* @__PURE__ */ L("div", {
+					className: "text-xs font-medium text-muted-foreground mb-2",
+					children: "Severity"
+				}), /* @__PURE__ */ L("div", {
+					className: "flex flex-wrap gap-2",
+					children: Object.keys(B).map((t) => {
+						let n = B[t], i = r.severities?.includes(t);
+						return /* @__PURE__ */ L("button", {
+							type: "button",
+							className: e("px-3 py-1.5 rounded-lg text-xs font-medium transition-all", i ? e(n.bgColor, n.color, "ring-2 ring-offset-1", n.borderColor) : "bg-background hover:bg-muted text-muted-foreground border"),
+							onClick: () => p(t),
+							children: n.label
+						}, t);
+					})
+				})] }),
+				/* @__PURE__ */ R("div", { children: [/* @__PURE__ */ L("div", {
+					className: "text-xs font-medium text-muted-foreground mb-2",
+					children: "Event Types"
+				}), /* @__PURE__ */ L("div", {
+					className: "space-y-3",
+					children: [
+						{
+							label: "Authentication",
+							types: [
+								"login",
+								"logout",
+								"password_change",
+								"mfa_enable",
+								"mfa_disable",
+								"session_revoke"
+							]
+						},
+						{
+							label: "Data",
+							types: [
+								"create",
+								"update",
+								"delete",
+								"view",
+								"export",
+								"import",
+								"data_export"
+							]
+						},
+						{
+							label: "Users",
+							types: [
+								"user_invite",
+								"user_remove",
+								"permission_change"
+							]
+						},
+						{
+							label: "System",
+							types: [
+								"settings_change",
+								"api_key_create",
+								"api_key_revoke",
+								"backup",
+								"restore"
+							]
+						},
+						{
+							label: "Files",
+							types: ["file_upload", "file_download"]
+						},
+						{
+							label: "Billing",
+							types: ["payment", "subscription_change"]
+						}
+					].map((t) => /* @__PURE__ */ R("div", { children: [/* @__PURE__ */ L("div", {
+						className: "text-xs text-muted-foreground mb-1.5",
+						children: t.label
+					}), /* @__PURE__ */ L("div", {
+						className: "flex flex-wrap gap-1.5",
+						children: t.types.map((t) => {
+							let n = z[t], i = r.eventTypes?.includes(t);
+							return /* @__PURE__ */ L("button", {
+								type: "button",
+								className: e("px-2 py-1 rounded text-xs font-medium transition-all", i ? e(n.bgColor, n.color) : "bg-background hover:bg-muted text-muted-foreground border"),
+								onClick: () => f(t),
+								children: n.label
+							}, t);
+						})
+					})] }, t.label))
+				})] }),
+				a && a.length > 0 && /* @__PURE__ */ R("div", { children: [/* @__PURE__ */ L("div", {
+					className: "text-xs font-medium text-muted-foreground mb-2",
+					children: "Users"
+				}), /* @__PURE__ */ L("div", {
+					className: "flex flex-wrap gap-2",
+					children: a.map((t) => {
+						let n = r.userIds?.includes(t.id);
+						return /* @__PURE__ */ R("button", {
+							type: "button",
+							className: e("inline-flex items-center gap-2 px-2 py-1 rounded-lg text-xs font-medium transition-all", n ? "bg-primary text-primary-foreground" : "bg-background hover:bg-muted text-muted-foreground border"),
+							onClick: () => m(t.id),
+							children: [/* @__PURE__ */ L(W, {
+								user: t,
+								size: "sm",
+								className: "h-4 w-4 text-[8px]"
+							}), t.name]
+						}, t.id);
+					})
+				})] }),
+				/* @__PURE__ */ R("div", { children: [/* @__PURE__ */ L("div", {
+					className: "text-xs font-medium text-muted-foreground mb-2",
+					children: "Date Range"
+				}), /* @__PURE__ */ R("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ L("input", {
+							type: "date",
+							"aria-label": "Start date",
+							value: r.startDate ? t(r.startDate) : "",
+							onChange: (e) => i({
+								...r,
+								startDate: e.target.value ? new Date(e.target.value) : void 0
+							}),
+							className: "px-3 py-1.5 text-xs rounded-lg border bg-background focus:outline-none focus:ring-2 focus:ring-ring"
+						}),
+						/* @__PURE__ */ L("span", {
+							className: "text-xs text-muted-foreground",
+							children: "to"
+						}),
+						/* @__PURE__ */ L("input", {
+							type: "date",
+							"aria-label": "End date",
+							value: r.endDate ? t(r.endDate) : "",
+							onChange: (e) => i({
+								...r,
+								endDate: e.target.value ? new Date(e.target.value) : void 0
+							}),
+							className: "px-3 py-1.5 text-xs rounded-lg border bg-background focus:outline-none focus:ring-2 focus:ring-ring"
+						})
+					]
+				})] })
+			]
+		})]
+	});
+}
+function X({ onExport: t }) {
+	let [r, i] = n.useState(!1);
+	return /* @__PURE__ */ R("div", {
+		className: "relative",
+		children: [/* @__PURE__ */ R("button", {
+			type: "button",
+			className: "inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-lg border bg-background hover:bg-muted transition-colors",
+			onClick: () => i(!r),
+			children: [
+				/* @__PURE__ */ L(d, { className: "h-4 w-4" }),
+				"Export",
+				/* @__PURE__ */ L(s, { className: e("h-4 w-4 transition-transform", r && "rotate-180") })
+			]
+		}), r && /* @__PURE__ */ R(I, { children: [/* @__PURE__ */ L("div", {
+			className: "fixed inset-0 z-10",
+			onClick: () => i(!1)
+		}), /* @__PURE__ */ R("div", {
+			className: "absolute right-0 top-full mt-1 z-20 w-40 bg-popover border rounded-lg shadow-lg overflow-hidden animate-in fade-in slide-in-from-top-2 duration-200",
+			children: [/* @__PURE__ */ R("button", {
+				type: "button",
+				className: "w-full px-3 py-2 text-sm text-left hover:bg-muted transition-colors flex items-center gap-2",
+				onClick: () => {
+					t("csv"), i(!1);
+				},
+				children: [/* @__PURE__ */ L(m, { className: "h-4 w-4" }), "Export as CSV"]
+			}), /* @__PURE__ */ R("button", {
+				type: "button",
+				className: "w-full px-3 py-2 text-sm text-left hover:bg-muted transition-colors flex items-center gap-2",
+				onClick: () => {
+					t("json"), i(!1);
+				},
+				children: [/* @__PURE__ */ L(m, { className: "h-4 w-4" }), "Export as JSON"]
+			})]
+		})] })]
+	});
+}
+function Z({ events: t, onEventClick: i, onFilterChange: a, onLoadMore: o, onExport: c, hasMore: l = !1, loading: u = !1, showFilters: d = !0, showSearch: f = !0, showExport: p = !0, infiniteScroll: m = !1, maxItems: g, users: _, className: v }) {
+	let [b, x] = n.useState({}), [S, C] = n.useState(/* @__PURE__ */ new Set()), w = n.useRef(/* @__PURE__ */ new Set()), T = n.useRef(null), E = n.useRef(null);
+	n.useEffect(() => {
+		let e = new Set(t.map((e) => e.id)), n = /* @__PURE__ */ new Set();
+		if (e.forEach((e) => {
+			w.current.has(e) || n.add(e);
+		}), n.size > 0 && w.current.size > 0) {
+			C(n);
+			let e = setTimeout(() => C(/* @__PURE__ */ new Set()), 500);
+			return () => clearTimeout(e);
+		}
+		w.current = e;
+	}, [t]);
+	let D = n.useCallback((e) => {
+		x(e), a?.(e);
+	}, [a]), O = n.useMemo(() => {
+		let e = t;
+		if (b.eventTypes && b.eventTypes.length > 0 && (e = e.filter((e) => b.eventTypes.includes(e.type))), b.severities && b.severities.length > 0 && (e = e.filter((e) => b.severities.includes(e.severity))), b.userIds && b.userIds.length > 0 && (e = e.filter((e) => b.userIds.includes(e.user.id))), b.search) {
+			let t = b.search.toLowerCase();
+			e = e.filter((e) => e.description.toLowerCase().includes(t) || e.user.name.toLowerCase().includes(t) || e.user.email?.toLowerCase().includes(t) || e.resource?.toLowerCase().includes(t) || e.ipAddress?.includes(t));
+		}
+		if (b.startDate && (e = e.filter((e) => new Date(e.timestamp) >= b.startDate)), b.endDate) {
+			let t = new Date(b.endDate);
+			t.setHours(23, 59, 59, 999), e = e.filter((e) => new Date(e.timestamp) <= t);
+		}
+		return g && g > 0 && (e = e.slice(0, g)), e;
+	}, [
+		t,
+		b,
+		g
+	]);
+	return n.useEffect(() => {
+		if (!(!m || !o || !l)) return T.current = new IntersectionObserver((e) => {
+			e[0].isIntersecting && !u && o();
+		}, { threshold: .1 }), E.current && T.current.observe(E.current), () => {
+			T.current?.disconnect();
+		};
+	}, [
+		m,
+		o,
+		l,
+		u
+	]), t.length === 0 && !u ? /* @__PURE__ */ R("div", {
+		className: e("flex flex-col items-center justify-center py-12 text-center", v),
+		children: [
+			/* @__PURE__ */ L(r, { className: "h-12 w-12 text-muted-foreground/50 mb-4" }),
+			/* @__PURE__ */ L("h3", {
+				className: "text-lg font-medium text-muted-foreground",
+				children: "No audit events"
+			}),
+			/* @__PURE__ */ L("p", {
+				className: "text-sm text-muted-foreground/70 mt-1",
+				children: "Activity will appear here when events are logged."
+			})
+		]
+	}) : /* @__PURE__ */ R("div", {
+		className: e("w-full", v),
+		children: [
+			/* @__PURE__ */ R("div", {
+				className: "flex items-start justify-between gap-4 mb-4",
+				children: [/* @__PURE__ */ L("div", {
+					className: "flex-1",
+					children: (d || f) && /* @__PURE__ */ L(Y, {
+						filters: b,
+						onFilterChange: D,
+						users: _,
+						showSearch: f
+					})
+				}), p && c && /* @__PURE__ */ L(X, { onExport: c })]
+			}),
+			/* @__PURE__ */ L("div", {
+				className: "space-y-3",
+				children: O.map((e) => /* @__PURE__ */ L(J, {
+					event: e,
+					onEventClick: i,
+					isNew: S.has(e.id)
+				}, e.id))
+			}),
+			u && /* @__PURE__ */ L("div", {
+				className: "flex items-center justify-center py-6",
+				children: /* @__PURE__ */ L(y, { className: "h-6 w-6 animate-spin text-muted-foreground" })
+			}),
+			!u && l && /* @__PURE__ */ L(I, { children: m ? /* @__PURE__ */ L("div", {
+				ref: E,
+				className: "h-1"
+			}) : /* @__PURE__ */ L("div", {
+				className: "flex justify-center pt-4",
+				children: /* @__PURE__ */ R("button", {
+					type: "button",
+					className: "inline-flex items-center gap-2 px-4 py-2 text-sm font-medium rounded-lg border bg-background hover:bg-muted transition-colors",
+					onClick: o,
+					children: [/* @__PURE__ */ L(s, { className: "h-4 w-4" }), "Load more"]
+				})
+			}) }),
+			O.length === 0 && t.length > 0 && !u && /* @__PURE__ */ R("div", {
+				className: "flex flex-col items-center justify-center py-12 text-center",
+				children: [/* @__PURE__ */ L(h, { className: "h-8 w-8 text-muted-foreground mb-3" }), /* @__PURE__ */ L("p", {
+					className: "text-sm text-muted-foreground",
+					children: "No events match the current filters"
+				})]
+			})
+		]
+	});
+}
+function Q({ initialEvents: e = [], maxEvents: t = 1e3, initialFilters: r = {} } = {}) {
+	let [i, a] = n.useState(e), [o, s] = n.useState(r), [c, l] = n.useState(!1), [u, d] = n.useState(!1), f = n.useCallback((e) => {
+		a((n) => [e, ...n].slice(0, t));
+	}, [t]), p = n.useCallback((e) => {
+		a((n) => [...e, ...n].slice(0, t));
+	}, [t]), m = n.useCallback((e) => {
+		a((t) => t.filter((t) => t.id !== e));
+	}, []), h = n.useCallback(() => {
+		s({});
+	}, []), g = n.useCallback(async (e) => {
+		l(!0);
+		try {
+			let n = await e();
+			a((e) => {
+				let r = new Set(e.map((e) => e.id)), i = n.events.filter((e) => !r.has(e.id));
+				return [...e, ...i].slice(0, t);
+			}), d(n.hasMore);
+		} finally {
+			l(!1);
+		}
+	}, [t]), _ = n.useCallback((e) => {
+		a(e);
+	}, []), v = n.useCallback(() => {
+		a([]);
+	}, []), y = n.useCallback(() => {
+		let e = i;
+		if (o.eventTypes && o.eventTypes.length > 0 && (e = e.filter((e) => o.eventTypes.includes(e.type))), o.severities && o.severities.length > 0 && (e = e.filter((e) => o.severities.includes(e.severity))), o.userIds && o.userIds.length > 0 && (e = e.filter((e) => o.userIds.includes(e.user.id))), o.search) {
+			let t = o.search.toLowerCase();
+			e = e.filter((e) => e.description.toLowerCase().includes(t) || e.user.name.toLowerCase().includes(t) || e.user.email?.toLowerCase().includes(t));
+		}
+		if (o.startDate && (e = e.filter((e) => new Date(e.timestamp) >= o.startDate)), o.endDate) {
+			let t = new Date(o.endDate);
+			t.setHours(23, 59, 59, 999), e = e.filter((e) => new Date(e.timestamp) <= t);
+		}
+		return e;
+	}, [i, o]);
+	return {
+		events: i,
+		filters: o,
+		loading: c,
+		hasMore: u,
+		addEvent: f,
+		addEvents: p,
+		removeEvent: m,
+		setFilters: s,
+		clearFilters: h,
+		loadMore: g,
+		refresh: _,
+		clear: v,
+		setLoading: l,
+		setHasMore: d,
+		exportEvents: n.useCallback((e) => {
+			let t = y();
+			if (e === "json") return JSON.stringify(t, null, 2);
+			let n = [
+				"ID",
+				"Type",
+				"Severity",
+				"Description",
+				"User Name",
+				"User Email",
+				"IP Address",
+				"Location",
+				"Resource",
+				"Timestamp"
+			], r = t.map((e) => [
+				e.id,
+				e.type,
+				e.severity,
+				`"${e.description.replace(/"/g, "\"\"")}"`,
+				e.user.name,
+				e.user.email || "",
+				e.ipAddress || "",
+				U(e.location) || "",
+				e.resource || "",
+				new Date(e.timestamp).toISOString()
+			]);
+			return [n.join(","), ...r.map((e) => e.join(","))].join("\n");
+		}, [y]),
+		getFilteredEvents: y
+	};
+}
+//#endregion
+export { Z as default, Q as useAuditLog };