@wakastellar/ui 4.0.0 → 4.0.1

package/dist/components/waka-admincrumb/index.d.ts

@@ -18,7 +18,9 @@ export interface AdmincrumbItem {
     id: string;
     name: string;
     type: "partner" | "network" | "customer";
-    metadata?: Record<string, any>;
+    metadata?: {
+        count?: number;
+    } & Record<string, unknown>;
 }
 export interface AdmincrumbLevel {
     type: "partner" | "network" | "customer";
@@ -29,9 +31,9 @@ export interface AdmincrumbLevel {
     placeholder?: string;
     emptyText?: string;
 }
-declare const admincrumbVariants: (props?: {
-    variant?: "default" | "inline" | "compact" | "minimal" | "pills";
-} & import("class-variance-authority/types").ClassProp) => string;
+declare const admincrumbVariants: (props?: ({
+    variant?: "default" | "inline" | "compact" | "minimal" | "pills" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface WakaAdmincrumbProps extends VariantProps<typeof admincrumbVariants> {
     levels: AdmincrumbLevel[];
     separator?: React.ReactNode;
@@ -46,9 +48,9 @@ export interface WakaAdmincrumbProps extends VariantProps<typeof admincrumbVaria
 }
 export declare const WakaAdmincrumb: React.ForwardRefExoticComponent<WakaAdmincrumbProps & React.RefAttributes<HTMLDivElement>>;
 export declare function useAdmincrumb(): {
-    partner: AdmincrumbItem;
-    network: AdmincrumbItem;
-    customer: AdmincrumbItem;
+    partner: AdmincrumbItem | undefined;
+    network: AdmincrumbItem | undefined;
+    customer: AdmincrumbItem | undefined;
     handleLevelChange: (level: number, item: AdmincrumbItem) => void;
     reset: () => void;
 };

package/dist/components/waka-admincrumb/index.es.js

@@ -0,0 +1,193 @@
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import { Badge as t } from "../badge/index.es.js";
+import { Button as n } from "../button/index.es.js";
+import { Command as r, CommandEmpty as i, CommandGroup as a, CommandInput as o, CommandItem as s, CommandList as c } from "../command/index.es.js";
+import { Popover as l, PopoverContent as u, PopoverTrigger as d } from "../popover/index.es.js";
+import * as f from "react";
+import { Building2 as p, ChevronRight as m, Filter as h, Home as g, Network as _, Search as v, Users as y, X as b } from "lucide-react";
+import { cva as x } from "class-variance-authority";
+import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";
+//#region src/components/waka-admincrumb/index.tsx
+var T = x("flex items-center", {
+	variants: { variant: {
+		default: "gap-2 p-3 rounded-lg border bg-card shadow-sm",
+		minimal: "gap-2",
+		pills: "gap-2 p-2 rounded-full border bg-muted/30",
+		inline: "gap-1.5 text-sm",
+		compact: "gap-1.5 p-2 rounded-md bg-muted/50"
+	} },
+	defaultVariants: { variant: "default" }
+}), E = x("justify-between gap-2 transition-all", {
+	variants: { variant: {
+		default: "h-9 border-primary/50",
+		minimal: "h-8 border-0 shadow-none hover:bg-accent",
+		pills: "h-8 rounded-full px-4",
+		inline: "h-7 text-sm border-0 shadow-none p-0 hover:bg-transparent hover:underline",
+		compact: "h-7 text-xs px-2"
+	} },
+	defaultVariants: { variant: "default" }
+}), D = {
+	partner: p,
+	network: _,
+	customer: y
+}, O = {
+	partner: "bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200",
+	network: "bg-purple-100 text-purple-800 dark:bg-purple-900 dark:text-purple-200",
+	customer: "bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200"
+}, k = {
+	partner: "Partenaire",
+	network: "Réseau",
+	customer: "Client"
+}, A = f.forwardRef(({ type: p, items: h, selected: g, isLoading: _, onSelect: y, placeholder: x, emptyText: S, showIcon: T, showBadge: A, variant: j }, M) => {
+	let [N, P] = f.useState(!1), [F, I] = f.useState(""), L = D[p], R = f.useMemo(() => F ? h.filter((e) => e.name.toLowerCase().includes(F.toLowerCase())) : h, [h, F]), z = (e) => {
+		y(e), P(!1), I("");
+	};
+	return /* @__PURE__ */ w(l, {
+		open: N,
+		onOpenChange: P,
+		children: [/* @__PURE__ */ C(d, {
+			asChild: !0,
+			children: /* @__PURE__ */ w(n, {
+				ref: M,
+				variant: j === "inline" ? "ghost" : "outline",
+				role: "combobox",
+				"aria-expanded": N,
+				className: e(E({ variant: j }), g?.id ? "border-primary/50" : ""),
+				disabled: _ || h.length === 0,
+				children: [/* @__PURE__ */ w("div", {
+					className: "flex items-center gap-2 min-w-0",
+					children: [
+						T && L && /* @__PURE__ */ C(L, { className: "h-4 w-4 shrink-0" }),
+						/* @__PURE__ */ C("span", {
+							className: "truncate",
+							children: g?.name || x || k[p]
+						}),
+						A && g?.id && /* @__PURE__ */ C(t, {
+							variant: "secondary",
+							className: e("text-xs", O[p]),
+							children: p
+						})
+					]
+				}), g?.id ? /* @__PURE__ */ C(b, {
+					className: "h-3 w-3 shrink-0 opacity-50 hover:opacity-100",
+					onClick: (e) => {
+						e.stopPropagation(), y({
+							id: "",
+							name: "",
+							type: p
+						}), I("");
+					}
+				}) : /* @__PURE__ */ C(m, { className: "h-4 w-4 shrink-0 opacity-50" })]
+			})
+		}), /* @__PURE__ */ C(u, {
+			className: "w-[300px] p-0",
+			align: "start",
+			children: /* @__PURE__ */ w(r, {
+				shouldFilter: !1,
+				children: [/* @__PURE__ */ w("div", {
+					className: "flex items-center border-b px-3 py-2 bg-muted/50",
+					children: [/* @__PURE__ */ C(v, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }), /* @__PURE__ */ C(o, {
+						placeholder: `Rechercher ${k[p].toLowerCase()}...`,
+						value: F,
+						onValueChange: I,
+						className: "border-0 focus:ring-0"
+					})]
+				}), /* @__PURE__ */ w(c, { children: [/* @__PURE__ */ C(i, { children: S || `Aucun ${k[p].toLowerCase()} trouvé` }), /* @__PURE__ */ C(a, { children: R.map((e) => /* @__PURE__ */ C(s, {
+					value: e.id,
+					onSelect: () => z(e),
+					className: "cursor-pointer",
+					children: /* @__PURE__ */ w("div", {
+						className: "flex items-center gap-2 w-full",
+						children: [
+							T && L && /* @__PURE__ */ C(L, { className: "h-4 w-4 shrink-0" }),
+							/* @__PURE__ */ C("span", {
+								className: "flex-1 truncate",
+								children: e.name
+							}),
+							e.metadata?.count !== void 0 && /* @__PURE__ */ C(t, {
+								variant: "secondary",
+								className: "text-xs",
+								children: e.metadata.count
+							})
+						]
+					})
+				}, e.id)) })] })]
+			})
+		})]
+	});
+});
+A.displayName = "AdmincrumbSelector";
+var j = f.forwardRef(({ levels: r, separator: i, className: a, onLevelChange: o, showIcons: s = !0, showBadges: c = !1, showHome: l = !1, maxWidth: u = "100%", variant: d = "default", resetable: f = !1, onReset: p }, _) => {
+	let v = (e) => (t) => {
+		o?.(e, t);
+	}, y = r.some((e) => e.selected?.id), x = f && y && p;
+	return /* @__PURE__ */ w("nav", {
+		ref: _,
+		"aria-label": "Fil d'Ariane administrateur",
+		className: e("flex items-center gap-2", a),
+		style: { maxWidth: u },
+		children: [/* @__PURE__ */ w("div", {
+			className: e(T({ variant: d }), "overflow-x-auto"),
+			children: [
+				l && /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ C(n, {
+					variant: d === "inline" ? "ghost" : "outline",
+					size: d === "compact" ? "sm" : "default",
+					className: e(d === "inline" && "h-7 px-2", d === "compact" && "h-7 px-2"),
+					onClick: () => p?.(),
+					children: /* @__PURE__ */ C(g, { className: "h-4 w-4" })
+				}), /* @__PURE__ */ C(m, {
+					className: "h-4 w-4 text-muted-foreground shrink-0",
+					"aria-hidden": "true"
+				})] }),
+				/* @__PURE__ */ C("ol", {
+					className: "flex items-center gap-2 list-none p-0 m-0",
+					children: r.map((t, n) => /* @__PURE__ */ w("li", {
+						className: "flex items-center gap-2",
+						children: [n > 0 && /* @__PURE__ */ C(S, { children: i || /* @__PURE__ */ C(m, {
+							className: e("text-muted-foreground shrink-0", d === "compact" || d === "inline" ? "h-3 w-3" : "h-4 w-4"),
+							"aria-hidden": "true"
+						}) }), /* @__PURE__ */ C(A, {
+							...t,
+							onSelect: v(n),
+							showIcon: s,
+							showBadge: c,
+							variant: d || "default"
+						})]
+					}, `${t.type}-${n}`))
+				}),
+				x && /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ C("div", {
+					className: "w-px h-6 bg-border mx-1",
+					"aria-hidden": "true"
+				}), /* @__PURE__ */ w(n, {
+					variant: "ghost",
+					size: d === "compact" ? "sm" : "default",
+					onClick: p,
+					className: e("gap-2", d === "compact" && "h-7 px-2 text-xs"),
+					children: [/* @__PURE__ */ C(b, { className: "h-3 w-3" }), "Réinitialiser"]
+				})] })
+			]
+		}), y && !x && /* @__PURE__ */ w(t, {
+			variant: "secondary",
+			className: "gap-1",
+			children: [/* @__PURE__ */ C(h, { className: "h-3 w-3" }), "Filtré"]
+		})]
+	});
+});
+j.displayName = "WakaAdmincrumb";
+function M() {
+	let [e, t] = f.useState(), [n, r] = f.useState(), [i, a] = f.useState();
+	return {
+		partner: e,
+		network: n,
+		customer: i,
+		handleLevelChange: f.useCallback((e, n) => {
+			e === 0 ? (t(n.id ? n : void 0), r(void 0), a(void 0)) : e === 1 ? (r(n.id ? n : void 0), a(void 0)) : e === 2 && a(n.id ? n : void 0);
+		}, []),
+		reset: f.useCallback(() => {
+			t(void 0), r(void 0), a(void 0);
+		}, [])
+	};
+}
+//#endregion
+export { j as WakaAdmincrumb, M as useAdmincrumb };

