react-aiops 0.1.20 → 0.1.21

package/dist/index.js

@@ -1,5 +1,5 @@
-import { jsxs as d, jsx as e, Fragment as Ie } from "react/jsx-runtime";
-import X, { createContext as He, useContext as ae, useState as R, useEffect as Oe, useMemo as Ze, useRef as Z, useCallback as ct } from "react";
+import { jsxs as d, jsx as e, Fragment as Le } from "react/jsx-runtime";
+import F, { createContext as _e, useContext as de, useState as R, useEffect as De, useMemo as Fe, useRef as J, useCallback as ct } from "react";
 const Mt = {
   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: "⚠️" },
@@ -182,7 +182,7 @@ const E = {
   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)" }
-}, Di = "#00e5ff", Ni = "#0055cc", Le = "linear-gradient(180deg, #071428 0%, #040c1c 60%, #030810 100%)", Je = "linear-gradient(180deg, rgba(10,25,50,0.35) 0%, rgba(5,15,35,0.25) 60%, rgba(3,10,20,0.15) 100%)";
+}, Di = "#00e5ff", Ni = "#0055cc", Ne = "linear-gradient(180deg, #071428 0%, #040c1c 60%, #030810 100%)", Je = "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 et(t, n, o) {
   const i = {
     position: "absolute",
@@ -233,14 +233,14 @@ function et(t, n, o) {
     }
   };
 }
-const Qe = "cubic-bezier(0.34, 1.56, 0.64, 1)", Ke = "cubic-bezier(0.16, 1, 0.3, 1)";
+const Ke = "cubic-bezier(0.34, 1.56, 0.64, 1)", Ge = "cubic-bezier(0.16, 1, 0.3, 1)";
 function xt(t) {
   return E[t]?.color ?? E.online.color;
 }
 function Bt(t, n, o) {
   return t >= o ? "#ff2255" : t >= n ? "#ff8c00" : "#00e5ff";
 }
