react-aiops 0.1.18 → 0.1.19

package/dist/index.js

@@ -1,11 +1,11 @@
-import { jsxs as d, jsx as e, Fragment as Ae } from "react/jsx-runtime";
-import q, { createContext as He, useContext as ae, useState as R, useEffect as Te, useMemo as Ze, useRef as Z, useCallback as ct } from "react";
-const Wt = {
+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";
+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: "⚠️" },
   critical: { color: "#ff2255", bg: "rgba(255, 34, 85, 0.1)", border: "#ff2255", icon: "🛑" }
 };
-function Mt({
+function zt({
   name: t,
   status: n,
   dbSync: o = !0,
@@ -146,7 +146,7 @@ function Mt({
                 }
               ),
               c.map((p, f) => {
-                const g = Wt[p.level];
+                const g = Mt[p.level];
                 return /* @__PURE__ */ d(
                   "div",
                   {
@@ -177,12 +177,12 @@ function Mt({
     }
   );
 }
-const C = {
+const E = {
   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)" }
-}, Ii = "#00e5ff", Oi = "#0055cc", Ie = "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", 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%)";
 function et(t, n, o) {
   const i = {
     position: "absolute",
@@ -234,23 +234,23 @@ 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)";
-function mt(t) {
-  return C[t]?.color ?? C.online.color;
+function xt(t) {
+  return E[t]?.color ?? E.online.color;
 }
-function zt(t, n, o) {
+function Bt(t, n, o) {
   return t >= o ? "#ff2255" : t >= n ? "#ff8c00" : "#00e5ff";
 }
 function We(t, n, o, i) {
   return t === "offline" ? "offline" : t === "critical" && n >= i ? "critical" : (t === "critical" || t === "warning") && n >= o ? "warning" : "online";
 }
-function Bt({
+function Ft({
   component: t,
   onClose: n,
   visible: o,
   sceneWidth: i = 660,
   sceneHeight: r = 600
 }) {
-  const { type: a, name: s, status: l, ex: u, ey: c, context: p = {} } = t, f = mt(l), g = u >= i / 2, h = c >= r / 2, y = {
+  const { type: a, name: s, status: l, ex: u, ey: c, context: p = {} } = t, f = xt(l), g = u >= i / 2, h = c >= r / 2, y = {
     position: "fixed",
     ...g ? { right: 28 } : { left: 28 },
     ...h ? { bottom: 110 } : { top: 72 }
@@ -519,7 +519,7 @@ function Bt({
               position: "relative",
               zIndex: 2
             },
-            children: w.map((b) => /* @__PURE__ */ e(Ft, { metric: b, visible: o, accentColor: f }, b.id))
+            children: w.map((b) => /* @__PURE__ */ e(Ut, { metric: b, visible: o, accentColor: f }, b.id))
           }
         ),
         /* @__PURE__ */ d(
@@ -568,7 +568,7 @@ function Bt({
     }
   );
 }
-function Ft({
+function Ut({
   metric: t,
   visible: n,
   accentColor: o
@@ -584,7 +584,7 @@ function Ft({
     colorOverride: p,
     warnAt: f = 70,
     critAt: g = 85
-  } = t, h = p ?? zt(a, f, g), y = p ?? mt(l);
+  } = t, h = p ?? Bt(a, f, g), y = p ?? xt(l);
   return /* @__PURE__ */ d(
     "div",
     {
@@ -615,7 +615,7 @@ function Ft({
               animation: n ? `comp-dialog-icon-pop 0.5s ${Qe} ${0.35 + c * 0.12}s both` : "none"
             },
             children: [
-              /* @__PURE__ */ e(Ut, { type: u, color: y }),
+              /* @__PURE__ */ e(Ht, { type: u, color: y }),
               (l === "warning" || l === "critical") && /* @__PURE__ */ e(
                 "div",
                 {
@@ -808,7 +808,7 @@ function Ft({
     }
   );
 }
-function Ut({ type: t, color: n }) {
+function Ht({ type: t, color: n }) {
   return t === "cpu" ? /* @__PURE__ */ d("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(
@@ -894,13 +894,13 @@ function Ut({ type: t, color: n }) {
   ] });
 }
 const tt = He(null), it = He({ index: 0 });
-function Li() {
+function Wi() {
   return ae(tt);
 }
-function Di() {
+function Mi() {
   return ae(it);
 }
-function Ht({
+function Yt({
   children: t,
   logoUrl: n,
   viewState: o,
@@ -926,17 +926,17 @@ function Ht({
   selectedSystemAlerts: $
 }) {
   const [S, N] = R(0);
-  Te(() => {
+  Oe(() => {
     let I;
     if ((o === "compact" || o === "collapsing") && f) {
-      const V = () => {
-        N((de) => de + g), I = requestAnimationFrame(V);
+      const H = () => {
+        N((de) => de + g), I = requestAnimationFrame(H);
       };
-      I = requestAnimationFrame(V);
+      I = requestAnimationFrame(H);
     }
     return () => cancelAnimationFrame(I);
   }, [o, f, g]);
-  const B = q.Children.toArray(t), z = B.length, Y = Ze(
+  const B = X.Children.toArray(t), z = B.length, U = Ze(
     () => ({
       totalSystems: z,
       carouselRotation: S,
@@ -967,8 +967,8 @@ function Ht({
       x,
       h
     ]
-  ), le = B.map((I, V) => /* @__PURE__ */ e(it.Provider, { value: { index: V }, children: I }, V)), se = o === "expanded" || o === "expanding" && i >= 4;
-  return /* @__PURE__ */ d(tt.Provider, { value: Y, children: [
+  ), 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: [
     /* @__PURE__ */ d("div", { style: { position: "relative", width: h, height: y, margin: "0 auto", flexShrink: 0 }, children: [
       n && (o === "compact" || o === "collapsing") && /* @__PURE__ */ e(
         "img",
@@ -993,7 +993,7 @@ function Ht({
       le
     ] }),
     r && /* @__PURE__ */ e("div", { onClick: (I) => I.stopPropagation(), children: /* @__PURE__ */ e(
-      Mt,
+      zt,
       {
         name: r,
         status: b,
@@ -1004,7 +1004,7 @@ function Ht({
       }
     ) }),
     a && /* @__PURE__ */ e("div", { onClick: (I) => I.stopPropagation(), children: /* @__PURE__ */ e(
-      Bt,
+      Ft,
       {
         component: a,
         onClose: w,
@@ -1015,7 +1015,7 @@ function Ht({
     ) })
   ] });
 }
-function Yt({
+function Vt({
   x1: t,
   y1: n,
   x2: o,
@@ -1062,7 +1062,7 @@ function Yt({
         )
       }
     ),
-    r && /* @__PURE__ */ d(Ae, { children: [
+    r && /* @__PURE__ */ d(Ie, { children: [
       /* @__PURE__ */ e("circle", { r: "3", fill: a, opacity: 0.85, children: /* @__PURE__ */ e(
         "animateMotion",
         {
@@ -1082,14 +1082,14 @@ function Yt({
     ] })
   ] });
 }
-const Vt = [
+const _t = [
   { 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 _t({
+function jt({
   children: t,
   size: n = 230,
   widthRatio: o = 1,
@@ -1255,7 +1255,7 @@ function _t({
         background: `radial-gradient(ellipse, ${i}88 0%, ${i}33 40%, transparent 72%)`,
         filter: "blur(12px)"
       } }),
-      Vt.map((s, l) => /* @__PURE__ */ e("div", { style: {
+      _t.map((s, l) => /* @__PURE__ */ e("div", { style: {
         position: "absolute",
         width: a * s.scale,
         height: n * s.scale,
@@ -1298,8 +1298,8 @@ function _t({
     }, children: r })
   ] });
 }
-const ge = He(null), jt = "cubic-bezier(0.34, 1.56, 0.64, 1)", pt = 330, ft = 340, Xt = 660;
-function xt({
+const ye = He(null), Xt = "cubic-bezier(0.34, 1.56, 0.64, 1)", pt = 330, ft = 340, qt = 660;
+function vt({
   name: t,
   status: n = "online",
   connections: o = [],
@@ -1320,24 +1320,24 @@ function xt({
   _onComponentClick: x,
   _containerWidth: w
 }) {
-  const b = ae(tt), k = ae(it), T = 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, Y = f ?? b?.selectedComponent ?? null, le = g ?? b?.rotateY ?? 20, se = h ?? b?.autoRotateComponents ?? !0, I = y ?? b?.componentScale ?? 0.35, V = m ?? b?.drillZoom ?? 3.3, de = v ?? b?.onSelectSystem, Oe = x ?? b?.onComponentClick, Le = w ?? b?.containerWidth ?? 950, _ = z === t, L = _ && (N === "expanded" || N === "expanding" && B >= 1), F = !L, ce = (Le - Xt) / 2, U = pt + ce, ye = T / $ * Math.PI * 2 + S, Ye = 420, Ve = 160, pe = U + Math.cos(ye) * Ye, E = 450 + Math.sin(ye) * Ve, fe = Math.round(E), te = !_ && (N === "expanding" || N === "expanded"), ue = te ? 0 : 1, J = F ? 0.3 + (Math.sin(ye) + 1) * 0.1 : 1, j = F ? J : I, me = N === "compact" || N === "collapsing" ? "none" : "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)", De = _ && Y, _e = De ? V : 1, At = Y?.ex ?? 330, Tt = Y?.ey ?? 300, { size: It = 90, color: Ot = "#00e5ff", widthRatio: Lt = 3 } = i ?? {}, Dt = {
+  const b = ae(tt), k = ae(it), T = 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 = T / $ * 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, Tt = U?.ex ?? 330, It = U?.ey ?? 300, { size: Ot = 90, color: Lt = "#00e5ff", widthRatio: Dt = 3 } = i ?? {}, Nt = {
     name: t,
-    isSelected: _,
+    isSelected: V,
     isExpandedPos: L,
-    isCompact: F,
+    isCompact: K,
     animPhase: B,
-    compactCx: pe,
-    compactCy: E,
+    compactCx: fe,
+    compactCy: C,
     groupScale: J,
-    effectiveScale: j,
-    transitionValue: me,
+    effectiveScale: _,
+    transitionValue: ve,
     rotateY: le,
     autoRotateComponents: se,
-    onComponentClick: Oe,
-    selectedComponentName: Y?.name ?? null,
-    expandedOffsetX: ce
+    onComponentClick: ce,
+    selectedComponentName: U?.name ?? null,
+    expandedOffsetX: pe
   };
-  return /* @__PURE__ */ e(ge.Provider, { value: Dt, children: /* @__PURE__ */ d(
+  return /* @__PURE__ */ e(ye.Provider, { value: Nt, children: /* @__PURE__ */ d(
     "div",
     {
       style: {
@@ -1347,21 +1347,21 @@ function xt({
         width: "100%",
         height: "100%",
         pointerEvents: "none",
-        opacity: ue,
-        transition: `opacity 0.8s ease, filter 0.5s ease, transform 0.6s ${jt}`,
-        filter: F && Math.sin(ye) < -0.5 ? "brightness(0.5) blur(2px)" : "none",
-        zIndex: _ ? 500 : te ? 0 : fe,
-        transformOrigin: `${U}px ${ft}px`,
-        transform: De ? `translate(${-(At - pt) * _e}px, ${-(Tt - ft) * _e}px) scale(${_e})` : "none"
+        opacity: he,
+        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(${-(Tt - pt) * _e}px, ${-(It - ft) * _e}px) scale(${_e})` : "none"
       },
       children: [
-        F && !te && /* @__PURE__ */ e(
+        K && !te && /* @__PURE__ */ e(
           "div",
           {
             style: {
               position: "absolute",
-              left: pe,
-              top: E,
+              left: fe,
+              top: C,
               width: 160,
               height: 180,
               transform: "translate(-50%, -80%)",
@@ -1374,13 +1374,13 @@ function xt({
             }
           }
         ),
-        F && (n === "warning" || n === "critical") && /* @__PURE__ */ e(
+        K && (n === "warning" || n === "critical") && /* @__PURE__ */ e(
           "div",
           {
             style: {
               position: "absolute",
-              left: pe,
-              top: E - 200,
+              left: fe,
+              top: C - 200,
               transform: `translate(-50%, -50%) scale(${J})`,
               zIndex: 110,
               pointerEvents: "none",
@@ -1427,13 +1427,13 @@ function xt({
           {
             style: {
               position: "absolute",
-              left: L ? U : pe,
-              top: L ? 48 : E - 180,
+              left: L ? me : fe,
+              top: L ? 48 : C - 180,
               transform: `translate(-50%, -50%) scale(${L ? 1.2 : J * 1.5})`,
               opacity: 1,
               pointerEvents: "none",
               zIndex: 100,
-              transition: me,
+              transition: ve,
               fontSize: 36,
               fontWeight: 700,
               letterSpacing: "0.18em",
@@ -1453,25 +1453,25 @@ function xt({
             style: {
               position: "absolute",
               top: 0,
-              left: L ? ce : 0,
+              left: L ? pe : 0,
               width: 660,
               height: 640,
               pointerEvents: "none",
               zIndex: 0,
-              transition: me
+              transition: ve
             },
-            children: o.map((ee, Nt) => /* @__PURE__ */ e(
-              Yt,
+            children: o.map((ee, Wt) => /* @__PURE__ */ e(
+              Vt,
               {
                 x1: ee.from[0],
                 y1: ee.from[1],
                 x2: ee.to[0],
                 y2: ee.to[1],
-                show: _ && B >= (ee.visibleAtPhase ?? 0),
+                show: V && B >= (ee.visibleAtPhase ?? 0),
                 color: ee.color,
                 dur: ee.duration
               },
-              Nt
+              Wt
             ))
           }
         ),
@@ -1480,13 +1480,13 @@ function xt({
           {
             style: {
               position: "absolute",
-              left: L ? U : pe,
-              top: L ? 570 : E + 70,
+              left: L ? me : fe,
+              top: L ? 570 : C + 70,
               transform: `translate(-50%, -50%) scaleX(${L ? 1 : 0.4}) scaleY(${L ? 1 : 0.6}) scale(${L ? 1 : J})`,
-              transition: me,
+              transition: ve,
               zIndex: 1
             },
-            children: /* @__PURE__ */ e(_t, { size: It, color: Ot, widthRatio: Lt, children: /* @__PURE__ */ e("div", { className: "base-hotspot" }) })
+            children: /* @__PURE__ */ e(jt, { size: Ot, color: Lt, widthRatio: Dt, children: /* @__PURE__ */ e("div", { className: "base-hotspot" }) })
           }
         ),
         r
@@ -1506,9 +1506,9 @@ function W({
   align: u = "right",
   internalRef: c
 }) {
-  const p = ae(ge), f = p?.expandedOffsetX ?? 0;
+  const p = ae(ye), f = p?.expandedOffsetX ?? 0;
   if (o === "online") return null;
-  const g = l && !!p?.isExpandedPos, h = C[o]?.color ?? C.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;
+  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 = "";
   if (y) {
     const S = m + (x - m) / 2;
@@ -1641,42 +1641,64 @@ function W({
     }
   );
 }
-const vt = 70, wt = 85;
-function qt(t) {
+const wt = 70, St = 85, Qt = {
+  online: 0,
+  warning: 1,
+  offline: 2,
+  critical: 3
+};
+function ut(t) {
+  return Qt[t] ?? 0;
+}
+function Kt(t) {
   if (!t) return null;
   const n = t.dialogMetrics ?? t.context?.dialogMetrics;
-  return n && n.length > 0 ? Qt(n) : Kt(t.context);
+  return n && n.length > 0 ? Gt(n) : Zt(t.context);
 }
-function Qt(t) {
+function Gt(t) {
   let n = null;
   for (const r of t) {
     if (r.color) continue;
-    const a = r.critAt ?? wt, s = r.warnAt ?? vt;
-    r.value >= a ? (!n || n.severity !== "critical") && (n = { metric: r, severity: "critical" }) : r.value >= s && (!n || n.severity !== "critical") && (n = { metric: r, severity: "warning" });
+    const a = r.critAt ?? St, s = r.warnAt ?? wt;
+    r.value >= a ? (!n || n.severity !== "critical" || r.value > n.metric.value) && (n = { metric: r, severity: "critical" }) : r.value >= s && (!n || n.severity !== "critical" && r.value > n.metric.value) && (n = { metric: r, severity: "warning" });
   }
   if (!n) return null;
   const { metric: o, severity: i } = n;
   return {
+    severity: i,
     msg: `${o.label} at ${o.value}${o.unit ?? "%"}`,
-    internalRef: o.id.toUpperCase(),
-    status: i
+    internalRef: o.id.toUpperCase()
   };
 }
-function Kt(t) {
+function Zt(t) {
   if (!t) return null;
   const n = [];
   t.cpuLoad !== void 0 && n.push({ label: "CPU", value: t.cpuLoad, id: "CPU" }), t.memLoad !== void 0 && n.push({ label: "MEM", value: t.memLoad, id: "HEAP" }), t.traffic !== void 0 && n.push({ label: "TRAFFIC", value: t.traffic, id: "NET" }), t.queueDepth !== void 0 && n.push({ label: "QUEUE", value: t.queueDepth, id: "QUEUE" }), t.capacity !== void 0 && n.push({ label: "CAPACITY", value: t.capacity, id: "DISK" });
   let o = null;
   for (const a of n)
-    a.value >= wt ? (!o || o.severity !== "critical") && (o = { entry: a, severity: "critical" }) : a.value >= vt && (!o || o.severity !== "critical") && (o = { entry: a, severity: "warning" });
+    a.value >= St ? (!o || o.severity !== "critical" || a.value > o.entry.value) && (o = { entry: a, severity: "critical" }) : a.value >= wt && (!o || o.severity !== "critical" && a.value > o.entry.value) && (o = { entry: a, severity: "warning" });
   if (!o) return null;
   const { entry: i, severity: r } = o;
   return {
+    severity: r,
     msg: `${i.label} at ${i.value}%`,
-    internalRef: i.id,
-    status: r
+    internalRef: i.id
   };
 }
+function Jt(t, n) {
+  const o = t?.status ?? "online", i = ut(o), r = Kt(t), a = r ? ut(r.severity) : 0, s = i >= a ? o : r.severity;
+  if (i === 0 && a === 0)
+    return { effectiveSeverity: "online", callout: null };
+  let l;
+  return i >= a && i > 0 ? l = {
+    severity: o,
+    msg: n?.msg ?? `Status: ${o.toUpperCase()}`,
+    internalRef: n?.internalRef,
+    offsetX: n?.offsetX,
+    offsetY: n?.offsetY,
+    align: n?.align
+  } : l = r, { effectiveSeverity: s, callout: l };
+}
 function A({
   ex: t,
   ey: n,
@@ -1693,7 +1715,7 @@ function A({
   bare: g = !1,
   alert: h
 }) {
-  const y = ae(ge);
+  const y = ae(ye);
   if (!y)
     throw new Error("ServiceNode must be used inside a <Service> component.");
   const {
@@ -1707,7 +1729,10 @@ function A({
     onComponentClick: $,
     selectedComponentName: S,
     expandedOffsetX: N
-  } = y, z = p === 0 || y.isSelected && v >= p ? 1 : 0, Y = x + o.x, le = w + o.y, se = m ? t + N : Y, I = m ? n : le, V = f !== void 0 ? f : y.isCompact ? b : k, de = !!c && !!S && c.name === S, Oe = c?.status ? C[c.status]?.color ?? a : a, Le = c?.status === "offline" ? "#4a6a8a" : Oe, _ = c && m && $ ? () => $({
+  } = 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(
+    () => Jt(c, h),
+    [c, h]
+  ), V = ce !== "online" ? E[ce]?.color ?? a : a, L = ce === "offline" ? "#4a6a8a" : V, K = c && m && $ ? () => $({
     type: c.type,
     name: c.name,
     status: c.status,
@@ -1717,11 +1742,8 @@ function A({
     dialogMetrics: c.dialogMetrics,
     subComponents: c.subComponents,
     graphSeries: c.graphSeries
-  }) : void 0, L = c?.name ?? s ?? "", F = Ze(
-    () => h ? null : qt(c),
-    [h, c]
-  ), ce = h ? c?.status ?? "online" : F?.status ?? "online", U = h ?? (F ? { msg: F.msg, internalRef: F.internalRef } : null);
-  return /* @__PURE__ */ d(Ae, { children: [
+  }) : void 0, pe = c?.name ?? s ?? "";
+  return /* @__PURE__ */ d(Ie, { children: [
     /* @__PURE__ */ e(
       "div",
       {
@@ -1729,46 +1751,46 @@ function A({
           position: "absolute",
           left: se,
           top: I,
-          transform: `translate(-50%, -50%) scale(${V})`,
+          transform: `translate(-50%, -50%) scale(${H})`,
           opacity: z,
           zIndex: i,
           transition: T || "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)",
           pointerEvents: m && z >= 0.5 ? "auto" : "none"
         },
         children: g ? r : /* @__PURE__ */ e(
-          Gt,
+          ei,
           {
-            statusColor: Le,
+            statusColor: L,
             label: s,
             subLabel: l,
             delay: u,
             showLabels: m,
             isCompact: y.isCompact,
-            onClick: _,
+            onClick: K,
             isSelected: de,
             children: r
           }
         )
       }
     ),
-    U && /* @__PURE__ */ e(
+    Y && /* @__PURE__ */ e(
       W,
       {
         ex: t,
         ey: n,
-        status: ce,
-        title: L,
-        msg: U.msg,
-        offsetX: U.offsetX ?? 110,
-        offsetY: U.offsetY ?? -30,
-        align: U.align ?? "right",
-        internalRef: U.internalRef,
+        status: Y.severity,
+        title: pe,
+        msg: Y.msg,
+        offsetX: Y.offsetX ?? 110,
+        offsetY: Y.offsetY ?? -30,
+        align: Y.align ?? "right",
+        internalRef: Y.internalRef,
         isVisible: !0
       }
     )
   ] });
 }
-function Gt({
+function ei({
   children: t,
   statusColor: n,
   label: o,
@@ -1808,7 +1830,7 @@ function Gt({
               }
             }
           ),
-          /* @__PURE__ */ e("div", { style: s ? { background: "#040c1a", borderRadius: 2 } : void 0, children: s && q.isValidElement(t) ? q.cloneElement(t, {
+          /* @__PURE__ */ e("div", { style: s ? { background: "#040c1a", borderRadius: 2 } : void 0, children: s && X.isValidElement(t) ? X.cloneElement(t, {
             _compact: !0
           }) : t })
         ] }),
@@ -1829,7 +1851,7 @@ function Gt({
     }
   );
 }
-function St({ synced: t, latencyMs: n }) {
+function $t({ synced: t, latencyMs: n }) {
   const o = t ? "#00ff88" : "#ff8c00";
   return /* @__PURE__ */ d("div", { className: "sync-bridge", children: [
     /* @__PURE__ */ d("div", { className: "sync-arrows", children: [
@@ -1864,8 +1886,8 @@ function St({ synced: t, latencyMs: n }) {
     ] })
   ] });
 }
-const ie = 140, X = 240, re = 160, xe = et(ie, X, re);
-function Zt({
+const ie = 140, j = 240, re = 160, we = et(ie, j, re);
+function ti({
   cfg: t,
   name: n,
   cpuLoad: o,
@@ -1885,8 +1907,8 @@ function Zt({
     {
       style: {
         width: ie,
-        height: X,
-        background: a ? Ie : Je,
+        height: j,
+        background: a ? Le : Je,
         position: "relative",
         overflow: "hidden",
         fontFamily: "'Courier New', monospace",
@@ -2277,13 +2299,13 @@ function Zt({
     }
   );
 }
-function Jt() {
+function ii() {
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
         width: ie,
-        height: X,
+        height: j,
         background: "linear-gradient(180deg, #040c1a 0%, #030810 100%)",
         position: "relative",
         overflow: "hidden",
@@ -2391,7 +2413,7 @@ function Jt() {
     }
   );
 }
-function ut({
+function ht({
   side: t,
   color: n,
   brandLabel: o
@@ -2402,7 +2424,7 @@ function ut({
     {
       style: {
         width: re,
-        height: X,
+        height: j,
         background: i ? "linear-gradient(90deg, #040c1c 0%, #071428 60%, #040c1c 100%)" : "linear-gradient(90deg, #040c1c 0%, #071428 40%, #040c1c 100%)",
         position: "relative",
         overflow: "hidden"
@@ -2421,7 +2443,7 @@ function ut({
             }
           }
         ),
-        [8, X - 20].map((r) => /* @__PURE__ */ e(
+        [8, j - 20].map((r) => /* @__PURE__ */ e(
           "div",
           {
             style: {
@@ -2443,8 +2465,8 @@ function ut({
           {
             style: {
               position: "absolute",
-              top: X * 0.35,
-              bottom: X * 0.15,
+              top: j * 0.35,
+              bottom: j * 0.15,
               left: i ? 22 : 18,
               right: i ? 18 : 22,
               display: "flex",
@@ -2472,7 +2494,7 @@ function ut({
           {
             style: {
               position: "absolute",
-              top: X * 0.18,
+              top: j * 0.18,
               left: i ? 12 : re - 78,
               fontSize: 7,
               color: "#1a3050",
@@ -2491,7 +2513,7 @@ function ut({
     }
   );
 }
-function ei({ cpuLoad: t }) {
+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);
   return /* @__PURE__ */ d(
     "div",
@@ -2571,7 +2593,7 @@ function ei({ cpuLoad: t }) {
     }
   );
 }
-function be({
+function ge({
   rotateX: t = -22,
   rotateY: n = 20,
   rotateZ: o = 0,
@@ -2585,7 +2607,7 @@ function be({
   _compact: p
 }) {
   const [f, g] = R(n), h = Z(0), y = Z(0);
-  Te(() => {
+  Oe(() => {
     if (!r) {
       g(n);
       return;
@@ -2597,13 +2619,13 @@ function be({
       cancelAnimationFrame(h.current), y.current = 0;
     };
   }, [r, n]);
-  const m = C[a] ?? C.online;
+  const m = E[a] ?? E.online;
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
         width: ie * i,
-        height: X * i,
+        height: j * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -2656,7 +2678,7 @@ function be({
             style: {
               position: "absolute",
               width: ie * 1.4 * i,
-              height: X * 0.8 * i,
+              height: j * 0.8 * i,
               background: `radial-gradient(ellipse, ${m.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(45 * i)}px)`,
               pointerEvents: "none",
@@ -2680,15 +2702,15 @@ function be({
               {
                 style: {
                   width: ie,
-                  height: X,
+                  height: j,
                   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: xe.front, children: /* @__PURE__ */ e(
-                    Zt,
+                  /* @__PURE__ */ e("div", { style: we.front, children: /* @__PURE__ */ e(
+                    ti,
                     {
                       cfg: m,
                       name: s,
@@ -2699,11 +2721,11 @@ function be({
                       brandLabel: c
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: xe.back, children: /* @__PURE__ */ e(Jt, {}) }),
-                  /* @__PURE__ */ e("div", { style: xe.left, children: /* @__PURE__ */ e(ut, { side: "left", color: m.color, brandLabel: c }) }),
-                  /* @__PURE__ */ e("div", { style: xe.right, children: /* @__PURE__ */ e(ut, { side: "right", color: m.color, brandLabel: c }) }),
-                  /* @__PURE__ */ e("div", { style: xe.top, children: /* @__PURE__ */ e(ei, { cpuLoad: l }) }),
-                  /* @__PURE__ */ e("div", { style: xe.bottom, children: /* @__PURE__ */ e(
+                  /* @__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(
                     "div",
                     {
                       style: {
@@ -2722,7 +2744,7 @@ function be({
     }
   );
 }
-function Ni({
+function zi({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -2763,15 +2785,15 @@ function Ni({
         graphSeries: m
       },
       alert: v,
-      children: /* @__PURE__ */ e(be, { status: a, cpuLoad: p, memLoad: f, brandLabel: g })
+      children: /* @__PURE__ */ e(ge, { status: a, cpuLoad: p, memLoad: f, brandLabel: g })
     }
   );
 }
-const Ge = 12, he = 55, G = he * 2, $e = 52, nt = 10, je = 3 * $e + 2 * nt, ve = 2 * Math.PI * he / Ge, Xe = Array.from({ length: Ge }, (t, n) => n / Ge * 360);
+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) {
   return Math.cos(t * Math.PI / 180) * 0.42 + 0.58;
 }
-function ti({
+function oi({
   diskY: t,
   diskIdx: n,
   cfg: o,
@@ -2779,7 +2801,7 @@ function ti({
   capacity: r,
   compact: a
 }) {
-  return /* @__PURE__ */ d(Ae, { children: [
+  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__ */ e(
@@ -2787,17 +2809,17 @@ function ti({
         {
           style: {
             position: "absolute",
-            width: ve,
-            height: $e,
-            left: (G - ve) / 2,
+            width: Se,
+            height: Re,
+            left: (G - Se) / 2,
             top: t,
-            transform: `rotateY(${s}deg) translateZ(${he}px)`,
+            transform: `rotateY(${s}deg) translateZ(${be}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(Ae, { children: [
+          children: c && /* @__PURE__ */ d(Ie, { children: [
             /* @__PURE__ */ e(
               "div",
               {
@@ -2853,7 +2875,7 @@ function ti({
           width: G + 4,
           height: G + 4,
           left: -2,
-          top: t - he,
+          top: t - be,
           borderRadius: "50%",
           transform: "rotateX(90deg)",
           backfaceVisibility: "hidden",
@@ -2914,7 +2936,7 @@ function ti({
           width: G + 4,
           height: G + 4,
           left: -2,
-          top: t + $e - he,
+          top: t + Re - be,
           borderRadius: "50%",
           transform: "rotateX(-90deg)",
           backfaceVisibility: "hidden",
@@ -2945,11 +2967,11 @@ function ti({
         {
           style: {
             position: "absolute",
-            width: ve + 1.5,
+            width: Se + 1.5,
             height: 6,
-            left: (G - ve - 1.5) / 2,
-            top: t + $e - 3,
-            transform: `rotateY(${s}deg) translateZ(${he + 1.5}px)`,
+            left: (G - Se - 1.5) / 2,
+            top: t + Re - 3,
+            transform: `rotateY(${s}deg) translateZ(${be + 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}`,
@@ -2966,11 +2988,11 @@ function ti({
         {
           style: {
             position: "absolute",
-            width: ve,
+            width: Se,
             height: nt,
-            left: (G - ve) / 2,
-            top: t + $e,
-            transform: `rotateY(${s}deg) translateZ(${he}px)`,
+            left: (G - Se) / 2,
+            top: t + Re,
+            transform: `rotateY(${s}deg) translateZ(${be}px)`,
             backfaceVisibility: "hidden",
             background: `rgb(${c},${p},${f})`
           }
@@ -2993,7 +3015,7 @@ function Ne({
   _compact: l
 }) {
   const [u, c] = R(n), p = Z(0), f = Z(0);
-  Te(() => {
+  Oe(() => {
     if (!r) {
       c(n);
       return;
@@ -3005,7 +3027,7 @@ function Ne({
       cancelAnimationFrame(p.current), f.current = 0;
     };
   }, [r, n]);
-  const g = C[a] ?? C.online;
+  const g = E[a] ?? E.online;
   return /* @__PURE__ */ d(
     "div",
     {
@@ -3103,9 +3125,9 @@ function Ne({
                   transition: r ? "none" : "transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94)"
                 },
                 children: [0, 1, 2].map((h) => /* @__PURE__ */ e(
-                  ti,
+                  oi,
                   {
-                    diskY: h * ($e + nt),
+                    diskY: h * (Re + nt),
                     diskIdx: h,
                     cfg: g,
                     hasRingBelow: h < 2,
@@ -3122,7 +3144,7 @@ function Ne({
     }
   );
 }
-function Wi({
+function Bi({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -3166,7 +3188,7 @@ function Wi({
   );
 }
 function ot({ status: t = "online", scale: n = 1 }) {
-  const i = (C[t] ?? C.online).color;
+  const i = (E[t] ?? E.online).color;
   return /* @__PURE__ */ e(
     "div",
     {
@@ -3277,7 +3299,7 @@ function ot({ status: t = "online", scale: n = 1 }) {
     }
   );
 }
-function Mi({
+function Fi({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -3300,8 +3322,8 @@ function Mi({
     }
   );
 }
-const ne = 190, Q = 72, ke = 120, we = et(ne, Q, ke);
-function ii({
+const ne = 190, q = 72, Ee = 120, $e = et(ne, q, Ee);
+function ri({
   cfg: t,
   name: n,
   traffic: o,
@@ -3314,8 +3336,8 @@ function ii({
     {
       style: {
         width: ne,
-        height: Q,
-        background: r ? Ie : Je,
+        height: q,
+        background: r ? Le : Je,
         position: "relative",
         overflow: "hidden",
         fontFamily: "'Courier New', monospace",
@@ -3563,13 +3585,13 @@ function ii({
     }
   );
 }
-function ni() {
+function ai() {
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
         width: ne,
-        height: Q,
+        height: q,
         background: "linear-gradient(180deg, #040c1a, #030810)",
         position: "relative",
         overflow: "hidden",
@@ -3584,7 +3606,7 @@ function ni() {
           {
             style: {
               width: 40,
-              height: Q - 16,
+              height: q - 16,
               background: "#020710",
               border: "1px solid #1a2d40",
               borderRadius: 2,
@@ -3640,7 +3662,7 @@ function ni() {
             style: {
               marginLeft: "auto",
               width: 12,
-              height: Q - 16,
+              height: q - 16,
               background: "#020710",
               border: "1px solid #1a3050",
               borderRadius: 1
@@ -3651,13 +3673,13 @@ function ni() {
     }
   );
 }
-function ht({ side: t, color: n }) {
+function bt({ side: t, color: n }) {
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
-        width: ke,
-        height: Q,
+        width: Ee,
+        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"
@@ -3681,8 +3703,8 @@ function ht({ 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",
@@ -3708,14 +3730,14 @@ function ht({ side: t, color: n }) {
     }
   );
 }
-function oi({ traffic: t }) {
-  const n = Math.floor((ke - 14) / 7);
+function li({ traffic: t }) {
+  const n = Math.floor((Ee - 14) / 7);
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
         width: ne,
-        height: ke,
+        height: Ee,
         background: "linear-gradient(180deg, #0c1c30 0%, #07101e 40%, #040c1a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -3729,7 +3751,7 @@ function oi({ traffic: t }) {
               top: 0,
               left: 0,
               right: 0,
-              height: ke * 0.35,
+              height: Ee * 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%)`
@@ -3780,7 +3802,7 @@ function rt({
   _compact: c
 }) {
   const [p, f] = R(n), g = Z(0), h = Z(0);
-  Te(() => {
+  Oe(() => {
     if (!r) {
       f(n);
       return;
@@ -3792,13 +3814,13 @@ function rt({
       cancelAnimationFrame(g.current), h.current = 0;
     };
   }, [r, n]);
-  const y = C[a] ?? C.online;
+  const y = E[a] ?? E.online;
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
         width: ne * i,
-        height: Q * i,
+        height: q * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -3859,7 +3881,7 @@ function rt({
             style: {
               position: "absolute",
               width: ne * 1.3 * i,
-              height: Q * 2 * i,
+              height: q * 2 * i,
               background: `radial-gradient(ellipse, ${y.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(40 * i)}px)`,
               pointerEvents: "none",
@@ -3883,15 +3905,15 @@ function rt({
               {
                 style: {
                   width: ne,
-                  height: Q,
+                  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: we.front, children: /* @__PURE__ */ e(
-                    ii,
+                  /* @__PURE__ */ e("div", { style: $e.front, children: /* @__PURE__ */ e(
+                    ri,
                     {
                       cfg: y,
                       name: s,
@@ -3900,11 +3922,11 @@ function rt({
                       compact: c
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: we.back, children: /* @__PURE__ */ e(ni, {}) }),
-                  /* @__PURE__ */ e("div", { style: we.left, children: /* @__PURE__ */ e(ht, { side: "left", color: y.color }) }),
-                  /* @__PURE__ */ e("div", { style: we.right, children: /* @__PURE__ */ e(ht, { side: "right", color: y.color }) }),
-                  /* @__PURE__ */ e("div", { style: we.top, children: /* @__PURE__ */ e(oi, { traffic: l }) }),
-                  /* @__PURE__ */ e("div", { style: we.bottom, children: /* @__PURE__ */ e("div", { style: { width: ne, height: ke, background: "#020508" } }) })
+                  /* @__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" } }) })
                 ]
               }
             )
@@ -3914,7 +3936,7 @@ function rt({
     }
   );
 }
-function zi({
+function Ui({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -3958,13 +3980,13 @@ function zi({
     }
   );
 }
-const oe = 190, K = 72, Re = 120, Se = et(oe, K, Re), bt = {
+const oe = 190, Q = 72, Ce = 120, ke = et(oe, Q, Ce), 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)" },
   offline: { color: "#1e3a5a", glow: "rgba(30,58,90,0.25)" }
 };
-function ri({
+function si({
   cfg: t,
   name: n,
   queueDepth: o,
@@ -3978,8 +4000,8 @@ function ri({
     {
       style: {
         width: oe,
-        height: K,
-        background: a ? Ie : Je,
+        height: Q,
+        background: a ? Le : Je,
         position: "relative",
         overflow: "hidden",
         fontFamily: "'Courier New', monospace",
@@ -4223,13 +4245,13 @@ function ri({
     }
   );
 }
-function ai() {
+function di() {
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
         width: oe,
-        height: K,
+        height: Q,
         background: "linear-gradient(180deg, #040c1a, #030810)",
         position: "relative",
         overflow: "hidden",
@@ -4244,7 +4266,7 @@ function ai() {
           {
             style: {
               width: 40,
-              height: K - 16,
+              height: Q - 16,
               background: "#020710",
               border: "1px solid #1a2d40",
               borderRadius: 2,
@@ -4300,7 +4322,7 @@ function ai() {
             style: {
               marginLeft: "auto",
               width: 12,
-              height: K - 16,
+              height: Q - 16,
               background: "#020710",
               border: "1px solid #1a3050",
               borderRadius: 1
@@ -4311,13 +4333,13 @@ function ai() {
     }
   );
 }
-function gt({ side: t, color: n }) {
+function yt({ side: t, color: n }) {
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
-        width: Re,
-        height: K,
+        width: Ce,
+        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"
@@ -4341,8 +4363,8 @@ function gt({ side: t, color: n }) {
           {
             style: {
               position: "absolute",
-              top: K * 0.25,
-              bottom: K * 0.25,
+              top: Q * 0.25,
+              bottom: Q * 0.25,
               left: 14,
               right: 14,
               display: "flex",
@@ -4368,14 +4390,14 @@ function gt({ side: t, color: n }) {
     }
   );
 }
-function li({ queueDepth: t, color: n }) {
-  const o = Math.floor((Re - 14) / 7);
+function ci({ queueDepth: t, color: n }) {
+  const o = Math.floor((Ce - 14) / 7);
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
         width: oe,
-        height: Re,
+        height: Ce,
         background: "linear-gradient(180deg, #0c1c30 0%, #07101e 40%, #040c1a 100%)",
         position: "relative",
         overflow: "hidden"
@@ -4389,7 +4411,7 @@ function li({ queueDepth: t, color: n }) {
               top: 0,
               left: 0,
               right: 0,
-              height: Re * 0.35,
+              height: Ce * 0.35,
               background: `radial-gradient(ellipse at 50% 0%,
           ${t > 70 ? "rgba(255,34,85,0.14)" : `${n}15`} 0%,
           transparent 70%)`
@@ -4427,7 +4449,7 @@ function li({ queueDepth: t, color: n }) {
     }
   );
 }
-function $t({
+function kt({
   rotateX: t = -20,
   rotateY: n = 20,
   rotateZ: o = 0,
@@ -4441,7 +4463,7 @@ function $t({
   _compact: p
 }) {
   const [f, g] = R(n), h = Z(0), y = Z(0);
-  Te(() => {
+  Oe(() => {
     if (!r) {
       g(n);
       return;
@@ -4453,13 +4475,13 @@ function $t({
       cancelAnimationFrame(h.current), y.current = 0;
     };
   }, [r, n]);
-  const m = bt[a] ?? bt.online;
+  const m = gt[a] ?? gt.online;
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
         width: oe * i,
-        height: K * i,
+        height: Q * i,
         position: "relative",
         display: "flex",
         alignItems: "center",
@@ -4520,7 +4542,7 @@ function $t({
             style: {
               position: "absolute",
               width: oe * 1.3 * i,
-              height: K * 2 * i,
+              height: Q * 2 * i,
               background: `radial-gradient(ellipse, ${m.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(40 * i)}px)`,
               pointerEvents: "none",
@@ -4544,15 +4566,15 @@ function $t({
               {
                 style: {
                   width: oe,
-                  height: K,
+                  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: Se.front, children: /* @__PURE__ */ e(
-                    ri,
+                  /* @__PURE__ */ e("div", { style: ke.front, children: /* @__PURE__ */ e(
+                    si,
                     {
                       cfg: m,
                       name: s,
@@ -4562,11 +4584,11 @@ function $t({
                       compact: p
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: Se.back, children: /* @__PURE__ */ e(ai, {}) }),
-                  /* @__PURE__ */ e("div", { style: Se.left, children: /* @__PURE__ */ e(gt, { side: "left", color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: Se.right, children: /* @__PURE__ */ e(gt, { side: "right", color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: Se.top, children: /* @__PURE__ */ e(li, { queueDepth: l, color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: Se.bottom, children: /* @__PURE__ */ e("div", { style: { width: oe, height: Re, background: "#020508" } }) })
+                  /* @__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" } }) })
                 ]
               }
             )
@@ -4576,7 +4598,7 @@ function $t({
     }
   );
 }
-function Bi({
+function Hi({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -4618,7 +4640,7 @@ function Bi({
       },
       alert: v,
       children: /* @__PURE__ */ e(
-        $t,
+        kt,
         {
           status: a,
           queueDepth: p,
@@ -4635,7 +4657,7 @@ 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 si({ data: t, color: n, height: o = 28 }) {
+function pi({ data: t, color: n, height: o = 28 }) {
   const r = o, a = Math.max(...t, 1), s = t.map((l, u) => {
     const c = u / (t.length - 1) * 120, p = r - l / a * (r - 4) - 2;
     return `${c},${p}`;
@@ -4653,7 +4675,7 @@ function si({ data: t, color: n, height: o = 28 }) {
     }
   ) });
 }
-function di({
+function fi({
   type: t,
   name: n,
   context: o = {},
@@ -4661,7 +4683,7 @@ function di({
   animPhase: r,
   series: a
 }) {
-  const s = i === "critical" || i === "offline" ? "#ff2255" : i === "warning" ? "#ff8c00" : "#00e5ff", l = a ? a.map((p) => ({ ...p })) : ci(t, o), u = r >= 0.3 ? 0 : -280, c = r >= 0.2 ? 1 : 0;
+  const s = i === "critical" || i === "offline" ? "#ff2255" : i === "warning" ? "#ff8c00" : "#00e5ff", l = a ? a.map((p) => ({ ...p })) : ui(t, o), u = r >= 0.3 ? 0 : -280, c = r >= 0.2 ? 1 : 0;
   return /* @__PURE__ */ d(
     "div",
     {
@@ -4716,7 +4738,7 @@ function di({
                   p.unit
                 ] })
               ] }),
-              /* @__PURE__ */ e(si, { data: p.data, color: p.color, height: 26 })
+              /* @__PURE__ */ e(pi, { data: p.data, color: p.color, height: 26 })
             ]
           },
           p.id
@@ -4725,7 +4747,7 @@ function di({
     }
   );
 }
-function ci(t, n) {
+function ui(t, n) {
   if (t === "server") {
     const o = n.cpuLoad ?? 50, i = n.memLoad ?? 60;
     return [
@@ -4761,7 +4783,7 @@ function ci(t, n) {
   }
   return [];
 }
-function kt({
+function Rt({
   w: t,
   h: n,
   color: o,
@@ -4770,14 +4792,14 @@ function kt({
   delay: a = "0s",
   children: s
 }) {
-  const l = r ? C[r]?.glow ?? "rgba(0,229,255,0.4)" : "rgba(0,229,255,0.4)";
+  const l = r ? E[r]?.glow ?? "rgba(0,229,255,0.4)" : "rgba(0,229,255,0.4)";
   return /* @__PURE__ */ d(
     "div",
     {
       style: {
         width: t,
         height: n,
-        background: Ie,
+        background: Le,
         position: "relative",
         overflow: "hidden",
         borderRadius: 2,
@@ -4811,8 +4833,8 @@ function kt({
               width: 4,
               height: 4,
               borderRadius: "50%",
-              background: C[r]?.color,
-              boxShadow: `0 0 6px ${C[r]?.color}`,
+              background: E[r]?.color,
+              boxShadow: `0 0 6px ${E[r]?.color}`,
               animation: "holo-led-blink 1.2s infinite"
             }
           }
@@ -4867,7 +4889,7 @@ function ze({
         style: {
           width: 52,
           height: 36,
-          background: Ie,
+          background: Le,
           position: "relative",
           borderRadius: 2,
           border: `1px solid ${t}55`,
@@ -4938,8 +4960,8 @@ function ze({
                 width: 4,
                 height: 4,
                 borderRadius: "50%",
-                background: C[o]?.color,
-                boxShadow: `0 0 6px ${C[o]?.color}`,
+                background: E[o]?.color,
+                boxShadow: `0 0 6px ${E[o]?.color}`,
                 animation: "holo-led-blink 1.2s infinite"
               }
             }
@@ -5036,7 +5058,7 @@ function Be({
                 width: 3,
                 height: 3,
                 borderRadius: "50%",
-                background: C[o]?.color,
+                background: E[o]?.color,
                 animation: "holo-led-blink 1.2s infinite"
               }
             }
@@ -5062,13 +5084,13 @@ function Be({
     )
   ] });
 }
-function Ce({
+function Pe({
   color: t = "#00e5ff",
   label: n = "DRIVE-1",
   status: o = "online",
   activity: i = !1
 }) {
-  return /* @__PURE__ */ d(kt, { w: 56, h: 22, color: t, label: n, status: o, children: [
+  return /* @__PURE__ */ d(Rt, { w: 56, h: 22, color: t, label: n, status: o, children: [
     /* @__PURE__ */ e(
       "div",
       {
@@ -5101,7 +5123,7 @@ function Ce({
     )
   ] });
 }
-function Rt({
+function Et({
   color: t = "#00e5ff",
   label: n = "NET",
   status: o = "online"
@@ -5112,7 +5134,7 @@ function Rt({
       style: {
         width: 48,
         height: 28,
-        background: Ie,
+        background: Le,
         position: "relative",
         borderRadius: 2,
         border: `1px solid ${t}44`,
@@ -5170,7 +5192,7 @@ function M({
   label: n = "THREAD",
   status: o = "online"
 }) {
-  return /* @__PURE__ */ e(kt, { w: 44, h: 28, color: t, label: n, status: o });
+  return /* @__PURE__ */ e(Rt, { w: 44, h: 28, color: t, label: n, status: o });
 }
 function Me({
   color: t = "#ff8c00",
@@ -5230,7 +5252,7 @@ function Me({
                 width: 4,
                 height: 4,
                 borderRadius: "50%",
-                background: C[o]?.color,
+                background: E[o]?.color,
                 animation: "holo-led-blink 1.2s infinite"
               }
             }
@@ -5256,7 +5278,7 @@ function Me({
     )
   ] });
 }
-function H({
+function F({
   color: t = "#00e5ff",
   label: n = "PORT-1",
   status: o = "online"
@@ -5285,7 +5307,7 @@ function H({
               width: 4,
               height: 4,
               borderRadius: "50%",
-              background: o && o !== "online" ? C[o]?.color ?? t : t,
+              background: o && o !== "online" ? E[o]?.color ?? t : t,
               boxShadow: `0 0 4px ${t}`,
               animation: o && o !== "online" && o !== "offline" ? "holo-led-blink 1s infinite" : "none"
             }
@@ -5326,7 +5348,7 @@ function H({
     }
   );
 }
-function pi(t, n, o, i) {
+function hi(t, n, o, i) {
   const r = o === "online" ? "online" : o;
   return t === "server" ? [
     {
@@ -5430,8 +5452,8 @@ function pi(t, n, o, i) {
     }
   ] : [];
 }
-const D = "cubic-bezier(0.34, 1.56, 0.64, 1)", fi = "cubic-bezier(0.16, 1, 0.3, 1)";
-function ui({ items: t, revealPhase: n }) {
+const D = "cubic-bezier(0.34, 1.56, 0.64, 1)", bi = "cubic-bezier(0.16, 1, 0.3, 1)";
+function gi({ items: t, revealPhase: n }) {
   return /* @__PURE__ */ e(
     "div",
     {
@@ -5458,14 +5480,14 @@ function ui({ items: t, revealPhase: n }) {
     }
   );
 }
-function hi({
+function yi({
   type: t,
   status: n,
   context: o,
   internal: i,
   revealPhase: r
 }) {
-  const a = C[n]?.color ?? C.online.color, s = "#ff8c00";
+  const a = E[n]?.color ?? E.online.color, s = "#ff8c00";
   if (t === "server") {
     const l = o.cpuLoad ?? 50, u = o.memLoad ?? 60, c = [
       {
@@ -5527,13 +5549,13 @@ function hi({
       {
         key: "d1",
         delay: 4,
-        el: /* @__PURE__ */ e(Ce, { color: a, label: "DRIVE-1", status: i[4]?.status, activity: !0 })
+        el: /* @__PURE__ */ e(Pe, { color: a, label: "DRIVE-1", status: i[4]?.status, activity: !0 })
       },
       {
         key: "d2",
         delay: 5,
         el: /* @__PURE__ */ e(
-          Ce,
+          Pe,
           {
             color: a,
             label: "DRIVE-2",
@@ -5546,7 +5568,7 @@ function hi({
         key: "d3",
         delay: 6,
         el: /* @__PURE__ */ e(
-          Ce,
+          Pe,
           {
             color: a,
             label: "DRIVE-3",
@@ -5563,7 +5585,7 @@ function hi({
       {
         key: "net",
         delay: 8,
-        el: /* @__PURE__ */ e(Rt, { color: a, label: "NET", status: i[8]?.status })
+        el: /* @__PURE__ */ e(Et, { color: a, label: "NET", status: i[8]?.status })
       }
     ];
     return /* @__PURE__ */ e(
@@ -5603,7 +5625,7 @@ function hi({
             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(H, { color: a, label: `PORT-${c + 1}`, status: p?.status })
+          children: /* @__PURE__ */ e(F, { color: a, label: `PORT-${c + 1}`, status: p?.status })
         },
         `p${c}`
       );
@@ -5669,7 +5691,7 @@ function hi({
                 transform: `scale(${r >= 0.25 + l * 0.1 ? 1 : 0.6})`,
                 transition: `all 0.4s ${D} ${l * 0.08}s`
               },
-              children: /* @__PURE__ */ e(H, { color: "#bb55ff", label: `INST-${l}`, status: i[l]?.status })
+              children: /* @__PURE__ */ e(F, { color: "#bb55ff", label: `INST-${l}`, status: i[l]?.status })
             },
             l
           )),
@@ -5768,7 +5790,7 @@ function hi({
   }
   return null;
 }
-function Fi({
+function Yi({
   type: t,
   name: n,
   status: o,
@@ -5778,7 +5800,7 @@ function Fi({
   subComponents: s,
   graphSeries: l
 }) {
-  const u = pi(t, n, o, a), c = C[o]?.color ?? C.online.color, p = r >= 0.1 ? 1 : r * 10, f = r >= 0.2 ? "-50%" : "0%", g = r >= 0.2 ? "50%" : "0%", h = r >= 0.25 ? Math.min(1, (r - 0.25) * 1.5) : 0;
+  const u = hi(t, n, o, a), c = E[o]?.color ?? E.online.color, p = r >= 0.1 ? 1 : r * 10, f = r >= 0.2 ? "-50%" : "0%", g = r >= 0.2 ? "50%" : "0%", h = r >= 0.25 ? Math.min(1, (r - 0.25) * 1.5) : 0;
   return /* @__PURE__ */ d(
     "div",
     {
@@ -5802,13 +5824,13 @@ function Fi({
               backdropFilter: "blur(10px)",
               WebkitBackdropFilter: "blur(10px)",
               opacity: p,
-              transition: `opacity 0.4s ${fi}`
+              transition: `opacity 0.4s ${bi}`
             },
             onClick: i
           }
         ),
         /* @__PURE__ */ e(
-          di,
+          fi,
           {
             type: t,
             name: n,
@@ -5978,8 +6000,8 @@ function Fi({
                         }
                       }
                     ),
-                    /* @__PURE__ */ e("div", { style: { flex: 1, padding: "8px 0 24px" }, children: s ? /* @__PURE__ */ e(ui, { items: s, revealPhase: h }) : /* @__PURE__ */ e(
-                      hi,
+                    /* @__PURE__ */ e("div", { style: { flex: 1, padding: "8px 0 24px" }, children: s ? /* @__PURE__ */ e(gi, { items: s, revealPhase: h }) : /* @__PURE__ */ e(
+                      yi,
                       {
                         type: t,
                         name: n,
@@ -5999,7 +6021,7 @@ function Fi({
     }
   );
 }
-function bi({ onSubmit: t }) {
+function mi({ onSubmit: t }) {
   const [n, o] = R(""), [i, r] = R(""), [a, s] = R(null), [l, u] = 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() });
@@ -6091,27 +6113,27 @@ function bi({ onSubmit: t }) {
   ] }) });
 }
 const at = He(null);
-function gi() {
+function xi() {
   const t = ae(at);
   if (!t)
     throw new Error("useAIOpsData must be used within an AIOPsDashboard with dataEndpoint configured");
   return t;
 }
-function yi() {
+function vi() {
   return ae(at);
 }
-function Ui(t) {
-  const { data: n } = gi();
+function Vi(t) {
+  const { data: n } = xi();
   return n[t] ?? null;
 }
-function mi(t) {
+function wi(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 xi(t) {
+function Si(t) {
   if (typeof t == "number") return t;
   if (typeof t == "string") {
     const n = Number(t);
@@ -6119,7 +6141,7 @@ function xi(t) {
   }
   return t;
 }
-function vi({ config: t, children: n }) {
+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);
   g.current = t;
   const h = Z(r);
@@ -6160,7 +6182,7 @@ function vi({ config: t, children: n }) {
       }
     }
   }, []);
-  Te(() => {
+  Oe(() => {
     if (!r) return;
     y();
     const x = g.current.refreshInterval ?? 6e4, w = window.setInterval(y, x);
@@ -6178,28 +6200,28 @@ function vi({ config: t, children: n }) {
   };
   return /* @__PURE__ */ d(at.Provider, { value: v, children: [
     n,
-    !r && /* @__PURE__ */ e(bi, { onSubmit: m })
+    !r && /* @__PURE__ */ e(mi, { onSubmit: m })
   ] });
 }
-function Hi(t) {
+function _i(t) {
   const { dataEndpoint: n, dataBindings: o, dataRefreshInterval: i } = t;
   if (n && o) {
-    const r = mi(o);
+    const r = wi(o);
     return /* @__PURE__ */ e(
-      vi,
+      $i,
       {
         config: {
           endpoint: n,
           queries: r,
           refreshInterval: i
         },
-        children: /* @__PURE__ */ e(yt, { ...t })
+        children: /* @__PURE__ */ e(mt, { ...t })
       }
     );
   }
-  return /* @__PURE__ */ e(yt, { ...t });
+  return /* @__PURE__ */ e(mt, { ...t });
 }
-function yt({
+function mt({
   brandName: t = "BUSAUD AIOps",
   brandTag: n = "3D MONITOR",
   services: o = [],
@@ -6211,38 +6233,38 @@ function yt({
   dataTransform: u,
   children: c
 }) {
-  const p = yi(), [f] = R(20), [g] = R(!1), [h] = 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 = (E) => {
-    v === "compact" && (T(E), 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(() => {
+  const p = vi(), [f] = R(20), [g] = R(!1), [h] = 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");
     }, 2400));
-  }, Y = () => {
+  }, U = () => {
     $ ? (S(null), B(0)) : v === "expanded" && (x("collapsing"), b(0), T(null), setTimeout(() => {
-      x((E) => E === "collapsing" ? "compact" : E);
+      x((C) => C === "collapsing" ? "compact" : C);
     }, 1e3));
-  }, le = (E) => {
-    S(E), B(0);
+  }, le = (C) => {
+    S(C), B(0);
   };
-  q.useEffect(() => {
+  X.useEffect(() => {
     if (!$) return;
-    const E = performance.now(), fe = 1200, te = () => {
-      const J = performance.now() - E, j = Math.min(1, J / fe);
-      B(j), j < 1 && requestAnimationFrame(te);
-    }, ue = requestAnimationFrame(te);
-    return () => cancelAnimationFrame(ue);
+    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 se = () => {
     S(null), B(0);
-  }, I = o.find((E) => E.name === k), V = I?.status ?? "online", de = I?.dbSync ?? !0, Oe = I?.metrics, Le = I?.alerts, _ = u ?? xi, L = p?.data, F = Ze(() => !L || !l ? c : q.Children.map(c, (E) => {
-    if (!q.isValidElement(E)) return E;
-    const fe = E.props.name;
-    if (!fe || !l[fe]) return E;
-    const te = l[fe], ue = {};
-    for (const [J, j] of Object.entries(te)) {
-      const dt = typeof j == "string" ? j : j.query, me = typeof j == "object" && j.transform ? j.transform : _, De = L[dt];
-      De !== void 0 && (ue[J] = me(De));
+  }, 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));
     }
-    return Object.keys(ue).length > 0 ? q.cloneElement(E, ue) : E;
-  }), [c, L, l, _]), ce = p?.lastRefreshError ?? null, U = 330, ye = 340, Ye = $ ? 1.15 : 1, Ve = $ ? -($.ex - U) * 0.06 : 0, pe = $ ? -($.ey - ye) * 0.06 : 0;
+    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 /* @__PURE__ */ d("div", { className: "app", style: s ? { fontFamily: s } : void 0, children: [
     /* @__PURE__ */ e(
       "div",
@@ -6257,7 +6279,7 @@ function yt({
           backgroundPosition: "center center",
           backgroundRepeat: "no-repeat",
           transition: "transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1)",
-          transform: `translate(${Ve}px, ${pe}px) scale(${Ye})`,
+          transform: `translate(${Ve}px, ${fe}px) scale(${Ye})`,
           willChange: "transform"
         }
       }
@@ -6268,7 +6290,7 @@ function yt({
         /* @__PURE__ */ e("span", { className: "brand-text", children: t })
       ] }),
       /* @__PURE__ */ d("div", { className: "hdr-right", children: [
-        ce && /* @__PURE__ */ d("div", { className: "hdr-refresh-error", children: [
+        pe && /* @__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" })
         ] }),
@@ -6282,9 +6304,9 @@ function yt({
         style: {
           cursor: v === "expanded" ? "zoom-out" : "default"
         },
-        onClick: Y,
+        onClick: U,
         children: /* @__PURE__ */ e(
-          Ht,
+          Yt,
           {
             viewState: v,
             animPhase: w,
@@ -6299,14 +6321,14 @@ function yt({
             carouselSpeed: a,
             logoUrl: r,
             onSelectSystem: z,
-            onBackgroundClick: Y,
+            onBackgroundClick: U,
             onComponentClick: le,
             onCloseDrill: se,
-            selectedSystemStatus: V,
+            selectedSystemStatus: H,
             selectedSystemDbSync: de,
-            selectedSystemMetrics: Oe,
-            selectedSystemAlerts: Le,
-            children: F
+            selectedSystemMetrics: ce,
+            selectedSystemAlerts: Y,
+            children: K
           }
         )
       }
@@ -6322,21 +6344,21 @@ function P(t, n, o = 24) {
 function Ct(t) {
   return t === "critical" || t === "offline" ? "#ff2255" : t === "warning" ? "#ff8c00" : "#00e5ff";
 }
-function Ee(t, n, o) {
+function Ae(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(Ce, { color: r, label: "DRIVE-1", status: "online", activity: !0 }) },
-    { id: "drive-2", label: "DRIVE-2", status: "online", element: /* @__PURE__ */ e(Ce, { color: r, label: "DRIVE-2", status: "online", activity: a > 30 }) },
-    { id: "drive-3", label: "DRIVE-3", status: "online", element: /* @__PURE__ */ e(Ce, { color: r, label: "DRIVE-3", status: "online", activity: a > 50 }) },
+    { 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: "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(Rt, { color: r, label: "NET", status: p }) }
+    { id: "network", label: "NET", status: p, element: /* @__PURE__ */ e(Et, { color: r, label: "NET", status: p }) }
   ];
 }
-function Pe(t) {
+function Te(t) {
   const n = t?.cpuLoad ?? 50, o = t?.memLoad ?? 60;
   return [
     { id: "cpu", label: "CPU-0", unit: "%", color: "#00e5ff", data: P(n, 15) },
@@ -6349,22 +6371,22 @@ function Pe(t) {
     { id: "thread", label: "THREAD-POOL", unit: "%", color: "#22aaff", data: P(55, 20) }
   ];
 }
-function Et(t, n, o) {
+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(H, { color: r, label: "PORT-1", status: "online" }) },
-    { id: "port-2", label: "PORT-2", status: "online", element: /* @__PURE__ */ e(H, { 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(H, { color: r, label: "PORT-3", status: a }) },
-    { id: "port-4", label: "PORT-4", status: "online", element: /* @__PURE__ */ e(H, { 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(H, { color: r, label: "PORT-5", status: s }) },
-    { id: "port-6", label: "PORT-6", status: "online", element: /* @__PURE__ */ e(H, { color: r, label: "PORT-6", status: "online" }) },
-    { id: "port-7", label: "PORT-7", status: "online", element: /* @__PURE__ */ e(H, { color: r, label: "PORT-7", status: "online" }) },
-    { id: "port-8", label: "PORT-8", status: "online", element: /* @__PURE__ */ e(H, { color: r, label: "PORT-8", status: "online" }) },
+    { 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" }) }
   ];
 }
-function Pt(t) {
+function At(t) {
   const n = t?.traffic ?? 50;
   return [
     { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: P(n, 20) },
@@ -6374,19 +6396,19 @@ function Pt(t) {
     { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: P(n * 0.9, 15) }
   ];
 }
-function wi(t, n, o) {
+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(H, { color: "#bb55ff", label: "INST-0", status: "online" }) },
-    { id: "inst-1", label: "INST-1", status: "online", element: /* @__PURE__ */ e(H, { 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(H, { color: "#bb55ff", label: "INST-2", status: r }) },
+    { 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 }) }
   ];
 }
-function Si(t) {
+function Ri(t) {
   const n = t?.queueDepth ?? 50;
   return [
     { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: P(n, 20) },
@@ -6428,7 +6450,7 @@ function lt(t) {
   ];
   return n.includes("critical") ? "critical" : n.includes("warning") ? "warning" : n.includes("offline") ? "offline" : "online";
 }
-function Yi(t) {
+function ji(t) {
   const n = lt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     {
@@ -6450,7 +6472,7 @@ function Yi(t) {
     }
   ];
 }
-function Vi(t) {
+function Xi(t) {
   const n = lt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     ...t.dbSync ? [] : [{ level: "warning", message: "DB Replication Lag Detected" }],
@@ -6459,7 +6481,7 @@ function Vi(t) {
     ...!o && !i && t.dbSync ? [{ level: "info", message: "All Systems Nominal" }] : []
   ];
 }
-const $i = [
+const Ei = [
   { from: [330, 120], to: [220, 260], visibleAtPhase: 3 },
   { from: [330, 120], to: [440, 260], visibleAtPhase: 3 },
   { from: [220, 260], to: [165, 390], visibleAtPhase: 4 },
@@ -6472,9 +6494,9 @@ const $i = [
   { from: [330, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" },
   { from: [495, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" }
 ];
-function ki({ config: t }) {
-  const n = q.useContext(ge), 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(Ae, { children: [
+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: [
     /* @__PURE__ */ e(
       A,
       {
@@ -6503,8 +6525,8 @@ function ki({ config: t }) {
           name: "WEB-DISP",
           status: r,
           context: { traffic: 78 },
-          subComponents: Et(r),
-          graphSeries: Pt({ traffic: 78 })
+          subComponents: Pt(r),
+          graphSeries: At({ traffic: 78 })
         },
         children: /* @__PURE__ */ e(
           rt,
@@ -6536,11 +6558,11 @@ function ki({ config: t }) {
           name: "MSG-SRV",
           status: a,
           context: { queueDepth: 45 },
-          subComponents: wi(a),
-          graphSeries: Si({ queueDepth: 45 })
+          subComponents: ki(a),
+          graphSeries: Ri({ queueDepth: 45 })
         },
         children: /* @__PURE__ */ e(
-          $t,
+          kt,
           {
             rotateY: -o,
             autoRotate: i,
@@ -6570,11 +6592,11 @@ function ki({ config: t }) {
           name: "APP-01",
           status: s,
           context: { cpuLoad: 67, memLoad: 72 },
-          subComponents: Ee(s, "APP-01", { cpuLoad: 67, memLoad: 72 }),
-          graphSeries: Pe({ cpuLoad: 67, memLoad: 72 })
+          subComponents: Ae(s, "APP-01", { cpuLoad: 67, memLoad: 72 }),
+          graphSeries: Te({ cpuLoad: 67, memLoad: 72 })
         },
         children: /* @__PURE__ */ e(
-          be,
+          ge,
           {
             rotateY: o,
             autoRotate: i,
@@ -6603,11 +6625,11 @@ function ki({ config: t }) {
           name: "APP-02",
           status: l,
           context: { cpuLoad: 89, memLoad: 91 },
-          subComponents: Ee(l, "APP-02", { cpuLoad: 89, memLoad: 91 }),
-          graphSeries: Pe({ cpuLoad: 89, memLoad: 91 })
+          subComponents: Ae(l, "APP-02", { cpuLoad: 89, memLoad: 91 }),
+          graphSeries: Te({ cpuLoad: 89, memLoad: 91 })
         },
         children: /* @__PURE__ */ e(
-          be,
+          ge,
           {
             rotateY: o,
             autoRotate: i,
@@ -6636,11 +6658,11 @@ function ki({ config: t }) {
           name: "APP-03",
           status: u,
           context: { cpuLoad: 45, memLoad: 63 },
-          subComponents: Ee(u, "APP-03", { cpuLoad: 45, memLoad: 63 }),
-          graphSeries: Pe({ cpuLoad: 45, memLoad: 63 })
+          subComponents: Ae(u, "APP-03", { cpuLoad: 45, memLoad: 63 }),
+          graphSeries: Te({ cpuLoad: 45, memLoad: 63 })
         },
         children: /* @__PURE__ */ e(
-          be,
+          ge,
           {
             rotateY: o,
             autoRotate: i,
@@ -6729,14 +6751,14 @@ function ki({ config: t }) {
         visibleAtPhase: 6,
         fixedScale: 1,
         bare: !0,
-        children: /* @__PURE__ */ e(St, { synced: f, latencyMs: f ? 8 : 342 })
+        children: /* @__PURE__ */ e($t, { synced: f, latencyMs: f ? 8 : 342 })
       }
     ),
-    /* @__PURE__ */ e(Ri, { config: t })
+    /* @__PURE__ */ e(Pi, { config: t })
   ] });
 }
-function Ri({ config: t }) {
-  const n = q.useContext(ge), { wdStatus: o, msStatus: i, srv1Status: r, srv2Status: a, srv3Status: s, pdbStatus: l, sdbStatus: u, dbSync: c } = t, p = n?.isSelected && n?.isExpandedPos;
+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;
   return n?.isSelected ? /* @__PURE__ */ d("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
       W,
@@ -6860,15 +6882,15 @@ function Ri({ config: t }) {
     )
   ] }) : null;
 }
-function _i({ config: t, ...n }) {
+function qi({ config: t, ...n }) {
   return /* @__PURE__ */ e(
-    xt,
+    vt,
     {
       name: t.name,
       status: lt(t),
-      connections: $i,
+      connections: Ei,
       ...n,
-      children: /* @__PURE__ */ e(ki, { config: t })
+      children: /* @__PURE__ */ e(Ci, { config: t })
     }
   );
 }
@@ -6883,7 +6905,7 @@ function st(t) {
   ];
   return n.includes("critical") ? "critical" : n.includes("warning") ? "warning" : n.includes("offline") ? "offline" : "online";
 }
-function ji(t) {
+function Qi(t) {
   const n = st(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     {
@@ -6905,7 +6927,7 @@ function ji(t) {
     }
   ];
 }
-function Xi(t) {
+function Ki(t) {
   const n = st(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     ...t.dbSync ? [] : [{ level: "warning", message: "DB Replication Lag Detected" }],
@@ -6914,7 +6936,7 @@ function Xi(t) {
     ...!o && !i && t.dbSync ? [{ level: "info", message: "All Systems Nominal" }] : []
   ];
 }
-const Ci = [
+const Ai = [
   { from: [330, 120], to: [330, 260], visibleAtPhase: 3 },
   { from: [330, 260], to: [165, 390], visibleAtPhase: 4 },
   { from: [330, 260], to: [330, 390], visibleAtPhase: 4 },
@@ -6923,9 +6945,9 @@ const Ci = [
   { from: [330, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" },
   { from: [495, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" }
 ];
-function Ei({ config: t }) {
-  const n = q.useContext(ge), 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(Ae, { children: [
+function Ti({ 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: [
     /* @__PURE__ */ e(
       A,
       {
@@ -6954,8 +6976,8 @@ function Ei({ config: t }) {
           name: "DISP-01",
           status: r,
           context: { traffic: 78 },
-          subComponents: Et(r),
-          graphSeries: Pt({ traffic: 78 })
+          subComponents: Pt(r),
+          graphSeries: At({ traffic: 78 })
         },
         children: /* @__PURE__ */ e(
           rt,
@@ -6987,11 +7009,11 @@ function Ei({ config: t }) {
           name: "APP-01",
           status: a,
           context: { cpuLoad: 67, memLoad: 72 },
-          subComponents: Ee(a, "APP-01", { cpuLoad: 67, memLoad: 72 }),
-          graphSeries: Pe({ cpuLoad: 67, memLoad: 72 })
+          subComponents: Ae(a, "APP-01", { cpuLoad: 67, memLoad: 72 }),
+          graphSeries: Te({ cpuLoad: 67, memLoad: 72 })
         },
         children: /* @__PURE__ */ e(
-          be,
+          ge,
           {
             rotateY: o,
             autoRotate: i,
@@ -7020,11 +7042,11 @@ function Ei({ config: t }) {
           name: "APP-02",
           status: s,
           context: { cpuLoad: 89, memLoad: 91 },
-          subComponents: Ee(s, "APP-02", { cpuLoad: 89, memLoad: 91 }),
-          graphSeries: Pe({ cpuLoad: 89, memLoad: 91 })
+          subComponents: Ae(s, "APP-02", { cpuLoad: 89, memLoad: 91 }),
+          graphSeries: Te({ cpuLoad: 89, memLoad: 91 })
         },
         children: /* @__PURE__ */ e(
-          be,
+          ge,
           {
             rotateY: o,
             autoRotate: i,
@@ -7053,11 +7075,11 @@ function Ei({ config: t }) {
           name: "APP-03",
           status: l,
           context: { cpuLoad: 45, memLoad: 63 },
-          subComponents: Ee(l, "APP-03", { cpuLoad: 45, memLoad: 63 }),
-          graphSeries: Pe({ cpuLoad: 45, memLoad: 63 })
+          subComponents: Ae(l, "APP-03", { cpuLoad: 45, memLoad: 63 }),
+          graphSeries: Te({ cpuLoad: 45, memLoad: 63 })
         },
         children: /* @__PURE__ */ e(
-          be,
+          ge,
           {
             rotateY: o,
             autoRotate: i,
@@ -7146,14 +7168,14 @@ function Ei({ config: t }) {
         visibleAtPhase: 6,
         fixedScale: 1,
         bare: !0,
-        children: /* @__PURE__ */ e(St, { synced: p, latencyMs: p ? 8 : 342 })
+        children: /* @__PURE__ */ e($t, { synced: p, latencyMs: p ? 8 : 342 })
       }
     ),
-    /* @__PURE__ */ e(Pi, { config: t })
+    /* @__PURE__ */ e(Ii, { config: t })
   ] });
 }
-function Pi({ config: t }) {
-  const n = q.useContext(ge), { dispStatus: o, srv1Status: i, srv2Status: r, srv3Status: a, pdbStatus: s, sdbStatus: l, dbSync: u } = t, c = n?.isSelected && n?.isExpandedPos;
+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;
   return n?.isSelected ? /* @__PURE__ */ d("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
       W,
@@ -7262,80 +7284,80 @@ function Pi({ config: t }) {
     )
   ] }) : null;
 }
-function qi({ config: t, ...n }) {
+function Gi({ config: t, ...n }) {
   return /* @__PURE__ */ e(
-    xt,
+    vt,
     {
       name: t.name,
       status: st(t),
-      connections: Ci,
+      connections: Ai,
       ...n,
-      children: /* @__PURE__ */ e(Ei, { config: t })
+      children: /* @__PURE__ */ e(Ti, { config: t })
     }
   );
 }
 export {
-  Hi as AIOPsDashboard,
+  _i as AIOPsDashboard,
   ze as CPU3D,
-  Ht as Carousel,
+  Yt as Carousel,
   tt as CarouselContext,
   it as CarouselItemContext,
-  Bt as ComponentDialog,
-  Fi as ComponentDrillView,
-  vi as DataProvider,
+  Ft as ComponentDialog,
+  Yi as ComponentDrillView,
+  $i as DataProvider,
   Ne as Database3D,
-  Wi as DatabaseNode,
-  Ce as DriveBay3D,
-  Ci as EXCHANGE_CONNECTIONS,
-  qi as ExchangeService,
-  Oi as HOLO_BLUE,
-  Ii as HOLO_CYAN,
+  Bi as DatabaseNode,
+  Pe as DriveBay3D,
+  Ai as EXCHANGE_CONNECTIONS,
+  Gi as ExchangeService,
+  Ni as HOLO_BLUE,
+  Di as HOLO_CYAN,
   Je as HOLO_GLASS,
-  Ie as HOLO_SURFACE,
-  di as HistoricalGraphPanel,
-  _t as HoloBase,
+  Le as HOLO_SURFACE,
+  fi as HistoricalGraphPanel,
+  jt as HoloBase,
   ot as Human3D,
-  Mi as HumanNode,
+  Fi as HumanNode,
   Be as Memory3D,
-  $t as MessageServer3D,
-  Bi as MessageServerNode,
-  Rt as NetworkBlock3D,
+  kt as MessageServer3D,
+  Hi as MessageServerNode,
+  Et as NetworkBlock3D,
   W as NodeCallout,
   Me as Platter3D,
-  H as Port3D,
-  _i as SAPService,
-  $i as SAP_CONNECTIONS,
-  C as STATUS_CFG,
-  be as Server3D,
-  Ni as ServerNode,
-  xt as Service,
-  ge as ServiceContext,
-  Mt as ServiceDialog,
+  F as Port3D,
+  qi as SAPService,
+  Ei as SAP_CONNECTIONS,
+  E as STATUS_CFG,
+  ge as Server3D,
+  zi as ServerNode,
+  vt as Service,
+  ye as ServiceContext,
+  zt as ServiceDialog,
   A as ServiceNode,
-  Yt as SvgConnection,
-  St as SyncBridge,
+  Vt as SvgConnection,
+  $t as SyncBridge,
   M as ThreadPool3D,
   rt as WebDispatcher3D,
-  zi as WebDispatcherNode,
-  Xi as computeExchangeDialogAlerts,
-  ji as computeExchangeDialogMetrics,
+  Ui as WebDispatcherNode,
+  Ki as computeExchangeDialogAlerts,
+  Qi as computeExchangeDialogMetrics,
   st as computeExchangeServiceStatus,
-  Vi as computeSAPDialogAlerts,
-  Yi as computeSAPDialogMetrics,
+  Xi as computeSAPDialogAlerts,
+  ji as computeSAPDialogMetrics,
   lt as computeSAPServiceStatus,
-  xi as defaultDataTransform,
+  Si as defaultDataTransform,
   Ue as getDatabaseGraphSeries,
   Fe as getDatabaseSubComponents,
-  Pt as getDispatcherGraphSeries,
-  Et as getDispatcherSubComponents,
-  Si as getMessageServerGraphSeries,
-  wi as getMessageServerSubComponents,
-  Pe as getServerGraphSeries,
-  Ee as getServerSubComponents,
+  At as getDispatcherGraphSeries,
+  Pt as getDispatcherSubComponents,
+  Ri as getMessageServerGraphSeries,
+  ki as getMessageServerSubComponents,
+  Te as getServerGraphSeries,
+  Ae as getServerSubComponents,
   et as makeFaceStyles,
-  gi as useAIOpsData,
-  yi as useAIOpsDataOptional,
-  Li as useCarouselContext,
-  Di as useCarouselItemContext,
-  Ui as useQueryResult
+  xi as useAIOpsData,
+  vi as useAIOpsDataOptional,
+  Wi as useCarouselContext,
+  Mi as useCarouselItemContext,
+  Vi as useQueryResult
 };