package/dist/components/waka-alert-panel/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs.js`),t=require(`../../utils/cn.cjs.js`),n=require(`../badge/index.cjs.js`),r=require(`../button/index.cjs.js`),i=require(`../dropdown-menu/index.cjs.js`),a=require(`../select/index.cjs.js`),o=require(`../scroll-area/index.cjs.js`);let s=require(`react`);s=e.__toESM(s);let c=require(`lucide-react`),l=require(`react/jsx-runtime`);var u={critical:{icon:c.AlertCircle,color:`text-red-500`,bgColor:`bg-red-500/10 border-red-500/30`},warning:{icon:c.AlertTriangle,color:`text-yellow-500`,bgColor:`bg-yellow-500/10 border-yellow-500/30`},info:{icon:c.Info,color:`text-blue-500`,bgColor:`bg-blue-500/10 border-blue-500/30`}},d={firing:{label:`Firing`,variant:`destructive`},acknowledged:{label:`Acknowledged`,variant:`secondary`},resolved:{label:`Resolved`,variant:`outline`},silenced:{label:`Silenced`,variant:`outline`}};function f(e){let t=new Date().getTime()-e.getTime(),n=Math.floor(t/6e4),r=Math.floor(n/60),i=Math.floor(r/24);return i>0?`${i}d ${r%24}h`:r>0?`${r}h ${n%60}m`:`${n}m`}function p({alert:e,onAcknowledge:a,onSilence:o,onResolve:s,onViewDetails:p,onRunbook:m}){let h=u[e.severity],g=d[e.status],_=h.icon;return(0,l.jsx)(`div`,{className:t.cn(`border rounded-lg p-4 transition-all`,h.bgColor,e.status===`firing`&&e.severity===`critical`&&`animate-pulse`),children:(0,l.jsxs)(`div`,{className:`flex items-start gap-3`,children:[(0,l.jsx)(_,{className:t.cn(`h-5 w-5 mt-0.5 shrink-0`,h.color)}),(0,l.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,l.jsxs)(`div`,{className:`flex items-center gap-2 flex-wrap`,children:[(0,l.jsx)(`h4`,{className:`font-semibold truncate`,children:e.title}),(0,l.jsx)(n.Badge,{variant:g.variant,children:g.label}),(0,l.jsx)(n.Badge,{variant:`outline`,className:`text-xs`,children:e.source})]}),e.description&&(0,l.jsx)(`p`,{className:`text-sm text-muted-foreground mt-1 line-clamp-2`,children:e.description}),(0,l.jsxs)(`div`,{className:`flex items-center gap-4 mt-2 text-xs text-muted-foreground`,children:[(0,l.jsxs)(`span`,{className:`flex items-center gap-1`,children:[(0,l.jsx)(c.Clock,{className:`h-3 w-3`}),f(e.startedAt)]}),e.acknowledgedBy&&(0,l.jsxs)(`span`,{children:[`Ack by `,e.acknowledgedBy]}),e.silencedUntil&&e.silencedUntil>new Date&&(0,l.jsxs)(`span`,{className:`flex items-center gap-1`,children:[(0,l.jsx)(c.VolumeX,{className:`h-3 w-3`}),`Silenced until `,e.silencedUntil.toLocaleTimeString()]})]}),e.labels&&Object.keys(e.labels).length>0&&(0,l.jsxs)(`div`,{className:`flex items-center gap-1 mt-2 flex-wrap`,children:[Object.entries(e.labels).slice(0,3).map(([e,t])=>(0,l.jsxs)(n.Badge,{variant:`outline`,className:`text-xs`,children:[e,`=`,t]},e)),Object.keys(e.labels).length>3&&(0,l.jsxs)(n.Badge,{variant:`outline`,className:`text-xs`,children:[`+`,Object.keys(e.labels).length-3]})]})]}),(0,l.jsxs)(i.DropdownMenu,{children:[(0,l.jsx)(i.DropdownMenuTrigger,{asChild:!0,children:(0,l.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-8 w-8 p-0`,children:(0,l.jsx)(c.MoreVertical,{className:`h-4 w-4`})})}),(0,l.jsxs)(i.DropdownMenuContent,{align:`end`,children:[(0,l.jsxs)(i.DropdownMenuItem,{onClick:()=>p?.(e),children:[(0,l.jsx)(c.Eye,{className:`h-4 w-4 mr-2`}),`View Details`]}),e.runbookUrl&&(0,l.jsxs)(i.DropdownMenuItem,{onClick:()=>m?.(e),children:[(0,l.jsx)(c.ExternalLink,{className:`h-4 w-4 mr-2`}),`View Runbook`]}),(0,l.jsx)(i.DropdownMenuSeparator,{}),e.status===`firing`&&(0,l.jsxs)(l.Fragment,{children:[(0,l.jsxs)(i.DropdownMenuItem,{onClick:()=>a?.(e.id),children:[(0,l.jsx)(c.Check,{className:`h-4 w-4 mr-2`}),`Acknowledge`]}),(0,l.jsxs)(i.DropdownMenuItem,{onClick:()=>o?.(e.id,30),children:[(0,l.jsx)(c.VolumeX,{className:`h-4 w-4 mr-2`}),`Silence 30m`]}),(0,l.jsxs)(i.DropdownMenuItem,{onClick:()=>o?.(e.id,60),children:[(0,l.jsx)(c.VolumeX,{className:`h-4 w-4 mr-2`}),`Silence 1h`]}),(0,l.jsxs)(i.DropdownMenuItem,{onClick:()=>o?.(e.id,240),children:[(0,l.jsx)(c.VolumeX,{className:`h-4 w-4 mr-2`}),`Silence 4h`]})]}),e.status!==`resolved`&&(0,l.jsxs)(i.DropdownMenuItem,{onClick:()=>s?.(e.id),children:[(0,l.jsx)(c.CheckCircle,{className:`h-4 w-4 mr-2`}),`Mark Resolved`]})]})]})]})})}function m({alerts:e,onAcknowledge:i,onSilence:u,onResolve:d,onViewDetails:f,onRunbook:m,onRefresh:h,isLoading:g=!1,showResolved:_=!1,className:v,title:y=`Alerts`}){let[b,x]=s.useState(`all`),[S,C]=s.useState(`all`),w=s.useMemo(()=>e.filter(e=>!(!_&&e.status===`resolved`||b!==`all`&&e.severity!==b||S!==`all`&&e.status!==S)),[e,_,b,S]),T=s.useMemo(()=>{let t=e.filter(e=>e.status!==`resolved`);return{critical:t.filter(e=>e.severity===`critical`).length,warning:t.filter(e=>e.severity===`warning`).length,info:t.filter(e=>e.severity===`info`).length}},[e]),E=s.useMemo(()=>({firing:w.filter(e=>e.status===`firing`),acknowledged:w.filter(e=>e.status===`acknowledged`),silenced:w.filter(e=>e.status===`silenced`),resolved:w.filter(e=>e.status===`resolved`)}),[w]);return(0,l.jsxs)(`div`,{className:t.cn(`flex flex-col border rounded-lg bg-background`,v),children:[(0,l.jsxs)(`div`,{className:`flex items-center justify-between gap-4 p-3 border-b`,children:[(0,l.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,l.jsx)(c.Bell,{className:`h-5 w-5`}),(0,l.jsx)(`h3`,{className:`font-semibold`,children:y}),(0,l.jsxs)(`div`,{className:`flex items-center gap-1`,children:[T.critical>0&&(0,l.jsxs)(n.Badge,{variant:`destructive`,className:`text-xs`,children:[T.critical,` critical`]}),T.warning>0&&(0,l.jsxs)(n.Badge,{className:`bg-yellow-500 text-xs`,children:[T.warning,` warning`]}),T.info>0&&(0,l.jsxs)(n.Badge,{variant:`secondary`,className:`text-xs`,children:[T.info,` info`]})]})]}),(0,l.jsx)(`div`,{className:`flex items-center gap-2`,children:h&&(0,l.jsx)(r.Button,{variant:`ghost`,size:`sm`,onClick:h,disabled:g,children:(0,l.jsx)(c.RefreshCw,{className:t.cn(`h-4 w-4`,g&&`animate-spin`)})})})]}),(0,l.jsxs)(`div`,{className:`flex items-center gap-2 p-2 border-b bg-muted/30`,children:[(0,l.jsxs)(a.Select,{value:b,onValueChange:e=>x(e),children:[(0,l.jsxs)(a.SelectTrigger,{className:`w-[130px] h-8`,children:[(0,l.jsx)(c.Filter,{className:`h-4 w-4 mr-2`}),(0,l.jsx)(a.SelectValue,{placeholder:`Severity`})]}),(0,l.jsxs)(a.SelectContent,{children:[(0,l.jsx)(a.SelectItem,{value:`all`,children:`All Severity`}),(0,l.jsx)(a.SelectItem,{value:`critical`,children:`Critical`}),(0,l.jsx)(a.SelectItem,{value:`warning`,children:`Warning`}),(0,l.jsx)(a.SelectItem,{value:`info`,children:`Info`})]})]}),(0,l.jsxs)(a.Select,{value:S,onValueChange:e=>C(e),children:[(0,l.jsx)(a.SelectTrigger,{className:`w-[140px] h-8`,children:(0,l.jsx)(a.SelectValue,{placeholder:`Status`})}),(0,l.jsxs)(a.SelectContent,{children:[(0,l.jsx)(a.SelectItem,{value:`all`,children:`All Status`}),(0,l.jsx)(a.SelectItem,{value:`firing`,children:`Firing`}),(0,l.jsx)(a.SelectItem,{value:`acknowledged`,children:`Acknowledged`}),(0,l.jsx)(a.SelectItem,{value:`silenced`,children:`Silenced`}),_&&(0,l.jsx)(a.SelectItem,{value:`resolved`,children:`Resolved`})]})]})]}),(0,l.jsx)(o.ScrollArea,{className:`flex-1`,children:(0,l.jsx)(`div`,{className:`p-3 space-y-4`,children:w.length===0?(0,l.jsxs)(`div`,{className:`flex flex-col items-center justify-center h-32 text-muted-foreground`,children:[(0,l.jsx)(c.BellOff,{className:`h-8 w-8 mb-2`}),(0,l.jsx)(`span`,{children:`No alerts to display`})]}):(0,l.jsxs)(l.Fragment,{children:[E.firing.length>0&&(0,l.jsxs)(`div`,{className:`space-y-2`,children:[(0,l.jsxs)(`h4`,{className:`text-sm font-medium text-red-500 flex items-center gap-2`,children:[(0,l.jsx)(c.Volume2,{className:`h-4 w-4`}),`Firing (`,E.firing.length,`)`]}),E.firing.map(e=>(0,l.jsx)(p,{alert:e,onAcknowledge:i,onSilence:u,onResolve:d,onViewDetails:f,onRunbook:m},e.id))]}),E.acknowledged.length>0&&(0,l.jsxs)(`div`,{className:`space-y-2`,children:[(0,l.jsxs)(`h4`,{className:`text-sm font-medium text-muted-foreground flex items-center gap-2`,children:[(0,l.jsx)(c.Check,{className:`h-4 w-4`}),`Acknowledged (`,E.acknowledged.length,`)`]}),E.acknowledged.map(e=>(0,l.jsx)(p,{alert:e,onAcknowledge:i,onSilence:u,onResolve:d,onViewDetails:f,onRunbook:m},e.id))]}),E.silenced.length>0&&(0,l.jsxs)(`div`,{className:`space-y-2`,children:[(0,l.jsxs)(`h4`,{className:`text-sm font-medium text-muted-foreground flex items-center gap-2`,children:[(0,l.jsx)(c.VolumeX,{className:`h-4 w-4`}),`Silenced (`,E.silenced.length,`)`]}),E.silenced.map(e=>(0,l.jsx)(p,{alert:e,onAcknowledge:i,onSilence:u,onResolve:d,onViewDetails:f,onRunbook:m},e.id))]}),_&&E.resolved.length>0&&(0,l.jsxs)(`div`,{className:`space-y-2`,children:[(0,l.jsxs)(`h4`,{className:`text-sm font-medium text-muted-foreground flex items-center gap-2`,children:[(0,l.jsx)(c.CheckCircle,{className:`h-4 w-4`}),`Resolved (`,E.resolved.length,`)`]}),E.resolved.map(e=>(0,l.jsx)(p,{alert:e,onAcknowledge:i,onSilence:u,onResolve:d,onViewDetails:f,onRunbook:m},e.id))]})]})})})]})}var h=[{id:`1`,title:`High CPU Usage on prod-api-1`,description:`CPU usage has exceeded 90% for more than 5 minutes`,severity:`critical`,status:`firing`,source:`prometheus`,startedAt:new Date(Date.now()-15*6e4),labels:{instance:`prod-api-1`,job:`api-server`},runbookUrl:`https://runbooks.example.com/high-cpu`},{id:`2`,title:`Database Connection Pool Exhausted`,description:`PostgreSQL connection pool is at 95% capacity`,severity:`warning`,status:`acknowledged`,source:`prometheus`,startedAt:new Date(Date.now()-45*6e4),acknowledgedAt:new Date(Date.now()-30*6e4),acknowledgedBy:`john.doe`,labels:{db:`primary`,pool:`main`}},{id:`3`,title:`SSL Certificate Expiring Soon`,description:`Certificate for api.example.com expires in 7 days`,severity:`info`,status:`silenced`,source:`cert-manager`,startedAt:new Date(Date.now()-2*36e5),silencedUntil:new Date(Date.now()+24*36e5),labels:{domain:`api.example.com`}}];exports.WakaAlertPanel=m,exports.defaultAlerts=h;