-function We(t, n, o, i) {
+function ze(t, n, o, i) {
   return t === "offline" ? "offline" : t === "critical" && n >= i ? "critical" : (t === "critical" || t === "warning") && n >= o ? "warning" : "online";
 }
 function Ft({
@@ -265,7 +265,7 @@ function Ft({
         sublabel: b.sublabel,
         value: b.value,
         unit: b.unit ?? "%",
-        status: We(l, b.value, A, $),
+        status: ze(l, b.value, A, $),
         icon: b.icon ?? "cpu",
         delay: k,
         colorOverride: b.color,
@@ -274,7 +274,7 @@ function Ft({
       };
     });
   else {
-    const b = p.cpuLoad ?? p.traffic ?? 50, k = p.memLoad ?? p.queueDepth ?? 60, A = p.capacity ?? 72, $ = We(l, b, 70, 85), S = We(l, k, 75, 88), N = We(l, A, 75, 90);
+    const b = p.cpuLoad ?? p.traffic ?? 50, k = p.memLoad ?? p.queueDepth ?? 60, A = p.capacity ?? 72, $ = ze(l, b, 70, 85), S = ze(l, k, 75, 88), N = ze(l, A, 75, 90);
     w = [
       {
         id: "cpu",
@@ -323,7 +323,7 @@ function Ft({
         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 ${Ke}, transform 0.55s ${Qe}`,
+        transition: `opacity 0.45s ${Ge}, transform 0.55s ${Ke}`,
         pointerEvents: o ? "auto" : "none",
         zIndex: 9999,
         animation: o ? "comp-dialog-border-glow 3s ease-in-out infinite" : "none",
@@ -594,7 +594,7 @@ function Ut({
         gap: 16,
         opacity: n ? 1 : 0,
         transform: n ? "translateY(0)" : "translateY(12px)",
-        transition: `opacity 0.4s ${Ke} ${0.3 + c * 0.12}s, transform 0.5s ${Qe} ${0.3 + c * 0.12}s`
+        transition: `opacity 0.4s ${Ge} ${0.3 + c * 0.12}s, transform 0.5s ${Ke} ${0.3 + c * 0.12}s`
       },
       children: [
         /* @__PURE__ */ d(
@@ -612,7 +612,7 @@ function Ut({
               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 ${Ke} ${0.35 + c * 0.12}s both` : "none"
             },
             children: [
               /* @__PURE__ */ e(Ht, { type: u, color: y }),
@@ -714,7 +714,7 @@ function Ut({
                       background: `linear-gradient(90deg, ${h}66, ${h})`,
                       boxShadow: `0 0 8px ${h}44`,
                       transformOrigin: "left center",
-                      animation: n ? `comp-dialog-metric-fill 0.8s ${Ke} ${0.4 + c * 0.12}s both` : "none"
+                      animation: n ? `comp-dialog-metric-fill 0.8s ${Ge} ${0.4 + c * 0.12}s both` : "none"
                     }
                   }
                 ),
@@ -893,12 +893,12 @@ function Ht({ type: t, color: n }) {
     /* @__PURE__ */ e("line", { x1: "18", y1: "12", x2: "21", y2: "12", stroke: n, strokeWidth: "0.8" })
   ] });
 }
-const tt = He(null), it = He({ index: 0 });
+const tt = _e(null), it = _e({ index: 0 });
 function Wi() {
-  return ae(tt);
+  return de(tt);
 }
 function Mi() {
-  return ae(it);
+  return de(it);
 }
 function Yt({
   children: t,
@@ -926,17 +926,17 @@ function Yt({
   selectedSystemAlerts: $
 }) {
   const [S, N] = R(0);
-  Oe(() => {
+  De(() => {
     let I;
     if ((o === "compact" || o === "collapsing") && f) {
-      const H = () => {
-        N((de) => de + g), I = requestAnimationFrame(H);
+      const Y = () => {
+        N((fe) => fe + g), I = requestAnimationFrame(Y);
       };
-      I = requestAnimationFrame(H);
+      I = requestAnimationFrame(Y);
     }
     return () => cancelAnimationFrame(I);
   }, [o, f, g]);
-  const B = X.Children.toArray(t), z = B.length, U = Ze(
+  const B = F.Children.toArray(t), z = B.length, H = Fe(
     () => ({
       totalSystems: z,
       carouselRotation: S,
@@ -967,8 +967,8 @@ function Yt({
       x,
       h
     ]
-  ), le = B.map((I, H) => /* @__PURE__ */ e(it.Provider, { value: { index: H }, children: I }, H)), se = o === "expanded" || o === "expanding" && i >= 4;
-  return /* @__PURE__ */ d(tt.Provider, { value: U, children: [
+  ), ce = B.map((I, Y) => /* @__PURE__ */ e(it.Provider, { value: { index: Y }, children: I }, Y)), pe = o === "expanded" || o === "expanding" && i >= 4;
+  return /* @__PURE__ */ d(tt.Provider, { value: H, children: [
     /* @__PURE__ */ d("div", { style: { position: "relative", width: h, height: y, margin: "0 auto", flexShrink: 0 }, children: [
       n && (o === "compact" || o === "collapsing") && /* @__PURE__ */ e(
         "img",
@@ -990,7 +990,7 @@ function Yt({
           }
         }
       ),
-      le
+      ce
     ] }),
     r && /* @__PURE__ */ e("div", { onClick: (I) => I.stopPropagation(), children: /* @__PURE__ */ e(
       zt,
@@ -998,7 +998,7 @@ function Yt({
         name: r,
         status: b,
         dbSync: k,
-        visible: se && !a,
+        visible: pe && !a,
         metrics: A,
         alerts: $
       }
@@ -1062,7 +1062,7 @@ function Vt({
         )
       }
     ),
-    r && /* @__PURE__ */ d(Ie, { children: [
+    r && /* @__PURE__ */ d(Le, { children: [
       /* @__PURE__ */ e("circle", { r: "3", fill: a, opacity: 0.85, children: /* @__PURE__ */ e(
         "animateMotion",
         {
@@ -1298,7 +1298,7 @@ function jt({
     }, children: r })
   ] });
 }
-const ye = He(null), Xt = "cubic-bezier(0.34, 1.56, 0.64, 1)", pt = 330, ft = 340, qt = 660;
+const ve = _e(null), Xt = "cubic-bezier(0.34, 1.56, 0.64, 1)", pt = 330, ft = 340, qt = 660;
 function vt({
   name: t,
   status: n = "online",
@@ -1320,24 +1320,24 @@ function vt({
   _onComponentClick: x,
   _containerWidth: w
 }) {
-  const b = ae(tt), k = ae(it), A = a ?? k.index, $ = s ?? b?.totalSystems ?? 1, S = l ?? b?.carouselRotation ?? 0, N = u ?? b?.viewState ?? "compact", B = c ?? b?.animPhase ?? 0, z = p ?? b?.selectedSystem ?? null, U = f ?? b?.selectedComponent ?? null, le = g ?? b?.rotateY ?? 20, se = h ?? b?.autoRotateComponents ?? !0, I = y ?? b?.componentScale ?? 0.35, H = m ?? b?.drillZoom ?? 3.3, de = v ?? b?.onSelectSystem, ce = x ?? b?.onComponentClick, Y = w ?? b?.containerWidth ?? 950, V = z === t, L = V && (N === "expanded" || N === "expanding" && B >= 1), K = !L, pe = (Y - qt) / 2, me = pt + pe, xe = A / $ * Math.PI * 2 + S, Ye = 420, Ve = 160, fe = me + Math.cos(xe) * Ye, C = 450 + Math.sin(xe) * Ve, ue = Math.round(C), te = !V && (N === "expanding" || N === "expanded"), he = te ? 0 : 1, J = K ? 0.3 + (Math.sin(xe) + 1) * 0.1 : 1, _ = K ? J : I, ve = N === "compact" || N === "collapsing" ? "none" : "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)", De = V && U, _e = De ? H : 1, At = U?.ex ?? 330, It = U?.ey ?? 300, { size: Ot = 90, color: Lt = "#00e5ff", widthRatio: Dt = 3 } = i ?? {}, Nt = {
+  const b = de(tt), k = de(it), A = a ?? k.index, $ = s ?? b?.totalSystems ?? 1, S = l ?? b?.carouselRotation ?? 0, N = u ?? b?.viewState ?? "compact", B = c ?? b?.animPhase ?? 0, z = p ?? b?.selectedSystem ?? null, H = f ?? b?.selectedComponent ?? null, ce = g ?? b?.rotateY ?? 20, pe = h ?? b?.autoRotateComponents ?? !0, I = y ?? b?.componentScale ?? 0.35, Y = m ?? b?.drillZoom ?? 3.3, fe = v ?? b?.onSelectSystem, V = x ?? b?.onComponentClick, _ = w ?? b?.containerWidth ?? 950, j = z === t, L = j && (N === "expanded" || N === "expanding" && B >= 1), G = !L, ue = (_ - qt) / 2, ne = pt + ue, ee = A / $ * Math.PI * 2 + S, we = 420, he = 160, be = ne + Math.cos(ee) * we, C = 450 + Math.sin(ee) * he, ge = Math.round(C), oe = !j && (N === "expanding" || N === "expanded"), ye = oe ? 0 : 1, te = G ? 0.3 + (Math.sin(ee) + 1) * 0.1 : 1, X = G ? te : I, Se = N === "compact" || N === "collapsing" ? "none" : "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)", We = j && H, je = We ? Y : 1, At = H?.ex ?? 330, It = H?.ey ?? 300, { size: Ot = 90, color: Lt = "#00e5ff", widthRatio: Dt = 3 } = i ?? {}, Nt = {
     name: t,
-    isSelected: V,
+    isSelected: j,
     isExpandedPos: L,
-    isCompact: K,
+    isCompact: G,
     animPhase: B,
-    compactCx: fe,
+    compactCx: be,
     compactCy: C,
-    groupScale: J,
-    effectiveScale: _,
-    transitionValue: ve,
-    rotateY: le,
-    autoRotateComponents: se,
-    onComponentClick: ce,
-    selectedComponentName: U?.name ?? null,
-    expandedOffsetX: pe
+    groupScale: te,
+    effectiveScale: X,
+    transitionValue: Se,
+    rotateY: ce,
+    autoRotateComponents: pe,
+    onComponentClick: V,
+    selectedComponentName: H?.name ?? null,
+    expandedOffsetX: ue
   };
-  return /* @__PURE__ */ e(ye.Provider, { value: Nt, children: /* @__PURE__ */ d(
+  return /* @__PURE__ */ e(ve.Provider, { value: Nt, children: /* @__PURE__ */ d(
     "div",
     {
       style: {
@@ -1347,20 +1347,20 @@ function vt({
         width: "100%",
         height: "100%",
         pointerEvents: "none",
-        opacity: he,
+        opacity: ye,
         transition: `opacity 0.8s ease, filter 0.5s ease, transform 0.6s ${Xt}`,
-        filter: K && Math.sin(xe) < -0.5 ? "brightness(0.5) blur(2px)" : "none",
-        zIndex: V ? 500 : te ? 0 : ue,
-        transformOrigin: `${me}px ${ft}px`,
-        transform: De ? `translate(${-(At - pt) * _e}px, ${-(It - ft) * _e}px) scale(${_e})` : "none"
+        filter: G && Math.sin(ee) < -0.5 ? "brightness(0.5) blur(2px)" : "none",
+        zIndex: j ? 500 : oe ? 0 : ge,
+        transformOrigin: `${ne}px ${ft}px`,
+        transform: We ? `translate(${-(At - pt) * je}px, ${-(It - ft) * je}px) scale(${je})` : "none"
       },
       children: [
-        K && !te && /* @__PURE__ */ e(
+        G && !oe && /* @__PURE__ */ e(
           "div",
           {
             style: {
               position: "absolute",
-              left: fe,
+              left: be,
               top: C,
               width: 160,
               height: 180,
@@ -1369,19 +1369,19 @@ function vt({
               cursor: "pointer",
               zIndex: 101
             },
-            onClick: (ee) => {
-              ee.stopPropagation(), de?.(t);
+            onClick: (ie) => {
+              ie.stopPropagation(), fe?.(t);
             }
           }
         ),
-        K && (n === "warning" || n === "critical") && /* @__PURE__ */ e(
+        G && (n === "warning" || n === "critical") && /* @__PURE__ */ e(
           "div",
           {
             style: {
               position: "absolute",
-              left: fe,
+              left: be,
               top: C - 200,
-              transform: `translate(-50%, -50%) scale(${J})`,
+              transform: `translate(-50%, -50%) scale(${te})`,
               zIndex: 110,
               pointerEvents: "none",
               animation: "holo-led-blink 1.5s infinite",
@@ -1427,13 +1427,13 @@ function vt({
           {
             style: {
               position: "absolute",
-              left: L ? me : fe,
+              left: L ? ne : be,
               top: L ? 48 : C - 180,
-              transform: `translate(-50%, -50%) scale(${L ? 1.2 : J * 1.5})`,
+              transform: `translate(-50%, -50%) scale(${L ? 1.2 : te * 1.5})`,
               opacity: 1,
               pointerEvents: "none",
               zIndex: 100,
-              transition: ve,
+              transition: Se,
               fontSize: 36,
               fontWeight: 700,
               letterSpacing: "0.18em",
@@ -1453,23 +1453,23 @@ function vt({
             style: {
               position: "absolute",
               top: 0,
-              left: L ? pe : 0,
+              left: L ? ue : 0,
               width: 660,
               height: 640,
               pointerEvents: "none",
               zIndex: 0,
-              transition: ve
+              transition: Se
             },
-            children: o.map((ee, Wt) => /* @__PURE__ */ e(
+            children: o.map((ie, Wt) => /* @__PURE__ */ e(
               Vt,
               {
-                x1: ee.from[0],
-                y1: ee.from[1],
-                x2: ee.to[0],
-                y2: ee.to[1],
-                show: V && B >= (ee.visibleAtPhase ?? 0),
-                color: ee.color,
-                dur: ee.duration
+                x1: ie.from[0],
+                y1: ie.from[1],
+                x2: ie.to[0],
+                y2: ie.to[1],
+                show: j && B >= (ie.visibleAtPhase ?? 0),
+                color: ie.color,
+                dur: ie.duration
               },
               Wt
             ))
@@ -1480,10 +1480,10 @@ function vt({
           {
             style: {
               position: "absolute",
-              left: L ? me : fe,
+              left: L ? ne : be,
               top: L ? 570 : C + 70,
-              transform: `translate(-50%, -50%) scaleX(${L ? 1 : 0.4}) scaleY(${L ? 1 : 0.6}) scale(${L ? 1 : J})`,
-              transition: ve,
+              transform: `translate(-50%, -50%) scaleX(${L ? 1 : 0.4}) scaleY(${L ? 1 : 0.6}) scale(${L ? 1 : te})`,
+              transition: Se,
               zIndex: 1
             },
             children: /* @__PURE__ */ e(jt, { size: Ot, color: Lt, widthRatio: Dt, children: /* @__PURE__ */ e("div", { className: "base-hotspot" }) })
@@ -1506,7 +1506,7 @@ function W({
   align: u = "right",
   internalRef: c
 }) {
-  const p = ae(ye), f = p?.expandedOffsetX ?? 0;
+  const p = de(ve), f = p?.expandedOffsetX ?? 0;
   if (o === "online") return null;
   const g = l && !!p?.isExpandedPos, h = E[o]?.color ?? E.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 = "";
@@ -1712,7 +1712,7 @@ function T({
   bare: g = !1,
   alert: h
 }) {
-  const y = ae(ye);
+  const y = de(ve);
   if (!y)
     throw new Error("ServiceNode must be used inside a <Service> component.");
   const {
@@ -1726,10 +1726,10 @@ function T({
     onComponentClick: $,
     selectedComponentName: S,
     expandedOffsetX: N
-  } = y, z = p === 0 || y.isSelected && v >= p ? 1 : 0, U = x + o.x, le = w + o.y, se = m ? t + N : U, I = m ? n : le, H = f !== void 0 ? f : y.isCompact ? b : k, de = !!c && !!S && c.name === S, { effectiveSeverity: ce, callout: Y } = Ze(
+  } = y, z = p === 0 || y.isSelected && v >= p ? 1 : 0, H = x + o.x, ce = w + o.y, pe = m ? t + N : H, I = m ? n : ce, Y = f !== void 0 ? f : y.isCompact ? b : k, fe = !!c && !!S && c.name === S, { effectiveSeverity: V, callout: _ } = Fe(
     () => Jt(c, h),
     [c, h]
-  ), V = ce !== "online" ? E[ce]?.color ?? a : a, L = ce === "offline" ? "#4a6a8a" : V, K = c && m && $ ? () => $({
+  ), j = V !== "online" ? E[V]?.color ?? a : a, L = V === "offline" ? "#4a6a8a" : j, G = c && m && $ ? () => $({
     type: c.type,
     name: c.name,
     status: c.status,
@@ -1739,22 +1739,27 @@ function T({
     dialogMetrics: c.dialogMetrics,
     subComponents: c.subComponents,
     graphSeries: c.graphSeries
-  }) : void 0, pe = c?.name ?? s ?? "";
-  return /* @__PURE__ */ d(Ie, { children: [
+  }) : void 0, ue = c?.name ?? s ?? "", ne = c?.status ?? "online", ee = V !== "online" && V !== ne, we = Fe(() => ee ? F.Children.map(
+    r,
+    (he) => F.isValidElement(he) ? F.cloneElement(he, {
+      status: V
+    }) : he
+  ) : r, [r, ee, V]);
+  return /* @__PURE__ */ d(Le, { children: [
     /* @__PURE__ */ e(
       "div",
       {
         style: {
           position: "absolute",
-          left: se,
+          left: pe,
           top: I,
-          transform: `translate(-50%, -50%) scale(${H})`,
+          transform: `translate(-50%, -50%) scale(${Y})`,
           opacity: z,
           zIndex: i,
           transition: A || "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)",
           pointerEvents: m && z >= 0.5 ? "auto" : "none"
         },
-        children: g ? r : /* @__PURE__ */ e(
+        children: g ? we : /* @__PURE__ */ e(
           ei,
           {
             statusColor: L,
@@ -1763,25 +1768,25 @@ function T({
             delay: u,
             showLabels: m,
             isCompact: y.isCompact,
-            onClick: K,
-            isSelected: de,
-            children: r
+            onClick: G,
+            isSelected: fe,
+            children: we
           }
         )
       }
     ),
-    Y && /* @__PURE__ */ e(
+    _ && /* @__PURE__ */ e(
       W,
       {
         ex: t,
         ey: n,
-        status: Y.severity,
-        title: pe,
-        msg: Y.msg,
-        offsetX: Y.offsetX ?? 110,
-        offsetY: Y.offsetY ?? -30,
-        align: Y.align ?? "right",
-        internalRef: Y.internalRef,
+        status: _.severity,
+        title: ue,
+        msg: _.msg,
+        offsetX: _.offsetX ?? 110,
+        offsetY: _.offsetY ?? -30,
+        align: _.align ?? "right",
+        internalRef: _.internalRef,
         isVisible: !0
       }
     )
@@ -1827,7 +1832,7 @@ function ei({
               }
             }
           ),
-          /* @__PURE__ */ e("div", { style: s ? { background: "#040c1a", borderRadius: 2 } : void 0, children: s && X.isValidElement(t) ? X.cloneElement(t, {
+          /* @__PURE__ */ e("div", { style: s ? { background: "#040c1a", borderRadius: 2 } : void 0, children: s && F.isValidElement(t) ? F.cloneElement(t, {
             _compact: !0
           }) : t })
         ] }),
@@ -1883,7 +1888,7 @@ function $t({ synced: t, latencyMs: n }) {
     ] })
   ] });
 }
-const ie = 140, j = 240, re = 160, we = et(ie, j, re);
+const re = 140, q = 240, se = 160, $e = et(re, q, se);
 function ti({
   cfg: t,
   name: n,
@@ -1903,9 +1908,9 @@ function ti({
     "div",
     {
       style: {
-        width: ie,
-        height: j,
-        background: a ? Le : Je,
+        width: re,
+        height: q,
+        background: a ? Ne : Je,
         position: "relative",
         overflow: "hidden",
         fontFamily: "'Courier New', monospace",
@@ -2301,8 +2306,8 @@ function ii() {
     "div",
     {
       style: {
-        width: ie,
-        height: j,
+        width: re,
+        height: q,
         background: "linear-gradient(180deg, #040c1a 0%, #030810 100%)",
         position: "relative",
         overflow: "hidden",
@@ -2420,8 +2425,8 @@ function ht({
     "div",
     {
       style: {
-        width: re,
-        height: j,
+        width: se,
+        height: q,
         background: i ? "linear-gradient(90deg, #040c1c 0%, #071428 60%, #040c1c 100%)" : "linear-gradient(90deg, #040c1c 0%, #071428 40%, #040c1c 100%)",
         position: "relative",
         overflow: "hidden"
@@ -2440,13 +2445,13 @@ function ht({
             }
           }
         ),
-        [8, j - 20].map((r) => /* @__PURE__ */ e(
+        [8, q - 20].map((r) => /* @__PURE__ */ e(
           "div",
           {
             style: {
               position: "absolute",
               top: r,
-              left: i ? 10 : re - 18,
+              left: i ? 10 : se - 18,
               width: 8,
               height: 8,
               borderRadius: 1,
@@ -2462,8 +2467,8 @@ function ht({
           {
             style: {
               position: "absolute",
-              top: j * 0.35,
-              bottom: j * 0.15,
+              top: q * 0.35,
+              bottom: q * 0.15,
               left: i ? 22 : 18,
               right: i ? 18 : 22,
               display: "flex",
@@ -2491,8 +2496,8 @@ function ht({
           {
             style: {
               position: "absolute",
-              top: j * 0.18,
-              left: i ? 12 : re - 78,
+              top: q * 0.18,
+              left: i ? 12 : se - 78,
               fontSize: 7,
               color: "#1a3050",
               letterSpacing: "0.2em",
@@ -2511,13 +2516,13 @@ function ht({
   );
 }
 function ni({ 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((re - 18) / 7);
+  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((se - 18) / 7);
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
-        width: ie,
-        height: re,
+        width: re,
+        height: se,
         background: "linear-gradient(180deg, #0c1c30 0%, #070f1e 40%, #040c1a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -2531,7 +2536,7 @@ function ni({ cpuLoad: t }) {
               top: 0,
               left: 0,
               right: 0,
-              height: re * 0.4,
+              height: se * 0.4,
               background: `radial-gradient(ellipse at 50% 0%, ${o} 0%, transparent 70%)`
             }
           }
@@ -2590,7 +2595,7 @@ function ni({ cpuLoad: t }) {
     }
   );
 }
-function ge({
+function xe({
   rotateX: t = -22,
   rotateY: n = 20,
   rotateZ: o = 0,
@@ -2603,8 +2608,8 @@ function ge({
   brandLabel: c = "BUSAUD",
   _compact: p
 }) {
-  const [f, g] = R(n), h = Z(0), y = Z(0);
-  Oe(() => {
+  const [f, g] = R(n), h = J(0), y = J(0);
+  De(() => {
     if (!r) {
       g(n);
       return;
@@ -2621,8 +2626,8 @@ function ge({
     "div",
     {
       style: {
-        width: ie * i,
-        height: j * i,
+        width: re * i,
+        height: q * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -2674,8 +2679,8 @@ function ge({
           {
             style: {
               position: "absolute",
-              width: ie * 1.4 * i,
-              height: j * 0.8 * i,
+              width: re * 1.4 * i,
+              height: q * 0.8 * i,
               background: `radial-gradient(ellipse, ${m.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(45 * i)}px)`,
               pointerEvents: "none",
@@ -2698,15 +2703,15 @@ function ge({
               "div",
               {
                 style: {
-                  width: ie,
-                  height: j,
+                  width: re,
+                  height: q,
                   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(
+                  /* @__PURE__ */ e("div", { style: $e.front, children: /* @__PURE__ */ e(
                     ti,
                     {
                       cfg: m,
@@ -2718,16 +2723,16 @@ function ge({
                       brandLabel: c
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: we.back, children: /* @__PURE__ */ e(ii, {}) }),
-                  /* @__PURE__ */ e("div", { style: we.left, children: /* @__PURE__ */ e(ht, { side: "left", color: m.color, brandLabel: c }) }),
-                  /* @__PURE__ */ e("div", { style: we.right, children: /* @__PURE__ */ e(ht, { side: "right", color: m.color, brandLabel: c }) }),
-                  /* @__PURE__ */ e("div", { style: we.top, children: /* @__PURE__ */ e(ni, { cpuLoad: l }) }),
-                  /* @__PURE__ */ e("div", { style: we.bottom, children: /* @__PURE__ */ e(
+                  /* @__PURE__ */ e("div", { style: $e.back, children: /* @__PURE__ */ e(ii, {}) }),
+                  /* @__PURE__ */ e("div", { style: $e.left, children: /* @__PURE__ */ e(ht, { side: "left", color: m.color, brandLabel: c }) }),
+                  /* @__PURE__ */ e("div", { style: $e.right, children: /* @__PURE__ */ e(ht, { side: "right", color: m.color, brandLabel: c }) }),
+                  /* @__PURE__ */ e("div", { style: $e.top, children: /* @__PURE__ */ e(ni, { cpuLoad: l }) }),
+                  /* @__PURE__ */ e("div", { style: $e.bottom, children: /* @__PURE__ */ e(
                     "div",
                     {
                       style: {
-                        width: ie,
-                        height: re,
+                        width: re,
+                        height: se,
                         background: "linear-gradient(180deg, #030710, #020508)"
                       }
                     }
@@ -2782,12 +2787,12 @@ function zi({
         graphSeries: m
       },
       alert: v,
-      children: /* @__PURE__ */ e(ge, { status: a, cpuLoad: p, memLoad: f, brandLabel: g })
+      children: /* @__PURE__ */ e(xe, { status: a, cpuLoad: p, memLoad: f, brandLabel: g })
     }
   );
 }
-const Ge = 12, be = 55, G = be * 2, Re = 52, nt = 10, je = 3 * Re + 2 * nt, Se = 2 * Math.PI * be / Ge, Xe = Array.from({ length: Ge }, (t, n) => n / Ge * 360);
-function qe(t) {
+const Ze = 12, me = 55, Z = me * 2, Ce = 52, nt = 10, Xe = 3 * Ce + 2 * nt, ke = 2 * Math.PI * me / Ze, qe = Array.from({ length: Ze }, (t, n) => n / Ze * 360);
+function Qe(t) {
   return Math.cos(t * Math.PI / 180) * 0.42 + 0.58;
 }
 function oi({
@@ -2798,25 +2803,25 @@ function oi({
   capacity: r,
   compact: a
 }) {
-  return /* @__PURE__ */ d(Ie, { children: [
-    Xe.map((s, l) => {
-      const u = qe(s), c = l === 0, p = Math.round(4 + u * 9), f = Math.round(12 + u * 22), g = Math.round(28 + u * 44), h = Math.round(u * 0.55 * 255).toString(16).padStart(2, "0");
+  return /* @__PURE__ */ d(Le, { children: [
+    qe.map((s, l) => {
+      const u = Qe(s), c = l === 0, p = Math.round(4 + u * 9), f = Math.round(12 + u * 22), g = Math.round(28 + u * 44), h = Math.round(u * 0.55 * 255).toString(16).padStart(2, "0");
       return /* @__PURE__ */ e(
         "div",
         {
           style: {
             position: "absolute",
-            width: Se,
-            height: Re,
-            left: (G - Se) / 2,
+            width: ke,
+            height: Ce,
+            left: (Z - ke) / 2,
             top: t,
-            transform: `rotateY(${s}deg) translateZ(${be}px)`,
+            transform: `rotateY(${s}deg) translateZ(${me}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})`,
             borderLeft: `1px solid ${o.color}${h}`,
             boxShadow: c ? `inset 0 0 18px ${o.color}28` : "none"
           },
-          children: c && /* @__PURE__ */ d(Ie, { children: [
+          children: c && /* @__PURE__ */ d(Le, { children: [
             /* @__PURE__ */ e(
               "div",
               {
@@ -2869,10 +2874,10 @@ function oi({
       {
         style: {
           position: "absolute",
-          width: G + 4,
-          height: G + 4,
+          width: Z + 4,
+          height: Z + 4,
           left: -2,
-          top: t - be,
+          top: t - me,
           borderRadius: "50%",
           transform: "rotateX(90deg)",
           backfaceVisibility: "hidden",
@@ -2930,10 +2935,10 @@ function oi({
       {
         style: {
           position: "absolute",
-          width: G + 4,
-          height: G + 4,
+          width: Z + 4,
+          height: Z + 4,
           left: -2,
-          top: t + Re - be,
+          top: t + Ce - me,
           borderRadius: "50%",
           transform: "rotateX(-90deg)",
           backfaceVisibility: "hidden",
@@ -2957,18 +2962,18 @@ function oi({
         )
       }
     ),
-    i && Xe.map((s, l) => {
-      const u = qe(s);
+    i && qe.map((s, l) => {
+      const u = Qe(s);
       return /* @__PURE__ */ e(
         "div",
         {
           style: {
             position: "absolute",
-            width: Se + 1.5,
+            width: ke + 1.5,
             height: 6,
-            left: (G - Se - 1.5) / 2,
-            top: t + Re - 3,
-            transform: `rotateY(${s}deg) translateZ(${be + 1.5}px)`,
+            left: (Z - ke - 1.5) / 2,
+            top: t + Ce - 3,
+            transform: `rotateY(${s}deg) translateZ(${me + 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}`,
@@ -2978,18 +2983,18 @@ function oi({
         `rng${n}${l}`
       );
     }),
-    i && Xe.map((s, l) => {
-      const u = qe(s), c = Math.round(2 + u * 4), p = Math.round(5 + u * 10), f = Math.round(12 + u * 20);
+    i && qe.map((s, l) => {
+      const u = Qe(s), c = Math.round(2 + u * 4), p = Math.round(5 + u * 10), f = Math.round(12 + u * 20);
       return /* @__PURE__ */ e(
         "div",
         {
           style: {
             position: "absolute",
-            width: Se,
+            width: ke,
             height: nt,
-            left: (G - Se) / 2,
-            top: t + Re,
-            transform: `rotateY(${s}deg) translateZ(${be}px)`,
+            left: (Z - ke) / 2,
+            top: t + Ce,
+            transform: `rotateY(${s}deg) translateZ(${me}px)`,
             backfaceVisibility: "hidden",
             background: `rgb(${c},${p},${f})`
           }
@@ -2999,7 +3004,7 @@ function oi({
     })
   ] });
 }
-function Ne({
+function Me({
   rotateX: t = -22,
   rotateY: n = -15,
   rotateZ: o = 0,
@@ -3011,8 +3016,8 @@ function Ne({
   // connections = 284,
   _compact: l
 }) {
-  const [u, c] = R(n), p = Z(0), f = Z(0);
-  Oe(() => {
+  const [u, c] = R(n), p = J(0), f = J(0);
+  De(() => {
     if (!r) {
       c(n);
       return;
@@ -3029,8 +3034,8 @@ function Ne({
     "div",
     {
       style: {
-        width: G * i,
-        height: je * i,
+        width: Z * i,
+        height: Xe * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -3090,8 +3095,8 @@ function Ne({
           {
             style: {
               position: "absolute",
-              width: G * 2.8 * i,
-              height: je * 0.85 * i,
+              width: Z * 2.8 * i,
+              height: Xe * 0.85 * i,
               background: `radial-gradient(ellipse, ${g.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(50 * i)}px)`,
               pointerEvents: "none",
@@ -3114,8 +3119,8 @@ function Ne({
               "div",
               {
                 style: {
-                  width: G,
-                  height: je,
+                  width: Z,
+                  height: Xe,
                   position: "relative",
                   transformStyle: "preserve-3d",
                   transform: `rotateX(${t}deg) rotateY(${u}deg) rotateZ(${o}deg)`,
@@ -3124,7 +3129,7 @@ function Ne({
                 children: [0, 1, 2].map((h) => /* @__PURE__ */ e(
                   oi,
                   {
-                    diskY: h * (Re + nt),
+                    diskY: h * (Ce + nt),
                     diskIdx: h,
                     cfg: g,
                     hasRingBelow: h < 2,
@@ -3180,7 +3185,7 @@ function Bi({
         graphSeries: h
       },
       alert: y,
-      children: /* @__PURE__ */ e(Ne, { status: a, capacity: p })
+      children: /* @__PURE__ */ e(Me, { status: a, capacity: p })
     }
   );
 }
@@ -3319,7 +3324,7 @@ function Fi({
     }
   );
 }
-const ne = 190, q = 72, Ee = 120, $e = et(ne, q, Ee);
+const ae = 190, Q = 72, Pe = 120, Re = et(ae, Q, Pe);
 function ri({
   cfg: t,
   name: n,
@@ -3332,9 +3337,9 @@ function ri({
     "div",
     {
       style: {
-        width: ne,
-        height: q,
-        background: r ? Le : Je,
+        width: ae,
+        height: Q,
+        background: r ? Ne : Je,
         position: "relative",
         overflow: "hidden",
         fontFamily: "'Courier New', monospace",
@@ -3587,8 +3592,8 @@ function ai() {
     "div",
     {
       style: {
-        width: ne,
-        height: q,
+        width: ae,
+        height: Q,
         background: "linear-gradient(180deg, #040c1a, #030810)",
         position: "relative",
         overflow: "hidden",
@@ -3603,7 +3608,7 @@ function ai() {
           {
             style: {
               width: 40,
-              height: q - 16,
+              height: Q - 16,
               background: "#020710",
               border: "1px solid #1a2d40",
               borderRadius: 2,
@@ -3659,7 +3664,7 @@ function ai() {
             style: {
               marginLeft: "auto",
               width: 12,
-              height: q - 16,
+              height: Q - 16,
               background: "#020710",
               border: "1px solid #1a3050",
               borderRadius: 1
@@ -3675,8 +3680,8 @@ function bt({ side: t, color: n }) {
     "div",
     {
       style: {
-        width: Ee,
-        height: q,
+        width: Pe,
+        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"
@@ -3700,8 +3705,8 @@ function bt({ side: t, color: n }) {
           {
             style: {
               position: "absolute",
-              top: q * 0.25,
-              bottom: q * 0.25,
+              top: Q * 0.25,
+              bottom: Q * 0.25,
               left: 14,
               right: 14,
               display: "flex",
@@ -3728,13 +3733,13 @@ function bt({ side: t, color: n }) {
   );
 }
 function li({ traffic: t }) {
-  const n = Math.floor((Ee - 14) / 7);
+  const n = Math.floor((Pe - 14) / 7);
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
-        width: ne,
-        height: Ee,
+        width: ae,
+        height: Pe,
         background: "linear-gradient(180deg, #0c1c30 0%, #07101e 40%, #040c1a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -3748,7 +3753,7 @@ function li({ traffic: t }) {
               top: 0,
               left: 0,
               right: 0,
-              height: Ee * 0.35,
+              height: Pe * 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%)`
@@ -3798,8 +3803,8 @@ function rt({
   activeRoutes: u = 12,
   _compact: c
 }) {
-  const [p, f] = R(n), g = Z(0), h = Z(0);
-  Oe(() => {
+  const [p, f] = R(n), g = J(0), h = J(0);
+  De(() => {
     if (!r) {
       f(n);
       return;
@@ -3816,8 +3821,8 @@ function rt({
     "div",
     {
       style: {
-        width: ne * i,
-        height: q * i,
+        width: ae * i,
+        height: Q * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -3877,8 +3882,8 @@ function rt({
           {
             style: {
               position: "absolute",
-              width: ne * 1.3 * i,
-              height: q * 2 * i,
+              width: ae * 1.3 * i,
+              height: Q * 2 * i,
               background: `radial-gradient(ellipse, ${y.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(40 * i)}px)`,
               pointerEvents: "none",
@@ -3901,15 +3906,15 @@ function rt({
               "div",
               {
                 style: {
-                  width: ne,
-                  height: q,
+                  width: ae,
+                  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: $e.front, children: /* @__PURE__ */ e(
+                  /* @__PURE__ */ e("div", { style: Re.front, children: /* @__PURE__ */ e(
                     ri,
                     {
                       cfg: y,
@@ -3919,11 +3924,11 @@ function rt({
                       compact: c
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: $e.back, children: /* @__PURE__ */ e(ai, {}) }),
-                  /* @__PURE__ */ e("div", { style: $e.left, children: /* @__PURE__ */ e(bt, { side: "left", color: y.color }) }),
-                  /* @__PURE__ */ e("div", { style: $e.right, children: /* @__PURE__ */ e(bt, { side: "right", color: y.color }) }),
-                  /* @__PURE__ */ e("div", { style: $e.top, children: /* @__PURE__ */ e(li, { traffic: l }) }),
-                  /* @__PURE__ */ e("div", { style: $e.bottom, children: /* @__PURE__ */ e("div", { style: { width: ne, height: Ee, background: "#020508" } }) })
+                  /* @__PURE__ */ e("div", { style: Re.back, children: /* @__PURE__ */ e(ai, {}) }),
+                  /* @__PURE__ */ e("div", { style: Re.left, children: /* @__PURE__ */ e(bt, { side: "left", color: y.color }) }),
+                  /* @__PURE__ */ e("div", { style: Re.right, children: /* @__PURE__ */ e(bt, { side: "right", color: y.color }) }),
+                  /* @__PURE__ */ e("div", { style: Re.top, children: /* @__PURE__ */ e(li, { traffic: l }) }),
+                  /* @__PURE__ */ e("div", { style: Re.bottom, children: /* @__PURE__ */ e("div", { style: { width: ae, height: Pe, background: "#020508" } }) })
                 ]
               }
             )
@@ -3977,7 +3982,7 @@ function Ui({
     }
   );
 }
-const oe = 190, Q = 72, Ce = 120, ke = et(oe, Q, Ce), gt = {
+const le = 190, K = 72, Te = 120, Ee = et(le, K, Te), gt = {
   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)" },
@@ -3996,9 +4001,9 @@ function si({
     "div",
     {
       style: {
-        width: oe,
-        height: Q,
-        background: a ? Le : Je,
+        width: le,
+        height: K,
+        background: a ? Ne : Je,
         position: "relative",
         overflow: "hidden",
         fontFamily: "'Courier New', monospace",
@@ -4247,8 +4252,8 @@ function di() {
     "div",
     {
       style: {
-        width: oe,
-        height: Q,
+        width: le,
+        height: K,
         background: "linear-gradient(180deg, #040c1a, #030810)",
         position: "relative",
         overflow: "hidden",
@@ -4263,7 +4268,7 @@ function di() {
           {
             style: {
               width: 40,
-              height: Q - 16,
+              height: K - 16,
               background: "#020710",
               border: "1px solid #1a2d40",
               borderRadius: 2,
@@ -4319,7 +4324,7 @@ function di() {
             style: {
               marginLeft: "auto",
               width: 12,
-              height: Q - 16,
+              height: K - 16,
               background: "#020710",
               border: "1px solid #1a3050",
               borderRadius: 1
@@ -4335,8 +4340,8 @@ function yt({ side: t, color: n }) {
     "div",
     {
       style: {
-        width: Ce,
-        height: Q,
+        width: Te,
+        height: K,
         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"
@@ -4360,8 +4365,8 @@ function yt({ side: t, color: n }) {
           {
             style: {
               position: "absolute",
-              top: Q * 0.25,
-              bottom: Q * 0.25,
+              top: K * 0.25,
+              bottom: K * 0.25,
               left: 14,
               right: 14,
               display: "flex",
@@ -4388,13 +4393,13 @@ function yt({ side: t, color: n }) {
   );
 }
 function ci({ queueDepth: t, color: n }) {
-  const o = Math.floor((Ce - 14) / 7);
+  const o = Math.floor((Te - 14) / 7);
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
-        width: oe,
-        height: Ce,
+        width: le,
+        height: Te,
         background: "linear-gradient(180deg, #0c1c30 0%, #07101e 40%, #040c1a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -4408,7 +4413,7 @@ function ci({ queueDepth: t, color: n }) {
               top: 0,
               left: 0,
               right: 0,
-              height: Ce * 0.35,
+              height: Te * 0.35,
               background: `radial-gradient(ellipse at 50% 0%,
           ${t > 70 ? "rgba(255,34,85,0.14)" : `${n}15`} 0%,
           transparent 70%)`
@@ -4459,8 +4464,8 @@ function kt({
   instances: c = 3,
   _compact: p
 }) {
-  const [f, g] = R(n), h = Z(0), y = Z(0);
-  Oe(() => {
+  const [f, g] = R(n), h = J(0), y = J(0);
+  De(() => {
     if (!r) {
       g(n);
       return;
@@ -4477,8 +4482,8 @@ function kt({
     "div",
     {
       style: {
-        width: oe * i,
-        height: Q * i,
+        width: le * i,
+        height: K * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -4538,8 +4543,8 @@ function kt({
           {
             style: {
               position: "absolute",
-              width: oe * 1.3 * i,
-              height: Q * 2 * i,
+              width: le * 1.3 * i,
+              height: K * 2 * i,
               background: `radial-gradient(ellipse, ${m.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(40 * i)}px)`,
               pointerEvents: "none",
@@ -4562,15 +4567,15 @@ function kt({
               "div",
               {
                 style: {
-                  width: oe,
-                  height: Q,
+                  width: le,
+                  height: K,
                   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: ke.front, children: /* @__PURE__ */ e(
+                  /* @__PURE__ */ e("div", { style: Ee.front, children: /* @__PURE__ */ e(
                     si,
                     {
                       cfg: m,
@@ -4581,11 +4586,11 @@ function kt({
                       compact: p
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: ke.back, children: /* @__PURE__ */ e(di, {}) }),
-                  /* @__PURE__ */ e("div", { style: ke.left, children: /* @__PURE__ */ e(yt, { side: "left", color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: ke.right, children: /* @__PURE__ */ e(yt, { side: "right", color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: ke.top, children: /* @__PURE__ */ e(ci, { queueDepth: l, color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: ke.bottom, children: /* @__PURE__ */ e("div", { style: { width: oe, height: Ce, background: "#020508" } }) })
+                  /* @__PURE__ */ e("div", { style: Ee.back, children: /* @__PURE__ */ e(di, {}) }),
+                  /* @__PURE__ */ e("div", { style: Ee.left, children: /* @__PURE__ */ e(yt, { side: "left", color: m.color }) }),
+                  /* @__PURE__ */ e("div", { style: Ee.right, children: /* @__PURE__ */ e(yt, { side: "right", color: m.color }) }),
+                  /* @__PURE__ */ e("div", { style: Ee.top, children: /* @__PURE__ */ e(ci, { queueDepth: l, color: m.color }) }),
+                  /* @__PURE__ */ e("div", { style: Ee.bottom, children: /* @__PURE__ */ e("div", { style: { width: le, height: Te, background: "#020508" } }) })
                 ]
               }
             )
@@ -4796,7 +4801,7 @@ function Rt({
       style: {
         width: t,
         height: n,
-        background: Le,
+        background: Ne,
         position: "relative",
         overflow: "hidden",
         borderRadius: 2,
@@ -4873,7 +4878,7 @@ function Rt({
     }
   );
 }
-function ze({
+function Ue({
   color: t = "#00e5ff",
   label: n = "CPU-0",
   status: o = "online",
@@ -4886,7 +4891,7 @@ function ze({
         style: {
           width: 52,
           height: 36,
-          background: Le,
+          background: Ne,
           position: "relative",
           borderRadius: 2,
           border: `1px solid ${t}55`,
@@ -4984,7 +4989,7 @@ function ze({
     )
   ] });
 }
-function Be({
+function He({
   color: t = "#00e5ff",
   label: n = "HEAP-0",
   status: o = "online",
@@ -5081,7 +5086,7 @@ function Be({
     )
   ] });
 }
-function Pe({
+function Ae({
   color: t = "#00e5ff",
   label: n = "DRIVE-1",
   status: o = "online",
@@ -5131,7 +5136,7 @@ function Et({
       style: {
         width: 48,
         height: 28,
-        background: Le,
+        background: Ne,
         position: "relative",
         borderRadius: 2,
         border: `1px solid ${t}44`,
@@ -5191,7 +5196,7 @@ function M({
 }) {
   return /* @__PURE__ */ e(Rt, { w: 44, h: 28, color: t, label: n, status: o });
 }
-function Me({
+function Be({
   color: t = "#ff8c00",
   label: n = "PLATTER-0",
   status: o = "online",
@@ -5275,7 +5280,7 @@ function Me({
     )
   ] });
 }
-function F({
+function U({
   color: t = "#00e5ff",
   label: n = "PORT-1",
   status: o = "online"
@@ -5491,7 +5496,7 @@ function yi({
         key: "cpu0",
         delay: 0,
         el: /* @__PURE__ */ e(
-          ze,
+          Ue,
           {
             color: a,
             label: "CPU-0",
@@ -5505,7 +5510,7 @@ function yi({
         key: "cpu1",
         delay: 1,
         el: /* @__PURE__ */ e(
-          ze,
+          Ue,
           {
             color: a,
             label: "CPU-1",
@@ -5519,7 +5524,7 @@ function yi({
         key: "heap0",
         delay: 2,
         el: /* @__PURE__ */ e(
-          Be,
+          He,
           {
             color: "#8855ee",
             label: "HEAP-0",
@@ -5533,7 +5538,7 @@ function yi({
         key: "heap1",
         delay: 3,
         el: /* @__PURE__ */ e(
-          Be,
+          He,
           {
             color: "#8855ee",
             label: "HEAP-1",
@@ -5546,13 +5551,13 @@ function yi({
       {
         key: "d1",
         delay: 4,
-        el: /* @__PURE__ */ e(Pe, { color: a, label: "DRIVE-1", status: i[4]?.status, activity: !0 })
+        el: /* @__PURE__ */ e(Ae, { color: a, label: "DRIVE-1", status: i[4]?.status, activity: !0 })
       },
       {
         key: "d2",
         delay: 5,
         el: /* @__PURE__ */ e(
-          Pe,
+          Ae,
           {
             color: a,
             label: "DRIVE-2",
@@ -5565,7 +5570,7 @@ function yi({
         key: "d3",
         delay: 6,
         el: /* @__PURE__ */ e(
-          Pe,
+          Ae,
           {
             color: a,
             label: "DRIVE-3",
@@ -5622,7 +5627,7 @@ function yi({
             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`
           },
-          children: /* @__PURE__ */ e(F, { color: a, label: `PORT-${c + 1}`, status: p?.status })
+          children: /* @__PURE__ */ e(U, { color: a, label: `PORT-${c + 1}`, status: p?.status })
         },
         `p${c}`
       );
@@ -5688,7 +5693,7 @@ function yi({
                 transform: `scale(${r >= 0.25 + l * 0.1 ? 1 : 0.6})`,
                 transition: `all 0.4s ${D} ${l * 0.08}s`
               },
-              children: /* @__PURE__ */ e(F, { color: "#bb55ff", label: `INST-${l}`, status: i[l]?.status })
+              children: /* @__PURE__ */ e(U, { color: "#bb55ff", label: `INST-${l}`, status: i[l]?.status })
             },
             l
           )),
@@ -5748,7 +5753,7 @@ function yi({
                 transition: `all 0.45s ${D} ${u * 0.1}s`
               },
               children: /* @__PURE__ */ e(
-                Me,
+                Be,
                 {
                   color: s,
                   label: `PLATTER-${u}`,
@@ -6109,15 +6114,15 @@ function mi({ onSubmit: t }) {
     /* @__PURE__ */ e("div", { className: "cred-footer", children: "CREDENTIALS ARE STORED IN MEMORY ONLY" })
   ] }) });
 }
-const at = He(null);
+const at = _e(null);
 function xi() {
-  const t = ae(at);
+  const t = de(at);
   if (!t)
     throw new Error("useAIOpsData must be used within an AIOPsDashboard with dataEndpoint configured");
   return t;
 }
 function vi() {
-  return ae(at);
+  return de(at);
 }
 function Vi(t) {
   const { data: n } = xi();
@@ -6139,9 +6144,9 @@ function Si(t) {
   return t;
 }
 function $i({ config: t, children: n }) {
-  const [o, i] = R({}), [r, a] = R(null), [s, l] = R(!1), [u, c] = R(null), [p, f] = R(null), g = Z(t);
+  const [o, i] = R({}), [r, a] = R(null), [s, l] = R(!1), [u, c] = R(null), [p, f] = R(null), g = J(t);
   g.current = t;
-  const h = Z(r);
+  const h = J(r);
   h.current = r;
   const y = ct(async () => {
     const x = h.current, w = g.current;
@@ -6179,7 +6184,7 @@ function $i({ config: t, children: n }) {
       }
     }
   }, []);
-  Oe(() => {
+  De(() => {
     if (!r) return;
     y();
     const x = g.current.refreshInterval ?? 6e4, w = window.setInterval(y, x);
@@ -6234,34 +6239,34 @@ function mt({
     v === "compact" && (A(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");
     }, 2400));
-  }, U = () => {
+  }, H = () => {
     $ ? (S(null), B(0)) : v === "expanded" && (x("collapsing"), b(0), A(null), setTimeout(() => {
       x((C) => C === "collapsing" ? "compact" : C);
     }, 1e3));
-  }, le = (C) => {
+  }, ce = (C) => {
     S(C), B(0);
   };
-  X.useEffect(() => {
+  F.useEffect(() => {
     if (!$) return;
-    const C = performance.now(), ue = 1200, te = () => {
-      const J = performance.now() - C, _ = Math.min(1, J / ue);
-      B(_), _ < 1 && requestAnimationFrame(te);
-    }, he = requestAnimationFrame(te);
-    return () => cancelAnimationFrame(he);
+    const C = performance.now(), ge = 1200, oe = () => {
+      const te = performance.now() - C, X = Math.min(1, te / ge);
+      B(X), X < 1 && requestAnimationFrame(oe);
+    }, ye = requestAnimationFrame(oe);
+    return () => cancelAnimationFrame(ye);
   }, [$]);
-  const se = () => {
+  const pe = () => {
     S(null), B(0);
-  }, I = o.find((C) => C.name === k), H = I?.status ?? "online", de = I?.dbSync ?? !0, ce = I?.metrics, Y = I?.alerts, V = u ?? Si, L = p?.data, K = Ze(() => !L || !l ? c : X.Children.map(c, (C) => {
-    if (!X.isValidElement(C)) return C;
-    const ue = C.props.name;
-    if (!ue || !l[ue]) return C;
-    const te = l[ue], he = {};
-    for (const [J, _] of Object.entries(te)) {
-      const dt = typeof _ == "string" ? _ : _.query, ve = typeof _ == "object" && _.transform ? _.transform : V, De = L[dt];
-      De !== void 0 && (he[J] = ve(De));
+  }, I = o.find((C) => C.name === k), Y = I?.status ?? "online", fe = I?.dbSync ?? !0, V = I?.metrics, _ = I?.alerts, j = u ?? Si, L = p?.data, G = Fe(() => !L || !l ? c : F.Children.map(c, (C) => {
+    if (!F.isValidElement(C)) return C;
+    const ge = C.props.name;
+    if (!ge || !l[ge]) return C;
+    const oe = l[ge], ye = {};
+    for (const [te, X] of Object.entries(oe)) {
+      const dt = typeof X == "string" ? X : X.query, Se = typeof X == "object" && X.transform ? X.transform : j, We = L[dt];
+      We !== void 0 && (ye[te] = Se(We));
     }
-    return Object.keys(he).length > 0 ? X.cloneElement(C, he) : C;
-  }), [c, L, l, V]), pe = p?.lastRefreshError ?? null, me = 330, xe = 340, Ye = $ ? 1.15 : 1, Ve = $ ? -($.ex - me) * 0.06 : 0, fe = $ ? -($.ey - xe) * 0.06 : 0;
+    return Object.keys(ye).length > 0 ? F.cloneElement(C, ye) : C;
+  }), [c, L, l, j]), ue = p?.lastRefreshError ?? null, ne = 330, ee = 340, we = $ ? 1.15 : 1, he = $ ? -($.ex - ne) * 0.06 : 0, be = $ ? -($.ey - ee) * 0.06 : 0;
   return /* @__PURE__ */ d("div", { className: "app", style: s ? { fontFamily: s } : void 0, children: [
     /* @__PURE__ */ e(
       "div",
@@ -6276,7 +6281,7 @@ function mt({
           backgroundPosition: "center center",
           backgroundRepeat: "no-repeat",
           transition: "transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1)",
-          transform: `translate(${Ve}px, ${fe}px) scale(${Ye})`,
+          transform: `translate(${he}px, ${be}px) scale(${we})`,
           willChange: "transform"
         }
       }
@@ -6287,7 +6292,7 @@ function mt({
         /* @__PURE__ */ e("span", { className: "brand-text", children: t })
       ] }),
       /* @__PURE__ */ d("div", { className: "hdr-right", children: [
-        pe && /* @__PURE__ */ d("div", { className: "hdr-refresh-error", children: [
+        ue && /* @__PURE__ */ d("div", { className: "hdr-refresh-error", children: [
           /* @__PURE__ */ e("span", { className: "refresh-error-dot" }),
           /* @__PURE__ */ e("span", { className: "refresh-error-text", children: "DATA REFRESH FAILED" })
         ] }),
@@ -6301,7 +6306,7 @@ function mt({
         style: {
           cursor: v === "expanded" ? "zoom-out" : "default"
         },
-        onClick: U,
+        onClick: H,
         children: /* @__PURE__ */ e(
           Yt,
           {
@@ -6318,14 +6323,14 @@ function mt({
             carouselSpeed: a,
             logoUrl: r,
             onSelectSystem: z,
-            onBackgroundClick: U,
-            onComponentClick: le,
-            onCloseDrill: se,
-            selectedSystemStatus: H,
-            selectedSystemDbSync: de,
-            selectedSystemMetrics: ce,
-            selectedSystemAlerts: Y,
-            children: K
+            onBackgroundClick: H,
+            onComponentClick: ce,
+            onCloseDrill: pe,
+            selectedSystemStatus: Y,
+            selectedSystemDbSync: fe,
+            selectedSystemMetrics: V,
+            selectedSystemAlerts: _,
+            children: G
           }
         )
       }
@@ -6341,21 +6346,21 @@ function P(t, n, o = 24) {
 function Ct(t) {
   return t === "critical" || t === "offline" ? "#ff2255" : t === "warning" ? "#ff8c00" : "#00e5ff";
 }
-function Te(t, n, o) {
+function Ie(t, n, o) {
   const i = t === "online" ? "online" : t, r = Ct(t), a = o?.cpuLoad ?? 50, s = o?.memLoad ?? 60, l = i === "critical" || i === "warning" && a > 80 ? i : "online", u = i === "warning" && s > 85 ? "warning" : i === "critical" ? "critical" : "online", c = 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: u, detail: u === "warning" ? "Memory heap usage" : u === "critical" ? "OOM risk" : void 0, element: /* @__PURE__ */ e(Be, { color: "#8855ee", label: "HEAP-0", status: u, 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(Pe, { color: r, label: "DRIVE-1", status: "online", activity: !0 }) },
-    { id: "drive-2", label: "DRIVE-2", status: "online", element: /* @__PURE__ */ e(Pe, { color: r, label: "DRIVE-2", status: "online", activity: a > 30 }) },
-    { id: "drive-3", label: "DRIVE-3", status: "online", element: /* @__PURE__ */ e(Pe, { color: r, label: "DRIVE-3", status: "online", activity: a > 50 }) },
+    { id: "cpu-0", label: "CPU-0", status: l, detail: i === "critical" ? "Core overload" : i === "warning" ? "Load spike" : void 0, element: /* @__PURE__ */ e(Ue, { color: r, label: "CPU-0", status: l, load: a }) },
+    { id: "cpu-1", label: "CPU-1", status: "online", element: /* @__PURE__ */ e(Ue, { color: r, label: "CPU-1", status: "online", load: a * 0.7 }) },
+    { id: "heap-0", label: "HEAP-0", status: u, detail: u === "warning" ? "Memory heap usage" : u === "critical" ? "OOM risk" : void 0, element: /* @__PURE__ */ e(He, { color: "#8855ee", label: "HEAP-0", status: u, usedPercent: s }) },
+    { id: "heap-1", label: "HEAP-1", status: "online", element: /* @__PURE__ */ e(He, { color: "#8855ee", label: "HEAP-1", status: "online", usedPercent: s * 0.85 }) },
+    { id: "drive-1", label: "DRIVE-1", status: "online", element: /* @__PURE__ */ e(Ae, { color: r, label: "DRIVE-1", status: "online", activity: !0 }) },
+    { id: "drive-2", label: "DRIVE-2", status: "online", element: /* @__PURE__ */ e(Ae, { color: r, label: "DRIVE-2", status: "online", activity: a > 30 }) },
+    { id: "drive-3", label: "DRIVE-3", status: "online", element: /* @__PURE__ */ e(Ae, { 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(Et, { color: r, label: "NET", status: p }) }
   ];
 }
-function Ae(t) {
+function Oe(t) {
   const n = t?.cpuLoad ?? 50, o = t?.memLoad ?? 60;
   return [
     { id: "cpu", label: "CPU-0", unit: "%", color: "#00e5ff", data: P(n, 15) },
@@ -6371,14 +6376,14 @@ function Ae(t) {
 function Pt(t, n, o) {
   const i = t === "online" ? "online" : t, r = Ct(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: "port-1", label: "PORT-1", status: "online", element: /* @__PURE__ */ e(U, { color: r, label: "PORT-1", status: "online" }) },
+    { id: "port-2", label: "PORT-2", status: "online", element: /* @__PURE__ */ e(U, { 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(U, { color: r, label: "PORT-3", status: a }) },
+    { id: "port-4", label: "PORT-4", status: "online", element: /* @__PURE__ */ e(U, { 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(U, { color: r, label: "PORT-5", status: s }) },
+    { id: "port-6", label: "PORT-6", status: "online", element: /* @__PURE__ */ e(U, { color: r, label: "PORT-6", status: "online" }) },
+    { id: "port-7", label: "PORT-7", status: "online", element: /* @__PURE__ */ e(U, { color: r, label: "PORT-7", status: "online" }) },
+    { id: "port-8", label: "PORT-8", status: "online", element: /* @__PURE__ */ e(U, { 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" }) }
   ];
@@ -6396,9 +6401,9 @@ function Tt(t) {
 function ki(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: "inst-0", label: "INST-0", status: "online", element: /* @__PURE__ */ e(U, { color: "#bb55ff", label: "INST-0", status: "online" }) },
+    { id: "inst-1", label: "INST-1", status: "online", element: /* @__PURE__ */ e(U, { 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(U, { 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" }) },
@@ -6415,17 +6420,17 @@ function Ri(t) {
     { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: P(n * 0.9, 15) }
   ];
 }
-function Fe(t, n, o) {
+function Ye(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", u = i === "critical" ? "critical" : "online", c = 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: "platter-0", label: "PLATTER-0", status: "online", element: /* @__PURE__ */ e(Be, { 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(Be, { 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(Be, { color: r, label: "PLATTER-2", status: l, capacityPercent: a }) },
     { id: "conn-pool", label: "CONN-POOL", status: u, detail: u === "critical" ? "Pool exhausted" : void 0, element: /* @__PURE__ */ e(M, { color: r, label: "CONN-POOL", status: u }) },
     { 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 }) }
   ];
 }
-function Ue(t) {
+function Ve(t) {
   const n = t?.capacity ?? 70;
   return [
     { id: "platter0", label: "PLATTER-0 I/O", unit: "%", color: "#ff8c00", data: P(40, 20) },
@@ -6492,8 +6497,8 @@ const Ei = [
   { from: [495, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" }
 ];
 function Ci({ config: t }) {
-  const n = X.useContext(ye), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { wdStatus: r, msStatus: a, srv1Status: s, srv2Status: l, srv3Status: u, pdbStatus: c, sdbStatus: p, dbSync: f } = t;
-  return /* @__PURE__ */ d(Ie, { children: [
+  const n = F.useContext(ve), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { wdStatus: r, msStatus: a, srv1Status: s, srv2Status: l, srv3Status: u, pdbStatus: c, sdbStatus: p, dbSync: f } = t;
+  return /* @__PURE__ */ d(Le, { children: [
     /* @__PURE__ */ e(
       T,
       {
@@ -6589,11 +6594,11 @@ function Ci({ config: t }) {
           name: "APP-01",
           status: s,
           context: { cpuLoad: 67, memLoad: 72 },
-          subComponents: Te(s, "APP-01", { cpuLoad: 67, memLoad: 72 }),
-          graphSeries: Ae({ cpuLoad: 67, memLoad: 72 })
+          subComponents: Ie(s, "APP-01", { cpuLoad: 67, memLoad: 72 }),
+          graphSeries: Oe({ cpuLoad: 67, memLoad: 72 })
         },
         children: /* @__PURE__ */ e(
-          ge,
+          xe,
           {
             rotateY: o,
             autoRotate: i,
@@ -6622,11 +6627,11 @@ function Ci({ config: t }) {
           name: "APP-02",
           status: l,
           context: { cpuLoad: 89, memLoad: 91 },
-          subComponents: Te(l, "APP-02", { cpuLoad: 89, memLoad: 91 }),
-          graphSeries: Ae({ cpuLoad: 89, memLoad: 91 })
+          subComponents: Ie(l, "APP-02", { cpuLoad: 89, memLoad: 91 }),
+          graphSeries: Oe({ cpuLoad: 89, memLoad: 91 })
         },
         children: /* @__PURE__ */ e(
-          ge,
+          xe,
           {
             rotateY: o,
             autoRotate: i,
@@ -6655,11 +6660,11 @@ function Ci({ config: t }) {
           name: "APP-03",
           status: u,
           context: { cpuLoad: 45, memLoad: 63 },
-          subComponents: Te(u, "APP-03", { cpuLoad: 45, memLoad: 63 }),
-          graphSeries: Ae({ cpuLoad: 45, memLoad: 63 })
+          subComponents: Ie(u, "APP-03", { cpuLoad: 45, memLoad: 63 }),
+          graphSeries: Oe({ cpuLoad: 45, memLoad: 63 })
         },
         children: /* @__PURE__ */ e(
-          ge,
+          xe,
           {
             rotateY: o,
             autoRotate: i,
@@ -6688,11 +6693,11 @@ function Ci({ config: t }) {
           name: "DB-PRI",
           status: c,
           context: { capacity: 72 },
-          subComponents: Fe(c, "DB-PRI", { capacity: 72 }),
-          graphSeries: Ue({ capacity: 72 })
+          subComponents: Ye(c, "DB-PRI", { capacity: 72 }),
+          graphSeries: Ve({ capacity: 72 })
         },
         children: /* @__PURE__ */ e(
-          Ne,
+          Me,
           {
             rotateY: -o,
             autoRotate: i,
@@ -6721,11 +6726,11 @@ function Ci({ config: t }) {
           name: "DB-STB",
           status: p,
           context: { capacity: 72 },
-          subComponents: Fe(p, "DB-STB", { capacity: 72 }),
-          graphSeries: Ue({ capacity: 72 })
+          subComponents: Ye(p, "DB-STB", { capacity: 72 }),
+          graphSeries: Ve({ capacity: 72 })
         },
         children: /* @__PURE__ */ e(
-          Ne,
+          Me,
           {
             rotateY: o,
             autoRotate: i,
@@ -6755,7 +6760,7 @@ function Ci({ config: t }) {
   ] });
 }
 function Pi({ config: t }) {
-  const n = X.useContext(ye), { wdStatus: o, msStatus: i, srv1Status: r, srv2Status: a, srv3Status: s, pdbStatus: l, sdbStatus: u, dbSync: c } = t, p = n?.isSelected && n?.isExpandedPos;
+  const n = F.useContext(ve), { wdStatus: o, msStatus: i, srv1Status: r, srv2Status: a, srv3Status: s, pdbStatus: l, sdbStatus: u, dbSync: c } = t, p = n?.isSelected && n?.isExpandedPos;
   return n?.isSelected ? /* @__PURE__ */ d("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
       W,
@@ -6943,8 +6948,8 @@ const Ti = [
   { from: [495, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" }
 ];
 function Ai({ config: t }) {
-  const n = X.useContext(ye), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { dispStatus: r, srv1Status: a, srv2Status: s, srv3Status: l, pdbStatus: u, sdbStatus: c, dbSync: p } = t;
-  return /* @__PURE__ */ d(Ie, { children: [
+  const n = F.useContext(ve), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { dispStatus: r, srv1Status: a, srv2Status: s, srv3Status: l, pdbStatus: u, sdbStatus: c, dbSync: p } = t;
+  return /* @__PURE__ */ d(Le, { children: [
     /* @__PURE__ */ e(
       T,
       {
@@ -7006,11 +7011,11 @@ function Ai({ config: t }) {
           name: "APP-01",
           status: a,
           context: { cpuLoad: 67, memLoad: 72 },
-          subComponents: Te(a, "APP-01", { cpuLoad: 67, memLoad: 72 }),
-          graphSeries: Ae({ cpuLoad: 67, memLoad: 72 })
+          subComponents: Ie(a, "APP-01", { cpuLoad: 67, memLoad: 72 }),
+          graphSeries: Oe({ cpuLoad: 67, memLoad: 72 })
         },
         children: /* @__PURE__ */ e(
-          ge,
+          xe,
           {
             rotateY: o,
             autoRotate: i,
@@ -7039,11 +7044,11 @@ function Ai({ config: t }) {
           name: "APP-02",
           status: s,
           context: { cpuLoad: 89, memLoad: 91 },
-          subComponents: Te(s, "APP-02", { cpuLoad: 89, memLoad: 91 }),
-          graphSeries: Ae({ cpuLoad: 89, memLoad: 91 })
+          subComponents: Ie(s, "APP-02", { cpuLoad: 89, memLoad: 91 }),
+          graphSeries: Oe({ cpuLoad: 89, memLoad: 91 })
         },
         children: /* @__PURE__ */ e(
-          ge,
+          xe,
           {
             rotateY: o,
             autoRotate: i,
@@ -7072,11 +7077,11 @@ function Ai({ config: t }) {
           name: "APP-03",
           status: l,
           context: { cpuLoad: 45, memLoad: 63 },
-          subComponents: Te(l, "APP-03", { cpuLoad: 45, memLoad: 63 }),
-          graphSeries: Ae({ cpuLoad: 45, memLoad: 63 })
+          subComponents: Ie(l, "APP-03", { cpuLoad: 45, memLoad: 63 }),
+          graphSeries: Oe({ cpuLoad: 45, memLoad: 63 })
         },
         children: /* @__PURE__ */ e(
-          ge,
+          xe,
           {
             rotateY: o,
             autoRotate: i,
@@ -7105,11 +7110,11 @@ function Ai({ config: t }) {
           name: "DB-PRI",
           status: u,
           context: { capacity: 72 },
-          subComponents: Fe(u, "DB-PRI", { capacity: 72 }),
-          graphSeries: Ue({ capacity: 72 })
+          subComponents: Ye(u, "DB-PRI", { capacity: 72 }),
+          graphSeries: Ve({ capacity: 72 })
         },
         children: /* @__PURE__ */ e(
-          Ne,
+          Me,
           {
             rotateY: -o,
             autoRotate: i,
@@ -7138,11 +7143,11 @@ function Ai({ config: t }) {
           name: "DB-STB",
           status: c,
           context: { capacity: 72 },
-          subComponents: Fe(c, "DB-STB", { capacity: 72 }),
-          graphSeries: Ue({ capacity: 72 })
+          subComponents: Ye(c, "DB-STB", { capacity: 72 }),
+          graphSeries: Ve({ capacity: 72 })
         },
         children: /* @__PURE__ */ e(
-          Ne,
+          Me,
           {
             rotateY: o,
             autoRotate: i,
@@ -7172,7 +7177,7 @@ function Ai({ config: t }) {
   ] });
 }
 function Ii({ config: t }) {
-  const n = X.useContext(ye), { dispStatus: o, srv1Status: i, srv2Status: r, srv3Status: a, pdbStatus: s, sdbStatus: l, dbSync: u } = t, c = n?.isSelected && n?.isExpandedPos;
+  const n = F.useContext(ve), { dispStatus: o, srv1Status: i, srv2Status: r, srv3Status: a, pdbStatus: s, sdbStatus: l, dbSync: u } = t, c = n?.isSelected && n?.isExpandedPos;
   return n?.isSelected ? /* @__PURE__ */ d("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
       W,
@@ -7295,40 +7300,40 @@ function Gi({ config: t, ...n }) {
 }
 export {
   _i as AIOPsDashboard,
-  ze as CPU3D,
+  Ue as CPU3D,
   Yt as Carousel,
   tt as CarouselContext,
   it as CarouselItemContext,
   Ft as ComponentDialog,
   Yi as ComponentDrillView,
   $i as DataProvider,
-  Ne as Database3D,
+  Me as Database3D,
   Bi as DatabaseNode,
-  Pe as DriveBay3D,
+  Ae as DriveBay3D,
   Ti as EXCHANGE_CONNECTIONS,
   Gi as ExchangeService,
   Ni as HOLO_BLUE,
   Di as HOLO_CYAN,
   Je as HOLO_GLASS,
-  Le as HOLO_SURFACE,
+  Ne as HOLO_SURFACE,
   fi as HistoricalGraphPanel,
   jt as HoloBase,
   ot as Human3D,
   Fi as HumanNode,
-  Be as Memory3D,
+  He as Memory3D,
   kt as MessageServer3D,
   Hi as MessageServerNode,
   Et as NetworkBlock3D,
   W as NodeCallout,
-  Me as Platter3D,
-  F as Port3D,
+  Be as Platter3D,
+  U as Port3D,
   qi as SAPService,
   Ei as SAP_CONNECTIONS,
   E as STATUS_CFG,
-  ge as Server3D,
+  xe as Server3D,
   zi as ServerNode,
   vt as Service,
-  ye as ServiceContext,
+  ve as ServiceContext,
   zt as ServiceDialog,
   T as ServiceNode,
   Vt as SvgConnection,
@@ -7343,14 +7348,14 @@ export {
   ji as computeSAPDialogMetrics,
   lt as computeSAPServiceStatus,
   Si as defaultDataTransform,
-  Ue as getDatabaseGraphSeries,
-  Fe as getDatabaseSubComponents,
+  Ve as getDatabaseGraphSeries,
+  Ye as getDatabaseSubComponents,
   Tt as getDispatcherGraphSeries,
   Pt as getDispatcherSubComponents,
   Ri as getMessageServerGraphSeries,
   ki as getMessageServerSubComponents,
-  Ae as getServerGraphSeries,
-  Te as getServerSubComponents,
+  Oe as getServerGraphSeries,
+  Ie as getServerSubComponents,
   et as makeFaceStyles,
   xi as useAIOpsData,
   vi as useAIOpsDataOptional,