react-aiops 0.1.11 → 0.1.12

package/dist/index.js

@@ -1,11 +1,11 @@
-import { jsxs as d, jsx as e, Fragment as Ee } from "react/jsx-runtime";
-import j, { createContext as Ue, useContext as re, useState as R, useEffect as Ae, useMemo as yt, useRef as K, useCallback as dt } from "react";
-const Dt = {
+import { jsxs as c, jsx as e, Fragment as Me } from "react/jsx-runtime";
+import q, { createContext as tt, useContext as ge, useState as R, useEffect as ke, useMemo as Tt, useRef as ie, useCallback as Ge } from "react";
+const Ht = {
   info: { color: "#00ff88", bg: "rgba(0, 255, 136, 0.1)", border: "#00ff88", icon: "✅" },
   warning: { color: "#ff8c00", bg: "rgba(255, 140, 0, 0.1)", border: "#ff8c00", icon: "⚠️" },
   critical: { color: "#ff2255", bg: "rgba(255, 34, 85, 0.1)", border: "#ff2255", icon: "🛑" }
 };
-function Nt({
+function Ut({
   name: t,
   status: n,
   dbSync: o = !0,
@@ -31,13 +31,13 @@ function Nt({
       value: s ? "5.42%" : l ? "1.20%" : "0.01%",
       color: s ? "#ff2255" : l ? "#ff8c00" : "#00ff88"
     }
-  ], c = a ?? [
+  ], d = a ?? [
     ...o ? [] : [{ level: "warning", message: "DB Replication Lag Detected" }],
     ...s ? [{ level: "critical", message: "Critical Component Failure" }] : [],
     ...l && !s ? [{ level: "warning", message: "Component Warning State" }] : [],
     ...!s && !l && o ? [{ level: "info", message: "All Systems Nominal" }] : []
   ];
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
@@ -64,7 +64,7 @@ function Nt({
         gap: 16
       },
       children: [
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -115,13 +115,13 @@ function Nt({
               fontSize: 13,
               color: "#a0b0c0"
             },
-            children: h.map((p, f) => /* @__PURE__ */ d("div", { style: { display: "flex", justifyContent: "space-between" }, children: [
+            children: h.map((p, f) => /* @__PURE__ */ c("div", { style: { display: "flex", justifyContent: "space-between" }, children: [
               /* @__PURE__ */ e("span", { children: p.label }),
               /* @__PURE__ */ e("span", { style: { color: p.color }, children: p.value })
             ] }, f))
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -145,24 +145,24 @@ function Nt({
                   children: "SYSTEM ALERTS"
                 }
               ),
-              c.map((p, f) => {
-                const g = Dt[p.level];
-                return /* @__PURE__ */ d(
+              d.map((p, f) => {
+                const b = Ht[p.level];
+                return /* @__PURE__ */ c(
                   "div",
                   {
                     style: {
                       display: "flex",
                       gap: 8,
                       alignItems: "flex-start",
-                      color: g.color,
+                      color: b.color,
                       fontSize: 12,
-                      background: g.bg,
+                      background: b.bg,
                       padding: "6px 10px",
                       borderRadius: 4,
-                      borderLeft: `2px solid ${g.border}`
+                      borderLeft: `2px solid ${b.border}`
                     },
                     children: [
-                      /* @__PURE__ */ e("span", { children: g.icon }),
+                      /* @__PURE__ */ e("span", { children: b.icon }),
                       " ",
                       /* @__PURE__ */ e("span", { children: p.message })
                     ]
@@ -177,13 +177,13 @@ function Nt({
     }
   );
 }
-const P = {
+const C = {
   online: { color: "#00e5ff", glow: "rgba(0,229,255,0.55)" },
   warning: { color: "#ff8c00", glow: "rgba(255,140,0,0.55)" },
   critical: { color: "#ff2255", glow: "rgba(255,34,85,0.55)" },
   offline: { color: "#1e3a5a", glow: "rgba(30,58,90,0.25)" }
-}, Pi = "#00e5ff", Ci = "#0055cc", Te = "linear-gradient(180deg, #071428 0%, #040c1c 60%, #030810 100%)", Ze = "linear-gradient(180deg, rgba(10,25,50,0.35) 0%, rgba(5,15,35,0.25) 60%, rgba(3,10,20,0.15) 100%)";
-function Je(t, n, o) {
+}, Ii = "#00e5ff", Di = "#0055cc", ze = "linear-gradient(180deg, #071428 0%, #040c1c 60%, #030810 100%)", ft = "linear-gradient(180deg, rgba(10,25,50,0.35) 0%, rgba(5,15,35,0.25) 60%, rgba(3,10,20,0.15) 100%)";
+function ht(t, n, o) {
   const i = {
     position: "absolute",
     overflow: "hidden",
@@ -233,56 +233,56 @@ function Je(t, n, o) {
     }
   };
 }
-const Qe = "cubic-bezier(0.34, 1.56, 0.64, 1)", Ge = "cubic-bezier(0.16, 1, 0.3, 1)";
-function mt(t) {
-  return P[t]?.color ?? P.online.color;
+const ct = "cubic-bezier(0.34, 1.56, 0.64, 1)", qe = "cubic-bezier(0.16, 1, 0.3, 1)";
+function Ot(t) {
+  return C[t]?.color ?? C.online.color;
 }
-function Wt(t, n, o) {
+function Yt(t, n, o) {
   return t >= o ? "#ff2255" : t >= n ? "#ff8c00" : "#00e5ff";
 }
-function We(t, n, o, i) {
+function Xe(t, n, o, i) {
   return t === "offline" ? "offline" : t === "critical" && n >= i ? "critical" : (t === "critical" || t === "warning") && n >= o ? "warning" : "online";
 }
-function Mt({
+function Vt({
   component: t,
   onClose: n,
   visible: o,
   sceneWidth: i = 660,
   sceneHeight: r = 600
 }) {
-  const { type: a, name: s, status: l, ex: h, ey: c, context: p = {} } = t, f = mt(l), g = h >= i / 2, u = c >= r / 2, y = {
+  const { type: a, name: s, status: l, ex: h, ey: d, context: p = {} } = t, f = Ot(l), b = h >= i / 2, u = d >= r / 2, g = {
     position: "fixed",
-    ...g ? { right: 28 } : { left: 28 },
+    ...b ? { right: 28 } : { left: 28 },
     ...u ? { bottom: 110 } : { top: 72 }
-  }, m = g ? 40 : -40, v = u ? 30 : -30, x = t.dialogMetrics ?? p.dialogMetrics;
-  let w;
-  if (x && x.length > 0)
-    w = x.map((b, k) => {
-      const T = b.warnAt ?? 70, $ = b.critAt ?? 85;
+  }, m = b ? 40 : -40, w = u ? 30 : -30, v = t.dialogMetrics ?? p.dialogMetrics;
+  let S;
+  if (v && v.length > 0)
+    S = v.map((y, x) => {
+      const A = y.warnAt ?? 70, k = y.critAt ?? 85;
       return {
-        id: b.id,
-        label: b.label,
-        sublabel: b.sublabel,
-        value: b.value,
-        unit: b.unit ?? "%",
-        status: We(l, b.value, T, $),
-        icon: b.icon ?? "cpu",
-        delay: k,
-        colorOverride: b.color,
-        warnAt: T,
-        critAt: $
+        id: y.id,
+        label: y.label,
+        sublabel: y.sublabel,
+        value: y.value,
+        unit: y.unit ?? "%",
+        status: Xe(l, y.value, A, k),
+        icon: y.icon ?? "cpu",
+        delay: x,
+        colorOverride: y.color,
+        warnAt: A,
+        critAt: k
       };
     });
   else {
-    const b = p.cpuLoad ?? p.traffic ?? 50, k = p.memLoad ?? p.queueDepth ?? 60, T = p.capacity ?? 72, $ = We(l, b, 70, 85), S = We(l, k, 75, 88), N = We(l, T, 75, 90);
-    w = [
+    const y = p.cpuLoad ?? p.traffic ?? 50, x = p.memLoad ?? p.queueDepth ?? 60, A = p.capacity ?? 72, k = Xe(l, y, 70, 85), $ = Xe(l, x, 75, 88), H = Xe(l, A, 75, 90);
+    S = [
       {
         id: "cpu",
         label: a === "dispatcher" ? "TRAFFIC" : a === "messageServer" ? "QUEUE" : "CPU",
         sublabel: a === "dispatcher" ? "PORT LOAD" : a === "messageServer" ? "QUEUE DEPTH" : "PROCESSOR",
-        value: b,
+        value: y,
         unit: "%",
-        status: $,
+        status: k,
         icon: "cpu",
         delay: 0
       },
@@ -290,9 +290,9 @@ function Mt({
         id: "mem",
         label: "MEMORY",
         sublabel: a === "database" ? "BUFFER POOL" : "HEAP USAGE",
-        value: k,
+        value: x,
         unit: "%",
-        status: S,
+        status: $,
         icon: "mem",
         delay: 1
       },
@@ -300,19 +300,19 @@ function Mt({
         id: "storage",
         label: "STORAGE",
         sublabel: a === "database" ? "TABLESPACE" : "DISK I/O",
-        value: T,
+        value: A,
         unit: "%",
-        status: N,
+        status: H,
         icon: "disk",
         delay: 2
       }
     ];
   }
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        ...y,
+        ...g,
         width: 420,
         background: "linear-gradient(170deg, rgba(2, 10, 22, 0.96) 0%, rgba(2, 6, 14, 0.98) 100%)",
         backdropFilter: "blur(20px)",
@@ -322,14 +322,14 @@ function Mt({
         fontFamily: "'Courier New', monospace",
         overflow: "hidden",
         opacity: o ? 1 : 0,
-        transform: o ? "scale(1) translate(0, 0)" : `scale(0.7) translate(${m}px, ${v}px)`,
-        transition: `opacity 0.45s ${Ge}, transform 0.55s ${Qe}`,
+        transform: o ? "scale(1) translate(0, 0)" : `scale(0.7) translate(${m}px, ${w}px)`,
+        transition: `opacity 0.45s ${qe}, transform 0.55s ${ct}`,
         pointerEvents: o ? "auto" : "none",
         zIndex: 9999,
         animation: o ? "comp-dialog-border-glow 3s ease-in-out infinite" : "none",
         "--dialog-color": f
       },
-      onClick: (b) => b.stopPropagation(),
+      onClick: (y) => y.stopPropagation(),
       children: [
         /* @__PURE__ */ e(
           "div",
@@ -393,14 +393,14 @@ function Mt({
             borderRight: `2px solid ${f}66`,
             borderRadius: "0 0 14px 0"
           }
-        ].map((b, k) => /* @__PURE__ */ e(
+        ].map((y, x) => /* @__PURE__ */ e(
           "div",
           {
-            style: { position: "absolute", width: 18, height: 18, pointerEvents: "none", ...b }
+            style: { position: "absolute", width: 18, height: 18, pointerEvents: "none", ...y }
           },
-          k
+          x
         )),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -414,8 +414,8 @@ function Mt({
               zIndex: 2
             },
             children: [
-              /* @__PURE__ */ d("div", { style: { display: "flex", alignItems: "center", gap: 10, minWidth: 0 }, children: [
-                /* @__PURE__ */ d("div", { style: { position: "relative" }, children: [
+              /* @__PURE__ */ c("div", { style: { display: "flex", alignItems: "center", gap: 10, minWidth: 0 }, children: [
+                /* @__PURE__ */ c("div", { style: { position: "relative" }, children: [
                   /* @__PURE__ */ e(
                     "div",
                     {
@@ -442,7 +442,7 @@ function Mt({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ d("div", { style: { display: "flex", flexDirection: "column", gap: 2, minWidth: 0 }, children: [
+                /* @__PURE__ */ c("div", { style: { display: "flex", flexDirection: "column", gap: 2, minWidth: 0 }, children: [
                   /* @__PURE__ */ e(
                     "span",
                     {
@@ -477,8 +477,8 @@ function Mt({
               /* @__PURE__ */ e(
                 "button",
                 {
-                  onClick: (b) => {
-                    b.stopPropagation(), n();
+                  onClick: (y) => {
+                    y.stopPropagation(), n();
                   },
                   style: {
                     width: 34,
@@ -496,11 +496,11 @@ function Mt({
                     lineHeight: 1,
                     flexShrink: 0
                   },
-                  onMouseEnter: (b) => {
-                    b.currentTarget.style.background = `${f}22`, b.currentTarget.style.boxShadow = `0 0 12px ${f}44`;
+                  onMouseEnter: (y) => {
+                    y.currentTarget.style.background = `${f}22`, y.currentTarget.style.boxShadow = `0 0 12px ${f}44`;
                   },
-                  onMouseLeave: (b) => {
-                    b.currentTarget.style.background = `linear-gradient(135deg, rgba(0,0,0,0.5) 0%, ${f}08 100%)`, b.currentTarget.style.boxShadow = "none";
+                  onMouseLeave: (y) => {
+                    y.currentTarget.style.background = `linear-gradient(135deg, rgba(0,0,0,0.5) 0%, ${f}08 100%)`, y.currentTarget.style.boxShadow = "none";
                   },
                   children: "×"
                 }
@@ -519,10 +519,10 @@ function Mt({
               position: "relative",
               zIndex: 2
             },
-            children: w.map((b) => /* @__PURE__ */ e(zt, { metric: b, visible: o, accentColor: f }, b.id))
+            children: S.map((y) => /* @__PURE__ */ e(_t, { metric: y, visible: o, accentColor: f }, y.id))
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -540,12 +540,12 @@ function Mt({
               zIndex: 2
             },
             children: [
-              /* @__PURE__ */ d("span", { children: [
+              /* @__PURE__ */ c("span", { children: [
                 a.toUpperCase(),
                 " · ",
                 l.toUpperCase()
               ] }),
-              /* @__PURE__ */ d("span", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
+              /* @__PURE__ */ c("span", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
                 /* @__PURE__ */ e(
                   "span",
                   {
@@ -568,7 +568,7 @@ function Mt({
     }
   );
 }
-function zt({
+function _t({
   metric: t,
   visible: n,
   accentColor: o
@@ -580,12 +580,12 @@ function zt({
     unit: s,
     status: l,
     icon: h,
-    delay: c,
+    delay: d,
     colorOverride: p,
     warnAt: f = 70,
-    critAt: g = 85
-  } = t, u = p ?? Wt(a, f, g), y = p ?? mt(l);
-  return /* @__PURE__ */ d(
+    critAt: b = 85
+  } = t, u = p ?? Yt(a, f, b), g = p ?? Ot(l);
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
@@ -594,28 +594,28 @@ function zt({
         gap: 16,
         opacity: n ? 1 : 0,
         transform: n ? "translateY(0)" : "translateY(12px)",
-        transition: `opacity 0.4s ${Ge} ${0.3 + c * 0.12}s, transform 0.5s ${Qe} ${0.3 + c * 0.12}s`
+        transition: `opacity 0.4s ${qe} ${0.3 + d * 0.12}s, transform 0.5s ${ct} ${0.3 + d * 0.12}s`
       },
       children: [
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
               width: 52,
               height: 52,
               borderRadius: 12,
-              border: `1px solid ${y}44`,
-              background: `linear-gradient(135deg, ${y}0c 0%, ${y}04 100%)`,
+              border: `1px solid ${g}44`,
+              background: `linear-gradient(135deg, ${g}0c 0%, ${g}04 100%)`,
               display: "flex",
               alignItems: "center",
               justifyContent: "center",
               flexShrink: 0,
               position: "relative",
               overflow: "hidden",
-              animation: n ? `comp-dialog-icon-pop 0.5s ${Qe} ${0.35 + c * 0.12}s both` : "none"
+              animation: n ? `comp-dialog-icon-pop 0.5s ${ct} ${0.35 + d * 0.12}s both` : "none"
             },
             children: [
-              /* @__PURE__ */ e(Bt, { type: h, color: y }),
+              /* @__PURE__ */ e(jt, { type: h, color: g }),
               (l === "warning" || l === "critical") && /* @__PURE__ */ e(
                 "div",
                 {
@@ -626,8 +626,8 @@ function zt({
                     width: 5,
                     height: 5,
                     borderRadius: "50%",
-                    background: y,
-                    boxShadow: `0 0 6px ${y}`,
+                    background: g,
+                    boxShadow: `0 0 6px ${g}`,
                     animation: "holo-led-blink 1.2s infinite"
                   }
                 }
@@ -635,8 +635,8 @@ function zt({
             ]
           }
         ),
-        /* @__PURE__ */ d("div", { style: { flex: 1, minWidth: 0 }, children: [
-          /* @__PURE__ */ d(
+        /* @__PURE__ */ c("div", { style: { flex: 1, minWidth: 0 }, children: [
+          /* @__PURE__ */ c(
             "div",
             {
               style: {
@@ -646,7 +646,7 @@ function zt({
                 marginBottom: 6
               },
               children: [
-                /* @__PURE__ */ d("div", { style: { display: "flex", flexDirection: "column", gap: 2 }, children: [
+                /* @__PURE__ */ c("div", { style: { display: "flex", flexDirection: "column", gap: 2 }, children: [
                   /* @__PURE__ */ e(
                     "span",
                     {
@@ -672,7 +672,7 @@ function zt({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ d(
+                /* @__PURE__ */ c(
                   "span",
                   {
                     style: {
@@ -691,7 +691,7 @@ function zt({
               ]
             }
           ),
-          /* @__PURE__ */ d(
+          /* @__PURE__ */ c(
             "div",
             {
               style: {
@@ -714,7 +714,8 @@ function zt({
                       background: `linear-gradient(90deg, ${u}66, ${u})`,
                       boxShadow: `0 0 8px ${u}44`,
                       transformOrigin: "left center",
-                      animation: n ? `comp-dialog-metric-fill 0.8s ${Ge} ${0.4 + c * 0.12}s both` : "none"
+                      animation: n ? `comp-dialog-metric-fill 0.8s ${qe} ${0.4 + d * 0.12}s both` : "none",
+                      transition: `width 0.6s ${qe}, background 0.4s ease, box-shadow 0.4s ease`
                     }
                   }
                 ),
@@ -736,7 +737,7 @@ function zt({
                   {
                     style: {
                       position: "absolute",
-                      left: `${g}%`,
+                      left: `${b}%`,
                       top: 0,
                       bottom: 0,
                       width: 1,
@@ -747,7 +748,7 @@ function zt({
               ]
             }
           ),
-          /* @__PURE__ */ d("div", { style: { position: "relative", height: 10, marginTop: 2 }, children: [
+          /* @__PURE__ */ c("div", { style: { position: "relative", height: 10, marginTop: 2 }, children: [
             /* @__PURE__ */ e(
               "span",
               {
@@ -780,7 +781,7 @@ function zt({
               {
                 style: {
                   position: "absolute",
-                  left: `${g}%`,
+                  left: `${b}%`,
                   transform: "translateX(-50%)",
                   fontSize: 6,
                   color: "rgba(255,34,85,0.3)",
@@ -808,8 +809,8 @@ function zt({
     }
   );
 }
-function Bt({ type: t, color: n }) {
-  return t === "cpu" ? /* @__PURE__ */ d("svg", { width: 28, height: 28, viewBox: "0 0 24 24", fill: "none", children: [
+function jt({ type: t, color: n }) {
+  return t === "cpu" ? /* @__PURE__ */ c("svg", { width: 28, height: 28, viewBox: "0 0 24 24", fill: "none", children: [
     /* @__PURE__ */ e("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2", stroke: n, strokeWidth: "1.5" }),
     /* @__PURE__ */ e(
       "rect",
@@ -836,7 +837,7 @@ function Bt({ type: t, color: n }) {
     /* @__PURE__ */ e("line", { x1: "9", y1: "18", x2: "9", y2: "20", stroke: n, strokeWidth: "1" }),
     /* @__PURE__ */ e("line", { x1: "12", y1: "18", x2: "12", y2: "20", stroke: n, strokeWidth: "1" }),
     /* @__PURE__ */ e("line", { x1: "15", y1: "18", x2: "15", y2: "20", stroke: n, strokeWidth: "1" })
-  ] }) : t === "mem" ? /* @__PURE__ */ d("svg", { width: 28, height: 28, viewBox: "0 0 24 24", fill: "none", children: [
+  ] }) : t === "mem" ? /* @__PURE__ */ c("svg", { width: 28, height: 28, viewBox: "0 0 24 24", fill: "none", children: [
     /* @__PURE__ */ e("rect", { x: "7", y: "3", width: "10", height: "18", rx: "1.5", stroke: n, strokeWidth: "1.5" }),
     /* @__PURE__ */ e(
       "rect",
@@ -883,7 +884,7 @@ function Bt({ type: t, color: n }) {
     /* @__PURE__ */ e("line", { x1: "17", y1: "7", x2: "19", y2: "7", stroke: n, strokeWidth: "0.8" }),
     /* @__PURE__ */ e("line", { x1: "17", y1: "11", x2: "19", y2: "11", stroke: n, strokeWidth: "0.8" }),
     /* @__PURE__ */ e("line", { x1: "17", y1: "15", x2: "19", y2: "15", stroke: n, strokeWidth: "0.8" })
-  ] }) : /* @__PURE__ */ d("svg", { width: 28, height: 28, viewBox: "0 0 24 24", fill: "none", children: [
+  ] }) : /* @__PURE__ */ c("svg", { width: 28, height: 28, viewBox: "0 0 24 24", fill: "none", children: [
     /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "8.5", stroke: n, strokeWidth: "1.5" }),
     /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "5.5", stroke: n, strokeWidth: "0.5", strokeDasharray: "2 2" }),
     /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "2", fill: `${n}55` }),
@@ -893,14 +894,14 @@ function Bt({ type: t, color: n }) {
     /* @__PURE__ */ e("line", { x1: "18", y1: "12", x2: "21", y2: "12", stroke: n, strokeWidth: "0.8" })
   ] });
 }
-const et = Ue(null), tt = Ue({ index: 0 });
-function Ei() {
-  return re(et);
+const ut = tt(null), bt = tt({ index: 0 });
+function Ni() {
+  return ge(ut);
 }
-function Ai() {
-  return re(tt);
+function Wi() {
+  return ge(bt);
 }
-function Ft({
+function Xt({
   children: t,
   logoUrl: n,
   viewState: o,
@@ -910,63 +911,66 @@ function Ft({
   drillAnimPhase: s,
   rotateY: l = 20,
   autoRotateComponents: h = !0,
-  componentScale: c = 0.35,
+  componentScale: d = 0.35,
   drillZoom: p = 3.3,
   autoRotateCarousel: f = !0,
-  carouselSpeed: g = 6e-3,
+  carouselSpeed: b = 6e-3,
   width: u = 950,
-  height: y = 790,
+  height: g = 790,
   onSelectSystem: m,
-  onBackgroundClick: v,
-  onComponentClick: x,
-  onCloseDrill: w,
-  selectedSystemStatus: b = "online",
-  selectedSystemDbSync: k = !0,
-  selectedSystemMetrics: T,
+  onBackgroundClick: w,
+  onComponentClick: v,
+  onCloseDrill: S,
+  onComponentUpdate: y,
+  selectedSystemStatus: x = "online",
+  selectedSystemDbSync: A = !0,
+  selectedSystemMetrics: k,
   selectedSystemAlerts: $
 }) {
-  const [S, N] = R(0);
-  Ae(() => {
-    let I;
+  const [H, L] = R(0);
+  ke(() => {
+    let D;
     if ((o === "compact" || o === "collapsing") && f) {
       const U = () => {
-        N((se) => se + g), I = requestAnimationFrame(U);
+        L((ne) => ne + b), D = requestAnimationFrame(U);
       };
-      I = requestAnimationFrame(U);
+      D = requestAnimationFrame(U);
     }
-    return () => cancelAnimationFrame(I);
-  }, [o, f, g]);
-  const B = j.Children.toArray(t), z = B.length, H = yt(() => ({
-    totalSystems: z,
-    carouselRotation: S,
+    return () => cancelAnimationFrame(D);
+  }, [o, f, b]);
+  const M = q.Children.toArray(t), K = M.length, Z = Tt(() => ({
+    totalSystems: K,
+    carouselRotation: H,
     viewState: o,
     animPhase: i,
     selectedSystem: r,
     selectedComponent: a,
     rotateY: l,
     autoRotateComponents: h,
-    componentScale: c,
+    componentScale: d,
     drillZoom: p,
     onSelectSystem: m,
-    onComponentClick: x,
+    onComponentClick: v,
+    onComponentUpdate: y,
     containerWidth: u
   }), [
-    z,
-    S,
+    K,
+    H,
     o,
     i,
     r,
     a,
     l,
     h,
-    c,
+    d,
     p,
     m,
-    x,
+    v,
+    y,
     u
-  ]), ae = B.map((I, U) => /* @__PURE__ */ e(tt.Provider, { value: { index: U }, children: I }, U)), le = o === "expanded" || o === "expanding" && i >= 4;
-  return /* @__PURE__ */ d(et.Provider, { value: H, children: [
-    /* @__PURE__ */ d("div", { style: { position: "relative", width: u, height: y, margin: "0 auto", flexShrink: 0 }, children: [
+  ]), ye = M.map((D, U) => /* @__PURE__ */ e(bt.Provider, { value: { index: U }, children: D }, U)), me = o === "expanded" || o === "expanding" && i >= 4;
+  return /* @__PURE__ */ c(ut.Provider, { value: Z, children: [
+    /* @__PURE__ */ c("div", { style: { position: "relative", width: u, height: g, margin: "0 auto", flexShrink: 0 }, children: [
       n && (o === "compact" || o === "collapsing") && /* @__PURE__ */ e(
         "img",
         {
@@ -987,32 +991,32 @@ function Ft({
           }
         }
       ),
-      ae
+      ye
     ] }),
-    r && /* @__PURE__ */ e("div", { onClick: (I) => I.stopPropagation(), children: /* @__PURE__ */ e(
-      Nt,
+    r && /* @__PURE__ */ e("div", { onClick: (D) => D.stopPropagation(), children: /* @__PURE__ */ e(
+      Ut,
       {
         name: r,
-        status: b,
-        dbSync: k,
-        visible: le && !a,
-        metrics: T,
+        status: x,
+        dbSync: A,
+        visible: me && !a,
+        metrics: k,
         alerts: $
       }
     ) }),
-    a && /* @__PURE__ */ e("div", { onClick: (I) => I.stopPropagation(), children: /* @__PURE__ */ e(
-      Mt,
+    a && /* @__PURE__ */ e("div", { onClick: (D) => D.stopPropagation(), children: /* @__PURE__ */ e(
+      Vt,
       {
         component: a,
-        onClose: w,
+        onClose: S,
         visible: s >= 0.3,
         sceneWidth: u,
-        sceneHeight: y
+        sceneHeight: g
       }
     ) })
   ] });
 }
-function Ht({
+function qt({
   x1: t,
   y1: n,
   x2: o,
@@ -1021,7 +1025,7 @@ function Ht({
   color: a = "#00e5ff",
   dur: s = "3s"
 }) {
-  return /* @__PURE__ */ d("g", { opacity: r ? 1 : 0, style: { transition: "opacity 0.6s ease" }, children: [
+  return /* @__PURE__ */ c("g", { opacity: r ? 1 : 0, style: { transition: "opacity 0.6s ease" }, children: [
     /* @__PURE__ */ e(
       "line",
       {
@@ -1059,7 +1063,7 @@ function Ht({
         )
       }
     ),
-    r && /* @__PURE__ */ d(Ee, { children: [
+    r && /* @__PURE__ */ c(Me, { children: [
       /* @__PURE__ */ e("circle", { r: "3", fill: a, opacity: 0.85, children: /* @__PURE__ */ e(
         "animateMotion",
         {
@@ -1079,14 +1083,14 @@ function Ht({
     ] })
   ] });
 }
-const Ut = [
+const Qt = [
   { scale: 1, op: 1, delay: "0.0s", bw: "2px", glow: 1 },
   { scale: 0.82, op: 0.88, delay: "0.5s", bw: "1.5px", glow: 0.7 },
   { scale: 0.64, op: 0.72, delay: "1.0s", bw: "1px", glow: 0.5 },
   { scale: 0.47, op: 0.58, delay: "1.5s", bw: "1px", glow: 0.35 },
   { scale: 0.3, op: 0.45, delay: "2.0s", bw: "1px", glow: 0.25 }
 ];
-function Yt({
+function Gt({
   children: t,
   size: n = 230,
   widthRatio: o = 1,
@@ -1094,13 +1098,13 @@ function Yt({
   label: r
 }) {
   const a = n * o;
-  return /* @__PURE__ */ d("div", { style: {
+  return /* @__PURE__ */ c("div", { style: {
     display: "flex",
     flexDirection: "column",
     alignItems: "center",
     position: "relative"
   }, children: [
-    /* @__PURE__ */ d("div", { style: {
+    /* @__PURE__ */ c("div", { style: {
       position: "relative",
       animation: "holo-float 4s ease-in-out infinite"
     }, children: [
@@ -1123,7 +1127,7 @@ function Yt({
       } }),
       t
     ] }),
-    /* @__PURE__ */ d("div", { style: {
+    /* @__PURE__ */ c("div", { style: {
       position: "relative",
       width: a,
       height: 88,
@@ -1195,7 +1199,7 @@ function Yt({
         animationDelay: "0.06s"
       } })
     ] }),
-    /* @__PURE__ */ d("div", { style: {
+    /* @__PURE__ */ c("div", { style: {
       position: "relative",
       width: a,
       height: n * 0.34,
@@ -1252,7 +1256,7 @@ function Yt({
         background: `radial-gradient(ellipse, ${i}88 0%, ${i}33 40%, transparent 72%)`,
         filter: "blur(12px)"
       } }),
-      Ut.map((s, l) => /* @__PURE__ */ e("div", { style: {
+      Qt.map((s, l) => /* @__PURE__ */ e("div", { style: {
         position: "absolute",
         width: a * s.scale,
         height: n * s.scale,
@@ -1295,8 +1299,8 @@ function Yt({
     }, children: r })
   ] });
 }
-const ue = Ue(null), Vt = "cubic-bezier(0.34, 1.56, 0.64, 1)", ct = 330, pt = 340, _t = 660;
-function xt({
+const Re = tt(null), Kt = "cubic-bezier(0.34, 1.56, 0.64, 1)", $t = 330, kt = 340, Zt = 660;
+function Lt({
   name: t,
   status: n = "online",
   connections: o = [],
@@ -1306,35 +1310,37 @@ function xt({
   _totalSystems: s,
   _carouselRotation: l,
   _viewState: h,
-  _animPhase: c,
+  _animPhase: d,
   _selectedSystem: p,
   _selectedComponent: f,
-  _rotateY: g,
+  _rotateY: b,
   _autoRotateComponents: u,
-  _componentScale: y,
+  _componentScale: g,
   _drillZoom: m,
-  _onSelectSystem: v,
-  _onComponentClick: x,
-  _containerWidth: w
+  _onSelectSystem: w,
+  _onComponentClick: v,
+  _onComponentUpdate: S,
+  _containerWidth: y
 }) {
-  const b = re(et), k = re(tt), T = a ?? k.index, $ = s ?? b?.totalSystems ?? 1, S = l ?? b?.carouselRotation ?? 0, N = h ?? b?.viewState ?? "compact", B = c ?? b?.animPhase ?? 0, z = p ?? b?.selectedSystem ?? null, H = f ?? b?.selectedComponent ?? null, ae = g ?? b?.rotateY ?? 20, le = u ?? b?.autoRotateComponents ?? !0, I = y ?? b?.componentScale ?? 0.35, U = m ?? b?.drillZoom ?? 3.3, se = v ?? b?.onSelectSystem, Ie = x ?? b?.onComponentClick, Oe = w ?? b?.containerWidth ?? 950, Y = z === t, L = Y && (N === "expanded" || N === "expanding" && B >= 1), Q = !L, Le = (Oe - _t) / 2, be = ct + Le, ge = T / $ * Math.PI * 2 + S, Ye = 420, Ve = 160, de = be + Math.cos(ge) * Ye, C = 450 + Math.sin(ge) * Ve, ce = Math.round(C), ee = !Y && (N === "expanding" || N === "expanded"), pe = ee ? 0 : 1, Z = Q ? 0.3 + (Math.sin(ge) + 1) * 0.1 : 1, V = Q ? Z : I, ye = N === "compact" || N === "collapsing" ? "none" : "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)", De = Y && H, _e = De ? U : 1, Ct = H?.ex ?? 330, Et = H?.ey ?? 300, { size: At = 90, color: Tt = "#00e5ff", widthRatio: It = 3 } = i ?? {}, Ot = {
+  const x = ge(ut), A = ge(bt), k = a ?? A.index, $ = s ?? x?.totalSystems ?? 1, H = l ?? x?.carouselRotation ?? 0, L = h ?? x?.viewState ?? "compact", M = d ?? x?.animPhase ?? 0, K = p ?? x?.selectedSystem ?? null, Z = f ?? x?.selectedComponent ?? null, ye = b ?? x?.rotateY ?? 20, me = u ?? x?.autoRotateComponents ?? !0, D = g ?? x?.componentScale ?? 0.35, U = m ?? x?.drillZoom ?? 3.3, ne = w ?? x?.onSelectSystem, Be = v ?? x?.onComponentClick, le = S ?? x?.onComponentUpdate, Fe = y ?? x?.containerWidth ?? 950, J = K === t, z = J && (L === "expanded" || L === "expanding" && M >= 1), _ = !z, se = (Fe - Zt) / 2, de = $t + se, Ce = k / $ * Math.PI * 2 + H, it = 420, nt = 160, xe = de + Math.cos(Ce) * it, ce = 450 + Math.sin(Ce) * nt, ot = Math.round(ce), T = !J && (L === "expanding" || L === "expanded"), j = T ? 0 : 1, oe = _ ? 0.3 + (Math.sin(Ce) + 1) * 0.1 : 1, ee = _ ? oe : D, re = L === "compact" || L === "collapsing" ? "none" : "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)", ve = J && Z, ae = ve ? U : 1, pe = Z?.ex ?? 330, B = Z?.ey ?? 300, { size: rt = 90, color: at = "#00e5ff", widthRatio: Ye = 3 } = i ?? {}, we = {
     name: t,
-    isSelected: Y,
-    isExpandedPos: L,
-    isCompact: Q,
-    animPhase: B,
-    compactCx: de,
-    compactCy: C,
-    groupScale: Z,
-    effectiveScale: V,
-    transitionValue: ye,
-    rotateY: ae,
-    autoRotateComponents: le,
-    onComponentClick: Ie,
-    selectedComponentName: H?.name ?? null,
-    expandedOffsetX: Le
+    isSelected: J,
+    isExpandedPos: z,
+    isCompact: _,
+    animPhase: M,
+    compactCx: xe,
+    compactCy: ce,
+    groupScale: oe,
+    effectiveScale: ee,
+    transitionValue: re,
+    rotateY: ye,
+    autoRotateComponents: me,
+    onComponentClick: Be,
+    onComponentUpdate: le,
+    selectedComponentName: Z?.name ?? null,
+    expandedOffsetX: se
   };
-  return /* @__PURE__ */ e(ue.Provider, { value: Ot, children: /* @__PURE__ */ d(
+  return /* @__PURE__ */ e(Re.Provider, { value: we, children: /* @__PURE__ */ c(
     "div",
     {
       style: {
@@ -1344,21 +1350,21 @@ function xt({
         width: "100%",
         height: "100%",
         pointerEvents: "none",
-        opacity: pe,
-        transition: `opacity 0.8s ease, filter 0.5s ease, transform 0.6s ${Vt}`,
-        filter: Q && Math.sin(ge) < -0.5 ? "brightness(0.5) blur(2px)" : "none",
-        zIndex: Y ? 500 : ee ? 0 : ce,
-        transformOrigin: `${be}px ${pt}px`,
-        transform: De ? `translate(${-(Ct - ct) * _e}px, ${-(Et - pt) * _e}px) scale(${_e})` : "none"
+        opacity: j,
+        transition: `opacity 0.8s ease, filter 0.5s ease, transform 0.6s ${Kt}`,
+        filter: _ && Math.sin(Ce) < -0.5 ? "brightness(0.5) blur(2px)" : "none",
+        zIndex: J ? 500 : T ? 0 : ot,
+        transformOrigin: `${de}px ${kt}px`,
+        transform: ve ? `translate(${-(pe - $t) * ae}px, ${-(B - kt) * ae}px) scale(${ae})` : "none"
       },
       children: [
-        Q && !ee && /* @__PURE__ */ e(
+        _ && !T && /* @__PURE__ */ e(
           "div",
           {
             style: {
               position: "absolute",
-              left: de,
-              top: C,
+              left: xe,
+              top: ce,
               width: 160,
               height: 180,
               transform: "translate(-50%, -80%)",
@@ -1366,25 +1372,25 @@ function xt({
               cursor: "pointer",
               zIndex: 101
             },
-            onClick: (J) => {
-              J.stopPropagation(), se?.(t);
+            onClick: (F) => {
+              F.stopPropagation(), ne?.(t);
             }
           }
         ),
-        Q && (n === "warning" || n === "critical") && /* @__PURE__ */ e(
+        _ && (n === "warning" || n === "critical") && /* @__PURE__ */ e(
           "div",
           {
             style: {
               position: "absolute",
-              left: de,
-              top: C - 200,
-              transform: `translate(-50%, -50%) scale(${Z})`,
+              left: xe,
+              top: ce - 200,
+              transform: `translate(-50%, -50%) scale(${oe})`,
               zIndex: 110,
               pointerEvents: "none",
               animation: "holo-led-blink 1.5s infinite",
               filter: `drop-shadow(0 0 10px ${n === "critical" ? "#ff2255" : "#ff8c00"})`
             },
-            children: /* @__PURE__ */ d("svg", { width: "48", height: "48", viewBox: "0 0 28 28", fill: "none", children: [
+            children: /* @__PURE__ */ c("svg", { width: "48", height: "48", viewBox: "0 0 28 28", fill: "none", children: [
               /* @__PURE__ */ e(
                 "path",
                 {
@@ -1424,13 +1430,13 @@ function xt({
           {
             style: {
               position: "absolute",
-              left: L ? be : de,
-              top: L ? 48 : C - 180,
-              transform: `translate(-50%, -50%) scale(${L ? 1.2 : Z * 1.5})`,
+              left: z ? de : xe,
+              top: z ? 48 : ce - 180,
+              transform: `translate(-50%, -50%) scale(${z ? 1.2 : oe * 1.5})`,
               opacity: 1,
               pointerEvents: "none",
               zIndex: 100,
-              transition: ye,
+              transition: re,
               fontSize: 36,
               fontWeight: 700,
               letterSpacing: "0.18em",
@@ -1450,25 +1456,25 @@ function xt({
             style: {
               position: "absolute",
               top: 0,
-              left: L ? Le : 0,
+              left: z ? se : 0,
               width: 660,
               height: 640,
               pointerEvents: "none",
               zIndex: 0,
-              transition: ye
+              transition: re
             },
-            children: o.map((J, Lt) => /* @__PURE__ */ e(
-              Ht,
+            children: o.map((F, Ve) => /* @__PURE__ */ e(
+              qt,
               {
-                x1: J.from[0],
-                y1: J.from[1],
-                x2: J.to[0],
-                y2: J.to[1],
-                show: Y && B >= (J.visibleAtPhase ?? 0),
-                color: J.color,
-                dur: J.duration
+                x1: F.from[0],
+                y1: F.from[1],
+                x2: F.to[0],
+                y2: F.to[1],
+                show: J && M >= (F.visibleAtPhase ?? 0),
+                color: F.color,
+                dur: F.duration
               },
-              Lt
+              Ve
             ))
           }
         ),
@@ -1477,13 +1483,13 @@ function xt({
           {
             style: {
               position: "absolute",
-              left: L ? be : de,
-              top: L ? 570 : C + 70,
-              transform: `translate(-50%, -50%) scaleX(${L ? 1 : 0.4}) scaleY(${L ? 1 : 0.6}) scale(${L ? 1 : Z})`,
-              transition: ye,
+              left: z ? de : xe,
+              top: z ? 570 : ce + 70,
+              transform: `translate(-50%, -50%) scaleX(${z ? 1 : 0.4}) scaleY(${z ? 1 : 0.6}) scale(${z ? 1 : oe})`,
+              transition: re,
               zIndex: 1
             },
-            children: /* @__PURE__ */ e(Yt, { size: At, color: Tt, widthRatio: It, children: /* @__PURE__ */ e("div", { className: "base-hotspot" }) })
+            children: /* @__PURE__ */ e(Gt, { size: rt, color: at, widthRatio: Ye, children: /* @__PURE__ */ e("div", { className: "base-hotspot" }) })
           }
         ),
         r
@@ -1491,7 +1497,7 @@ function xt({
     }
   ) });
 }
-function W({
+function N({
   ex: t,
   ey: n,
   status: o,
@@ -1501,23 +1507,23 @@ function W({
   offsetY: s,
   isVisible: l,
   align: h = "right",
-  internalRef: c
+  internalRef: d
 }) {
-  const p = re(ue), f = p?.expandedOffsetX ?? 0;
+  const p = ge(Re), f = p?.expandedOffsetX ?? 0;
   if (o === "online") return null;
-  const g = l && !!p?.isExpandedPos, u = P[o]?.color ?? P.warning.color, y = Math.abs(a) > Math.abs(s), m = t + f + (y ? Math.sign(a) * 45 : 0), v = n + (y ? 0 : Math.sign(s) * 40), x = t + f + a, w = n + s;
-  let b = "";
-  if (y) {
-    const S = m + (x - m) / 2;
-    b = `M ${m} ${v} L ${S} ${v} L ${S} ${w} L ${x} ${w}`;
+  const b = l && !!p?.isExpandedPos, u = C[o]?.color ?? C.warning.color, g = Math.abs(a) > Math.abs(s), m = t + f + (g ? Math.sign(a) * 45 : 0), w = n + (g ? 0 : Math.sign(s) * 40), v = t + f + a, S = n + s;
+  let y = "";
+  if (g) {
+    const $ = m + (v - m) / 2;
+    y = `M ${m} ${w} L ${$} ${w} L ${$} ${S} L ${v} ${S}`;
   } else {
-    const S = v + (w - v) / 2;
-    b = `M ${m} ${v} L ${m} ${S} L ${x} ${S} L ${x} ${w}`;
+    const $ = w + (S - w) / 2;
+    y = `M ${m} ${w} L ${m} ${$} L ${v} ${$} L ${v} ${S}`;
   }
-  let k = "translate(0, -50%)";
-  h === "left" && (k = "translate(-100%, -50%)"), h === "top" && (k = "translate(-50%, -100%)"), h === "bottom" && (k = "translate(-50%, 0)");
-  const T = h === "left" ? -8 : h === "right" ? 8 : 0, $ = h === "top" ? -8 : h === "bottom" ? 8 : 0;
-  return /* @__PURE__ */ d(
+  let x = "translate(0, -50%)";
+  h === "left" && (x = "translate(-100%, -50%)"), h === "top" && (x = "translate(-50%, -100%)"), h === "bottom" && (x = "translate(-50%, 0)");
+  const A = h === "left" ? -8 : h === "right" ? 8 : 0, k = h === "top" ? -8 : h === "bottom" ? 8 : 0;
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
@@ -1527,7 +1533,7 @@ function W({
         width: "100%",
         height: "100%",
         pointerEvents: "none",
-        opacity: g ? 1 : 0,
+        opacity: b ? 1 : 0,
         transition: "opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.8s",
         zIndex: 150
       },
@@ -1547,7 +1553,7 @@ function W({
             children: /* @__PURE__ */ e(
               "path",
               {
-                d: b,
+                d: y,
                 fill: "none",
                 stroke: u,
                 strokeWidth: "1.5",
@@ -1557,16 +1563,16 @@ function W({
             )
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
               position: "absolute",
-              left: x,
-              top: w,
-              transform: k,
-              marginLeft: T,
-              marginTop: $,
+              left: v,
+              top: S,
+              transform: x,
+              marginLeft: A,
+              marginTop: k,
               background: "repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(255,255,255,0.03) 2px, rgba(255,255,255,0.03) 4px), rgba(2, 8, 16, 0.82)",
               border: `1px solid ${u}55`,
               borderLeft: `2px solid ${u}`,
@@ -1580,7 +1586,7 @@ function W({
               boxShadow: `0 4px 12px rgba(0,0,0,0.4), 0 0 8px ${u}22 inset`
             },
             children: [
-              /* @__PURE__ */ d(
+              /* @__PURE__ */ c(
                 "div",
                 {
                   style: {
@@ -1614,7 +1620,7 @@ function W({
                           textTransform: "uppercase",
                           textShadow: `0 0 4px ${u}88`
                         },
-                        children: c ? `${i} · ${c}` : i
+                        children: d ? `${i} · ${d}` : i
                       }
                     )
                   ]
@@ -1638,7 +1644,7 @@ function W({
     }
   );
 }
-function A({
+function E({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -1648,74 +1654,90 @@ function A({
   label: s,
   subLabel: l,
   delay: h = "0s",
-  componentInfo: c,
+  componentInfo: d,
   visibleAtPhase: p = 0,
   fixedScale: f,
-  bare: g = !1,
+  bare: b = !1,
   alert: u
 }) {
-  const y = re(ue);
-  if (!y)
+  const g = ge(Re);
+  if (!g)
     throw new Error("ServiceNode must be used inside a <Service> component.");
   const {
     isExpandedPos: m,
-    animPhase: v,
-    compactCx: x,
-    compactCy: w,
-    groupScale: b,
-    effectiveScale: k,
-    transitionValue: T,
-    onComponentClick: $,
-    selectedComponentName: S,
-    expandedOffsetX: N
-  } = y, z = p === 0 || y.isSelected && v >= p ? 1 : 0, H = x + o.x, ae = w + o.y, le = m ? t + N : H, I = m ? n : ae, U = f !== void 0 ? f : y.isCompact ? b : k, se = !!c && !!S && c.name === S, Ie = c?.status ? P[c.status]?.color ?? a : a, Oe = c?.status === "offline" ? "#4a6a8a" : Ie, Y = c && m && $ ? () => $({
-    type: c.type,
-    name: c.name,
-    status: c.status,
-    ex: c.ex ?? t,
-    ey: c.ey ?? n,
-    context: c.context,
-    dialogMetrics: c.dialogMetrics,
-    subComponents: c.subComponents,
-    graphSeries: c.graphSeries
-  }) : void 0, L = c?.status ?? "online", Q = c?.name ?? s ?? "";
-  return /* @__PURE__ */ d(Ee, { children: [
+    animPhase: w,
+    compactCx: v,
+    compactCy: S,
+    groupScale: y,
+    effectiveScale: x,
+    transitionValue: A,
+    onComponentClick: k,
+    onComponentUpdate: $,
+    selectedComponentName: H,
+    expandedOffsetX: L
+  } = g, K = p === 0 || g.isSelected && w >= p ? 1 : 0, Z = v + o.x, ye = S + o.y, me = m ? t + L : Z, D = m ? n : ye, U = f !== void 0 ? f : g.isCompact ? y : x, ne = !!d && !!H && d.name === H, Be = d?.status ? C[d.status]?.color ?? a : a, le = d?.status === "offline" ? "#4a6a8a" : Be, Fe = d && m && k ? () => k({
+    type: d.type,
+    name: d.name,
+    status: d.status,
+    ex: d.ex ?? t,
+    ey: d.ey ?? n,
+    context: d.context,
+    dialogMetrics: d.dialogMetrics,
+    subComponents: d.subComponents,
+    graphSeries: d.graphSeries
+  }) : void 0, J = JSON.stringify(d?.context ?? {}), z = JSON.stringify(d?.dialogMetrics ?? []);
+  ke(() => {
+    !ne || !d || !$ || $({
+      type: d.type,
+      name: d.name,
+      status: d.status,
+      ex: d.ex ?? t,
+      ey: d.ey ?? n,
+      context: d.context,
+      dialogMetrics: d.dialogMetrics,
+      subComponents: d.subComponents,
+      graphSeries: d.graphSeries
+    });
+  }, [ne, d?.status, J, z]);
+  const _ = d?.status === "warning" || d?.status === "critical", se = d?.status ?? "online", de = d?.name ?? s ?? "";
+  return /* @__PURE__ */ c(Me, { children: [
     /* @__PURE__ */ e(
       "div",
       {
         style: {
           position: "absolute",
-          left: le,
-          top: I,
+          left: me,
+          top: D,
           transform: `translate(-50%, -50%) scale(${U})`,
-          opacity: z,
+          opacity: K,
           zIndex: i,
-          transition: T || "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)",
-          pointerEvents: m && z >= 0.5 ? "auto" : "none"
+          transition: A || "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)",
+          pointerEvents: m && K >= 0.5 ? "auto" : "none"
         },
-        children: g ? r : /* @__PURE__ */ e(
-          jt,
+        children: b ? r : /* @__PURE__ */ e(
+          Jt,
           {
-            statusColor: Oe,
+            statusColor: le,
             label: s,
             subLabel: l,
             delay: h,
             showLabels: m,
-            isCompact: y.isCompact,
-            onClick: Y,
-            isSelected: se,
+            isCompact: g.isCompact,
+            onClick: Fe,
+            isSelected: ne,
+            isAlerting: _,
             children: r
           }
         )
       }
     ),
     u && /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: t,
         ey: n,
-        status: L,
-        title: Q,
+        status: se,
+        title: de,
         msg: u.msg,
         offsetX: u.offsetX ?? 110,
         offsetY: u.offsetY ?? -30,
@@ -1726,7 +1748,7 @@ function A({
     )
   ] });
 }
-function jt({
+function Jt({
   children: t,
   statusColor: n,
   label: o,
@@ -1735,27 +1757,38 @@ function jt({
   showLabels: a = !0,
   isCompact: s = !1,
   onClick: l,
-  isSelected: h = !1
+  isSelected: h = !1,
+  isAlerting: d = !1
 }) {
-  const [c, p] = R(!1), f = h ? `brightness(1.5) drop-shadow(0 0 24px ${n}cc) drop-shadow(0 0 8px ${n}88)` : c && l ? `brightness(1.2) drop-shadow(0 0 12px ${n}77)` : "";
-  return /* @__PURE__ */ d(
+  const [p, f] = R(!1), b = h ? `brightness(1.5) drop-shadow(0 0 24px ${n}cc) drop-shadow(0 0 8px ${n}88)` : p && l ? `brightness(1.2) drop-shadow(0 0 12px ${n}77)` : "";
+  return /* @__PURE__ */ c(
     "div",
     {
       className: `float-node${l ? " float-node--interactive" : ""}`,
-      onClick: (g) => {
-        l && (g.stopPropagation(), l());
+      onClick: (u) => {
+        l && (u.stopPropagation(), l());
       },
       style: {
         cursor: l ? "pointer" : void 0,
         transition: "filter 0.3s ease",
-        filter: f
+        filter: b
       },
-      onMouseEnter: () => p(!0),
-      onMouseLeave: () => p(!1),
+      onMouseEnter: () => f(!0),
+      onMouseLeave: () => f(!1),
       role: l ? "button" : void 0,
       title: l ? "Click to inspect internal components" : void 0,
       children: [
-        /* @__PURE__ */ d("div", { className: "float-body", style: { animationDelay: r }, children: [
+        d && /* @__PURE__ */ e(
+          "div",
+          {
+            className: "node-alert-glow",
+            style: {
+              "--pulse-color": n,
+              boxShadow: `0 0 20px ${n}, 0 0 40px ${n}66`
+            }
+          }
+        ),
+        /* @__PURE__ */ c("div", { className: "float-body", style: { animationDelay: r }, children: [
           /* @__PURE__ */ e(
             "div",
             {
@@ -1766,11 +1799,11 @@ function jt({
               }
             }
           ),
-          /* @__PURE__ */ e("div", { style: s ? { background: "#040c1a", borderRadius: 2 } : void 0, children: s && j.isValidElement(t) ? j.cloneElement(t, {
+          /* @__PURE__ */ e("div", { style: s ? { background: "#040c1a", borderRadius: 2 } : void 0, children: s && q.isValidElement(t) ? q.cloneElement(t, {
             _compact: !0
           }) : t })
         ] }),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -1787,10 +1820,10 @@ function jt({
     }
   );
 }
-function vt({ synced: t, latencyMs: n }) {
+function It({ synced: t, latencyMs: n }) {
   const o = t ? "#00ff88" : "#ff8c00";
-  return /* @__PURE__ */ d("div", { className: "sync-bridge", children: [
-    /* @__PURE__ */ d("div", { className: "sync-arrows", children: [
+  return /* @__PURE__ */ c("div", { className: "sync-bridge", children: [
+    /* @__PURE__ */ c("div", { className: "sync-arrows", children: [
       /* @__PURE__ */ e("span", { style: { color: o, fontSize: 10, lineHeight: 1 }, children: "◄" }),
       /* @__PURE__ */ e(
         "div",
@@ -1815,15 +1848,15 @@ function vt({ synced: t, latencyMs: n }) {
         children: t ? "SYNCED" : "LAG"
       }
     ),
-    /* @__PURE__ */ d("div", { className: "sync-latency", style: { color: o + "88" }, children: [
+    /* @__PURE__ */ c("div", { className: "sync-latency", style: { color: o + "88" }, children: [
       n,
       "ms ",
       t ? "replication" : "behind"
     ] })
   ] });
 }
-const te = 140, _ = 240, oe = 160, me = Je(te, _, oe);
-function Xt({
+const fe = 140, X = 240, be = 160, Pe = ht(fe, X, be);
+function ei({
   cfg: t,
   name: n,
   cpuLoad: o,
@@ -1832,19 +1865,19 @@ function Xt({
   compact: a,
   brandLabel: s
 }) {
-  const l = Math.ceil(o / 100 * 3), h = r === "offline" ? "#4a6a8a" : t.color, c = [
+  const l = Math.ceil(o / 100 * 3), h = r === "offline" ? "#4a6a8a" : t.color, d = [
     { color: t.color, on: r !== "offline", label: "PWR" },
     { color: t.color, on: r === "online" || r === "warning", label: "NET" },
     { color: t.color, on: o > 15, label: "DSK" },
     { color: r === "critical" ? "#ff2255" : t.color, on: r === "critical", label: "FLT" }
   ];
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: te,
-        height: _,
-        background: a ? Te : Ze,
+        width: fe,
+        height: X,
+        background: a ? ze : ft,
         position: "relative",
         overflow: "hidden",
         fontFamily: "'Courier New', monospace",
@@ -1866,7 +1899,7 @@ function Xt({
             }
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -1881,7 +1914,7 @@ function Xt({
               gap: 7
             },
             children: [
-              /* @__PURE__ */ d("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
+              /* @__PURE__ */ c("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
                 /* @__PURE__ */ e("span", { style: { fontSize: 7, color: t.color + "55", letterSpacing: "0.22em" }, children: s }),
                 /* @__PURE__ */ e(
                   "div",
@@ -1897,7 +1930,7 @@ function Xt({
                       alignItems: "center",
                       justifyContent: "center"
                     },
-                    children: /* @__PURE__ */ d("svg", { width: "9", height: "9", viewBox: "0 0 10 10", fill: "none", children: [
+                    children: /* @__PURE__ */ c("svg", { width: "9", height: "9", viewBox: "0 0 10 10", fill: "none", children: [
                       /* @__PURE__ */ e("path", { d: "M5 1.5v3", stroke: t.color, strokeWidth: "1.4", strokeLinecap: "round" }),
                       /* @__PURE__ */ e(
                         "path",
@@ -1912,7 +1945,7 @@ function Xt({
                   }
                 )
               ] }),
-              /* @__PURE__ */ d("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
+              /* @__PURE__ */ c("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
                 /* @__PURE__ */ e(
                   "span",
                   {
@@ -1925,7 +1958,7 @@ function Xt({
                     children: n
                   }
                 ),
-                /* @__PURE__ */ e("div", { style: { display: "flex", gap: 5 }, children: c.map((p, f) => /* @__PURE__ */ e(
+                /* @__PURE__ */ e("div", { style: { display: "flex", gap: 5 }, children: d.map((p, f) => /* @__PURE__ */ e(
                   "div",
                   {
                     style: {
@@ -1956,7 +1989,7 @@ function Xt({
             }
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -2005,8 +2038,8 @@ function Xt({
           }
         ),
         Array.from({ length: 3 }, (p, f) => {
-          const g = f < l;
-          return /* @__PURE__ */ d(
+          const b = f < l;
+          return /* @__PURE__ */ c(
             "div",
             {
               style: {
@@ -2032,8 +2065,8 @@ function Xt({
                       height: 5,
                       borderRadius: "50%",
                       flexShrink: 0,
-                      background: g ? t.color : "#08142a",
-                      boxShadow: g ? `0 0 6px ${t.color}, 0 0 12px ${t.color}66` : "none"
+                      background: b ? t.color : "#08142a",
+                      boxShadow: b ? `0 0 6px ${t.color}, 0 0 12px ${t.color}66` : "none"
                     }
                   }
                 ),
@@ -2049,7 +2082,7 @@ function Xt({
                       position: "relative",
                       overflow: "hidden"
                     },
-                    children: g && /* @__PURE__ */ e(
+                    children: b && /* @__PURE__ */ e(
                       "div",
                       {
                         style: {
@@ -2096,7 +2129,7 @@ function Xt({
             }
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -2235,13 +2268,13 @@ function Xt({
     }
   );
 }
-function qt() {
-  return /* @__PURE__ */ d(
+function ti() {
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: te,
-        height: _,
+        width: fe,
+        height: X,
         background: "linear-gradient(180deg, #040c1a 0%, #030810 100%)",
         position: "relative",
         overflow: "hidden",
@@ -2349,18 +2382,18 @@ function qt() {
     }
   );
 }
-function ft({
+function Rt({
   side: t,
   color: n,
   brandLabel: o
 }) {
   const i = t === "right";
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: oe,
-        height: _,
+        width: be,
+        height: X,
         background: i ? "linear-gradient(90deg, #040c1c 0%, #071428 60%, #040c1c 100%)" : "linear-gradient(90deg, #040c1c 0%, #071428 40%, #040c1c 100%)",
         position: "relative",
         overflow: "hidden"
@@ -2379,13 +2412,13 @@ function ft({
             }
           }
         ),
-        [8, _ - 20].map((r) => /* @__PURE__ */ e(
+        [8, X - 20].map((r) => /* @__PURE__ */ e(
           "div",
           {
             style: {
               position: "absolute",
               top: r,
-              left: i ? 10 : oe - 18,
+              left: i ? 10 : be - 18,
               width: 8,
               height: 8,
               borderRadius: 1,
@@ -2401,8 +2434,8 @@ function ft({
           {
             style: {
               position: "absolute",
-              top: _ * 0.35,
-              bottom: _ * 0.15,
+              top: X * 0.35,
+              bottom: X * 0.15,
               left: i ? 22 : 18,
               right: i ? 18 : 22,
               display: "flex",
@@ -2425,13 +2458,13 @@ function ft({
             ))
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
               position: "absolute",
-              top: _ * 0.18,
-              left: i ? 12 : oe - 78,
+              top: X * 0.18,
+              left: i ? 12 : be - 78,
               fontSize: 7,
               color: "#1a3050",
               letterSpacing: "0.2em",
@@ -2449,14 +2482,14 @@ function ft({
     }
   );
 }
-function Qt({ cpuLoad: t }) {
-  const n = t / 100, o = n > 0.75 ? "rgba(255,34,85,0.16)" : n > 0.45 ? "rgba(255,140,0,0.12)" : "rgba(0,229,255,0.08)", i = Math.floor((oe - 18) / 7);
-  return /* @__PURE__ */ d(
+function ii({ cpuLoad: t }) {
+  const n = t / 100, o = n > 0.75 ? "rgba(255,34,85,0.16)" : n > 0.45 ? "rgba(255,140,0,0.12)" : "rgba(0,229,255,0.08)", i = Math.floor((be - 18) / 7);
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: te,
-        height: oe,
+        width: fe,
+        height: be,
         background: "linear-gradient(180deg, #0c1c30 0%, #070f1e 40%, #040c1a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -2470,7 +2503,7 @@ function Qt({ cpuLoad: t }) {
               top: 0,
               left: 0,
               right: 0,
-              height: oe * 0.4,
+              height: be * 0.4,
               background: `radial-gradient(ellipse at 50% 0%, ${o} 0%, transparent 70%)`
             }
           }
@@ -2529,7 +2562,7 @@ function Qt({ cpuLoad: t }) {
     }
   );
 }
-function he({
+function $e({
   rotateX: t = -22,
   rotateY: n = 20,
   rotateZ: o = 0,
@@ -2539,29 +2572,29 @@ function he({
   name: s = "SRV-001",
   cpuLoad: l = 67,
   memLoad: h = 82,
-  brandLabel: c = "BUSAUD",
+  brandLabel: d = "BUSAUD",
   _compact: p
 }) {
-  const [f, g] = R(n), u = K(0), y = K(0);
-  Ae(() => {
+  const [f, b] = R(n), u = ie(0), g = ie(0);
+  ke(() => {
     if (!r) {
-      g(n);
+      b(n);
       return;
     }
-    const v = (x) => {
-      y.current && g((w) => w + (x - y.current) * 0.027), y.current = x, u.current = requestAnimationFrame(v);
+    const w = (v) => {
+      g.current && b((S) => S + (v - g.current) * 0.027), g.current = v, u.current = requestAnimationFrame(w);
     };
-    return u.current = requestAnimationFrame(v), () => {
-      cancelAnimationFrame(u.current), y.current = 0;
+    return u.current = requestAnimationFrame(w), () => {
+      cancelAnimationFrame(u.current), g.current = 0;
     };
   }, [r, n]);
-  const m = P[a] ?? P.online;
-  return /* @__PURE__ */ d(
+  const m = C[a] ?? C.online;
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: te * i,
-        height: _ * i,
+        width: fe * i,
+        height: X * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -2581,7 +2614,7 @@ function he({
               animation: "holo-led-blink 1.5s infinite",
               filter: `drop-shadow(0 0 10px ${m.color})`
             },
-            children: /* @__PURE__ */ d("svg", { width: "44", height: "44", viewBox: "0 0 28 28", fill: "none", children: [
+            children: /* @__PURE__ */ c("svg", { width: "44", height: "44", viewBox: "0 0 28 28", fill: "none", children: [
               /* @__PURE__ */ e(
                 "path",
                 {
@@ -2613,8 +2646,8 @@ function he({
           {
             style: {
               position: "absolute",
-              width: te * 1.4 * i,
-              height: _ * 0.8 * i,
+              width: fe * 1.4 * i,
+              height: X * 0.8 * i,
               background: `radial-gradient(ellipse, ${m.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(45 * i)}px)`,
               pointerEvents: "none",
@@ -2633,20 +2666,20 @@ function he({
               transform: `scale(${i})`,
               transformOrigin: "center center"
             },
-            children: /* @__PURE__ */ d(
+            children: /* @__PURE__ */ c(
               "div",
               {
                 style: {
-                  width: te,
-                  height: _,
+                  width: fe,
+                  height: X,
                   position: "relative",
                   transformStyle: "preserve-3d",
                   transform: `rotateX(${t}deg) rotateY(${f}deg) rotateZ(${o}deg)`,
                   transition: r ? "none" : "transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94)"
                 },
                 children: [
-                  /* @__PURE__ */ e("div", { style: me.front, children: /* @__PURE__ */ e(
-                    Xt,
+                  /* @__PURE__ */ e("div", { style: Pe.front, children: /* @__PURE__ */ e(
+                    ei,
                     {
                       cfg: m,
                       name: s,
@@ -2654,19 +2687,19 @@ function he({
                       memLoad: h,
                       status: a,
                       compact: p,
-                      brandLabel: c
+                      brandLabel: d
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: me.back, children: /* @__PURE__ */ e(qt, {}) }),
-                  /* @__PURE__ */ e("div", { style: me.left, children: /* @__PURE__ */ e(ft, { side: "left", color: m.color, brandLabel: c }) }),
-                  /* @__PURE__ */ e("div", { style: me.right, children: /* @__PURE__ */ e(ft, { side: "right", color: m.color, brandLabel: c }) }),
-                  /* @__PURE__ */ e("div", { style: me.top, children: /* @__PURE__ */ e(Qt, { cpuLoad: l }) }),
-                  /* @__PURE__ */ e("div", { style: me.bottom, children: /* @__PURE__ */ e(
+                  /* @__PURE__ */ e("div", { style: Pe.back, children: /* @__PURE__ */ e(ti, {}) }),
+                  /* @__PURE__ */ e("div", { style: Pe.left, children: /* @__PURE__ */ e(Rt, { side: "left", color: m.color, brandLabel: d }) }),
+                  /* @__PURE__ */ e("div", { style: Pe.right, children: /* @__PURE__ */ e(Rt, { side: "right", color: m.color, brandLabel: d }) }),
+                  /* @__PURE__ */ e("div", { style: Pe.top, children: /* @__PURE__ */ e(ii, { cpuLoad: l }) }),
+                  /* @__PURE__ */ e("div", { style: Pe.bottom, children: /* @__PURE__ */ e(
                     "div",
                     {
                       style: {
-                        width: te,
-                        height: oe,
+                        width: fe,
+                        height: be,
                         background: "linear-gradient(180deg, #030710, #020508)"
                       }
                     }
@@ -2680,7 +2713,7 @@ function he({
     }
   );
 }
-function Ti({
+function Mi({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -2690,17 +2723,17 @@ function Ti({
   subLabel: s,
   color: l,
   delay: h,
-  visibleAtPhase: c,
+  visibleAtPhase: d,
   cpuLoad: p,
   memLoad: f,
-  brandLabel: g,
+  brandLabel: b,
   dialogMetrics: u,
-  subComponents: y,
+  subComponents: g,
   graphSeries: m,
-  alert: v
+  alert: w
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -2710,26 +2743,26 @@ function Ti({
       subLabel: s,
       color: l,
       delay: h,
-      visibleAtPhase: c,
+      visibleAtPhase: d,
       componentInfo: {
         type: "server",
         name: r,
         status: a,
         context: { cpuLoad: p, memLoad: f },
         dialogMetrics: u,
-        subComponents: y,
+        subComponents: g,
         graphSeries: m
       },
-      alert: v,
-      children: /* @__PURE__ */ e(he, { status: a, cpuLoad: p, memLoad: f, brandLabel: g })
+      alert: w,
+      children: /* @__PURE__ */ e($e, { status: a, cpuLoad: p, memLoad: f, brandLabel: b })
     }
   );
 }
-const Ke = 12, fe = 55, G = fe * 2, Se = 52, it = 10, je = 3 * Se + 2 * it, xe = 2 * Math.PI * fe / Ke, Xe = Array.from({ length: Ke }, (t, n) => n / Ke * 360);
-function qe(t) {
+const pt = 12, Se = 55, te = Se * 2, Oe = 52, gt = 10, lt = 3 * Oe + 2 * gt, Ee = 2 * Math.PI * Se / pt, st = Array.from({ length: pt }, (t, n) => n / pt * 360);
+function dt(t) {
   return Math.cos(t * Math.PI / 180) * 0.42 + 0.58;
 }
-function Gt({
+function ni({
   diskY: t,
   diskIdx: n,
   cfg: o,
@@ -2737,25 +2770,25 @@ function Gt({
   capacity: r,
   compact: a
 }) {
-  return /* @__PURE__ */ d(Ee, { children: [
-    Xe.map((s, l) => {
-      const h = qe(s), c = l === 0, p = Math.round(4 + h * 9), f = Math.round(12 + h * 22), g = Math.round(28 + h * 44), u = Math.round(h * 0.55 * 255).toString(16).padStart(2, "0");
+  return /* @__PURE__ */ c(Me, { children: [
+    st.map((s, l) => {
+      const h = dt(s), d = l === 0, p = Math.round(4 + h * 9), f = Math.round(12 + h * 22), b = Math.round(28 + h * 44), u = Math.round(h * 0.55 * 255).toString(16).padStart(2, "0");
       return /* @__PURE__ */ e(
         "div",
         {
           style: {
             position: "absolute",
-            width: xe,
-            height: Se,
-            left: (G - xe) / 2,
+            width: Ee,
+            height: Oe,
+            left: (te - Ee) / 2,
             top: t,
-            transform: `rotateY(${s}deg) translateZ(${fe}px)`,
+            transform: `rotateY(${s}deg) translateZ(${Se}px)`,
             backfaceVisibility: "hidden",
-            background: c ? a ? "linear-gradient(180deg, rgb(0,28,62), rgb(0,18,44))" : "linear-gradient(180deg, rgba(0,28,62,0.70), rgba(0,18,44,0.76))" : `rgb(${p},${f},${g})`,
+            background: d ? a ? "linear-gradient(180deg, rgb(0,28,62), rgb(0,18,44))" : "linear-gradient(180deg, rgba(0,28,62,0.70), rgba(0,18,44,0.76))" : `rgb(${p},${f},${b})`,
             borderLeft: `1px solid ${o.color}${u}`,
-            boxShadow: c ? `inset 0 0 18px ${o.color}28` : "none"
+            boxShadow: d ? `inset 0 0 18px ${o.color}28` : "none"
           },
-          children: c && /* @__PURE__ */ d(Ee, { children: [
+          children: d && /* @__PURE__ */ c(Me, { children: [
             /* @__PURE__ */ e(
               "div",
               {
@@ -2803,15 +2836,15 @@ function Gt({
         `p${n}${l}`
       );
     }),
-    /* @__PURE__ */ d(
+    /* @__PURE__ */ c(
       "div",
       {
         style: {
           position: "absolute",
-          width: G + 4,
-          height: G + 4,
+          width: te + 4,
+          height: te + 4,
           left: -2,
-          top: t - fe,
+          top: t - Se,
           borderRadius: "50%",
           transform: "rotateX(90deg)",
           backfaceVisibility: "hidden",
@@ -2869,10 +2902,10 @@ function Gt({
       {
         style: {
           position: "absolute",
-          width: G + 4,
-          height: G + 4,
+          width: te + 4,
+          height: te + 4,
           left: -2,
-          top: t + Se - fe,
+          top: t + Oe - Se,
           borderRadius: "50%",
           transform: "rotateX(-90deg)",
           backfaceVisibility: "hidden",
@@ -2896,18 +2929,18 @@ function Gt({
         )
       }
     ),
-    i && Xe.map((s, l) => {
-      const h = qe(s);
+    i && st.map((s, l) => {
+      const h = dt(s);
       return /* @__PURE__ */ e(
         "div",
         {
           style: {
             position: "absolute",
-            width: xe + 1.5,
+            width: Ee + 1.5,
             height: 6,
-            left: (G - xe - 1.5) / 2,
-            top: t + Se - 3,
-            transform: `rotateY(${s}deg) translateZ(${fe + 1.5}px)`,
+            left: (te - Ee - 1.5) / 2,
+            top: t + Oe - 3,
+            transform: `rotateY(${s}deg) translateZ(${Se + 1.5}px)`,
             backfaceVisibility: "hidden",
             background: o.color,
             boxShadow: `0 0 8px ${o.color}, 0 0 18px ${o.color}aa, 0 0 30px ${o.glow}`,
@@ -2917,20 +2950,20 @@ function Gt({
         `rng${n}${l}`
       );
     }),
-    i && Xe.map((s, l) => {
-      const h = qe(s), c = Math.round(2 + h * 4), p = Math.round(5 + h * 10), f = Math.round(12 + h * 20);
+    i && st.map((s, l) => {
+      const h = dt(s), d = Math.round(2 + h * 4), p = Math.round(5 + h * 10), f = Math.round(12 + h * 20);
       return /* @__PURE__ */ e(
         "div",
         {
           style: {
             position: "absolute",
-            width: xe,
-            height: it,
-            left: (G - xe) / 2,
-            top: t + Se,
-            transform: `rotateY(${s}deg) translateZ(${fe}px)`,
+            width: Ee,
+            height: gt,
+            left: (te - Ee) / 2,
+            top: t + Oe,
+            transform: `rotateY(${s}deg) translateZ(${Se}px)`,
             backfaceVisibility: "hidden",
-            background: `rgb(${c},${p},${f})`
+            background: `rgb(${d},${p},${f})`
           }
         },
         `gap${n}${l}`
@@ -2938,7 +2971,7 @@ function Gt({
     })
   ] });
 }
-function Ne({
+function Ue({
   rotateX: t = -22,
   rotateY: n = -15,
   rotateZ: o = 0,
@@ -2950,26 +2983,26 @@ function Ne({
   // connections = 284,
   _compact: l
 }) {
-  const [h, c] = R(n), p = K(0), f = K(0);
-  Ae(() => {
+  const [h, d] = R(n), p = ie(0), f = ie(0);
+  ke(() => {
     if (!r) {
-      c(n);
+      d(n);
       return;
     }
-    const u = (y) => {
-      f.current && c((m) => m + (y - f.current) * 0.027), f.current = y, p.current = requestAnimationFrame(u);
+    const u = (g) => {
+      f.current && d((m) => m + (g - f.current) * 0.027), f.current = g, p.current = requestAnimationFrame(u);
     };
     return p.current = requestAnimationFrame(u), () => {
       cancelAnimationFrame(p.current), f.current = 0;
     };
   }, [r, n]);
-  const g = P[a] ?? P.online;
-  return /* @__PURE__ */ d(
+  const b = C[a] ?? C.online;
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: G * i,
-        height: je * i,
+        width: te * i,
+        height: lt * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -2989,7 +3022,7 @@ function Ne({
               animation: "holo-led-blink 1.5s infinite",
               filter: `drop-shadow(0 0 10px ${a === "critical" ? "#ff2255" : "#ff8c00"})`
             },
-            children: /* @__PURE__ */ d("svg", { width: "44", height: "44", viewBox: "0 0 28 28", fill: "none", children: [
+            children: /* @__PURE__ */ c("svg", { width: "44", height: "44", viewBox: "0 0 28 28", fill: "none", children: [
               /* @__PURE__ */ e(
                 "path",
                 {
@@ -3029,9 +3062,9 @@ function Ne({
           {
             style: {
               position: "absolute",
-              width: G * 2.8 * i,
-              height: je * 0.85 * i,
-              background: `radial-gradient(ellipse, ${g.glow} 0%, transparent 65%)`,
+              width: te * 2.8 * i,
+              height: lt * 0.85 * i,
+              background: `radial-gradient(ellipse, ${b.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(50 * i)}px)`,
               pointerEvents: "none",
               top: "45%",
@@ -3053,19 +3086,19 @@ function Ne({
               "div",
               {
                 style: {
-                  width: G,
-                  height: je,
+                  width: te,
+                  height: lt,
                   position: "relative",
                   transformStyle: "preserve-3d",
                   transform: `rotateX(${t}deg) rotateY(${h}deg) rotateZ(${o}deg)`,
                   transition: r ? "none" : "transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94)"
                 },
                 children: [0, 1, 2].map((u) => /* @__PURE__ */ e(
-                  Gt,
+                  ni,
                   {
-                    diskY: u * (Se + it),
+                    diskY: u * (Oe + gt),
                     diskIdx: u,
-                    cfg: g,
+                    cfg: b,
                     hasRingBelow: u < 2,
                     capacity: s,
                     compact: l
@@ -3080,7 +3113,7 @@ function Ne({
     }
   );
 }
-function Ii({
+function zi({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -3090,15 +3123,15 @@ function Ii({
   subLabel: s,
   color: l,
   delay: h,
-  visibleAtPhase: c,
+  visibleAtPhase: d,
   capacity: p,
   dialogMetrics: f,
-  subComponents: g,
+  subComponents: b,
   graphSeries: u,
-  alert: y
+  alert: g
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -3108,23 +3141,23 @@ function Ii({
       subLabel: s,
       color: l,
       delay: h,
-      visibleAtPhase: c,
+      visibleAtPhase: d,
       componentInfo: {
         type: "database",
         name: r,
         status: a,
         context: { capacity: p },
         dialogMetrics: f,
-        subComponents: g,
+        subComponents: b,
         graphSeries: u
       },
-      alert: y,
-      children: /* @__PURE__ */ e(Ne, { status: a, capacity: p })
+      alert: g,
+      children: /* @__PURE__ */ e(Ue, { status: a, capacity: p })
     }
   );
 }
-function nt({ status: t = "online", scale: n = 1 }) {
-  const i = (P[t] ?? P.online).color;
+function yt({ status: t = "online", scale: n = 1 }) {
+  const i = (C[t] ?? C.online).color;
   return /* @__PURE__ */ e(
     "div",
     {
@@ -3135,7 +3168,7 @@ function nt({ status: t = "online", scale: n = 1 }) {
         alignItems: "center",
         justifyContent: "center"
       },
-      children: /* @__PURE__ */ d(
+      children: /* @__PURE__ */ c(
         "div",
         {
           style: {
@@ -3148,7 +3181,7 @@ function nt({ status: t = "online", scale: n = 1 }) {
             transformOrigin: "center center"
           },
           children: [
-            /* @__PURE__ */ d("div", { style: { position: "relative", animation: "holo-float 4s ease-in-out infinite" }, children: [
+            /* @__PURE__ */ c("div", { style: { position: "relative", animation: "holo-float 4s ease-in-out infinite" }, children: [
               /* @__PURE__ */ e(
                 "div",
                 {
@@ -3166,7 +3199,7 @@ function nt({ status: t = "online", scale: n = 1 }) {
                   }
                 }
               ),
-              /* @__PURE__ */ d(
+              /* @__PURE__ */ c(
                 "svg",
                 {
                   width: "70",
@@ -3174,7 +3207,7 @@ function nt({ status: t = "online", scale: n = 1 }) {
                   viewBox: "0 0 70 75",
                   style: { display: "block", overflow: "visible" },
                   children: [
-                    /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ d("radialGradient", { id: `usr-glow-${t}`, cx: "50%", cy: "45%", r: "55%", children: [
+                    /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ c("radialGradient", { id: `usr-glow-${t}`, cx: "50%", cy: "45%", r: "55%", children: [
                       /* @__PURE__ */ e("stop", { offset: "0%", stopColor: i, stopOpacity: "0.12" }),
                       /* @__PURE__ */ e("stop", { offset: "100%", stopColor: i, stopOpacity: "0" })
                     ] }) }),
@@ -3235,7 +3268,7 @@ function nt({ status: t = "online", scale: n = 1 }) {
     }
   );
 }
-function Oi({
+function Bi({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -3246,7 +3279,7 @@ function Oi({
   visibleAtPhase: l
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -3254,12 +3287,12 @@ function Oi({
       zIndex: i,
       color: s,
       visibleAtPhase: l,
-      children: /* @__PURE__ */ e(nt, { status: r, scale: a })
+      children: /* @__PURE__ */ e(yt, { status: r, scale: a })
     }
   );
 }
-const ie = 190, X = 72, $e = 120, ve = Je(ie, X, $e);
-function Kt({
+const he = 190, Q = 72, Le = 120, Ae = ht(he, Q, Le);
+function oi({
   cfg: t,
   name: n,
   traffic: o,
@@ -3267,13 +3300,13 @@ function Kt({
   compact: r
 }) {
   const a = Math.ceil(o / 100 * 8), s = Array(8).fill(t.color);
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: ie,
-        height: X,
-        background: r ? Te : Ze,
+        width: he,
+        height: Q,
+        background: r ? ze : ft,
         position: "relative",
         overflow: "hidden",
         fontFamily: "'Courier New', monospace",
@@ -3295,7 +3328,7 @@ function Kt({
             }
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -3344,7 +3377,7 @@ function Kt({
             ]
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -3359,15 +3392,15 @@ function Kt({
             },
             children: [
               /* @__PURE__ */ e("div", { style: { display: "flex", gap: 3, alignItems: "center" }, children: Array.from({ length: 8 }, (l, h) => {
-                const c = h < a, p = s[h];
-                return /* @__PURE__ */ d(
+                const d = h < a, p = s[h];
+                return /* @__PURE__ */ c(
                   "div",
                   {
                     style: {
                       width: 14,
                       height: 24,
                       background: "#03070f",
-                      border: `1px solid ${c ? p + "66" : "#1a2d40"}`,
+                      border: `1px solid ${d ? p + "66" : "#1a2d40"}`,
                       borderRadius: 1.5,
                       display: "flex",
                       flexDirection: "column",
@@ -3384,8 +3417,8 @@ function Kt({
                             width: 4,
                             height: 4,
                             borderRadius: "50%",
-                            background: c ? p : "#0a1830",
-                            boxShadow: c ? `0 0 5px ${p}, 0 0 10px ${p}88` : "none"
+                            background: d ? p : "#0a1830",
+                            boxShadow: d ? `0 0 5px ${p}, 0 0 10px ${p}88` : "none"
                           }
                         }
                       ),
@@ -3408,9 +3441,9 @@ function Kt({
                             width: 4,
                             height: 4,
                             borderRadius: "50%",
-                            background: c ? t.color : "#0a1830",
-                            boxShadow: c ? `0 0 5px ${t.color}` : "none",
-                            animation: c ? "holo-led-blink 1.8s linear infinite" : "none",
+                            background: d ? t.color : "#0a1830",
+                            boxShadow: d ? `0 0 5px ${t.color}` : "none",
+                            animation: d ? "holo-led-blink 1.8s linear infinite" : "none",
                             animationDelay: `${h * 0.2}s`
                           }
                         }
@@ -3430,11 +3463,11 @@ function Kt({
                   }
                 }
               ),
-              /* @__PURE__ */ d("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 5 }, children: [
-                /* @__PURE__ */ d("div", { children: [
-                  /* @__PURE__ */ d("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 2 }, children: [
+              /* @__PURE__ */ c("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 5 }, children: [
+                /* @__PURE__ */ c("div", { children: [
+                  /* @__PURE__ */ c("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 2 }, children: [
                     /* @__PURE__ */ e("span", { style: { fontSize: 6, color: "#2a5070", letterSpacing: "0.1em" }, children: "TRAFFIC" }),
-                    /* @__PURE__ */ d("span", { style: { fontSize: 6, color: t.color }, children: [
+                    /* @__PURE__ */ c("span", { style: { fontSize: 6, color: t.color }, children: [
                       o,
                       "%"
                     ] })
@@ -3464,9 +3497,9 @@ function Kt({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ d("div", { style: { display: "flex", justifyContent: "space-between" }, children: [
+                /* @__PURE__ */ c("div", { style: { display: "flex", justifyContent: "space-between" }, children: [
                   /* @__PURE__ */ e("span", { style: { fontSize: 6, color: "#2a5070", letterSpacing: "0.1em" }, children: "ROUTES" }),
-                  /* @__PURE__ */ d("span", { style: { fontSize: 6, color: t.color }, children: [
+                  /* @__PURE__ */ c("span", { style: { fontSize: 6, color: t.color }, children: [
                     i,
                     " active"
                   ] })
@@ -3494,9 +3527,9 @@ function Kt({
               { label: "HTTP", val: Math.round(o * 12.4), unit: "req/s" },
               { label: "HTTPS", val: Math.round(o * 8.6), unit: "req/s" },
               { label: "WS", val: Math.round(i * 3), unit: "conn" }
-            ].map((l) => /* @__PURE__ */ d("div", { style: { display: "flex", gap: 3 }, children: [
+            ].map((l) => /* @__PURE__ */ c("div", { style: { display: "flex", gap: 3 }, children: [
               /* @__PURE__ */ e("span", { style: { fontSize: 6, color: "#1e3a5a", letterSpacing: "0.08em" }, children: l.label }),
-              /* @__PURE__ */ d("span", { style: { fontSize: 6, color: t.color + "88" }, children: [
+              /* @__PURE__ */ c("span", { style: { fontSize: 6, color: t.color + "88" }, children: [
                 l.val,
                 " ",
                 l.unit
@@ -3521,13 +3554,13 @@ function Kt({
     }
   );
 }
-function Zt() {
-  return /* @__PURE__ */ d(
+function ri() {
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: ie,
-        height: X,
+        width: he,
+        height: Q,
         background: "linear-gradient(180deg, #040c1a, #030810)",
         position: "relative",
         overflow: "hidden",
@@ -3542,7 +3575,7 @@ function Zt() {
           {
             style: {
               width: 40,
-              height: X - 16,
+              height: Q - 16,
               background: "#020710",
               border: "1px solid #1a2d40",
               borderRadius: 2,
@@ -3598,7 +3631,7 @@ function Zt() {
             style: {
               marginLeft: "auto",
               width: 12,
-              height: X - 16,
+              height: Q - 16,
               background: "#020710",
               border: "1px solid #1a3050",
               borderRadius: 1
@@ -3609,13 +3642,13 @@ function Zt() {
     }
   );
 }
-function ht({ side: t, color: n }) {
-  return /* @__PURE__ */ d(
+function Ct({ side: t, color: n }) {
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: $e,
-        height: X,
+        width: Le,
+        height: Q,
         background: t === "right" ? "linear-gradient(90deg, #04091a 0%, #071428 60%, #040c1c 100%)" : "linear-gradient(90deg, #040c1c 0%, #071428 40%, #04091a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -3639,8 +3672,8 @@ function ht({ side: t, color: n }) {
           {
             style: {
               position: "absolute",
-              top: X * 0.25,
-              bottom: X * 0.25,
+              top: Q * 0.25,
+              bottom: Q * 0.25,
               left: 14,
               right: 14,
               display: "flex",
@@ -3666,14 +3699,14 @@ function ht({ side: t, color: n }) {
     }
   );
 }
-function Jt({ traffic: t }) {
-  const n = Math.floor(($e - 14) / 7);
-  return /* @__PURE__ */ d(
+function ai({ traffic: t }) {
+  const n = Math.floor((Le - 14) / 7);
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: ie,
-        height: $e,
+        width: he,
+        height: Le,
         background: "linear-gradient(180deg, #0c1c30 0%, #07101e 40%, #040c1a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -3687,7 +3720,7 @@ function Jt({ traffic: t }) {
               top: 0,
               left: 0,
               right: 0,
-              height: $e * 0.35,
+              height: Le * 0.35,
               background: `radial-gradient(ellipse at 50% 0%,
           ${t > 70 ? "rgba(255,34,85,0.14)" : "rgba(0,229,255,0.08)"} 0%,
           transparent 70%)`
@@ -3725,7 +3758,7 @@ function Jt({ traffic: t }) {
     }
   );
 }
-function ot({
+function mt({
   rotateX: t = -20,
   rotateY: n = 20,
   rotateZ: o = 0,
@@ -3735,28 +3768,28 @@ function ot({
   name: s = "WEB-DISP-01",
   traffic: l = 78,
   activeRoutes: h = 12,
-  _compact: c
+  _compact: d
 }) {
-  const [p, f] = R(n), g = K(0), u = K(0);
-  Ae(() => {
+  const [p, f] = R(n), b = ie(0), u = ie(0);
+  ke(() => {
     if (!r) {
       f(n);
       return;
     }
-    const m = (v) => {
-      u.current && f((x) => x + (v - u.current) * 0.027), u.current = v, g.current = requestAnimationFrame(m);
+    const m = (w) => {
+      u.current && f((v) => v + (w - u.current) * 0.027), u.current = w, b.current = requestAnimationFrame(m);
     };
-    return g.current = requestAnimationFrame(m), () => {
-      cancelAnimationFrame(g.current), u.current = 0;
+    return b.current = requestAnimationFrame(m), () => {
+      cancelAnimationFrame(b.current), u.current = 0;
     };
   }, [r, n]);
-  const y = P[a] ?? P.online;
-  return /* @__PURE__ */ d(
+  const g = C[a] ?? C.online;
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: ie * i,
-        height: X * i,
+        width: he * i,
+        height: Q * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -3776,7 +3809,7 @@ function ot({
               animation: "holo-led-blink 1.5s infinite",
               filter: `drop-shadow(0 0 10px ${a === "critical" ? "#ff2255" : "#ff8c00"})`
             },
-            children: /* @__PURE__ */ d("svg", { width: "44", height: "44", viewBox: "0 0 28 28", fill: "none", children: [
+            children: /* @__PURE__ */ c("svg", { width: "44", height: "44", viewBox: "0 0 28 28", fill: "none", children: [
               /* @__PURE__ */ e(
                 "path",
                 {
@@ -3816,9 +3849,9 @@ function ot({
           {
             style: {
               position: "absolute",
-              width: ie * 1.3 * i,
-              height: X * 2 * i,
-              background: `radial-gradient(ellipse, ${y.glow} 0%, transparent 65%)`,
+              width: he * 1.3 * i,
+              height: Q * 2 * i,
+              background: `radial-gradient(ellipse, ${g.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(40 * i)}px)`,
               pointerEvents: "none",
               top: "40%",
@@ -3836,33 +3869,33 @@ function ot({
               transform: `scale(${i})`,
               transformOrigin: "center center"
             },
-            children: /* @__PURE__ */ d(
+            children: /* @__PURE__ */ c(
               "div",
               {
                 style: {
-                  width: ie,
-                  height: X,
+                  width: he,
+                  height: Q,
                   position: "relative",
                   transformStyle: "preserve-3d",
                   transform: `rotateX(${t}deg) rotateY(${p}deg) rotateZ(${o}deg)`,
                   transition: r ? "none" : "transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94)"
                 },
                 children: [
-                  /* @__PURE__ */ e("div", { style: ve.front, children: /* @__PURE__ */ e(
-                    Kt,
+                  /* @__PURE__ */ e("div", { style: Ae.front, children: /* @__PURE__ */ e(
+                    oi,
                     {
-                      cfg: y,
+                      cfg: g,
                       name: s,
                       traffic: l,
                       activeRoutes: h,
-                      compact: c
+                      compact: d
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: ve.back, children: /* @__PURE__ */ e(Zt, {}) }),
-                  /* @__PURE__ */ e("div", { style: ve.left, children: /* @__PURE__ */ e(ht, { side: "left", color: y.color }) }),
-                  /* @__PURE__ */ e("div", { style: ve.right, children: /* @__PURE__ */ e(ht, { side: "right", color: y.color }) }),
-                  /* @__PURE__ */ e("div", { style: ve.top, children: /* @__PURE__ */ e(Jt, { traffic: l }) }),
-                  /* @__PURE__ */ e("div", { style: ve.bottom, children: /* @__PURE__ */ e("div", { style: { width: ie, height: $e, background: "#020508" } }) })
+                  /* @__PURE__ */ e("div", { style: Ae.back, children: /* @__PURE__ */ e(ri, {}) }),
+                  /* @__PURE__ */ e("div", { style: Ae.left, children: /* @__PURE__ */ e(Ct, { side: "left", color: g.color }) }),
+                  /* @__PURE__ */ e("div", { style: Ae.right, children: /* @__PURE__ */ e(Ct, { side: "right", color: g.color }) }),
+                  /* @__PURE__ */ e("div", { style: Ae.top, children: /* @__PURE__ */ e(ai, { traffic: l }) }),
+                  /* @__PURE__ */ e("div", { style: Ae.bottom, children: /* @__PURE__ */ e("div", { style: { width: he, height: Le, background: "#020508" } }) })
                 ]
               }
             )
@@ -3872,7 +3905,7 @@ function ot({
     }
   );
 }
-function Li({
+function Fi({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -3882,16 +3915,16 @@ function Li({
   subLabel: s,
   color: l,
   delay: h,
-  visibleAtPhase: c,
+  visibleAtPhase: d,
   traffic: p,
   activeRoutes: f,
-  dialogMetrics: g,
+  dialogMetrics: b,
   subComponents: u,
-  graphSeries: y,
+  graphSeries: g,
   alert: m
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -3901,28 +3934,28 @@ function Li({
       subLabel: s,
       color: l,
       delay: h,
-      visibleAtPhase: c,
+      visibleAtPhase: d,
       componentInfo: {
         type: "dispatcher",
         name: r,
         status: a,
         context: { traffic: p, activeRoutes: f },
-        dialogMetrics: g,
+        dialogMetrics: b,
         subComponents: u,
-        graphSeries: y
+        graphSeries: g
       },
       alert: m,
-      children: /* @__PURE__ */ e(ot, { status: a, traffic: p, activeRoutes: f })
+      children: /* @__PURE__ */ e(mt, { status: a, traffic: p, activeRoutes: f })
     }
   );
 }
-const ne = 190, q = 72, ke = 120, we = Je(ne, q, ke), ut = {
+const ue = 190, G = 72, Ie = 120, Te = ht(ue, G, Ie), Pt = {
   online: { color: "#bb55ff", glow: "rgba(187,85,255,0.50)" },
   warning: { color: "#ff8c00", glow: "rgba(255,140,0,0.50)" },
   critical: { color: "#ff2255", glow: "rgba(255,34,85,0.50)" },
   offline: { color: "#1e3a5a", glow: "rgba(30,58,90,0.25)" }
 };
-function ei({
+function li({
   cfg: t,
   name: n,
   queueDepth: o,
@@ -3931,13 +3964,13 @@ function ei({
   compact: a
 }) {
   const { color: s, glow: l } = t;
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: ne,
-        height: q,
-        background: a ? Te : Ze,
+        width: ue,
+        height: G,
+        background: a ? ze : ft,
         position: "relative",
         overflow: "hidden",
         fontFamily: "'Courier New', monospace",
@@ -3959,7 +3992,7 @@ function ei({
             }
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -4008,7 +4041,7 @@ function ei({
             ]
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -4022,9 +4055,9 @@ function ei({
               gap: 10
             },
             children: [
-              /* @__PURE__ */ e("div", { style: { display: "flex", gap: 3, alignItems: "center" }, children: Array.from({ length: 5 }, (h, c) => {
-                const p = c < r;
-                return /* @__PURE__ */ d(
+              /* @__PURE__ */ e("div", { style: { display: "flex", gap: 3, alignItems: "center" }, children: Array.from({ length: 5 }, (h, d) => {
+                const p = d < r;
+                return /* @__PURE__ */ c(
                   "div",
                   {
                     style: {
@@ -4074,13 +4107,13 @@ function ei({
                             background: p ? s : "#0a1830",
                             boxShadow: p ? `0 0 5px ${s}` : "none",
                             animation: p ? "holo-led-blink 2.2s linear infinite" : "none",
-                            animationDelay: `${c * 0.28}s`
+                            animationDelay: `${d * 0.28}s`
                           }
                         }
                       )
                     ]
                   },
-                  c
+                  d
                 );
               }) }),
               /* @__PURE__ */ e(
@@ -4093,11 +4126,11 @@ function ei({
                   }
                 }
               ),
-              /* @__PURE__ */ d("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 5 }, children: [
-                /* @__PURE__ */ d("div", { children: [
-                  /* @__PURE__ */ d("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 2 }, children: [
+              /* @__PURE__ */ c("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 5 }, children: [
+                /* @__PURE__ */ c("div", { children: [
+                  /* @__PURE__ */ c("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 2 }, children: [
                     /* @__PURE__ */ e("span", { style: { fontSize: 6, color: "#2a5070", letterSpacing: "0.1em" }, children: "QUEUE" }),
-                    /* @__PURE__ */ d("span", { style: { fontSize: 6, color: s }, children: [
+                    /* @__PURE__ */ c("span", { style: { fontSize: 6, color: s }, children: [
                       o,
                       "%"
                     ] })
@@ -4127,7 +4160,7 @@ function ei({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ d("div", { style: { display: "flex", justifyContent: "space-between" }, children: [
+                /* @__PURE__ */ c("div", { style: { display: "flex", justifyContent: "space-between" }, children: [
                   /* @__PURE__ */ e("span", { style: { fontSize: 6, color: "#2a5070", letterSpacing: "0.1em" }, children: "MSG/S" }),
                   /* @__PURE__ */ e("span", { style: { fontSize: 6, color: s }, children: i })
                 ] })
@@ -4154,9 +4187,9 @@ function ei({
               { label: "INST", val: r, unit: "conn" },
               { label: "ENQUEUE", val: Math.round(o * 2.4), unit: "msgs" },
               { label: "DISP", val: Math.round(i * 0.1), unit: "/s" }
-            ].map((h) => /* @__PURE__ */ d("div", { style: { display: "flex", gap: 3 }, children: [
+            ].map((h) => /* @__PURE__ */ c("div", { style: { display: "flex", gap: 3 }, children: [
               /* @__PURE__ */ e("span", { style: { fontSize: 6, color: "#1e3a5a", letterSpacing: "0.08em" }, children: h.label }),
-              /* @__PURE__ */ d("span", { style: { fontSize: 6, color: s + "88" }, children: [
+              /* @__PURE__ */ c("span", { style: { fontSize: 6, color: s + "88" }, children: [
                 h.val,
                 " ",
                 h.unit
@@ -4181,13 +4214,13 @@ function ei({
     }
   );
 }
-function ti() {
-  return /* @__PURE__ */ d(
+function si() {
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: ne,
-        height: q,
+        width: ue,
+        height: G,
         background: "linear-gradient(180deg, #040c1a, #030810)",
         position: "relative",
         overflow: "hidden",
@@ -4202,7 +4235,7 @@ function ti() {
           {
             style: {
               width: 40,
-              height: q - 16,
+              height: G - 16,
               background: "#020710",
               border: "1px solid #1a2d40",
               borderRadius: 2,
@@ -4258,7 +4291,7 @@ function ti() {
             style: {
               marginLeft: "auto",
               width: 12,
-              height: q - 16,
+              height: G - 16,
               background: "#020710",
               border: "1px solid #1a3050",
               borderRadius: 1
@@ -4269,13 +4302,13 @@ function ti() {
     }
   );
 }
-function bt({ side: t, color: n }) {
-  return /* @__PURE__ */ d(
+function Et({ side: t, color: n }) {
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: ke,
-        height: q,
+        width: Ie,
+        height: G,
         background: t === "right" ? "linear-gradient(90deg, #04091a 0%, #071428 60%, #040c1c 100%)" : "linear-gradient(90deg, #040c1c 0%, #071428 40%, #04091a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -4299,8 +4332,8 @@ function bt({ side: t, color: n }) {
           {
             style: {
               position: "absolute",
-              top: q * 0.25,
-              bottom: q * 0.25,
+              top: G * 0.25,
+              bottom: G * 0.25,
               left: 14,
               right: 14,
               display: "flex",
@@ -4326,14 +4359,14 @@ function bt({ side: t, color: n }) {
     }
   );
 }
-function ii({ queueDepth: t, color: n }) {
-  const o = Math.floor((ke - 14) / 7);
-  return /* @__PURE__ */ d(
+function di({ queueDepth: t, color: n }) {
+  const o = Math.floor((Ie - 14) / 7);
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: ne,
-        height: ke,
+        width: ue,
+        height: Ie,
         background: "linear-gradient(180deg, #0c1c30 0%, #07101e 40%, #040c1a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -4347,7 +4380,7 @@ function ii({ queueDepth: t, color: n }) {
               top: 0,
               left: 0,
               right: 0,
-              height: ke * 0.35,
+              height: Ie * 0.35,
               background: `radial-gradient(ellipse at 50% 0%,
           ${t > 70 ? "rgba(255,34,85,0.14)" : `${n}15`} 0%,
           transparent 70%)`
@@ -4385,7 +4418,7 @@ function ii({ queueDepth: t, color: n }) {
     }
   );
 }
-function wt({
+function Dt({
   rotateX: t = -20,
   rotateY: n = 20,
   rotateZ: o = 0,
@@ -4395,29 +4428,29 @@ function wt({
   name: s = "MSG-SRV-01",
   queueDepth: l = 45,
   msgsPerSec: h = 230,
-  instances: c = 3,
+  instances: d = 3,
   _compact: p
 }) {
-  const [f, g] = R(n), u = K(0), y = K(0);
-  Ae(() => {
+  const [f, b] = R(n), u = ie(0), g = ie(0);
+  ke(() => {
     if (!r) {
-      g(n);
+      b(n);
       return;
     }
-    const v = (x) => {
-      y.current && g((w) => w + (x - y.current) * 0.027), y.current = x, u.current = requestAnimationFrame(v);
+    const w = (v) => {
+      g.current && b((S) => S + (v - g.current) * 0.027), g.current = v, u.current = requestAnimationFrame(w);
     };
-    return u.current = requestAnimationFrame(v), () => {
-      cancelAnimationFrame(u.current), y.current = 0;
+    return u.current = requestAnimationFrame(w), () => {
+      cancelAnimationFrame(u.current), g.current = 0;
     };
   }, [r, n]);
-  const m = ut[a] ?? ut.online;
-  return /* @__PURE__ */ d(
+  const m = Pt[a] ?? Pt.online;
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
-        width: ne * i,
-        height: q * i,
+        width: ue * i,
+        height: G * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -4437,7 +4470,7 @@ function wt({
               animation: "holo-led-blink 1.5s infinite",
               filter: `drop-shadow(0 0 10px ${a === "critical" ? "#ff2255" : "#ff8c00"})`
             },
-            children: /* @__PURE__ */ d("svg", { width: "44", height: "44", viewBox: "0 0 28 28", fill: "none", children: [
+            children: /* @__PURE__ */ c("svg", { width: "44", height: "44", viewBox: "0 0 28 28", fill: "none", children: [
               /* @__PURE__ */ e(
                 "path",
                 {
@@ -4477,8 +4510,8 @@ function wt({
           {
             style: {
               position: "absolute",
-              width: ne * 1.3 * i,
-              height: q * 2 * i,
+              width: ue * 1.3 * i,
+              height: G * 2 * i,
               background: `radial-gradient(ellipse, ${m.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(40 * i)}px)`,
               pointerEvents: "none",
@@ -4497,34 +4530,34 @@ function wt({
               transform: `scale(${i})`,
               transformOrigin: "center center"
             },
-            children: /* @__PURE__ */ d(
+            children: /* @__PURE__ */ c(
               "div",
               {
                 style: {
-                  width: ne,
-                  height: q,
+                  width: ue,
+                  height: G,
                   position: "relative",
                   transformStyle: "preserve-3d",
                   transform: `rotateX(${t}deg) rotateY(${f}deg) rotateZ(${o}deg)`,
                   transition: r ? "none" : "transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94)"
                 },
                 children: [
-                  /* @__PURE__ */ e("div", { style: we.front, children: /* @__PURE__ */ e(
-                    ei,
+                  /* @__PURE__ */ e("div", { style: Te.front, children: /* @__PURE__ */ e(
+                    li,
                     {
                       cfg: m,
                       name: s,
                       queueDepth: l,
                       msgsPerSec: h,
-                      instances: c,
+                      instances: d,
                       compact: p
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: we.back, children: /* @__PURE__ */ e(ti, {}) }),
-                  /* @__PURE__ */ e("div", { style: we.left, children: /* @__PURE__ */ e(bt, { side: "left", color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: we.right, children: /* @__PURE__ */ e(bt, { side: "right", color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: we.top, children: /* @__PURE__ */ e(ii, { queueDepth: l, color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: we.bottom, children: /* @__PURE__ */ e("div", { style: { width: ne, height: ke, background: "#020508" } }) })
+                  /* @__PURE__ */ e("div", { style: Te.back, children: /* @__PURE__ */ e(si, {}) }),
+                  /* @__PURE__ */ e("div", { style: Te.left, children: /* @__PURE__ */ e(Et, { side: "left", color: m.color }) }),
+                  /* @__PURE__ */ e("div", { style: Te.right, children: /* @__PURE__ */ e(Et, { side: "right", color: m.color }) }),
+                  /* @__PURE__ */ e("div", { style: Te.top, children: /* @__PURE__ */ e(di, { queueDepth: l, color: m.color }) }),
+                  /* @__PURE__ */ e("div", { style: Te.bottom, children: /* @__PURE__ */ e("div", { style: { width: ue, height: Ie, background: "#020508" } }) })
                 ]
               }
             )
@@ -4534,7 +4567,7 @@ function wt({
     }
   );
 }
-function Di({
+function Hi({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -4544,17 +4577,17 @@ function Di({
   subLabel: s,
   color: l,
   delay: h,
-  visibleAtPhase: c,
+  visibleAtPhase: d,
   queueDepth: p,
   msgsPerSec: f,
-  instances: g,
+  instances: b,
   dialogMetrics: u,
-  subComponents: y,
+  subComponents: g,
   graphSeries: m,
-  alert: v
+  alert: w
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -4564,24 +4597,24 @@ function Di({
       subLabel: s,
       color: l,
       delay: h,
-      visibleAtPhase: c,
+      visibleAtPhase: d,
       componentInfo: {
         type: "messageServer",
         name: r,
         status: a,
-        context: { queueDepth: p, msgsPerSec: f, instances: g },
+        context: { queueDepth: p, msgsPerSec: f, instances: b },
         dialogMetrics: u,
-        subComponents: y,
+        subComponents: g,
         graphSeries: m
       },
-      alert: v,
+      alert: w,
       children: /* @__PURE__ */ e(
-        wt,
+        Dt,
         {
           status: a,
           queueDepth: p,
           msgsPerSec: f,
-          instances: g
+          instances: b
         }
       )
     }
@@ -4593,10 +4626,10 @@ function O(t, n, o = 24) {
     return Math.min(100, Math.max(0, t + Math.sin(a * Math.PI * 2) * n + (Math.random() - 0.5) * 10));
   });
 }
-function ni({ data: t, color: n, height: o = 28 }) {
+function ci({ data: t, color: n, height: o = 28 }) {
   const r = o, a = Math.max(...t, 1), s = t.map((l, h) => {
-    const c = h / (t.length - 1) * 120, p = r - l / a * (r - 4) - 2;
-    return `${c},${p}`;
+    const d = h / (t.length - 1) * 120, p = r - l / a * (r - 4) - 2;
+    return `${d},${p}`;
   }).join(" ");
   return /* @__PURE__ */ e("svg", { width: 120, height: r, style: { display: "block", overflow: "visible" }, children: /* @__PURE__ */ e(
     "polyline",
@@ -4611,7 +4644,7 @@ function ni({ data: t, color: n, height: o = 28 }) {
     }
   ) });
 }
-function oi({
+function pi({
   type: t,
   name: n,
   context: o = {},
@@ -4619,8 +4652,8 @@ function oi({
   animPhase: r,
   series: a
 }) {
-  const s = i === "critical" || i === "offline" ? "#ff2255" : i === "warning" ? "#ff8c00" : "#00e5ff", l = a ? a.map((p) => ({ ...p })) : ri(t, o), h = r >= 0.3 ? 0 : -280, c = r >= 0.2 ? 1 : 0;
-  return /* @__PURE__ */ d(
+  const s = i === "critical" || i === "offline" ? "#ff2255" : i === "warning" ? "#ff8c00" : "#00e5ff", l = a ? a.map((p) => ({ ...p })) : fi(t, o), h = r >= 0.3 ? 0 : -280, d = r >= 0.2 ? 1 : 0;
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
@@ -4634,11 +4667,11 @@ function oi({
         flexDirection: "column",
         overflow: "hidden",
         transform: `translateX(${h}px)`,
-        opacity: c,
+        opacity: d,
         transition: "transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.4s ease"
       },
       children: [
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -4648,14 +4681,14 @@ function oi({
             },
             children: [
               /* @__PURE__ */ e("div", { style: { fontSize: 10, color: s + "cc", letterSpacing: "0.12em", fontFamily: "'Courier New', monospace" }, children: "HISTORICAL" }),
-              /* @__PURE__ */ d("div", { style: { fontSize: 12, fontWeight: 700, color: "#fff", letterSpacing: "0.06em", marginTop: 2, fontFamily: "'Courier New', monospace" }, children: [
+              /* @__PURE__ */ c("div", { style: { fontSize: 12, fontWeight: 700, color: "#fff", letterSpacing: "0.06em", marginTop: 2, fontFamily: "'Courier New', monospace" }, children: [
                 n,
                 " · Sub-components"
               ] })
             ]
           }
         ),
-        /* @__PURE__ */ e("div", { style: { flex: 1, overflowY: "auto", padding: "12px 10px", display: "flex", flexDirection: "column", gap: 16 }, children: l.map((p, f) => /* @__PURE__ */ d(
+        /* @__PURE__ */ e("div", { style: { flex: 1, overflowY: "auto", padding: "12px 10px", display: "flex", flexDirection: "column", gap: 16 }, children: l.map((p, f) => /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -4667,14 +4700,14 @@ function oi({
               opacity: r >= 0.5 ? 1 : 0
             },
             children: [
-              /* @__PURE__ */ d("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 6 }, children: [
+              /* @__PURE__ */ c("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 6 }, children: [
                 /* @__PURE__ */ e("span", { style: { fontSize: 9, fontWeight: 600, color: p.color, letterSpacing: "0.08em", fontFamily: "'Courier New', monospace" }, children: p.label }),
-                /* @__PURE__ */ d("span", { style: { fontSize: 8, color: p.color + "99", fontFamily: "'Courier New', monospace" }, children: [
+                /* @__PURE__ */ c("span", { style: { fontSize: 8, color: p.color + "99", fontFamily: "'Courier New', monospace" }, children: [
                   Math.round(p.data[p.data.length - 1] ?? 0),
                   p.unit
                 ] })
               ] }),
-              /* @__PURE__ */ e(ni, { data: p.data, color: p.color, height: 26 })
+              /* @__PURE__ */ e(ci, { data: p.data, color: p.color, height: 26 })
             ]
           },
           p.id
@@ -4683,7 +4716,7 @@ function oi({
     }
   );
 }
-function ri(t, n) {
+function fi(t, n) {
   if (t === "server") {
     const o = n.cpuLoad ?? 50, i = n.memLoad ?? 60;
     return [
@@ -4719,7 +4752,7 @@ function ri(t, n) {
   }
   return [];
 }
-function St({
+function Nt({
   w: t,
   h: n,
   color: o,
@@ -4728,14 +4761,14 @@ function St({
   delay: a = "0s",
   children: s
 }) {
-  const l = r ? P[r]?.glow ?? "rgba(0,229,255,0.4)" : "rgba(0,229,255,0.4)";
-  return /* @__PURE__ */ d(
+  const l = r ? C[r]?.glow ?? "rgba(0,229,255,0.4)" : "rgba(0,229,255,0.4)";
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
         width: t,
         height: n,
-        background: Te,
+        background: ze,
         position: "relative",
         overflow: "hidden",
         borderRadius: 2,
@@ -4769,8 +4802,8 @@ function St({
               width: 4,
               height: 4,
               borderRadius: "50%",
-              background: P[r]?.color,
-              boxShadow: `0 0 6px ${P[r]?.color}`,
+              background: C[r]?.color,
+              boxShadow: `0 0 6px ${C[r]?.color}`,
               animation: "holo-led-blink 1.2s infinite"
             }
           }
@@ -4812,20 +4845,20 @@ function St({
     }
   );
 }
-function ze({
+function Ke({
   color: t = "#00e5ff",
   label: n = "CPU-0",
   status: o = "online",
   load: i = 0
 }) {
-  return /* @__PURE__ */ d("div", { style: { position: "relative", width: 52, height: 36 }, children: [
-    /* @__PURE__ */ d(
+  return /* @__PURE__ */ c("div", { style: { position: "relative", width: 52, height: 36 }, children: [
+    /* @__PURE__ */ c(
       "div",
       {
         style: {
           width: 52,
           height: 36,
-          background: Te,
+          background: ze,
           position: "relative",
           borderRadius: 2,
           border: `1px solid ${t}55`,
@@ -4896,8 +4929,8 @@ function ze({
                 width: 4,
                 height: 4,
                 borderRadius: "50%",
-                background: P[o]?.color,
-                boxShadow: `0 0 6px ${P[o]?.color}`,
+                background: C[o]?.color,
+                boxShadow: `0 0 6px ${C[o]?.color}`,
                 animation: "holo-led-blink 1.2s infinite"
               }
             }
@@ -4923,14 +4956,14 @@ function ze({
     )
   ] });
 }
-function Be({
+function Ze({
   color: t = "#00e5ff",
   label: n = "HEAP-0",
   status: o = "online",
   usedPercent: i = 0
 }) {
-  return /* @__PURE__ */ d("div", { style: { position: "relative", width: 28, height: 48 }, children: [
-    /* @__PURE__ */ d(
+  return /* @__PURE__ */ c("div", { style: { position: "relative", width: 28, height: 48 }, children: [
+    /* @__PURE__ */ c(
       "div",
       {
         style: {
@@ -4994,7 +5027,7 @@ function Be({
                 width: 3,
                 height: 3,
                 borderRadius: "50%",
-                background: P[o]?.color,
+                background: C[o]?.color,
                 animation: "holo-led-blink 1.2s infinite"
               }
             }
@@ -5020,13 +5053,13 @@ function Be({
     )
   ] });
 }
-function Re({
+function De({
   color: t = "#00e5ff",
   label: n = "DRIVE-1",
   status: o = "online",
   activity: i = !1
 }) {
-  return /* @__PURE__ */ d(St, { w: 56, h: 22, color: t, label: n, status: o, children: [
+  return /* @__PURE__ */ c(Nt, { w: 56, h: 22, color: t, label: n, status: o, children: [
     /* @__PURE__ */ e(
       "div",
       {
@@ -5059,18 +5092,18 @@ function Re({
     )
   ] });
 }
-function $t({
+function Wt({
   color: t = "#00e5ff",
   label: n = "NET",
   status: o = "online"
 }) {
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
         width: 48,
         height: 28,
-        background: Te,
+        background: ze,
         position: "relative",
         borderRadius: 2,
         border: `1px solid ${t}44`,
@@ -5123,21 +5156,21 @@ function $t({
     }
   );
 }
-function M({
+function W({
   color: t = "#00e5ff",
   label: n = "THREAD",
   status: o = "online"
 }) {
-  return /* @__PURE__ */ e(St, { w: 44, h: 28, color: t, label: n, status: o });
+  return /* @__PURE__ */ e(Nt, { w: 44, h: 28, color: t, label: n, status: o });
 }
-function Me({
+function Qe({
   color: t = "#ff8c00",
   label: n = "PLATTER-0",
   status: o = "online",
   capacityPercent: i = 0
 }) {
-  return /* @__PURE__ */ d("div", { style: { position: "relative", width: 48, height: 62 }, children: [
-    /* @__PURE__ */ d(
+  return /* @__PURE__ */ c("div", { style: { position: "relative", width: 48, height: 62 }, children: [
+    /* @__PURE__ */ c(
       "div",
       {
         style: {
@@ -5188,7 +5221,7 @@ function Me({
                 width: 4,
                 height: 4,
                 borderRadius: "50%",
-                background: P[o]?.color,
+                background: C[o]?.color,
                 animation: "holo-led-blink 1.2s infinite"
               }
             }
@@ -5214,12 +5247,12 @@ function Me({
     )
   ] });
 }
-function F({
+function Y({
   color: t = "#00e5ff",
   label: n = "PORT-1",
   status: o = "online"
 }) {
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
@@ -5243,7 +5276,7 @@ function F({
               width: 4,
               height: 4,
               borderRadius: "50%",
-              background: o && o !== "online" ? P[o]?.color ?? t : t,
+              background: o && o !== "online" ? C[o]?.color ?? t : t,
               boxShadow: `0 0 4px ${t}`,
               animation: o && o !== "online" && o !== "offline" ? "holo-led-blink 1s infinite" : "none"
             }
@@ -5284,7 +5317,7 @@ function F({
     }
   );
 }
-function ai(t, n, o, i) {
+function hi(t, n, o, i) {
   const r = o === "online" ? "online" : o;
   return t === "server" ? [
     {
@@ -5388,8 +5421,8 @@ function ai(t, n, o, i) {
     }
   ] : [];
 }
-const D = "cubic-bezier(0.34, 1.56, 0.64, 1)", li = "cubic-bezier(0.16, 1, 0.3, 1)";
-function si({ items: t, revealPhase: n }) {
+const I = "cubic-bezier(0.34, 1.56, 0.64, 1)", ui = "cubic-bezier(0.16, 1, 0.3, 1)";
+function bi({ items: t, revealPhase: n }) {
   return /* @__PURE__ */ e(
     "div",
     {
@@ -5407,7 +5440,7 @@ function si({ items: t, revealPhase: n }) {
           style: {
             opacity: n >= 0.2 + i * 0.06 ? 1 : 0,
             transform: `scale(${n >= 0.2 + i * 0.06 ? 1 : 0.6})`,
-            transition: `opacity 0.4s ${D} ${i * 0.06}s, transform 0.45s ${D} ${i * 0.06}s`
+            transition: `opacity 0.4s ${I} ${i * 0.06}s, transform 0.45s ${I} ${i * 0.06}s`
           },
           children: o.element
         },
@@ -5416,21 +5449,21 @@ function si({ items: t, revealPhase: n }) {
     }
   );
 }
-function di({
+function gi({
   type: t,
   status: n,
   context: o,
   internal: i,
   revealPhase: r
 }) {
-  const a = P[n]?.color ?? P.online.color, s = "#ff8c00";
+  const a = C[n]?.color ?? C.online.color, s = "#ff8c00";
   if (t === "server") {
-    const l = o.cpuLoad ?? 50, h = o.memLoad ?? 60, c = [
+    const l = o.cpuLoad ?? 50, h = o.memLoad ?? 60, d = [
       {
         key: "cpu0",
         delay: 0,
         el: /* @__PURE__ */ e(
-          ze,
+          Ke,
           {
             color: a,
             label: "CPU-0",
@@ -5444,7 +5477,7 @@ function di({
         key: "cpu1",
         delay: 1,
         el: /* @__PURE__ */ e(
-          ze,
+          Ke,
           {
             color: a,
             label: "CPU-1",
@@ -5458,7 +5491,7 @@ function di({
         key: "heap0",
         delay: 2,
         el: /* @__PURE__ */ e(
-          Be,
+          Ze,
           {
             color: "#8855ee",
             label: "HEAP-0",
@@ -5472,7 +5505,7 @@ function di({
         key: "heap1",
         delay: 3,
         el: /* @__PURE__ */ e(
-          Be,
+          Ze,
           {
             color: "#8855ee",
             label: "HEAP-1",
@@ -5485,13 +5518,13 @@ function di({
       {
         key: "d1",
         delay: 4,
-        el: /* @__PURE__ */ e(Re, { color: a, label: "DRIVE-1", status: i[4]?.status, activity: !0 })
+        el: /* @__PURE__ */ e(De, { color: a, label: "DRIVE-1", status: i[4]?.status, activity: !0 })
       },
       {
         key: "d2",
         delay: 5,
         el: /* @__PURE__ */ e(
-          Re,
+          De,
           {
             color: a,
             label: "DRIVE-2",
@@ -5504,7 +5537,7 @@ function di({
         key: "d3",
         delay: 6,
         el: /* @__PURE__ */ e(
-          Re,
+          De,
           {
             color: a,
             label: "DRIVE-3",
@@ -5516,12 +5549,12 @@ function di({
       {
         key: "thread",
         delay: 7,
-        el: /* @__PURE__ */ e(M, { color: a, label: "THREAD-POOL", status: i[7]?.status })
+        el: /* @__PURE__ */ e(W, { color: a, label: "THREAD-POOL", status: i[7]?.status })
       },
       {
         key: "net",
         delay: 8,
-        el: /* @__PURE__ */ e($t, { color: a, label: "NET", status: i[8]?.status })
+        el: /* @__PURE__ */ e(Wt, { color: a, label: "NET", status: i[8]?.status })
       }
     ];
     return /* @__PURE__ */ e(
@@ -5535,15 +5568,15 @@ function di({
           alignItems: "center",
           padding: 24
         },
-        children: c.map(({ key: p, delay: f, el: g }) => /* @__PURE__ */ e(
+        children: d.map(({ key: p, delay: f, el: b }) => /* @__PURE__ */ e(
           "div",
           {
             style: {
               opacity: r >= 0.2 + f * 0.08 ? 1 : 0,
               transform: `scale(${r >= 0.2 + f * 0.08 ? 1 : 0.6})`,
-              transition: `opacity 0.4s ${D} ${f * 0.06}s, transform 0.45s ${D} ${f * 0.06}s`
+              transition: `opacity 0.4s ${I} ${f * 0.06}s, transform 0.45s ${I} ${f * 0.06}s`
             },
-            children: g
+            children: b
           },
           p
         ))
@@ -5551,22 +5584,22 @@ function di({
     );
   }
   if (t === "dispatcher") {
-    const l = Array.from({ length: 8 }, (h, c) => {
-      const p = i[c];
+    const l = Array.from({ length: 8 }, (h, d) => {
+      const p = i[d];
       return /* @__PURE__ */ e(
         "div",
         {
           style: {
-            opacity: r >= 0.25 + c * 0.04 ? 1 : 0,
-            transform: `scale(${r >= 0.25 + c * 0.04 ? 1 : 0.5})`,
-            transition: `opacity 0.35s ${D} ${c * 0.04}s, transform 0.4s ${D} ${c * 0.04}s`
+            opacity: r >= 0.25 + d * 0.04 ? 1 : 0,
+            transform: `scale(${r >= 0.25 + d * 0.04 ? 1 : 0.5})`,
+            transition: `opacity 0.35s ${I} ${d * 0.04}s, transform 0.4s ${I} ${d * 0.04}s`
           },
-          children: /* @__PURE__ */ e(F, { color: a, label: `PORT-${c + 1}`, status: p?.status })
+          children: /* @__PURE__ */ e(Y, { color: a, label: `PORT-${d + 1}`, status: p?.status })
         },
-        `p${c}`
+        `p${d}`
       );
     });
-    return /* @__PURE__ */ d(
+    return /* @__PURE__ */ c(
       "div",
       {
         style: {
@@ -5578,16 +5611,16 @@ function di({
         },
         children: [
           /* @__PURE__ */ e("div", { style: { display: "flex", gap: 10, flexWrap: "wrap", justifyContent: "center" }, children: l }),
-          /* @__PURE__ */ d("div", { style: { display: "flex", gap: 16 }, children: [
+          /* @__PURE__ */ c("div", { style: { display: "flex", gap: 16 }, children: [
             /* @__PURE__ */ e(
               "div",
               {
                 style: {
                   opacity: r >= 0.7 ? 1 : 0,
                   transform: `scale(${r >= 0.7 ? 1 : 0.6})`,
-                  transition: `all 0.4s ${D} 0.3s`
+                  transition: `all 0.4s ${I} 0.3s`
                 },
-                children: /* @__PURE__ */ e(M, { color: a, label: "HTTP-WORKER", status: i[8]?.status })
+                children: /* @__PURE__ */ e(W, { color: a, label: "HTTP-WORKER", status: i[8]?.status })
               }
             ),
             /* @__PURE__ */ e(
@@ -5596,9 +5629,9 @@ function di({
                 style: {
                   opacity: r >= 0.8 ? 1 : 0,
                   transform: `scale(${r >= 0.8 ? 1 : 0.6})`,
-                  transition: `all 0.4s ${D} 0.4s`
+                  transition: `all 0.4s ${I} 0.4s`
                 },
-                children: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "HTTPS-WORKER", status: i[9]?.status })
+                children: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "HTTPS-WORKER", status: i[9]?.status })
               }
             )
           ] })
@@ -5607,7 +5640,7 @@ function di({
     );
   }
   if (t === "messageServer")
-    return /* @__PURE__ */ d(
+    return /* @__PURE__ */ c(
       "div",
       {
         style: {
@@ -5625,9 +5658,9 @@ function di({
               style: {
                 opacity: r >= 0.25 + l * 0.1 ? 1 : 0,
                 transform: `scale(${r >= 0.25 + l * 0.1 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} ${l * 0.08}s`
+                transition: `all 0.4s ${I} ${l * 0.08}s`
               },
-              children: /* @__PURE__ */ e(F, { color: "#bb55ff", label: `INST-${l}`, status: i[l]?.status })
+              children: /* @__PURE__ */ e(Y, { color: "#bb55ff", label: `INST-${l}`, status: i[l]?.status })
             },
             l
           )),
@@ -5637,9 +5670,9 @@ function di({
               style: {
                 opacity: r >= 0.6 ? 1 : 0,
                 transform: `scale(${r >= 0.6 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} 0.25s`
+                transition: `all 0.4s ${I} 0.25s`
               },
-              children: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "QUEUE-0", status: i[3]?.status })
+              children: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "QUEUE-0", status: i[3]?.status })
             }
           ),
           [4, 5, 6].map((l) => /* @__PURE__ */ e(
@@ -5648,10 +5681,10 @@ function di({
               style: {
                 opacity: r >= 0.7 + (l - 4) * 0.08 ? 1 : 0,
                 transform: `scale(${r >= 0.7 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} ${0.35 + (l - 4) * 0.05}s`
+                transition: `all 0.4s ${I} ${0.35 + (l - 4) * 0.05}s`
               },
               children: /* @__PURE__ */ e(
-                M,
+                W,
                 {
                   color: "#bb55ff",
                   label: `WORKER-${l - 3}`,
@@ -5666,7 +5699,7 @@ function di({
     );
   if (t === "database") {
     const l = o.capacity ?? 72;
-    return /* @__PURE__ */ d(
+    return /* @__PURE__ */ c(
       "div",
       {
         style: {
@@ -5684,10 +5717,10 @@ function di({
               style: {
                 opacity: r >= 0.2 + h * 0.12 ? 1 : 0,
                 transform: `scale(${r >= 0.2 + h * 0.12 ? 1 : 0.5})`,
-                transition: `all 0.45s ${D} ${h * 0.1}s`
+                transition: `all 0.45s ${I} ${h * 0.1}s`
               },
               children: /* @__PURE__ */ e(
-                Me,
+                Qe,
                 {
                   color: s,
                   label: `PLATTER-${h}`,
@@ -5704,9 +5737,9 @@ function di({
               style: {
                 opacity: r >= 0.6 ? 1 : 0,
                 transform: `scale(${r >= 0.6 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} 0.3s`
+                transition: `all 0.4s ${I} 0.3s`
               },
-              children: /* @__PURE__ */ e(M, { color: s, label: "CONN-POOL", status: i[3]?.status })
+              children: /* @__PURE__ */ e(W, { color: s, label: "CONN-POOL", status: i[3]?.status })
             }
           ),
           /* @__PURE__ */ e(
@@ -5715,9 +5748,9 @@ function di({
               style: {
                 opacity: r >= 0.75 ? 1 : 0,
                 transform: `scale(${r >= 0.75 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} 0.4s`
+                transition: `all 0.4s ${I} 0.4s`
               },
-              children: /* @__PURE__ */ e(M, { color: "#00ff88", label: "QUERY-CACHE", status: i[4]?.status })
+              children: /* @__PURE__ */ e(W, { color: "#00ff88", label: "QUERY-CACHE", status: i[4]?.status })
             }
           )
         ]
@@ -5726,7 +5759,7 @@ function di({
   }
   return null;
 }
-function Ni({
+function Ui({
   type: t,
   name: n,
   status: o,
@@ -5736,8 +5769,8 @@ function Ni({
   subComponents: s,
   graphSeries: l
 }) {
-  const h = ai(t, n, o, a), c = P[o]?.color ?? P.online.color, p = r >= 0.1 ? 1 : r * 10, f = r >= 0.2 ? "-50%" : "0%", g = r >= 0.2 ? "50%" : "0%", u = r >= 0.25 ? Math.min(1, (r - 0.25) * 1.5) : 0;
-  return /* @__PURE__ */ d(
+  const h = hi(t, n, o, a), d = C[o]?.color ?? C.online.color, p = r >= 0.1 ? 1 : r * 10, f = r >= 0.2 ? "-50%" : "0%", b = r >= 0.2 ? "50%" : "0%", u = r >= 0.25 ? Math.min(1, (r - 0.25) * 1.5) : 0;
+  return /* @__PURE__ */ c(
     "div",
     {
       style: {
@@ -5748,7 +5781,7 @@ function Ni({
         flexDirection: "row",
         pointerEvents: "auto"
       },
-      onClick: (y) => y.stopPropagation(),
+      onClick: (g) => g.stopPropagation(),
       children: [
         /* @__PURE__ */ e(
           "div",
@@ -5760,13 +5793,13 @@ function Ni({
               backdropFilter: "blur(10px)",
               WebkitBackdropFilter: "blur(10px)",
               opacity: p,
-              transition: `opacity 0.4s ${li}`
+              transition: `opacity 0.4s ${ui}`
             },
             onClick: i
           }
         ),
         /* @__PURE__ */ e(
-          oi,
+          pi,
           {
             type: t,
             name: n,
@@ -5776,7 +5809,7 @@ function Ni({
             series: l
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ c(
           "div",
           {
             style: {
@@ -5789,7 +5822,7 @@ function Ni({
               minWidth: 0
             },
             children: [
-              /* @__PURE__ */ d(
+              /* @__PURE__ */ c(
                 "div",
                 {
                   style: {
@@ -5807,10 +5840,10 @@ function Ni({
                           width: "50%",
                           height: "100%",
                           background: "linear-gradient(90deg, rgba(2, 8, 20, 0.98) 0%, rgba(2, 12, 28, 0.95) 100%)",
-                          borderRight: `2px solid ${c}44`,
+                          borderRight: `2px solid ${d}44`,
                           boxShadow: "4px 0 32px rgba(0,0,0,0.6)",
                           transform: `translateX(${f})`,
-                          transition: `transform 0.7s ${D}`
+                          transition: `transform 0.7s ${I}`
                         }
                       }
                     ),
@@ -5822,17 +5855,17 @@ function Ni({
                           height: "100%",
                           marginLeft: "auto",
                           background: "linear-gradient(90deg, rgba(2, 12, 28, 0.95) 0%, rgba(2, 8, 20, 0.98) 100%)",
-                          borderLeft: `2px solid ${c}44`,
+                          borderLeft: `2px solid ${d}44`,
                           boxShadow: "-4px 0 32px rgba(0,0,0,0.6)",
-                          transform: `translateX(${g})`,
-                          transition: `transform 0.7s ${D}`
+                          transform: `translateX(${b})`,
+                          transition: `transform 0.7s ${I}`
                         }
                       }
                     )
                   ]
                 }
               ),
-              /* @__PURE__ */ d(
+              /* @__PURE__ */ c(
                 "div",
                 {
                   style: {
@@ -5842,29 +5875,29 @@ function Ni({
                     maxWidth: 520,
                     minHeight: 320,
                     background: "linear-gradient(180deg, rgba(4, 14, 28, 0.6) 0%, rgba(2, 8, 18, 0.85) 100%)",
-                    border: `1px solid ${c}33`,
+                    border: `1px solid ${d}33`,
                     borderRadius: 12,
-                    boxShadow: `0 0 40px ${c}18, inset 0 0 60px rgba(0,0,0,0.4)`,
+                    boxShadow: `0 0 40px ${d}18, inset 0 0 60px rgba(0,0,0,0.4)`,
                     display: "flex",
                     flexDirection: "column",
                     opacity: u >= 0.1 ? 1 : 0,
-                    transition: `opacity 0.5s ${D} 0.2s`
+                    transition: `opacity 0.5s ${I} 0.2s`
                   },
                   children: [
-                    /* @__PURE__ */ d(
+                    /* @__PURE__ */ c(
                       "div",
                       {
                         style: {
                           padding: "12px 20px",
-                          borderBottom: `1px solid ${c}22`,
+                          borderBottom: `1px solid ${d}22`,
                           display: "flex",
                           alignItems: "center",
                           justifyContent: "space-between",
-                          background: `linear-gradient(180deg, ${c}11 0%, transparent 100%)`,
+                          background: `linear-gradient(180deg, ${d}11 0%, transparent 100%)`,
                           borderRadius: "12px 12px 0 0"
                         },
                         children: [
-                          /* @__PURE__ */ d("div", { style: { display: "flex", alignItems: "center", gap: 10 }, children: [
+                          /* @__PURE__ */ c("div", { style: { display: "flex", alignItems: "center", gap: 10 }, children: [
                             /* @__PURE__ */ e(
                               "div",
                               {
@@ -5872,13 +5905,13 @@ function Ni({
                                   width: 8,
                                   height: 8,
                                   borderRadius: "50%",
-                                  background: c,
-                                  boxShadow: `0 0 10px ${c}`,
+                                  background: d,
+                                  boxShadow: `0 0 10px ${d}`,
                                   animation: o === "warning" || o === "critical" ? "holo-led-blink 1.5s infinite" : "none"
                                 }
                               }
                             ),
-                            /* @__PURE__ */ d(
+                            /* @__PURE__ */ c(
                               "span",
                               {
                                 style: {
@@ -5903,9 +5936,9 @@ function Ni({
                                 width: 32,
                                 height: 32,
                                 borderRadius: 6,
-                                border: `1px solid ${c}44`,
+                                border: `1px solid ${d}44`,
                                 background: "rgba(0,0,0,0.4)",
-                                color: c,
+                                color: d,
                                 fontSize: 18,
                                 cursor: "pointer",
                                 display: "flex",
@@ -5929,15 +5962,15 @@ function Ni({
                           left: 0,
                           right: 0,
                           height: 1,
-                          background: `linear-gradient(90deg, transparent 5%, ${c}88 50%, transparent 95%)`,
-                          boxShadow: `0 0 8px ${c}`,
+                          background: `linear-gradient(90deg, transparent 5%, ${d}88 50%, transparent 95%)`,
+                          boxShadow: `0 0 8px ${d}`,
                           animation: "holo-scan 3s linear infinite",
                           pointerEvents: "none"
                         }
                       }
                     ),
-                    /* @__PURE__ */ e("div", { style: { flex: 1, padding: "8px 0 24px" }, children: s ? /* @__PURE__ */ e(si, { items: s, revealPhase: u }) : /* @__PURE__ */ e(
-                      di,
+                    /* @__PURE__ */ e("div", { style: { flex: 1, padding: "8px 0 24px" }, children: s ? /* @__PURE__ */ e(bi, { items: s, revealPhase: u }) : /* @__PURE__ */ e(
+                      gi,
                       {
                         type: t,
                         name: n,
@@ -5957,17 +5990,17 @@ function Ni({
     }
   );
 }
-function ci({ onSubmit: t }) {
-  const [n, o] = R(""), [i, r] = R(""), [a, s] = R(null), [l, h] = R(!1), c = n.trim().length > 0 && i.trim().length > 0;
-  return /* @__PURE__ */ e("div", { className: "cred-overlay", children: /* @__PURE__ */ d("form", { className: "cred-panel", onSubmit: (f) => {
-    f.preventDefault(), c && t({ accessKey: n.trim(), secretKey: i.trim() });
+function yi({ onSubmit: t }) {
+  const [n, o] = R(""), [i, r] = R(""), [a, s] = R(null), [l, h] = R(!1), d = n.trim().length > 0 && i.trim().length > 0;
+  return /* @__PURE__ */ e("div", { className: "cred-overlay", children: /* @__PURE__ */ c("form", { className: "cred-panel", onSubmit: (f) => {
+    f.preventDefault(), d && t({ accessKey: n.trim(), secretKey: i.trim() });
   }, onClick: (f) => f.stopPropagation(), children: [
     /* @__PURE__ */ e("div", { className: "cred-scanline" }),
     /* @__PURE__ */ e("span", { className: "cred-corner cred-corner--tl" }),
     /* @__PURE__ */ e("span", { className: "cred-corner cred-corner--tr" }),
     /* @__PURE__ */ e("span", { className: "cred-corner cred-corner--bl" }),
     /* @__PURE__ */ e("span", { className: "cred-corner cred-corner--br" }),
-    /* @__PURE__ */ e("div", { className: "cred-icon", children: /* @__PURE__ */ d(
+    /* @__PURE__ */ e("div", { className: "cred-icon", children: /* @__PURE__ */ c(
       "svg",
       {
         width: "32",
@@ -5984,7 +6017,7 @@ function ci({ onSubmit: t }) {
     ) }),
     /* @__PURE__ */ e("div", { className: "cred-title", children: "DATA SOURCE ACCESS" }),
     /* @__PURE__ */ e("div", { className: "cred-subtitle", children: "AUTHENTICATION REQUIRED" }),
-    /* @__PURE__ */ d("div", { className: "cred-field", children: [
+    /* @__PURE__ */ c("div", { className: "cred-field", children: [
       /* @__PURE__ */ e("label", { className: "cred-label", children: "ACCESS KEY" }),
       /* @__PURE__ */ e(
         "input",
@@ -6004,7 +6037,7 @@ function ci({ onSubmit: t }) {
         }
       )
     ] }),
-    /* @__PURE__ */ d("div", { className: "cred-field", children: [
+    /* @__PURE__ */ c("div", { className: "cred-field", children: [
       /* @__PURE__ */ e("label", { className: "cred-label", children: "SECRET KEY" }),
       /* @__PURE__ */ e(
         "input",
@@ -6023,18 +6056,18 @@ function ci({ onSubmit: t }) {
         }
       )
     ] }),
-    /* @__PURE__ */ d(
+    /* @__PURE__ */ c(
       "button",
       {
         className: "cred-btn",
         type: "submit",
-        disabled: !c,
+        disabled: !d,
         onMouseEnter: () => h(!0),
         onMouseLeave: () => h(!1),
         style: {
-          opacity: c ? 1 : 0.35,
-          cursor: c ? "pointer" : "not-allowed",
-          ...l && c ? {
+          opacity: d ? 1 : 0.35,
+          cursor: d ? "pointer" : "not-allowed",
+          ...l && d ? {
             background: "rgba(0,229,255,0.12)",
             boxShadow: "0 0 20px rgba(0,229,255,0.3), inset 0 0 12px rgba(0,229,255,0.08)"
           } : {}
@@ -6048,28 +6081,28 @@ function ci({ onSubmit: t }) {
     /* @__PURE__ */ e("div", { className: "cred-footer", children: "CREDENTIALS ARE STORED IN MEMORY ONLY" })
   ] }) });
 }
-const rt = Ue(null);
-function pi() {
-  const t = re(rt);
+const xt = tt(null);
+function mi() {
+  const t = ge(xt);
   if (!t)
     throw new Error("useAIOpsData must be used within an AIOPsDashboard with dataEndpoint configured");
   return t;
 }
-function fi() {
-  return re(rt);
+function xi() {
+  return ge(xt);
 }
-function Wi(t) {
-  const { data: n } = pi();
+function Yi(t) {
+  const { data: n } = mi();
   return n[t] ?? null;
 }
-function hi(t) {
+function vi(t) {
   const n = /* @__PURE__ */ new Set();
   for (const o of Object.values(t))
     for (const i of Object.values(o))
       n.add(typeof i == "string" ? i : i.query);
   return Array.from(n);
 }
-function ui(t) {
+function wi(t) {
   if (typeof t == "number") return t;
   if (typeof t == "string") {
     const n = Number(t);
@@ -6077,56 +6110,56 @@ function ui(t) {
   }
   return t;
 }
-function bi({ config: t, children: n }) {
-  const [o, i] = R({}), [r, a] = R(null), [s, l] = R(!1), [h, c] = R(null), [p, f] = R(null), g = K(t);
-  g.current = t;
-  const u = K(r);
+function Si({ config: t, children: n }) {
+  const [o, i] = R({}), [r, a] = R(null), [s, l] = R(!1), [h, d] = R(null), [p, f] = R(null), b = ie(t);
+  b.current = t;
+  const u = ie(r);
   u.current = r;
-  const y = dt(async () => {
-    const x = u.current, w = g.current;
-    if (x) {
+  const g = Ge(async () => {
+    const v = u.current, S = b.current;
+    if (v) {
       l(!0);
       try {
-        const b = await Promise.allSettled(
-          w.queries.map((S) => {
-            const N = w.endpoint.includes("?") ? "&" : "?", B = `${w.endpoint}${N}query=${encodeURIComponent(S)}`;
-            return fetch(B, {
+        const y = await Promise.allSettled(
+          S.queries.map(($) => {
+            const H = S.endpoint.includes("?") ? "&" : "?", L = `${S.endpoint}${H}query=${encodeURIComponent($)}`;
+            return fetch(L, {
               method: "GET",
               headers: {
-                "access-key": x.accessKey,
-                "access-secret-key": x.secretKey
+                "access-key": v.accessKey,
+                "access-secret-key": v.secretKey
               }
-            }).then((z) => {
-              if (!z.ok) throw new Error(`HTTP ${z.status}`);
-              return z.text();
-            }).then((z) => ({ query: S, data: z.trim() }));
+            }).then((M) => {
+              if (!M.ok) throw new Error(`HTTP ${M.status}`);
+              return M.text();
+            }).then((M) => ({ query: $, data: M.trim() }));
           })
-        ), k = {};
-        let T = 0;
-        for (const S of b)
-          S.status === "fulfilled" ? k[S.value.query] = S.value.data : T++;
-        i((S) => ({ ...S, ...k }));
-        const $ = w.queries.length;
-        c(
-          T > 0 ? `${T} of ${$} queries failed to refresh` : null
-        ), T < $ && f(/* @__PURE__ */ new Date());
-      } catch (b) {
-        const k = b instanceof Error ? b.message : "Refresh failed";
-        c(k);
+        ), x = {};
+        let A = 0;
+        for (const $ of y)
+          $.status === "fulfilled" ? x[$.value.query] = $.value.data : A++;
+        i(($) => ({ ...$, ...x }));
+        const k = S.queries.length;
+        d(
+          A > 0 ? `${A} of ${k} queries failed to refresh` : null
+        ), A < k && f(/* @__PURE__ */ new Date());
+      } catch (y) {
+        const x = y instanceof Error ? y.message : "Refresh failed";
+        d(x);
       } finally {
         l(!1);
       }
     }
   }, []);
-  Ae(() => {
+  ke(() => {
     if (!r) return;
-    y();
-    const x = g.current.refreshInterval ?? 6e4, w = window.setInterval(y, x);
-    return () => clearInterval(w);
-  }, [r, y]);
-  const m = dt((x) => {
-    a(x);
-  }, []), v = {
+    g();
+    const v = b.current.refreshInterval ?? 6e4, S = window.setInterval(g, v);
+    return () => clearInterval(S);
+  }, [r, g]);
+  const m = Ge((v) => {
+    a(v);
+  }, []), w = {
     data: o,
     isRefreshing: s,
     lastRefreshError: h,
@@ -6134,30 +6167,30 @@ function bi({ config: t, children: n }) {
     credentialsSet: !!r,
     setCredentials: m
   };
-  return /* @__PURE__ */ d(rt.Provider, { value: v, children: [
+  return /* @__PURE__ */ c(xt.Provider, { value: w, children: [
     n,
-    !r && /* @__PURE__ */ e(ci, { onSubmit: m })
+    !r && /* @__PURE__ */ e(yi, { onSubmit: m })
   ] });
 }
-function Mi(t) {
+function Vi(t) {
   const { dataEndpoint: n, dataBindings: o, dataRefreshInterval: i } = t;
   if (n && o) {
-    const r = hi(o);
+    const r = vi(o);
     return /* @__PURE__ */ e(
-      bi,
+      Si,
       {
         config: {
           endpoint: n,
           queries: r,
           refreshInterval: i
         },
-        children: /* @__PURE__ */ e(gt, { ...t })
+        children: /* @__PURE__ */ e(At, { ...t })
       }
     );
   }
-  return /* @__PURE__ */ e(gt, { ...t });
+  return /* @__PURE__ */ e(At, { ...t });
 }
-function gt({
+function At({
   brandName: t = "BUSAUD AIOps",
   brandTag: n = "3D MONITOR",
   services: o = [],
@@ -6167,41 +6200,75 @@ function gt({
   fontFamily: s,
   dataBindings: l,
   dataTransform: h,
-  children: c
+  children: d
 }) {
-  const p = fi(), [f] = R(20), [g] = R(!1), [u] = R(!0), [y] = R(0.45), [m] = R(3.3), [v, x] = R("compact"), [w, b] = R(0), [k, T] = R(null), [$, S] = R(null), [N, B] = R(0), z = (C) => {
-    v === "compact" && (T(C), x("expanding"), b(0), setTimeout(() => b(1), 50), setTimeout(() => b(2), 800), setTimeout(() => b(3), 1200), setTimeout(() => b(4), 1600), setTimeout(() => b(5), 2e3), setTimeout(() => {
-      b(6), x("expanded");
+  const p = xi(), [f] = R(20), [b] = R(!1), [u] = R(!0), [g] = R(0.45), [m] = R(3.3), [w, v] = R("compact"), [S, y] = R(0), [x, A] = R(null), [k, $] = R(null), [H, L] = R(0), M = (T) => {
+    w === "compact" && (A(T), v("expanding"), y(0), setTimeout(() => y(1), 50), setTimeout(() => y(2), 800), setTimeout(() => y(3), 1200), setTimeout(() => y(4), 1600), setTimeout(() => y(5), 2e3), setTimeout(() => {
+      y(6), v("expanded");
     }, 2400));
-  }, H = () => {
-    $ ? (S(null), B(0)) : v === "expanded" && (x("collapsing"), b(0), T(null), setTimeout(() => {
-      x((C) => C === "collapsing" ? "compact" : C);
+  }, K = () => {
+    k ? ($(null), L(0)) : w === "expanded" && (v("collapsing"), y(0), A(null), setTimeout(() => {
+      v((T) => T === "collapsing" ? "compact" : T);
     }, 1e3));
-  }, ae = (C) => {
-    S(C), B(0);
-  };
-  j.useEffect(() => {
-    if (!$) return;
-    const C = performance.now(), ce = 1200, ee = () => {
-      const Z = performance.now() - C, V = Math.min(1, Z / ce);
-      B(V), V < 1 && requestAnimationFrame(ee);
-    }, pe = requestAnimationFrame(ee);
-    return () => cancelAnimationFrame(pe);
-  }, [$]);
-  const le = () => {
-    S(null), B(0);
-  }, I = o.find((C) => C.name === k), U = I?.status ?? "online", se = I?.dbSync ?? !0, Ie = I?.metrics, Oe = I?.alerts, Y = h ?? ui, L = p?.data, Q = yt(() => !L || !l ? c : j.Children.map(c, (C) => {
-    if (!j.isValidElement(C)) return C;
-    const ce = C.props.name;
-    if (!ce || !l[ce]) return C;
-    const ee = l[ce], pe = {};
-    for (const [Z, V] of Object.entries(ee)) {
-      const st = typeof V == "string" ? V : V.query, ye = typeof V == "object" && V.transform ? V.transform : Y, De = L[st];
-      De !== void 0 && (pe[Z] = ye(De));
-    }
-    return Object.keys(pe).length > 0 ? j.cloneElement(C, pe) : C;
-  }), [c, L, l, Y]), Le = p?.lastRefreshError ?? null, be = 330, ge = 340, Ye = $ ? 1.15 : 1, Ve = $ ? -($.ex - be) * 0.06 : 0, de = $ ? -($.ey - ge) * 0.06 : 0;
-  return /* @__PURE__ */ d("div", { className: "app", style: s ? { fontFamily: s } : void 0, children: [
+  }, Z = Ge((T) => {
+    $(T), L(0);
+  }, []), ye = Ge((T) => {
+    $(T);
+  }, []);
+  q.useEffect(() => {
+    if (!k) return;
+    const T = performance.now(), j = 1200, oe = () => {
+      const V = performance.now() - T, re = Math.min(1, V / j);
+      L(re), re < 1 && requestAnimationFrame(oe);
+    }, ee = requestAnimationFrame(oe);
+    return () => cancelAnimationFrame(ee);
+  }, [k]);
+  const me = () => {
+    $(null), L(0);
+  }, D = h ?? wi, U = p?.data, { enhancedChildren: ne, liveAlerts: Be } = Tt(() => {
+    const T = {};
+    if (!U || !l) return { enhancedChildren: d, liveAlerts: T };
+    const j = {};
+    return { enhancedChildren: q.Children.map(d, (ee) => {
+      if (!q.isValidElement(ee)) return ee;
+      const V = ee.props.name;
+      if (!V || !l[V]) return ee;
+      const re = l[V], ve = {}, ae = {};
+      for (const [pe, B] of Object.entries(re)) {
+        const rt = typeof B == "string" ? B : B.query, at = typeof B == "object" && B.transform ? B.transform : D, Ye = U[rt];
+        if (Ye === void 0) continue;
+        const we = at(Ye);
+        if (ve[pe] = we, typeof B == "object" && B.alert && typeof we == "number") {
+          const { prop: F, warnAt: Ve = 70, critAt: St = 85, label: Ft } = B.alert, _e = Ft ?? pe, je = Math.round(we);
+          if (we >= St) {
+            const He = ae[F];
+            (!He || He.severity < 2) && (ae[F] = {
+              msg: `${_e} critical — ${je}%`,
+              internalRef: pe,
+              severity: 2
+            }), j[V] || (j[V] = []), j[V].push({
+              level: "critical",
+              message: `${_e} at ${je}% — exceeds critical threshold (${St}%)`
+            });
+          } else if (we >= Ve) {
+            const He = ae[F];
+            (!He || He.severity < 1) && (ae[F] = {
+              msg: `${_e} elevated — ${je}%`,
+              internalRef: pe,
+              severity: 1
+            }), j[V] || (j[V] = []), j[V].push({
+              level: "warning",
+              message: `${_e} at ${je}% — exceeds warning threshold (${Ve}%)`
+            });
+          }
+        }
+      }
+      for (const [pe, B] of Object.entries(ae))
+        ve[pe] = { msg: B.msg, internalRef: B.internalRef };
+      return Object.keys(ve).length > 0 ? q.cloneElement(ee, ve) : ee;
+    }), liveAlerts: j };
+  }, [d, U, l, D]), le = o.find((T) => T.name === x), Fe = le?.status ?? "online", J = le?.dbSync ?? !0, z = le?.metrics, _ = Be[x ?? ""] ?? [], se = le?.alerts ?? [], de = _.length > 0 ? [..._, ...se.filter((T) => T.level !== "info")] : se, Ce = p?.lastRefreshError ?? null, it = 330, nt = 340, xe = k ? 1.15 : 1, ce = k ? -(k.ex - it) * 0.06 : 0, ot = k ? -(k.ey - nt) * 0.06 : 0;
+  return /* @__PURE__ */ c("div", { className: "app", style: s ? { fontFamily: s } : void 0, children: [
     /* @__PURE__ */ e(
       "div",
       {
@@ -6215,18 +6282,18 @@ function gt({
           backgroundPosition: "center center",
           backgroundRepeat: "no-repeat",
           transition: "transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1)",
-          transform: `translate(${Ve}px, ${de}px) scale(${Ye})`,
+          transform: `translate(${ce}px, ${ot}px) scale(${xe})`,
           willChange: "transform"
         }
       }
     ),
-    /* @__PURE__ */ d("header", { className: "app-header", children: [
-      /* @__PURE__ */ d("div", { className: "hdr-brand", children: [
+    /* @__PURE__ */ c("header", { className: "app-header", children: [
+      /* @__PURE__ */ c("div", { className: "hdr-brand", children: [
         /* @__PURE__ */ e("span", { className: "brand-pulse" }),
         /* @__PURE__ */ e("span", { className: "brand-text", children: t })
       ] }),
-      /* @__PURE__ */ d("div", { className: "hdr-right", children: [
-        Le && /* @__PURE__ */ d("div", { className: "hdr-refresh-error", children: [
+      /* @__PURE__ */ c("div", { className: "hdr-right", children: [
+        Ce && /* @__PURE__ */ c("div", { className: "hdr-refresh-error", children: [
           /* @__PURE__ */ e("span", { className: "refresh-error-dot" }),
           /* @__PURE__ */ e("span", { className: "refresh-error-text", children: "DATA REFRESH FAILED" })
         ] }),
@@ -6238,143 +6305,144 @@ function gt({
       {
         className: "scene",
         style: {
-          cursor: v === "expanded" ? "zoom-out" : "default"
+          cursor: w === "expanded" ? "zoom-out" : "default"
         },
-        onClick: H,
+        onClick: K,
         children: /* @__PURE__ */ e(
-          Ft,
+          Xt,
           {
-            viewState: v,
-            animPhase: w,
-            selectedSystem: k,
-            selectedComponent: $,
-            drillAnimPhase: N,
+            viewState: w,
+            animPhase: S,
+            selectedSystem: x,
+            selectedComponent: k,
+            drillAnimPhase: H,
             rotateY: f,
-            autoRotateComponents: g,
-            componentScale: y,
+            autoRotateComponents: b,
+            componentScale: g,
             drillZoom: m,
             autoRotateCarousel: u,
             carouselSpeed: a,
             logoUrl: r,
-            onSelectSystem: z,
-            onBackgroundClick: H,
-            onComponentClick: ae,
-            onCloseDrill: le,
-            selectedSystemStatus: U,
-            selectedSystemDbSync: se,
-            selectedSystemMetrics: Ie,
-            selectedSystemAlerts: Oe,
-            children: Q
+            onSelectSystem: M,
+            onBackgroundClick: K,
+            onComponentClick: Z,
+            onComponentUpdate: ye,
+            onCloseDrill: me,
+            selectedSystemStatus: Fe,
+            selectedSystemDbSync: J,
+            selectedSystemMetrics: z,
+            selectedSystemAlerts: de,
+            children: ne
           }
         )
       }
     )
   ] });
 }
-function E(t, n, o = 24) {
+function P(t, n, o = 24) {
   return Array.from({ length: o }, (i, r) => {
     const a = r / o;
     return Math.min(100, Math.max(0, t + Math.sin(a * Math.PI * 2) * n + (Math.random() - 0.5) * 10));
   });
 }
-function kt(t) {
+function Mt(t) {
   return t === "critical" || t === "offline" ? "#ff2255" : t === "warning" ? "#ff8c00" : "#00e5ff";
 }
-function Pe(t, n, o) {
-  const i = t === "online" ? "online" : t, r = kt(t), a = o?.cpuLoad ?? 50, s = o?.memLoad ?? 60, l = i === "critical" || i === "warning" && a > 80 ? i : "online", h = i === "warning" && s > 85 ? "warning" : i === "critical" ? "critical" : "online", c = i === "critical" && n === "APP-03" ? "critical" : "online", p = i === "offline" ? "offline" : "online";
+function Ne(t, n, o) {
+  const i = t === "online" ? "online" : t, r = Mt(t), a = o?.cpuLoad ?? 50, s = o?.memLoad ?? 60, l = i === "critical" || i === "warning" && a > 80 ? i : "online", h = i === "warning" && s > 85 ? "warning" : i === "critical" ? "critical" : "online", d = i === "critical" && n === "APP-03" ? "critical" : "online", p = i === "offline" ? "offline" : "online";
   return [
-    { id: "cpu-0", label: "CPU-0", status: l, detail: i === "critical" ? "Core overload" : i === "warning" ? "Load spike" : void 0, element: /* @__PURE__ */ e(ze, { color: r, label: "CPU-0", status: l, load: a }) },
-    { id: "cpu-1", label: "CPU-1", status: "online", element: /* @__PURE__ */ e(ze, { color: r, label: "CPU-1", status: "online", load: a * 0.7 }) },
-    { id: "heap-0", label: "HEAP-0", status: h, detail: h === "warning" ? "Memory heap usage" : h === "critical" ? "OOM risk" : void 0, element: /* @__PURE__ */ e(Be, { color: "#8855ee", label: "HEAP-0", status: h, usedPercent: s }) },
-    { id: "heap-1", label: "HEAP-1", status: "online", element: /* @__PURE__ */ e(Be, { color: "#8855ee", label: "HEAP-1", status: "online", usedPercent: s * 0.85 }) },
-    { id: "drive-1", label: "DRIVE-1", status: "online", element: /* @__PURE__ */ e(Re, { color: r, label: "DRIVE-1", status: "online", activity: !0 }) },
-    { id: "drive-2", label: "DRIVE-2", status: "online", element: /* @__PURE__ */ e(Re, { color: r, label: "DRIVE-2", status: "online", activity: a > 30 }) },
-    { id: "drive-3", label: "DRIVE-3", status: "online", element: /* @__PURE__ */ e(Re, { color: r, label: "DRIVE-3", status: "online", activity: a > 50 }) },
-    { id: "thread-pool", label: "THREAD-POOL", status: c, detail: c === "critical" ? "Thread exhaustion" : void 0, element: /* @__PURE__ */ e(M, { color: r, label: "THREAD-POOL", status: c }) },
-    { id: "network", label: "NET", status: p, element: /* @__PURE__ */ e($t, { color: r, label: "NET", status: p }) }
+    { id: "cpu-0", label: "CPU-0", status: l, detail: i === "critical" ? "Core overload" : i === "warning" ? "Load spike" : void 0, element: /* @__PURE__ */ e(Ke, { color: r, label: "CPU-0", status: l, load: a }) },
+    { id: "cpu-1", label: "CPU-1", status: "online", element: /* @__PURE__ */ e(Ke, { color: r, label: "CPU-1", status: "online", load: a * 0.7 }) },
+    { id: "heap-0", label: "HEAP-0", status: h, detail: h === "warning" ? "Memory heap usage" : h === "critical" ? "OOM risk" : void 0, element: /* @__PURE__ */ e(Ze, { color: "#8855ee", label: "HEAP-0", status: h, usedPercent: s }) },
+    { id: "heap-1", label: "HEAP-1", status: "online", element: /* @__PURE__ */ e(Ze, { color: "#8855ee", label: "HEAP-1", status: "online", usedPercent: s * 0.85 }) },
+    { id: "drive-1", label: "DRIVE-1", status: "online", element: /* @__PURE__ */ e(De, { color: r, label: "DRIVE-1", status: "online", activity: !0 }) },
+    { id: "drive-2", label: "DRIVE-2", status: "online", element: /* @__PURE__ */ e(De, { color: r, label: "DRIVE-2", status: "online", activity: a > 30 }) },
+    { id: "drive-3", label: "DRIVE-3", status: "online", element: /* @__PURE__ */ e(De, { color: r, label: "DRIVE-3", status: "online", activity: a > 50 }) },
+    { id: "thread-pool", label: "THREAD-POOL", status: d, detail: d === "critical" ? "Thread exhaustion" : void 0, element: /* @__PURE__ */ e(W, { color: r, label: "THREAD-POOL", status: d }) },
+    { id: "network", label: "NET", status: p, element: /* @__PURE__ */ e(Wt, { color: r, label: "NET", status: p }) }
   ];
 }
-function Ce(t) {
+function We(t) {
   const n = t?.cpuLoad ?? 50, o = t?.memLoad ?? 60;
   return [
-    { id: "cpu", label: "CPU-0", unit: "%", color: "#00e5ff", data: E(n, 15) },
-    { id: "cpu1", label: "CPU-1", unit: "%", color: "#00e5ff", data: E(n * 0.7, 12) },
-    { id: "heap0", label: "HEAP-0", unit: "%", color: "#8855ee", data: E(o, 18) },
-    { id: "heap1", label: "HEAP-1", unit: "%", color: "#8855ee", data: E(o * 0.85, 14) },
-    { id: "drive1", label: "DRIVE-1 I/O", unit: "%", color: "#ff8c00", data: E(40, 25) },
-    { id: "drive2", label: "DRIVE-2 I/O", unit: "%", color: "#ff8c00", data: E(35, 20) },
-    { id: "drive3", label: "DRIVE-3 I/O", unit: "%", color: "#ff8c00", data: E(30, 22) },
-    { id: "thread", label: "THREAD-POOL", unit: "%", color: "#22aaff", data: E(55, 20) }
+    { id: "cpu", label: "CPU-0", unit: "%", color: "#00e5ff", data: P(n, 15) },
+    { id: "cpu1", label: "CPU-1", unit: "%", color: "#00e5ff", data: P(n * 0.7, 12) },
+    { id: "heap0", label: "HEAP-0", unit: "%", color: "#8855ee", data: P(o, 18) },
+    { id: "heap1", label: "HEAP-1", unit: "%", color: "#8855ee", data: P(o * 0.85, 14) },
+    { id: "drive1", label: "DRIVE-1 I/O", unit: "%", color: "#ff8c00", data: P(40, 25) },
+    { id: "drive2", label: "DRIVE-2 I/O", unit: "%", color: "#ff8c00", data: P(35, 20) },
+    { id: "drive3", label: "DRIVE-3 I/O", unit: "%", color: "#ff8c00", data: P(30, 22) },
+    { id: "thread", label: "THREAD-POOL", unit: "%", color: "#22aaff", data: P(55, 20) }
   ];
 }
-function Rt(t, n, o) {
-  const i = t === "online" ? "online" : t, r = kt(t), a = i === "critical" || i === "offline" ? i : "online", s = i === "warning" ? "warning" : "online", l = i === "critical" ? "critical" : "online";
+function zt(t, n, o) {
+  const i = t === "online" ? "online" : t, r = Mt(t), a = i === "critical" || i === "offline" ? i : "online", s = i === "warning" ? "warning" : "online", l = i === "critical" ? "critical" : "online";
   return [
-    { id: "port-1", label: "PORT-1", status: "online", element: /* @__PURE__ */ e(F, { color: r, label: "PORT-1", status: "online" }) },
-    { id: "port-2", label: "PORT-2", status: "online", element: /* @__PURE__ */ e(F, { color: r, label: "PORT-2", status: "online" }) },
-    { id: "port-3", label: "PORT-3", status: a, detail: i === "critical" ? "Gateway timeout" : i === "offline" ? "Unreachable" : void 0, element: /* @__PURE__ */ e(F, { color: r, label: "PORT-3", status: a }) },
-    { id: "port-4", label: "PORT-4", status: "online", element: /* @__PURE__ */ e(F, { color: r, label: "PORT-4", status: "online" }) },
-    { id: "port-5", label: "PORT-5", status: s, detail: s === "warning" ? "Latency spike" : void 0, element: /* @__PURE__ */ e(F, { color: r, label: "PORT-5", status: s }) },
-    { id: "port-6", label: "PORT-6", status: "online", element: /* @__PURE__ */ e(F, { color: r, label: "PORT-6", status: "online" }) },
-    { id: "port-7", label: "PORT-7", status: "online", element: /* @__PURE__ */ e(F, { color: r, label: "PORT-7", status: "online" }) },
-    { id: "port-8", label: "PORT-8", status: "online", element: /* @__PURE__ */ e(F, { color: r, label: "PORT-8", status: "online" }) },
-    { id: "http-worker", label: "HTTP-WORKER", status: l, detail: l === "critical" ? "Worker timeout" : void 0, element: /* @__PURE__ */ e(M, { color: r, label: "HTTP-WORKER", status: l }) },
-    { id: "https-worker", label: "HTTPS-WORKER", status: "online", element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "HTTPS-WORKER", status: "online" }) }
+    { id: "port-1", label: "PORT-1", status: "online", element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-1", status: "online" }) },
+    { id: "port-2", label: "PORT-2", status: "online", element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-2", status: "online" }) },
+    { id: "port-3", label: "PORT-3", status: a, detail: i === "critical" ? "Gateway timeout" : i === "offline" ? "Unreachable" : void 0, element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-3", status: a }) },
+    { id: "port-4", label: "PORT-4", status: "online", element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-4", status: "online" }) },
+    { id: "port-5", label: "PORT-5", status: s, detail: s === "warning" ? "Latency spike" : void 0, element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-5", status: s }) },
+    { id: "port-6", label: "PORT-6", status: "online", element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-6", status: "online" }) },
+    { id: "port-7", label: "PORT-7", status: "online", element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-7", status: "online" }) },
+    { id: "port-8", label: "PORT-8", status: "online", element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-8", status: "online" }) },
+    { id: "http-worker", label: "HTTP-WORKER", status: l, detail: l === "critical" ? "Worker timeout" : void 0, element: /* @__PURE__ */ e(W, { color: r, label: "HTTP-WORKER", status: l }) },
+    { id: "https-worker", label: "HTTPS-WORKER", status: "online", element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "HTTPS-WORKER", status: "online" }) }
   ];
 }
-function Pt(t) {
+function Bt(t) {
   const n = t?.traffic ?? 50;
   return [
-    { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: E(n, 20) },
-    { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: E(60, 25) },
-    { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: E(45, 20) },
-    { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: E(70, 30) },
-    { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: E(n * 0.9, 15) }
+    { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: P(n, 20) },
+    { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: P(60, 25) },
+    { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: P(45, 20) },
+    { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: P(70, 30) },
+    { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: P(n * 0.9, 15) }
   ];
 }
-function gi(t, n, o) {
+function $i(t, n, o) {
   const i = t === "online" ? "online" : t, r = i === "critical" ? "critical" : "online", a = i === "critical" || i === "offline" ? i : i === "warning" ? "warning" : "online", s = i === "critical" ? "critical" : "online";
   return [
-    { id: "inst-0", label: "INST-0", status: "online", element: /* @__PURE__ */ e(F, { color: "#bb55ff", label: "INST-0", status: "online" }) },
-    { id: "inst-1", label: "INST-1", status: "online", element: /* @__PURE__ */ e(F, { color: "#bb55ff", label: "INST-1", status: "online" }) },
-    { id: "inst-2", label: "INST-2", status: r, detail: r === "critical" ? "Instance unreachable" : void 0, element: /* @__PURE__ */ e(F, { color: "#bb55ff", label: "INST-2", status: r }) },
-    { id: "queue-0", label: "QUEUE-0", status: a, detail: i === "critical" ? "Queue full" : i === "offline" ? "Unreachable" : i === "warning" ? "Queue depth warning" : void 0, element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "QUEUE-0", status: a }) },
-    { id: "worker-1", label: "WORKER-1", status: "online", element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "WORKER-1", status: "online" }) },
-    { id: "worker-2", label: "WORKER-2", status: "online", element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "WORKER-2", status: "online" }) },
-    { id: "worker-3", label: "WORKER-3", status: s, detail: s === "critical" ? "Worker timeout" : void 0, element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "WORKER-3", status: s }) }
+    { id: "inst-0", label: "INST-0", status: "online", element: /* @__PURE__ */ e(Y, { color: "#bb55ff", label: "INST-0", status: "online" }) },
+    { id: "inst-1", label: "INST-1", status: "online", element: /* @__PURE__ */ e(Y, { color: "#bb55ff", label: "INST-1", status: "online" }) },
+    { id: "inst-2", label: "INST-2", status: r, detail: r === "critical" ? "Instance unreachable" : void 0, element: /* @__PURE__ */ e(Y, { color: "#bb55ff", label: "INST-2", status: r }) },
+    { id: "queue-0", label: "QUEUE-0", status: a, detail: i === "critical" ? "Queue full" : i === "offline" ? "Unreachable" : i === "warning" ? "Queue depth warning" : void 0, element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "QUEUE-0", status: a }) },
+    { id: "worker-1", label: "WORKER-1", status: "online", element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "WORKER-1", status: "online" }) },
+    { id: "worker-2", label: "WORKER-2", status: "online", element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "WORKER-2", status: "online" }) },
+    { id: "worker-3", label: "WORKER-3", status: s, detail: s === "critical" ? "Worker timeout" : void 0, element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "WORKER-3", status: s }) }
   ];
 }
-function yi(t) {
+function ki(t) {
   const n = t?.queueDepth ?? 50;
   return [
-    { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: E(n, 20) },
-    { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: E(60, 25) },
-    { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: E(45, 20) },
-    { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: E(70, 30) },
-    { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: E(n * 0.9, 15) }
+    { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: P(n, 20) },
+    { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: P(60, 25) },
+    { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: P(45, 20) },
+    { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: P(70, 30) },
+    { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: P(n * 0.9, 15) }
   ];
 }
-function Fe(t, n, o) {
-  const i = t === "online" ? "online" : t, r = "#ff8c00", a = o?.capacity ?? 72, s = i === "critical" || i === "offline" ? i : i === "warning" ? "warning" : "online", l = i === "warning" && n === "DB-STB" ? "warning" : "online", h = i === "critical" ? "critical" : "online", c = i === "warning" ? "warning" : "online";
+function Je(t, n, o) {
+  const i = t === "online" ? "online" : t, r = "#ff8c00", a = o?.capacity ?? 72, s = i === "critical" || i === "offline" ? i : i === "warning" ? "warning" : "online", l = i === "warning" && n === "DB-STB" ? "warning" : "online", h = i === "critical" ? "critical" : "online", d = i === "warning" ? "warning" : "online";
   return [
-    { id: "platter-0", label: "PLATTER-0", status: "online", element: /* @__PURE__ */ e(Me, { color: r, label: "PLATTER-0", status: "online", capacityPercent: a }) },
-    { id: "platter-1", label: "PLATTER-1", status: s, detail: i === "critical" ? "I/O failure" : i === "offline" ? "Connection lost" : i === "warning" ? "Slow queries" : void 0, element: /* @__PURE__ */ e(Me, { color: r, label: "PLATTER-1", status: s, capacityPercent: a }) },
-    { id: "platter-2", label: "PLATTER-2", status: l, detail: l === "warning" ? "Replication lag" : void 0, element: /* @__PURE__ */ e(Me, { color: r, label: "PLATTER-2", status: l, capacityPercent: a }) },
-    { id: "conn-pool", label: "CONN-POOL", status: h, detail: h === "critical" ? "Pool exhausted" : void 0, element: /* @__PURE__ */ e(M, { color: r, label: "CONN-POOL", status: h }) },
-    { id: "query-cache", label: "QUERY-CACHE", status: c, detail: c === "warning" ? "Cache miss rate" : void 0, element: /* @__PURE__ */ e(M, { color: "#00ff88", label: "QUERY-CACHE", status: c }) }
+    { id: "platter-0", label: "PLATTER-0", status: "online", element: /* @__PURE__ */ e(Qe, { color: r, label: "PLATTER-0", status: "online", capacityPercent: a }) },
+    { id: "platter-1", label: "PLATTER-1", status: s, detail: i === "critical" ? "I/O failure" : i === "offline" ? "Connection lost" : i === "warning" ? "Slow queries" : void 0, element: /* @__PURE__ */ e(Qe, { color: r, label: "PLATTER-1", status: s, capacityPercent: a }) },
+    { id: "platter-2", label: "PLATTER-2", status: l, detail: l === "warning" ? "Replication lag" : void 0, element: /* @__PURE__ */ e(Qe, { color: r, label: "PLATTER-2", status: l, capacityPercent: a }) },
+    { id: "conn-pool", label: "CONN-POOL", status: h, detail: h === "critical" ? "Pool exhausted" : void 0, element: /* @__PURE__ */ e(W, { color: r, label: "CONN-POOL", status: h }) },
+    { id: "query-cache", label: "QUERY-CACHE", status: d, detail: d === "warning" ? "Cache miss rate" : void 0, element: /* @__PURE__ */ e(W, { color: "#00ff88", label: "QUERY-CACHE", status: d }) }
   ];
 }
-function He(t) {
+function et(t) {
   const n = t?.capacity ?? 70;
   return [
-    { id: "platter0", label: "PLATTER-0 I/O", unit: "%", color: "#ff8c00", data: E(40, 20) },
-    { id: "platter1", label: "PLATTER-1 I/O", unit: "%", color: "#ff8c00", data: E(55, 25) },
-    { id: "platter2", label: "PLATTER-2 I/O", unit: "%", color: "#ff8c00", data: E(35, 18) },
-    { id: "connpool", label: "CONN-POOL", unit: "%", color: "#00e5ff", data: E(n, 15) },
-    { id: "cache", label: "QUERY-CACHE", unit: "%", color: "#00ff88", data: E(75, 12) }
+    { id: "platter0", label: "PLATTER-0 I/O", unit: "%", color: "#ff8c00", data: P(40, 20) },
+    { id: "platter1", label: "PLATTER-1 I/O", unit: "%", color: "#ff8c00", data: P(55, 25) },
+    { id: "platter2", label: "PLATTER-2 I/O", unit: "%", color: "#ff8c00", data: P(35, 18) },
+    { id: "connpool", label: "CONN-POOL", unit: "%", color: "#00e5ff", data: P(n, 15) },
+    { id: "cache", label: "QUERY-CACHE", unit: "%", color: "#00ff88", data: P(75, 12) }
   ];
 }
-function at(t) {
+function vt(t) {
   const n = [
     t.wdStatus,
     t.msStatus,
@@ -6386,8 +6454,8 @@ function at(t) {
   ];
   return n.includes("critical") ? "critical" : n.includes("warning") ? "warning" : n.includes("offline") ? "offline" : "online";
 }
-function zi(t) {
-  const n = at(t), o = n === "critical" || n === "offline", i = n === "warning";
+function _i(t) {
+  const n = vt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     {
       label: "Uptime",
@@ -6408,8 +6476,8 @@ function zi(t) {
     }
   ];
 }
-function Bi(t) {
-  const n = at(t), o = n === "critical" || n === "offline", i = n === "warning";
+function ji(t) {
+  const n = vt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     ...t.dbSync ? [] : [{ level: "warning", message: "DB Replication Lag Detected" }],
     ...o ? [{ level: "critical", message: "Critical Component Failure" }] : [],
@@ -6417,7 +6485,7 @@ function Bi(t) {
     ...!o && !i && t.dbSync ? [{ level: "info", message: "All Systems Nominal" }] : []
   ];
 }
-const mi = [
+const Ri = [
   { from: [330, 120], to: [220, 260], visibleAtPhase: 3 },
   { from: [330, 120], to: [440, 260], visibleAtPhase: 3 },
   { from: [220, 260], to: [165, 390], visibleAtPhase: 4 },
@@ -6430,11 +6498,11 @@ const mi = [
   { from: [330, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" },
   { from: [495, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" }
 ];
-function xi({ config: t }) {
-  const n = j.useContext(ue), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { wdStatus: r, msStatus: a, srv1Status: s, srv2Status: l, srv3Status: h, pdbStatus: c, sdbStatus: p, dbSync: f } = t;
-  return /* @__PURE__ */ d(Ee, { children: [
+function Ci({ config: t }) {
+  const n = q.useContext(Re), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { wdStatus: r, msStatus: a, srv1Status: s, srv2Status: l, srv3Status: h, pdbStatus: d, sdbStatus: p, dbSync: f } = t;
+  return /* @__PURE__ */ c(Me, { children: [
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 120,
@@ -6442,11 +6510,11 @@ function xi({ config: t }) {
         zIndex: 10,
         visibleAtPhase: 2,
         color: "#00e5ff",
-        children: /* @__PURE__ */ e(nt, { status: "online", scale: 1.5 })
+        children: /* @__PURE__ */ e(yt, { status: "online", scale: 1.5 })
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 220,
         ey: 260,
@@ -6461,11 +6529,11 @@ function xi({ config: t }) {
           name: "WEB-DISP",
           status: r,
           context: { traffic: 78 },
-          subComponents: Rt(r),
-          graphSeries: Pt({ traffic: 78 })
+          subComponents: zt(r),
+          graphSeries: Bt({ traffic: 78 })
         },
         children: /* @__PURE__ */ e(
-          ot,
+          mt,
           {
             rotateY: o,
             autoRotate: i,
@@ -6479,7 +6547,7 @@ function xi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 440,
         ey: 260,
@@ -6494,11 +6562,11 @@ function xi({ config: t }) {
           name: "MSG-SRV",
           status: a,
           context: { queueDepth: 45 },
-          subComponents: gi(a),
-          graphSeries: yi({ queueDepth: 45 })
+          subComponents: $i(a),
+          graphSeries: ki({ queueDepth: 45 })
         },
         children: /* @__PURE__ */ e(
-          wt,
+          Dt,
           {
             rotateY: -o,
             autoRotate: i,
@@ -6513,7 +6581,7 @@ function xi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 165,
         ey: 390,
@@ -6528,11 +6596,11 @@ function xi({ config: t }) {
           name: "APP-01",
           status: s,
           context: { cpuLoad: 67, memLoad: 72 },
-          subComponents: Pe(s, "APP-01", { cpuLoad: 67, memLoad: 72 }),
-          graphSeries: Ce({ cpuLoad: 67, memLoad: 72 })
+          subComponents: Ne(s, "APP-01", { cpuLoad: 67, memLoad: 72 }),
+          graphSeries: We({ cpuLoad: 67, memLoad: 72 })
         },
         children: /* @__PURE__ */ e(
-          he,
+          $e,
           {
             rotateY: o,
             autoRotate: i,
@@ -6546,7 +6614,7 @@ function xi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 390,
@@ -6561,11 +6629,11 @@ function xi({ config: t }) {
           name: "APP-02",
           status: l,
           context: { cpuLoad: 89, memLoad: 91 },
-          subComponents: Pe(l, "APP-02", { cpuLoad: 89, memLoad: 91 }),
-          graphSeries: Ce({ cpuLoad: 89, memLoad: 91 })
+          subComponents: Ne(l, "APP-02", { cpuLoad: 89, memLoad: 91 }),
+          graphSeries: We({ cpuLoad: 89, memLoad: 91 })
         },
         children: /* @__PURE__ */ e(
-          he,
+          $e,
           {
             rotateY: o,
             autoRotate: i,
@@ -6579,7 +6647,7 @@ function xi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 495,
         ey: 390,
@@ -6594,11 +6662,11 @@ function xi({ config: t }) {
           name: "APP-03",
           status: h,
           context: { cpuLoad: 45, memLoad: 63 },
-          subComponents: Pe(h, "APP-03", { cpuLoad: 45, memLoad: 63 }),
-          graphSeries: Ce({ cpuLoad: 45, memLoad: 63 })
+          subComponents: Ne(h, "APP-03", { cpuLoad: 45, memLoad: 63 }),
+          graphSeries: We({ cpuLoad: 45, memLoad: 63 })
         },
         children: /* @__PURE__ */ e(
-          he,
+          $e,
           {
             rotateY: o,
             autoRotate: i,
@@ -6612,7 +6680,7 @@ function xi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 200,
         ey: 520,
@@ -6625,17 +6693,17 @@ function xi({ config: t }) {
         componentInfo: {
           type: "database",
           name: "DB-PRI",
-          status: c,
+          status: d,
           context: { capacity: 72 },
-          subComponents: Fe(c, "DB-PRI", { capacity: 72 }),
-          graphSeries: He({ capacity: 72 })
+          subComponents: Je(d, "DB-PRI", { capacity: 72 }),
+          graphSeries: et({ capacity: 72 })
         },
         children: /* @__PURE__ */ e(
-          Ne,
+          Ue,
           {
             rotateY: -o,
             autoRotate: i,
-            status: c,
+            status: d,
             name: "DB-PRI",
             capacity: 72,
             connections: 284,
@@ -6645,7 +6713,7 @@ function xi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 460,
         ey: 520,
@@ -6660,11 +6728,11 @@ function xi({ config: t }) {
           name: "DB-STB",
           status: p,
           context: { capacity: 72 },
-          subComponents: Fe(p, "DB-STB", { capacity: 72 }),
-          graphSeries: He({ capacity: 72 })
+          subComponents: Je(p, "DB-STB", { capacity: 72 }),
+          graphSeries: et({ capacity: 72 })
         },
         children: /* @__PURE__ */ e(
-          Ne,
+          Ue,
           {
             rotateY: o,
             autoRotate: i,
@@ -6678,7 +6746,7 @@ function xi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 520,
@@ -6687,17 +6755,17 @@ function xi({ config: t }) {
         visibleAtPhase: 6,
         fixedScale: 1,
         bare: !0,
-        children: /* @__PURE__ */ e(vt, { synced: f, latencyMs: f ? 8 : 342 })
+        children: /* @__PURE__ */ e(It, { synced: f, latencyMs: f ? 8 : 342 })
       }
     ),
-    /* @__PURE__ */ e(vi, { config: t })
+    /* @__PURE__ */ e(Pi, { config: t })
   ] });
 }
-function vi({ config: t }) {
-  const n = j.useContext(ue), { wdStatus: o, msStatus: i, srv1Status: r, srv2Status: a, srv3Status: s, pdbStatus: l, sdbStatus: h, dbSync: c } = t, p = n?.isSelected && n?.isExpandedPos;
-  return n?.isSelected ? /* @__PURE__ */ d("div", { style: { pointerEvents: "none" }, children: [
+function Pi({ config: t }) {
+  const n = q.useContext(Re), { wdStatus: o, msStatus: i, srv1Status: r, srv2Status: a, srv3Status: s, pdbStatus: l, sdbStatus: h, dbSync: d } = t, p = n?.isSelected && n?.isExpandedPos;
+  return n?.isSelected ? /* @__PURE__ */ c("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 220,
         ey: 260,
@@ -6712,7 +6780,7 @@ function vi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 440,
         ey: 260,
@@ -6727,7 +6795,7 @@ function vi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 165,
         ey: 390,
@@ -6742,7 +6810,7 @@ function vi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 330,
         ey: 390,
@@ -6757,7 +6825,7 @@ function vi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 495,
         ey: 390,
@@ -6772,7 +6840,7 @@ function vi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 200,
         ey: 520,
@@ -6787,7 +6855,7 @@ function vi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 460,
         ey: 520,
@@ -6801,8 +6869,8 @@ function vi({ config: t }) {
         internalRef: h !== "online" ? "PLATTER-2" : void 0
       }
     ),
-    !c && /* @__PURE__ */ e(
-      W,
+    !d && /* @__PURE__ */ e(
+      N,
       {
         ex: 330,
         ey: 520,
@@ -6818,19 +6886,19 @@ function vi({ config: t }) {
     )
   ] }) : null;
 }
-function Fi({ config: t, ...n }) {
+function Xi({ config: t, ...n }) {
   return /* @__PURE__ */ e(
-    xt,
+    Lt,
     {
       name: t.name,
-      status: at(t),
-      connections: mi,
+      status: vt(t),
+      connections: Ri,
       ...n,
-      children: /* @__PURE__ */ e(xi, { config: t })
+      children: /* @__PURE__ */ e(Ci, { config: t })
     }
   );
 }
-function lt(t) {
+function wt(t) {
   const n = [
     t.dispStatus,
     t.srv1Status,
@@ -6841,8 +6909,8 @@ function lt(t) {
   ];
   return n.includes("critical") ? "critical" : n.includes("warning") ? "warning" : n.includes("offline") ? "offline" : "online";
 }
-function Hi(t) {
-  const n = lt(t), o = n === "critical" || n === "offline", i = n === "warning";
+function qi(t) {
+  const n = wt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     {
       label: "Uptime",
@@ -6863,8 +6931,8 @@ function Hi(t) {
     }
   ];
 }
-function Ui(t) {
-  const n = lt(t), o = n === "critical" || n === "offline", i = n === "warning";
+function Qi(t) {
+  const n = wt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     ...t.dbSync ? [] : [{ level: "warning", message: "DB Replication Lag Detected" }],
     ...o ? [{ level: "critical", message: "Critical Component Failure" }] : [],
@@ -6872,7 +6940,7 @@ function Ui(t) {
     ...!o && !i && t.dbSync ? [{ level: "info", message: "All Systems Nominal" }] : []
   ];
 }
-const wi = [
+const Ei = [
   { from: [330, 120], to: [330, 260], visibleAtPhase: 3 },
   { from: [330, 260], to: [165, 390], visibleAtPhase: 4 },
   { from: [330, 260], to: [330, 390], visibleAtPhase: 4 },
@@ -6881,11 +6949,11 @@ const wi = [
   { from: [330, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" },
   { from: [495, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" }
 ];
-function Si({ config: t }) {
-  const n = j.useContext(ue), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { dispStatus: r, srv1Status: a, srv2Status: s, srv3Status: l, pdbStatus: h, sdbStatus: c, dbSync: p } = t;
-  return /* @__PURE__ */ d(Ee, { children: [
+function Ai({ config: t }) {
+  const n = q.useContext(Re), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { dispStatus: r, srv1Status: a, srv2Status: s, srv3Status: l, pdbStatus: h, sdbStatus: d, dbSync: p } = t;
+  return /* @__PURE__ */ c(Me, { children: [
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 120,
@@ -6893,11 +6961,11 @@ function Si({ config: t }) {
         zIndex: 10,
         visibleAtPhase: 2,
         color: "#00e5ff",
-        children: /* @__PURE__ */ e(nt, { status: "online", scale: 1.5 })
+        children: /* @__PURE__ */ e(yt, { status: "online", scale: 1.5 })
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 260,
@@ -6912,11 +6980,11 @@ function Si({ config: t }) {
           name: "DISP-01",
           status: r,
           context: { traffic: 78 },
-          subComponents: Rt(r),
-          graphSeries: Pt({ traffic: 78 })
+          subComponents: zt(r),
+          graphSeries: Bt({ traffic: 78 })
         },
         children: /* @__PURE__ */ e(
-          ot,
+          mt,
           {
             rotateY: o,
             autoRotate: i,
@@ -6930,7 +6998,7 @@ function Si({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 165,
         ey: 390,
@@ -6945,11 +7013,11 @@ function Si({ config: t }) {
           name: "APP-01",
           status: a,
           context: { cpuLoad: 67, memLoad: 72 },
-          subComponents: Pe(a, "APP-01", { cpuLoad: 67, memLoad: 72 }),
-          graphSeries: Ce({ cpuLoad: 67, memLoad: 72 })
+          subComponents: Ne(a, "APP-01", { cpuLoad: 67, memLoad: 72 }),
+          graphSeries: We({ cpuLoad: 67, memLoad: 72 })
         },
         children: /* @__PURE__ */ e(
-          he,
+          $e,
           {
             rotateY: o,
             autoRotate: i,
@@ -6963,7 +7031,7 @@ function Si({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 390,
@@ -6978,11 +7046,11 @@ function Si({ config: t }) {
           name: "APP-02",
           status: s,
           context: { cpuLoad: 89, memLoad: 91 },
-          subComponents: Pe(s, "APP-02", { cpuLoad: 89, memLoad: 91 }),
-          graphSeries: Ce({ cpuLoad: 89, memLoad: 91 })
+          subComponents: Ne(s, "APP-02", { cpuLoad: 89, memLoad: 91 }),
+          graphSeries: We({ cpuLoad: 89, memLoad: 91 })
         },
         children: /* @__PURE__ */ e(
-          he,
+          $e,
           {
             rotateY: o,
             autoRotate: i,
@@ -6996,7 +7064,7 @@ function Si({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 495,
         ey: 390,
@@ -7011,11 +7079,11 @@ function Si({ config: t }) {
           name: "APP-03",
           status: l,
           context: { cpuLoad: 45, memLoad: 63 },
-          subComponents: Pe(l, "APP-03", { cpuLoad: 45, memLoad: 63 }),
-          graphSeries: Ce({ cpuLoad: 45, memLoad: 63 })
+          subComponents: Ne(l, "APP-03", { cpuLoad: 45, memLoad: 63 }),
+          graphSeries: We({ cpuLoad: 45, memLoad: 63 })
         },
         children: /* @__PURE__ */ e(
-          he,
+          $e,
           {
             rotateY: o,
             autoRotate: i,
@@ -7029,7 +7097,7 @@ function Si({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 200,
         ey: 520,
@@ -7044,11 +7112,11 @@ function Si({ config: t }) {
           name: "DB-PRI",
           status: h,
           context: { capacity: 72 },
-          subComponents: Fe(h, "DB-PRI", { capacity: 72 }),
-          graphSeries: He({ capacity: 72 })
+          subComponents: Je(h, "DB-PRI", { capacity: 72 }),
+          graphSeries: et({ capacity: 72 })
         },
         children: /* @__PURE__ */ e(
-          Ne,
+          Ue,
           {
             rotateY: -o,
             autoRotate: i,
@@ -7062,7 +7130,7 @@ function Si({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 460,
         ey: 520,
@@ -7075,17 +7143,17 @@ function Si({ config: t }) {
         componentInfo: {
           type: "database",
           name: "DB-STB",
-          status: c,
+          status: d,
           context: { capacity: 72 },
-          subComponents: Fe(c, "DB-STB", { capacity: 72 }),
-          graphSeries: He({ capacity: 72 })
+          subComponents: Je(d, "DB-STB", { capacity: 72 }),
+          graphSeries: et({ capacity: 72 })
         },
         children: /* @__PURE__ */ e(
-          Ne,
+          Ue,
           {
             rotateY: o,
             autoRotate: i,
-            status: c,
+            status: d,
             name: "DB-STB",
             capacity: 72,
             connections: 0,
@@ -7095,7 +7163,7 @@ function Si({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 520,
@@ -7104,17 +7172,17 @@ function Si({ config: t }) {
         visibleAtPhase: 6,
         fixedScale: 1,
         bare: !0,
-        children: /* @__PURE__ */ e(vt, { synced: p, latencyMs: p ? 8 : 342 })
+        children: /* @__PURE__ */ e(It, { synced: p, latencyMs: p ? 8 : 342 })
       }
     ),
-    /* @__PURE__ */ e($i, { config: t })
+    /* @__PURE__ */ e(Ti, { config: t })
   ] });
 }
-function $i({ config: t }) {
-  const n = j.useContext(ue), { dispStatus: o, srv1Status: i, srv2Status: r, srv3Status: a, pdbStatus: s, sdbStatus: l, dbSync: h } = t, c = n?.isSelected && n?.isExpandedPos;
-  return n?.isSelected ? /* @__PURE__ */ d("div", { style: { pointerEvents: "none" }, children: [
+function Ti({ config: t }) {
+  const n = q.useContext(Re), { dispStatus: o, srv1Status: i, srv2Status: r, srv3Status: a, pdbStatus: s, sdbStatus: l, dbSync: h } = t, d = n?.isSelected && n?.isExpandedPos;
+  return n?.isSelected ? /* @__PURE__ */ c("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 330,
         ey: 260,
@@ -7124,12 +7192,12 @@ function $i({ config: t }) {
         offsetX: -90,
         offsetY: -40,
         align: "left",
-        isVisible: !!c,
+        isVisible: !!d,
         internalRef: o !== "online" ? "PORT-3" : void 0
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 165,
         ey: 390,
@@ -7139,12 +7207,12 @@ function $i({ config: t }) {
         offsetX: -110,
         offsetY: -30,
         align: "left",
-        isVisible: !!c,
+        isVisible: !!d,
         internalRef: i !== "online" ? "CPU-0" : void 0
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 330,
         ey: 390,
@@ -7154,12 +7222,12 @@ function $i({ config: t }) {
         offsetX: 100,
         offsetY: -80,
         align: "right",
-        isVisible: !!c,
+        isVisible: !!d,
         internalRef: r !== "online" ? "HEAP-0" : void 0
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 495,
         ey: 390,
@@ -7169,12 +7237,12 @@ function $i({ config: t }) {
         offsetX: 110,
         offsetY: -30,
         align: "right",
-        isVisible: !!c,
+        isVisible: !!d,
         internalRef: a !== "online" ? "THREAD-POOL" : void 0
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 200,
         ey: 520,
@@ -7184,12 +7252,12 @@ function $i({ config: t }) {
         offsetX: -110,
         offsetY: 30,
         align: "left",
-        isVisible: !!c,
+        isVisible: !!d,
         internalRef: s !== "online" ? s === "critical" ? "CONN-POOL" : "QUERY-CACHE" : void 0
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 460,
         ey: 520,
@@ -7199,12 +7267,12 @@ function $i({ config: t }) {
         offsetX: 110,
         offsetY: 30,
         align: "right",
-        isVisible: !!c,
+        isVisible: !!d,
         internalRef: l !== "online" ? "PLATTER-2" : void 0
       }
     ),
     !h && /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 330,
         ey: 520,
@@ -7214,86 +7282,86 @@ function $i({ config: t }) {
         offsetX: 0,
         offsetY: 60,
         align: "bottom",
-        isVisible: !!c,
+        isVisible: !!d,
         internalRef: "PLATTER-2"
       }
     )
   ] }) : null;
 }
-function Yi({ config: t, ...n }) {
+function Gi({ config: t, ...n }) {
   return /* @__PURE__ */ e(
-    xt,
+    Lt,
     {
       name: t.name,
-      status: lt(t),
-      connections: wi,
+      status: wt(t),
+      connections: Ei,
       ...n,
-      children: /* @__PURE__ */ e(Si, { config: t })
+      children: /* @__PURE__ */ e(Ai, { config: t })
     }
   );
 }
 export {
-  Mi as AIOPsDashboard,
-  ze as CPU3D,
-  Ft as Carousel,
-  et as CarouselContext,
-  tt as CarouselItemContext,
-  Mt as ComponentDialog,
-  Ni as ComponentDrillView,
-  bi as DataProvider,
-  Ne as Database3D,
-  Ii as DatabaseNode,
-  Re as DriveBay3D,
-  wi as EXCHANGE_CONNECTIONS,
-  Yi as ExchangeService,
-  Ci as HOLO_BLUE,
-  Pi as HOLO_CYAN,
-  Ze as HOLO_GLASS,
-  Te as HOLO_SURFACE,
-  oi as HistoricalGraphPanel,
-  Yt as HoloBase,
-  nt as Human3D,
-  Oi as HumanNode,
-  Be as Memory3D,
-  wt as MessageServer3D,
-  Di as MessageServerNode,
-  $t as NetworkBlock3D,
-  W as NodeCallout,
-  Me as Platter3D,
-  F as Port3D,
-  Fi as SAPService,
-  mi as SAP_CONNECTIONS,
-  P as STATUS_CFG,
-  he as Server3D,
-  Ti as ServerNode,
-  xt as Service,
-  ue as ServiceContext,
-  Nt as ServiceDialog,
-  A as ServiceNode,
-  Ht as SvgConnection,
-  vt as SyncBridge,
-  M as ThreadPool3D,
-  ot as WebDispatcher3D,
-  Li as WebDispatcherNode,
-  Ui as computeExchangeDialogAlerts,
-  Hi as computeExchangeDialogMetrics,
-  lt as computeExchangeServiceStatus,
-  Bi as computeSAPDialogAlerts,
-  zi as computeSAPDialogMetrics,
-  at as computeSAPServiceStatus,
-  ui as defaultDataTransform,
-  He as getDatabaseGraphSeries,
-  Fe as getDatabaseSubComponents,
-  Pt as getDispatcherGraphSeries,
-  Rt as getDispatcherSubComponents,
-  yi as getMessageServerGraphSeries,
-  gi as getMessageServerSubComponents,
-  Ce as getServerGraphSeries,
-  Pe as getServerSubComponents,
-  Je as makeFaceStyles,
-  pi as useAIOpsData,
-  fi as useAIOpsDataOptional,
-  Ei as useCarouselContext,
-  Ai as useCarouselItemContext,
-  Wi as useQueryResult
+  Vi as AIOPsDashboard,
+  Ke as CPU3D,
+  Xt as Carousel,
+  ut as CarouselContext,
+  bt as CarouselItemContext,
+  Vt as ComponentDialog,
+  Ui as ComponentDrillView,
+  Si as DataProvider,
+  Ue as Database3D,
+  zi as DatabaseNode,
+  De as DriveBay3D,
+  Ei as EXCHANGE_CONNECTIONS,
+  Gi as ExchangeService,
+  Di as HOLO_BLUE,
+  Ii as HOLO_CYAN,
+  ft as HOLO_GLASS,
+  ze as HOLO_SURFACE,
+  pi as HistoricalGraphPanel,
+  Gt as HoloBase,
+  yt as Human3D,
+  Bi as HumanNode,
+  Ze as Memory3D,
+  Dt as MessageServer3D,
+  Hi as MessageServerNode,
+  Wt as NetworkBlock3D,
+  N as NodeCallout,
+  Qe as Platter3D,
+  Y as Port3D,
+  Xi as SAPService,
+  Ri as SAP_CONNECTIONS,
+  C as STATUS_CFG,
+  $e as Server3D,
+  Mi as ServerNode,
+  Lt as Service,
+  Re as ServiceContext,
+  Ut as ServiceDialog,
+  E as ServiceNode,
+  qt as SvgConnection,
+  It as SyncBridge,
+  W as ThreadPool3D,
+  mt as WebDispatcher3D,
+  Fi as WebDispatcherNode,
+  Qi as computeExchangeDialogAlerts,
+  qi as computeExchangeDialogMetrics,
+  wt as computeExchangeServiceStatus,
+  ji as computeSAPDialogAlerts,
+  _i as computeSAPDialogMetrics,
+  vt as computeSAPServiceStatus,
+  wi as defaultDataTransform,
+  et as getDatabaseGraphSeries,
+  Je as getDatabaseSubComponents,
+  Bt as getDispatcherGraphSeries,
+  zt as getDispatcherSubComponents,
+  ki as getMessageServerGraphSeries,
+  $i as getMessageServerSubComponents,
+  We as getServerGraphSeries,
+  Ne as getServerSubComponents,
+  ht as makeFaceStyles,
+  mi as useAIOpsData,
+  xi as useAIOpsDataOptional,
+  Ni as useCarouselContext,
+  Wi as useCarouselItemContext,
+  Yi as useQueryResult
 };