package/dist/components/waka-alert-panel/index.es.js

@@ -0,0 +1,420 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import { Badge as t } from "../badge/index.es.js";
+import { Button as n } from "../button/index.es.js";
+import { DropdownMenu as r, DropdownMenuContent as i, DropdownMenuItem as a, DropdownMenuSeparator as o, DropdownMenuTrigger as s } from "../dropdown-menu/index.es.js";
+import { Select as c, SelectContent as l, SelectItem as u, SelectTrigger as d, SelectValue as f } from "../select/index.es.js";
+import { ScrollArea as p } from "../scroll-area/index.es.js";
+import * as m from "react";
+import { AlertCircle as h, AlertTriangle as g, Bell as _, BellOff as v, Check as y, CheckCircle as b, Clock as x, ExternalLink as S, Eye as C, Filter as w, Info as T, MoreVertical as E, RefreshCw as D, Volume2 as O, VolumeX as k } from "lucide-react";
+import { Fragment as A, jsx as j, jsxs as M } from "react/jsx-runtime";
+//#region src/components/waka-alert-panel/index.tsx
+var N = {
+	critical: {
+		icon: h,
+		color: "text-red-500",
+		bgColor: "bg-red-500/10 border-red-500/30"
+	},
+	warning: {
+		icon: g,
+		color: "text-yellow-500",
+		bgColor: "bg-yellow-500/10 border-yellow-500/30"
+	},
+	info: {
+		icon: T,
+		color: "text-blue-500",
+		bgColor: "bg-blue-500/10 border-blue-500/30"
+	}
+}, P = {
+	firing: {
+		label: "Firing",
+		variant: "destructive"
+	},
+	acknowledged: {
+		label: "Acknowledged",
+		variant: "secondary"
+	},
+	resolved: {
+		label: "Resolved",
+		variant: "outline"
+	},
+	silenced: {
+		label: "Silenced",
+		variant: "outline"
+	}
+};
+function F(e) {
+	let t = (/* @__PURE__ */ new Date()).getTime() - e.getTime(), n = Math.floor(t / 6e4), r = Math.floor(n / 60), i = Math.floor(r / 24);
+	return i > 0 ? `${i}d ${r % 24}h` : r > 0 ? `${r}h ${n % 60}m` : `${n}m`;
+}
+function I({ alert: c, onAcknowledge: l, onSilence: u, onResolve: d, onViewDetails: f, onRunbook: p }) {
+	let m = N[c.severity], h = P[c.status], g = m.icon;
+	return /* @__PURE__ */ j("div", {
+		className: e("border rounded-lg p-4 transition-all", m.bgColor, c.status === "firing" && c.severity === "critical" && "animate-pulse"),
+		children: /* @__PURE__ */ M("div", {
+			className: "flex items-start gap-3",
+			children: [
+				/* @__PURE__ */ j(g, { className: e("h-5 w-5 mt-0.5 shrink-0", m.color) }),
+				/* @__PURE__ */ M("div", {
+					className: "flex-1 min-w-0",
+					children: [
+						/* @__PURE__ */ M("div", {
+							className: "flex items-center gap-2 flex-wrap",
+							children: [
+								/* @__PURE__ */ j("h4", {
+									className: "font-semibold truncate",
+									children: c.title
+								}),
+								/* @__PURE__ */ j(t, {
+									variant: h.variant,
+									children: h.label
+								}),
+								/* @__PURE__ */ j(t, {
+									variant: "outline",
+									className: "text-xs",
+									children: c.source
+								})
+							]
+						}),
+						c.description && /* @__PURE__ */ j("p", {
+							className: "text-sm text-muted-foreground mt-1 line-clamp-2",
+							children: c.description
+						}),
+						/* @__PURE__ */ M("div", {
+							className: "flex items-center gap-4 mt-2 text-xs text-muted-foreground",
+							children: [
+								/* @__PURE__ */ M("span", {
+									className: "flex items-center gap-1",
+									children: [/* @__PURE__ */ j(x, { className: "h-3 w-3" }), F(c.startedAt)]
+								}),
+								c.acknowledgedBy && /* @__PURE__ */ M("span", { children: ["Ack by ", c.acknowledgedBy] }),
+								c.silencedUntil && c.silencedUntil > /* @__PURE__ */ new Date() && /* @__PURE__ */ M("span", {
+									className: "flex items-center gap-1",
+									children: [
+										/* @__PURE__ */ j(k, { className: "h-3 w-3" }),
+										"Silenced until ",
+										c.silencedUntil.toLocaleTimeString()
+									]
+								})
+							]
+						}),
+						c.labels && Object.keys(c.labels).length > 0 && /* @__PURE__ */ M("div", {
+							className: "flex items-center gap-1 mt-2 flex-wrap",
+							children: [Object.entries(c.labels).slice(0, 3).map(([e, n]) => /* @__PURE__ */ M(t, {
+								variant: "outline",
+								className: "text-xs",
+								children: [
+									e,
+									"=",
+									n
+								]
+							}, e)), Object.keys(c.labels).length > 3 && /* @__PURE__ */ M(t, {
+								variant: "outline",
+								className: "text-xs",
+								children: ["+", Object.keys(c.labels).length - 3]
+							})]
+						})
+					]
+				}),
+				/* @__PURE__ */ M(r, { children: [/* @__PURE__ */ j(s, {
+					asChild: !0,
+					children: /* @__PURE__ */ j(n, {
+						variant: "ghost",
+						size: "sm",
+						className: "h-8 w-8 p-0",
+						children: /* @__PURE__ */ j(E, { className: "h-4 w-4" })
+					})
+				}), /* @__PURE__ */ M(i, {
+					align: "end",
+					children: [
+						/* @__PURE__ */ M(a, {
+							onClick: () => f?.(c),
+							children: [/* @__PURE__ */ j(C, { className: "h-4 w-4 mr-2" }), "View Details"]
+						}),
+						c.runbookUrl && /* @__PURE__ */ M(a, {
+							onClick: () => p?.(c),
+							children: [/* @__PURE__ */ j(S, { className: "h-4 w-4 mr-2" }), "View Runbook"]
+						}),
+						/* @__PURE__ */ j(o, {}),
+						c.status === "firing" && /* @__PURE__ */ M(A, { children: [
+							/* @__PURE__ */ M(a, {
+								onClick: () => l?.(c.id),
+								children: [/* @__PURE__ */ j(y, { className: "h-4 w-4 mr-2" }), "Acknowledge"]
+							}),
+							/* @__PURE__ */ M(a, {
+								onClick: () => u?.(c.id, 30),
+								children: [/* @__PURE__ */ j(k, { className: "h-4 w-4 mr-2" }), "Silence 30m"]
+							}),
+							/* @__PURE__ */ M(a, {
+								onClick: () => u?.(c.id, 60),
+								children: [/* @__PURE__ */ j(k, { className: "h-4 w-4 mr-2" }), "Silence 1h"]
+							}),
+							/* @__PURE__ */ M(a, {
+								onClick: () => u?.(c.id, 240),
+								children: [/* @__PURE__ */ j(k, { className: "h-4 w-4 mr-2" }), "Silence 4h"]
+							})
+						] }),
+						c.status !== "resolved" && /* @__PURE__ */ M(a, {
+							onClick: () => d?.(c.id),
+							children: [/* @__PURE__ */ j(b, { className: "h-4 w-4 mr-2" }), "Mark Resolved"]
+						})
+					]
+				})] })
+			]
+		})
+	});
+}
+function L({ alerts: r, onAcknowledge: i, onSilence: a, onResolve: o, onViewDetails: s, onRunbook: h, onRefresh: g, isLoading: x = !1, showResolved: S = !1, className: C, title: T = "Alerts" }) {
+	let [E, N] = m.useState("all"), [P, F] = m.useState("all"), L = m.useMemo(() => r.filter((e) => !(!S && e.status === "resolved" || E !== "all" && e.severity !== E || P !== "all" && e.status !== P)), [
+		r,
+		S,
+		E,
+		P
+	]), R = m.useMemo(() => {
+		let e = r.filter((e) => e.status !== "resolved");
+		return {
+			critical: e.filter((e) => e.severity === "critical").length,
+			warning: e.filter((e) => e.severity === "warning").length,
+			info: e.filter((e) => e.severity === "info").length
+		};
+	}, [r]), z = m.useMemo(() => ({
+		firing: L.filter((e) => e.status === "firing"),
+		acknowledged: L.filter((e) => e.status === "acknowledged"),
+		silenced: L.filter((e) => e.status === "silenced"),
+		resolved: L.filter((e) => e.status === "resolved")
+	}), [L]);
+	return /* @__PURE__ */ M("div", {
+		className: e("flex flex-col border rounded-lg bg-background", C),
+		children: [
+			/* @__PURE__ */ M("div", {
+				className: "flex items-center justify-between gap-4 p-3 border-b",
+				children: [/* @__PURE__ */ M("div", {
+					className: "flex items-center gap-3",
+					children: [
+						/* @__PURE__ */ j(_, { className: "h-5 w-5" }),
+						/* @__PURE__ */ j("h3", {
+							className: "font-semibold",
+							children: T
+						}),
+						/* @__PURE__ */ M("div", {
+							className: "flex items-center gap-1",
+							children: [
+								R.critical > 0 && /* @__PURE__ */ M(t, {
+									variant: "destructive",
+									className: "text-xs",
+									children: [R.critical, " critical"]
+								}),
+								R.warning > 0 && /* @__PURE__ */ M(t, {
+									className: "bg-yellow-500 text-xs",
+									children: [R.warning, " warning"]
+								}),
+								R.info > 0 && /* @__PURE__ */ M(t, {
+									variant: "secondary",
+									className: "text-xs",
+									children: [R.info, " info"]
+								})
+							]
+						})
+					]
+				}), /* @__PURE__ */ j("div", {
+					className: "flex items-center gap-2",
+					children: g && /* @__PURE__ */ j(n, {
+						variant: "ghost",
+						size: "sm",
+						onClick: g,
+						disabled: x,
+						children: /* @__PURE__ */ j(D, { className: e("h-4 w-4", x && "animate-spin") })
+					})
+				})]
+			}),
+			/* @__PURE__ */ M("div", {
+				className: "flex items-center gap-2 p-2 border-b bg-muted/30",
+				children: [/* @__PURE__ */ M(c, {
+					value: E,
+					onValueChange: (e) => N(e),
+					children: [/* @__PURE__ */ M(d, {
+						className: "w-[130px] h-8",
+						children: [/* @__PURE__ */ j(w, { className: "h-4 w-4 mr-2" }), /* @__PURE__ */ j(f, { placeholder: "Severity" })]
+					}), /* @__PURE__ */ M(l, { children: [
+						/* @__PURE__ */ j(u, {
+							value: "all",
+							children: "All Severity"
+						}),
+						/* @__PURE__ */ j(u, {
+							value: "critical",
+							children: "Critical"
+						}),
+						/* @__PURE__ */ j(u, {
+							value: "warning",
+							children: "Warning"
+						}),
+						/* @__PURE__ */ j(u, {
+							value: "info",
+							children: "Info"
+						})
+					] })]
+				}), /* @__PURE__ */ M(c, {
+					value: P,
+					onValueChange: (e) => F(e),
+					children: [/* @__PURE__ */ j(d, {
+						className: "w-[140px] h-8",
+						children: /* @__PURE__ */ j(f, { placeholder: "Status" })
+					}), /* @__PURE__ */ M(l, { children: [
+						/* @__PURE__ */ j(u, {
+							value: "all",
+							children: "All Status"
+						}),
+						/* @__PURE__ */ j(u, {
+							value: "firing",
+							children: "Firing"
+						}),
+						/* @__PURE__ */ j(u, {
+							value: "acknowledged",
+							children: "Acknowledged"
+						}),
+						/* @__PURE__ */ j(u, {
+							value: "silenced",
+							children: "Silenced"
+						}),
+						S && /* @__PURE__ */ j(u, {
+							value: "resolved",
+							children: "Resolved"
+						})
+					] })]
+				})]
+			}),
+			/* @__PURE__ */ j(p, {
+				className: "flex-1",
+				children: /* @__PURE__ */ j("div", {
+					className: "p-3 space-y-4",
+					children: L.length === 0 ? /* @__PURE__ */ M("div", {
+						className: "flex flex-col items-center justify-center h-32 text-muted-foreground",
+						children: [/* @__PURE__ */ j(v, { className: "h-8 w-8 mb-2" }), /* @__PURE__ */ j("span", { children: "No alerts to display" })]
+					}) : /* @__PURE__ */ M(A, { children: [
+						z.firing.length > 0 && /* @__PURE__ */ M("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ M("h4", {
+								className: "text-sm font-medium text-red-500 flex items-center gap-2",
+								children: [
+									/* @__PURE__ */ j(O, { className: "h-4 w-4" }),
+									"Firing (",
+									z.firing.length,
+									")"
+								]
+							}), z.firing.map((e) => /* @__PURE__ */ j(I, {
+								alert: e,
+								onAcknowledge: i,
+								onSilence: a,
+								onResolve: o,
+								onViewDetails: s,
+								onRunbook: h
+							}, e.id))]
+						}),
+						z.acknowledged.length > 0 && /* @__PURE__ */ M("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ M("h4", {
+								className: "text-sm font-medium text-muted-foreground flex items-center gap-2",
+								children: [
+									/* @__PURE__ */ j(y, { className: "h-4 w-4" }),
+									"Acknowledged (",
+									z.acknowledged.length,
+									")"
+								]
+							}), z.acknowledged.map((e) => /* @__PURE__ */ j(I, {
+								alert: e,
+								onAcknowledge: i,
+								onSilence: a,
+								onResolve: o,
+								onViewDetails: s,
+								onRunbook: h
+							}, e.id))]
+						}),
+						z.silenced.length > 0 && /* @__PURE__ */ M("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ M("h4", {
+								className: "text-sm font-medium text-muted-foreground flex items-center gap-2",
+								children: [
+									/* @__PURE__ */ j(k, { className: "h-4 w-4" }),
+									"Silenced (",
+									z.silenced.length,
+									")"
+								]
+							}), z.silenced.map((e) => /* @__PURE__ */ j(I, {
+								alert: e,
+								onAcknowledge: i,
+								onSilence: a,
+								onResolve: o,
+								onViewDetails: s,
+								onRunbook: h
+							}, e.id))]
+						}),
+						S && z.resolved.length > 0 && /* @__PURE__ */ M("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ M("h4", {
+								className: "text-sm font-medium text-muted-foreground flex items-center gap-2",
+								children: [
+									/* @__PURE__ */ j(b, { className: "h-4 w-4" }),
+									"Resolved (",
+									z.resolved.length,
+									")"
+								]
+							}), z.resolved.map((e) => /* @__PURE__ */ j(I, {
+								alert: e,
+								onAcknowledge: i,
+								onSilence: a,
+								onResolve: o,
+								onViewDetails: s,
+								onRunbook: h
+							}, e.id))]
+						})
+					] })
+				})
+			})
+		]
+	});
+}
+var R = [
+	{
+		id: "1",
+		title: "High CPU Usage on prod-api-1",
+		description: "CPU usage has exceeded 90% for more than 5 minutes",
+		severity: "critical",
+		status: "firing",
+		source: "prometheus",
+		startedAt: /* @__PURE__ */ new Date(Date.now() - 15 * 6e4),
+		labels: {
+			instance: "prod-api-1",
+			job: "api-server"
+		},
+		runbookUrl: "https://runbooks.example.com/high-cpu"
+	},
+	{
+		id: "2",
+		title: "Database Connection Pool Exhausted",
+		description: "PostgreSQL connection pool is at 95% capacity",
+		severity: "warning",
+		status: "acknowledged",
+		source: "prometheus",
+		startedAt: /* @__PURE__ */ new Date(Date.now() - 45 * 6e4),
+		acknowledgedAt: /* @__PURE__ */ new Date(Date.now() - 30 * 6e4),
+		acknowledgedBy: "john.doe",
+		labels: {
+			db: "primary",
+			pool: "main"
+		}
+	},
+	{
+		id: "3",
+		title: "SSL Certificate Expiring Soon",
+		description: "Certificate for api.example.com expires in 7 days",
+		severity: "info",
+		status: "silenced",
+		source: "cert-manager",
+		startedAt: /* @__PURE__ */ new Date(Date.now() - 2 * 36e5),
+		silencedUntil: new Date(Date.now() + 24 * 36e5),
+		labels: { domain: "api.example.com" }
+	}
+];
+//#endregion
+export { L as WakaAlertPanel, R as defaultAlerts };