react-aiops 0.1.13 → 0.1.15

package/dist/index.js

@@ -146,7 +146,7 @@ function Ut({
                 }
               ),
               d.map((p, f) => {
-                const g = Ht[p.level];
+                const b = Ht[p.level];
                 return /* @__PURE__ */ c(
                   "div",
                   {
@@ -154,15 +154,15 @@ function Ut({
                       display: "flex",
                       gap: 8,
                       alignItems: "flex-start",
-                      color: g.color,
+                      color: b.color,
                       fontSize: 12,
-                      background: g.bg,
+                      background: b.bg,
                       padding: "6px 10px",
                       borderRadius: 4,
-                      borderLeft: `2px solid ${g.border}`
+                      borderLeft: `2px solid ${b.border}`
                     },
                     children: [
-                      /* @__PURE__ */ e("span", { children: g.icon }),
+                      /* @__PURE__ */ e("span", { children: b.icon }),
                       " ",
                       /* @__PURE__ */ e("span", { children: p.message })
                     ]
@@ -177,7 +177,7 @@ function Ut({
     }
   );
 }
-const $ = {
+const C = {
   online: { color: "#00e5ff", glow: "rgba(0,229,255,0.55)" },
   warning: { color: "#ff8c00", glow: "rgba(255,140,0,0.55)" },
   critical: { color: "#ff2255", glow: "rgba(255,34,85,0.55)" },
@@ -235,7 +235,7 @@ function ht(t, n, o) {
 }
 const ct = "cubic-bezier(0.34, 1.56, 0.64, 1)", qe = "cubic-bezier(0.16, 1, 0.3, 1)";
 function Ot(t) {
-  return $[t]?.color ?? $.online.color;
+  return C[t]?.color ?? C.online.color;
 }
 function Yt(t, n, o) {
   return t >= o ? "#ff2255" : t >= n ? "#ff8c00" : "#00e5ff";
@@ -250,31 +250,31 @@ function Vt({
   sceneWidth: i = 660,
   sceneHeight: r = 600
 }) {
-  const { type: a, name: s, status: l, ex: h, ey: d, context: p = {} } = t, f = Ot(l), g = h >= i / 2, u = d >= r / 2, b = {
+  const { type: a, name: s, status: l, ex: h, ey: d, context: p = {} } = t, f = Ot(l), b = h >= i / 2, u = d >= r / 2, g = {
     position: "fixed",
-    ...g ? { right: 28 } : { left: 28 },
+    ...b ? { right: 28 } : { left: 28 },
     ...u ? { bottom: 110 } : { top: 72 }
-  }, m = g ? 40 : -40, w = u ? 30 : -30, v = t.dialogMetrics ?? p.dialogMetrics;
+  }, m = b ? 40 : -40, w = u ? 30 : -30, v = t.dialogMetrics ?? p.dialogMetrics;
   let S;
   if (v && v.length > 0)
     S = v.map((y, x) => {
-      const C = y.warnAt ?? 70, k = y.critAt ?? 85;
+      const A = y.warnAt ?? 70, k = y.critAt ?? 85;
       return {
         id: y.id,
         label: y.label,
         sublabel: y.sublabel,
         value: y.value,
         unit: y.unit ?? "%",
-        status: Xe(l, y.value, C, k),
+        status: Xe(l, y.value, A, k),
         icon: y.icon ?? "cpu",
         delay: x,
         colorOverride: y.color,
-        warnAt: C,
+        warnAt: A,
         critAt: k
       };
     });
   else {
-    const y = p.cpuLoad ?? p.traffic ?? 50, x = p.memLoad ?? p.queueDepth ?? 60, C = p.capacity ?? 72, k = Xe(l, y, 70, 85), P = Xe(l, x, 75, 88), O = Xe(l, C, 75, 90);
+    const y = p.cpuLoad ?? p.traffic ?? 50, x = p.memLoad ?? p.queueDepth ?? 60, A = p.capacity ?? 72, k = Xe(l, y, 70, 85), $ = Xe(l, x, 75, 88), H = Xe(l, A, 75, 90);
     S = [
       {
         id: "cpu",
@@ -292,7 +292,7 @@ function Vt({
         sublabel: a === "database" ? "BUFFER POOL" : "HEAP USAGE",
         value: x,
         unit: "%",
-        status: P,
+        status: $,
         icon: "mem",
         delay: 1
       },
@@ -300,9 +300,9 @@ function Vt({
         id: "storage",
         label: "STORAGE",
         sublabel: a === "database" ? "TABLESPACE" : "DISK I/O",
-        value: C,
+        value: A,
         unit: "%",
-        status: O,
+        status: H,
         icon: "disk",
         delay: 2
       }
@@ -312,7 +312,7 @@ function Vt({
     "div",
     {
       style: {
-        ...b,
+        ...g,
         width: 420,
         background: "linear-gradient(170deg, rgba(2, 10, 22, 0.96) 0%, rgba(2, 6, 14, 0.98) 100%)",
         backdropFilter: "blur(20px)",
@@ -583,8 +583,8 @@ function _t({
     delay: d,
     colorOverride: p,
     warnAt: f = 70,
-    critAt: g = 85
-  } = t, u = p ?? Yt(a, f, g), b = p ?? Ot(l);
+    critAt: b = 85
+  } = t, u = p ?? Yt(a, f, b), g = p ?? Ot(l);
   return /* @__PURE__ */ c(
     "div",
     {
@@ -604,8 +604,8 @@ function _t({
               width: 52,
               height: 52,
               borderRadius: 12,
-              border: `1px solid ${b}44`,
-              background: `linear-gradient(135deg, ${b}0c 0%, ${b}04 100%)`,
+              border: `1px solid ${g}44`,
+              background: `linear-gradient(135deg, ${g}0c 0%, ${g}04 100%)`,
               display: "flex",
               alignItems: "center",
               justifyContent: "center",
@@ -615,7 +615,7 @@ function _t({
               animation: n ? `comp-dialog-icon-pop 0.5s ${ct} ${0.35 + d * 0.12}s both` : "none"
             },
             children: [
-              /* @__PURE__ */ e(jt, { type: h, color: b }),
+              /* @__PURE__ */ e(jt, { type: h, color: g }),
               (l === "warning" || l === "critical") && /* @__PURE__ */ e(
                 "div",
                 {
@@ -626,8 +626,8 @@ function _t({
                     width: 5,
                     height: 5,
                     borderRadius: "50%",
-                    background: b,
-                    boxShadow: `0 0 6px ${b}`,
+                    background: g,
+                    boxShadow: `0 0 6px ${g}`,
                     animation: "holo-led-blink 1.2s infinite"
                   }
                 }
@@ -737,7 +737,7 @@ function _t({
                   {
                     style: {
                       position: "absolute",
-                      left: `${g}%`,
+                      left: `${b}%`,
                       top: 0,
                       bottom: 0,
                       width: 1,
@@ -781,7 +781,7 @@ function _t({
               {
                 style: {
                   position: "absolute",
-                  left: `${g}%`,
+                  left: `${b}%`,
                   transform: "translateX(-50%)",
                   fontSize: 6,
                   color: "rgba(255,34,85,0.3)",
@@ -914,34 +914,34 @@ function Xt({
   componentScale: d = 0.35,
   drillZoom: p = 3.3,
   autoRotateCarousel: f = !0,
-  carouselSpeed: g = 6e-3,
+  carouselSpeed: b = 6e-3,
   width: u = 950,
-  height: b = 790,
+  height: g = 790,
   onSelectSystem: m,
   onBackgroundClick: w,
   onComponentClick: v,
   onCloseDrill: S,
   onComponentUpdate: y,
   selectedSystemStatus: x = "online",
-  selectedSystemDbSync: C = !0,
+  selectedSystemDbSync: A = !0,
   selectedSystemMetrics: k,
-  selectedSystemAlerts: P
+  selectedSystemAlerts: $
 }) {
-  const [O, I] = R(0);
+  const [H, L] = R(0);
   ke(() => {
-    let N;
+    let D;
     if ((o === "compact" || o === "collapsing") && f) {
       const U = () => {
-        I((ne) => ne + g), N = requestAnimationFrame(U);
+        L((ne) => ne + b), D = requestAnimationFrame(U);
       };
-      N = requestAnimationFrame(U);
+      D = requestAnimationFrame(U);
     }
-    return () => cancelAnimationFrame(N);
-  }, [o, f, g]);
-  const z = q.Children.toArray(t), K = z.length, Z = Tt(
+    return () => cancelAnimationFrame(D);
+  }, [o, f, b]);
+  const M = q.Children.toArray(t), K = M.length, Z = Tt(
     () => ({
       totalSystems: K,
-      carouselRotation: O,
+      carouselRotation: H,
       viewState: o,
       animPhase: i,
       selectedSystem: r,
@@ -957,7 +957,7 @@ function Xt({
     }),
     [
       K,
-      O,
+      H,
       o,
       i,
       r,
@@ -971,9 +971,9 @@ function Xt({
       y,
       u
     ]
-  ), ye = z.map((N, U) => /* @__PURE__ */ e(bt.Provider, { value: { index: U }, children: N }, U)), me = o === "expanded" || o === "expanding" && i >= 4;
+  ), ye = M.map((D, U) => /* @__PURE__ */ e(bt.Provider, { value: { index: U }, children: D }, U)), me = o === "expanded" || o === "expanding" && i >= 4;
   return /* @__PURE__ */ c(ut.Provider, { value: Z, children: [
-    /* @__PURE__ */ c("div", { style: { position: "relative", width: u, height: b, margin: "0 auto", flexShrink: 0 }, children: [
+    /* @__PURE__ */ c("div", { style: { position: "relative", width: u, height: g, margin: "0 auto", flexShrink: 0 }, children: [
       n && (o === "compact" || o === "collapsing") && /* @__PURE__ */ e(
         "img",
         {
@@ -996,25 +996,25 @@ function Xt({
       ),
       ye
     ] }),
-    r && /* @__PURE__ */ e("div", { onClick: (N) => N.stopPropagation(), children: /* @__PURE__ */ e(
+    r && /* @__PURE__ */ e("div", { onClick: (D) => D.stopPropagation(), children: /* @__PURE__ */ e(
       Ut,
       {
         name: r,
         status: x,
-        dbSync: C,
+        dbSync: A,
         visible: me && !a,
         metrics: k,
-        alerts: P
+        alerts: $
       }
     ) }),
-    a && /* @__PURE__ */ e("div", { onClick: (N) => N.stopPropagation(), children: /* @__PURE__ */ e(
+    a && /* @__PURE__ */ e("div", { onClick: (D) => D.stopPropagation(), children: /* @__PURE__ */ e(
       Vt,
       {
         component: a,
         onClose: S,
         visible: s >= 0.3,
         sceneWidth: u,
-        sceneHeight: b
+        sceneHeight: g
       }
     ) })
   ] });
@@ -1316,30 +1316,30 @@ function Lt({
   _animPhase: d,
   _selectedSystem: p,
   _selectedComponent: f,
-  _rotateY: g,
+  _rotateY: b,
   _autoRotateComponents: u,
-  _componentScale: b,
+  _componentScale: g,
   _drillZoom: m,
   _onSelectSystem: w,
   _onComponentClick: v,
   _onComponentUpdate: S,
   _containerWidth: y
 }) {
-  const x = ge(ut), C = ge(bt), k = a ?? C.index, P = s ?? x?.totalSystems ?? 1, O = l ?? x?.carouselRotation ?? 0, I = h ?? x?.viewState ?? "compact", z = d ?? x?.animPhase ?? 0, K = p ?? x?.selectedSystem ?? null, Z = f ?? x?.selectedComponent ?? null, ye = g ?? x?.rotateY ?? 20, me = u ?? x?.autoRotateComponents ?? !0, N = b ?? x?.componentScale ?? 0.35, U = m ?? x?.drillZoom ?? 3.3, ne = w ?? x?.onSelectSystem, Be = v ?? x?.onComponentClick, oe = S ?? x?.onComponentUpdate, Fe = y ?? x?.containerWidth ?? 950, J = K === t, B = J && (I === "expanded" || I === "expanding" && z >= 1), _ = !B, se = (Fe - Zt) / 2, de = $t + se, Ce = k / P * Math.PI * 2 + O, it = 420, nt = 160, xe = de + Math.cos(Ce) * it, ce = 450 + Math.sin(Ce) * nt, ot = Math.round(ce), T = !J && (I === "expanding" || I === "expanded"), j = T ? 0 : 1, re = _ ? 0.3 + (Math.sin(Ce) + 1) * 0.1 : 1, ee = _ ? re : N, ae = I === "compact" || I === "collapsing" ? "none" : "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)", ve = J && Z, le = ve ? U : 1, pe = Z?.ex ?? 330, F = Z?.ey ?? 300, { size: rt = 90, color: at = "#00e5ff", widthRatio: Ye = 3 } = i ?? {}, we = {
+  const x = ge(ut), A = ge(bt), k = a ?? A.index, $ = s ?? x?.totalSystems ?? 1, H = l ?? x?.carouselRotation ?? 0, L = h ?? x?.viewState ?? "compact", M = d ?? x?.animPhase ?? 0, K = p ?? x?.selectedSystem ?? null, Z = f ?? x?.selectedComponent ?? null, ye = b ?? x?.rotateY ?? 20, me = u ?? x?.autoRotateComponents ?? !0, D = g ?? x?.componentScale ?? 0.35, U = m ?? x?.drillZoom ?? 3.3, ne = w ?? x?.onSelectSystem, Be = v ?? x?.onComponentClick, le = S ?? x?.onComponentUpdate, Fe = y ?? x?.containerWidth ?? 950, J = K === t, z = J && (L === "expanded" || L === "expanding" && M >= 1), _ = !z, se = (Fe - Zt) / 2, de = $t + se, Ce = k / $ * Math.PI * 2 + H, it = 420, nt = 160, xe = de + Math.cos(Ce) * it, ce = 450 + Math.sin(Ce) * nt, ot = Math.round(ce), T = !J && (L === "expanding" || L === "expanded"), j = T ? 0 : 1, oe = _ ? 0.3 + (Math.sin(Ce) + 1) * 0.1 : 1, ee = _ ? oe : D, re = L === "compact" || L === "collapsing" ? "none" : "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)", ve = J && Z, ae = ve ? U : 1, pe = Z?.ex ?? 330, B = Z?.ey ?? 300, { size: rt = 90, color: at = "#00e5ff", widthRatio: Ye = 3 } = i ?? {}, we = {
     name: t,
     isSelected: J,
-    isExpandedPos: B,
+    isExpandedPos: z,
     isCompact: _,
-    animPhase: z,
+    animPhase: M,
     compactCx: xe,
     compactCy: ce,
-    groupScale: re,
+    groupScale: oe,
     effectiveScale: ee,
-    transitionValue: ae,
+    transitionValue: re,
     rotateY: ye,
     autoRotateComponents: me,
     onComponentClick: Be,
-    onComponentUpdate: oe,
+    onComponentUpdate: le,
     selectedComponentName: Z?.name ?? null,
     expandedOffsetX: se
   };
@@ -1358,7 +1358,7 @@ function Lt({
         filter: _ && Math.sin(Ce) < -0.5 ? "brightness(0.5) blur(2px)" : "none",
         zIndex: J ? 500 : T ? 0 : ot,
         transformOrigin: `${de}px ${kt}px`,
-        transform: ve ? `translate(${-(pe - $t) * le}px, ${-(F - kt) * le}px) scale(${le})` : "none"
+        transform: ve ? `translate(${-(pe - $t) * ae}px, ${-(B - kt) * ae}px) scale(${ae})` : "none"
       },
       children: [
         _ && !T && /* @__PURE__ */ e(
@@ -1375,8 +1375,8 @@ function Lt({
               cursor: "pointer",
               zIndex: 101
             },
-            onClick: (H) => {
-              H.stopPropagation(), ne?.(t);
+            onClick: (F) => {
+              F.stopPropagation(), ne?.(t);
             }
           }
         ),
@@ -1387,7 +1387,7 @@ function Lt({
               position: "absolute",
               left: xe,
               top: ce - 200,
-              transform: `translate(-50%, -50%) scale(${re})`,
+              transform: `translate(-50%, -50%) scale(${oe})`,
               zIndex: 110,
               pointerEvents: "none",
               animation: "holo-led-blink 1.5s infinite",
@@ -1433,13 +1433,13 @@ function Lt({
           {
             style: {
               position: "absolute",
-              left: B ? de : xe,
-              top: B ? 48 : ce - 180,
-              transform: `translate(-50%, -50%) scale(${B ? 1.2 : re * 1.5})`,
+              left: z ? de : xe,
+              top: z ? 48 : ce - 180,
+              transform: `translate(-50%, -50%) scale(${z ? 1.2 : oe * 1.5})`,
               opacity: 1,
               pointerEvents: "none",
               zIndex: 100,
-              transition: ae,
+              transition: re,
               fontSize: 36,
               fontWeight: 700,
               letterSpacing: "0.18em",
@@ -1459,23 +1459,23 @@ function Lt({
             style: {
               position: "absolute",
               top: 0,
-              left: B ? se : 0,
+              left: z ? se : 0,
               width: 660,
               height: 640,
               pointerEvents: "none",
               zIndex: 0,
-              transition: ae
+              transition: re
             },
-            children: o.map((H, Ve) => /* @__PURE__ */ e(
+            children: o.map((F, Ve) => /* @__PURE__ */ e(
               qt,
               {
-                x1: H.from[0],
-                y1: H.from[1],
-                x2: H.to[0],
-                y2: H.to[1],
-                show: J && z >= (H.visibleAtPhase ?? 0),
-                color: H.color,
-                dur: H.duration
+                x1: F.from[0],
+                y1: F.from[1],
+                x2: F.to[0],
+                y2: F.to[1],
+                show: J && M >= (F.visibleAtPhase ?? 0),
+                color: F.color,
+                dur: F.duration
               },
               Ve
             ))
@@ -1486,10 +1486,10 @@ function Lt({
           {
             style: {
               position: "absolute",
-              left: B ? de : xe,
-              top: B ? 570 : ce + 70,
-              transform: `translate(-50%, -50%) scaleX(${B ? 1 : 0.4}) scaleY(${B ? 1 : 0.6}) scale(${B ? 1 : re})`,
-              transition: ae,
+              left: z ? de : xe,
+              top: z ? 570 : ce + 70,
+              transform: `translate(-50%, -50%) scaleX(${z ? 1 : 0.4}) scaleY(${z ? 1 : 0.6}) scale(${z ? 1 : oe})`,
+              transition: re,
               zIndex: 1
             },
             children: /* @__PURE__ */ e(Gt, { size: rt, color: at, widthRatio: Ye, children: /* @__PURE__ */ e("div", { className: "base-hotspot" }) })
@@ -1500,7 +1500,7 @@ function Lt({
     }
   ) });
 }
-function W({
+function N({
   ex: t,
   ey: n,
   status: o,
@@ -1510,23 +1510,22 @@ function W({
   offsetY: s,
   isVisible: l,
   align: h = "right",
-  internalRef: d,
-  forceShow: p = !1
+  internalRef: d
 }) {
-  const f = ge(Re), g = f?.expandedOffsetX ?? 0;
-  if (o === "online" && !p) return null;
-  const u = l && !!f?.isExpandedPos, b = o === "online" ? $.warning.color : $[o]?.color ?? $.warning.color, m = Math.abs(a) > Math.abs(s), w = t + g + (m ? Math.sign(a) * 45 : 0), v = n + (m ? 0 : Math.sign(s) * 40), S = t + g + a, y = n + s;
-  let x = "";
-  if (m) {
-    const O = w + (S - w) / 2;
-    x = `M ${w} ${v} L ${O} ${v} L ${O} ${y} L ${S} ${y}`;
+  const p = ge(Re), f = p?.expandedOffsetX ?? 0;
+  if (o === "online") return null;
+  const b = l && !!p?.isExpandedPos, u = C[o]?.color ?? C.warning.color, g = Math.abs(a) > Math.abs(s), m = t + f + (g ? Math.sign(a) * 45 : 0), w = n + (g ? 0 : Math.sign(s) * 40), v = t + f + a, S = n + s;
+  let y = "";
+  if (g) {
+    const $ = m + (v - m) / 2;
+    y = `M ${m} ${w} L ${$} ${w} L ${$} ${S} L ${v} ${S}`;
   } else {
-    const O = v + (y - v) / 2;
-    x = `M ${w} ${v} L ${w} ${O} L ${S} ${O} L ${S} ${y}`;
+    const $ = w + (S - w) / 2;
+    y = `M ${m} ${w} L ${m} ${$} L ${v} ${$} L ${v} ${S}`;
   }
-  let C = "translate(0, -50%)";
-  h === "left" && (C = "translate(-100%, -50%)"), h === "top" && (C = "translate(-50%, -100%)"), h === "bottom" && (C = "translate(-50%, 0)");
-  const k = h === "left" ? -8 : h === "right" ? 8 : 0, P = h === "top" ? -8 : h === "bottom" ? 8 : 0;
+  let x = "translate(0, -50%)";
+  h === "left" && (x = "translate(-100%, -50%)"), h === "top" && (x = "translate(-50%, -100%)"), h === "bottom" && (x = "translate(-50%, 0)");
+  const A = h === "left" ? -8 : h === "right" ? 8 : 0, k = h === "top" ? -8 : h === "bottom" ? 8 : 0;
   return /* @__PURE__ */ c(
     "div",
     {
@@ -1537,7 +1536,7 @@ function W({
         width: "100%",
         height: "100%",
         pointerEvents: "none",
-        opacity: u ? 1 : 0,
+        opacity: b ? 1 : 0,
         transition: "opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.8s",
         zIndex: 150
       },
@@ -1557,12 +1556,12 @@ function W({
             children: /* @__PURE__ */ e(
               "path",
               {
-                d: x,
+                d: y,
                 fill: "none",
-                stroke: b,
+                stroke: u,
                 strokeWidth: "1.5",
                 strokeDasharray: "5 4",
-                style: { filter: `drop-shadow(0 0 4px ${b})`, opacity: 0.55 }
+                style: { filter: `drop-shadow(0 0 4px ${u})`, opacity: 0.55 }
               }
             )
           }
@@ -1572,14 +1571,14 @@ function W({
           {
             style: {
               position: "absolute",
-              left: S,
-              top: y,
-              transform: C,
-              marginLeft: k,
-              marginTop: P,
+              left: v,
+              top: S,
+              transform: x,
+              marginLeft: A,
+              marginTop: k,
               background: "repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(255,255,255,0.03) 2px, rgba(255,255,255,0.03) 4px), rgba(2, 8, 16, 0.82)",
-              border: `1px solid ${b}55`,
-              borderLeft: `2px solid ${b}`,
+              border: `1px solid ${u}55`,
+              borderLeft: `2px solid ${u}`,
               backdropFilter: "blur(8px)",
               WebkitBackdropFilter: "blur(8px)",
               padding: "6px 10px",
@@ -1587,7 +1586,7 @@ function W({
               color: "#fff",
               fontFamily: "'Courier New', monospace",
               width: 140,
-              boxShadow: `0 4px 12px rgba(0,0,0,0.4), 0 0 8px ${b}22 inset`
+              boxShadow: `0 4px 12px rgba(0,0,0,0.4), 0 0 8px ${u}22 inset`
             },
             children: [
               /* @__PURE__ */ c(
@@ -1607,8 +1606,8 @@ function W({
                           width: 4,
                           height: 4,
                           borderRadius: "50%",
-                          background: b,
-                          boxShadow: `0 0 6px ${b}`,
+                          background: u,
+                          boxShadow: `0 0 6px ${u}`,
                           animation: "holo-led-blink 1.5s infinite"
                         }
                       }
@@ -1617,12 +1616,12 @@ function W({
                       "div",
                       {
                         style: {
-                          color: b,
+                          color: u,
                           fontWeight: "600",
                           fontSize: 10,
                           letterSpacing: "1px",
                           textTransform: "uppercase",
-                          textShadow: `0 0 4px ${b}88`
+                          textShadow: `0 0 4px ${u}88`
                         },
                         children: d ? `${i} · ${d}` : i
                       }
@@ -1648,7 +1647,7 @@ function W({
     }
   );
 }
-function A({
+function E({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -1661,11 +1660,11 @@ function A({
   componentInfo: d,
   visibleAtPhase: p = 0,
   fixedScale: f,
-  bare: g = !1,
+  bare: b = !1,
   alert: u
 }) {
-  const b = ge(Re);
-  if (!b)
+  const g = ge(Re);
+  if (!g)
     throw new Error("ServiceNode must be used inside a <Service> component.");
   const {
     isExpandedPos: m,
@@ -1674,12 +1673,12 @@ function A({
     compactCy: S,
     groupScale: y,
     effectiveScale: x,
-    transitionValue: C,
+    transitionValue: A,
     onComponentClick: k,
-    onComponentUpdate: P,
-    selectedComponentName: O,
-    expandedOffsetX: I
-  } = b, K = p === 0 || b.isSelected && w >= p ? 1 : 0, Z = v + o.x, ye = S + o.y, me = m ? t + I : Z, N = m ? n : ye, U = f !== void 0 ? f : b.isCompact ? y : x, ne = !!d && !!O && d.name === O, Be = d?.status ? $[d.status]?.color ?? a : a, oe = d?.status === "offline" ? "#4a6a8a" : Be, Fe = d && m && k ? () => k({
+    onComponentUpdate: $,
+    selectedComponentName: H,
+    expandedOffsetX: L
+  } = g, K = p === 0 || g.isSelected && w >= p ? 1 : 0, Z = v + o.x, ye = S + o.y, me = m ? t + L : Z, D = m ? n : ye, U = f !== void 0 ? f : g.isCompact ? y : x, ne = !!d && !!H && d.name === H, Be = d?.status ? C[d.status]?.color ?? a : a, le = d?.status === "offline" ? "#4a6a8a" : Be, Fe = d && m && k ? () => k({
     type: d.type,
     name: d.name,
     status: d.status,
@@ -1689,9 +1688,9 @@ function A({
     dialogMetrics: d.dialogMetrics,
     subComponents: d.subComponents,
     graphSeries: d.graphSeries
-  }) : void 0, J = JSON.stringify(d?.context ?? {}), B = JSON.stringify(d?.dialogMetrics ?? []);
+  }) : void 0, J = JSON.stringify(d?.context ?? {}), z = JSON.stringify(d?.dialogMetrics ?? []);
   ke(() => {
-    !ne || !d || !P || P({
+    !ne || !d || !$ || $({
       type: d.type,
       name: d.name,
       status: d.status,
@@ -1702,10 +1701,8 @@ function A({
       subComponents: d.subComponents,
       graphSeries: d.graphSeries
     });
-  }, [ne, d?.status, J, B]);
-  const _ = d?.status === "warning" || d?.status === "critical" || !!u;
-  u && d?.status === "online" && $.warning.color;
-  const se = d?.status ?? "online", de = d?.name ?? s ?? "";
+  }, [ne, d?.status, J, z]);
+  const _ = d?.status === "warning" || d?.status === "critical", se = d?.status ?? "online", de = d?.name ?? s ?? "";
   return /* @__PURE__ */ c(Me, { children: [
     /* @__PURE__ */ e(
       "div",
@@ -1713,22 +1710,22 @@ function A({
         style: {
           position: "absolute",
           left: me,
-          top: N,
+          top: D,
           transform: `translate(-50%, -50%) scale(${U})`,
           opacity: K,
           zIndex: i,
-          transition: C || "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)",
+          transition: A || "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)",
           pointerEvents: m && K >= 0.5 ? "auto" : "none"
         },
-        children: g ? r : /* @__PURE__ */ e(
+        children: b ? r : /* @__PURE__ */ e(
           Jt,
           {
-            statusColor: oe,
+            statusColor: le,
             label: s,
             subLabel: l,
             delay: h,
             showLabels: m,
-            isCompact: b.isCompact,
+            isCompact: g.isCompact,
             onClick: Fe,
             isSelected: ne,
             isAlerting: _,
@@ -1738,7 +1735,7 @@ function A({
       }
     ),
     u && /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: t,
         ey: n,
@@ -1749,8 +1746,7 @@ function A({
         offsetY: u.offsetY ?? -30,
         align: u.align ?? "right",
         internalRef: u.internalRef,
-        isVisible: !0,
-        forceShow: !0
+        isVisible: !0
       }
     )
   ] });
@@ -1767,7 +1763,7 @@ function Jt({
   isSelected: h = !1,
   isAlerting: d = !1
 }) {
-  const [p, f] = R(!1), g = h ? `brightness(1.5) drop-shadow(0 0 24px ${n}cc) drop-shadow(0 0 8px ${n}88)` : p && l ? `brightness(1.2) drop-shadow(0 0 12px ${n}77)` : "";
+  const [p, f] = R(!1), b = h ? `brightness(1.5) drop-shadow(0 0 24px ${n}cc) drop-shadow(0 0 8px ${n}88)` : p && l ? `brightness(1.2) drop-shadow(0 0 12px ${n}77)` : "";
   return /* @__PURE__ */ c(
     "div",
     {
@@ -1778,7 +1774,7 @@ function Jt({
       style: {
         cursor: l ? "pointer" : void 0,
         transition: "filter 0.3s ease",
-        filter: g
+        filter: b
       },
       onMouseEnter: () => f(!0),
       onMouseLeave: () => f(!1),
@@ -1790,8 +1786,8 @@ function Jt({
           {
             className: "node-alert-glow",
             style: {
-              "--pulse-color": alertGlowColor,
-              boxShadow: `0 0 20px ${alertGlowColor}, 0 0 40px ${alertGlowColor}66`
+              "--pulse-color": n,
+              boxShadow: `0 0 20px ${n}, 0 0 40px ${n}66`
             }
           }
         ),
@@ -2045,7 +2041,7 @@ function ei({
           }
         ),
         Array.from({ length: 3 }, (p, f) => {
-          const g = f < l;
+          const b = f < l;
           return /* @__PURE__ */ c(
             "div",
             {
@@ -2072,8 +2068,8 @@ function ei({
                       height: 5,
                       borderRadius: "50%",
                       flexShrink: 0,
-                      background: g ? t.color : "#08142a",
-                      boxShadow: g ? `0 0 6px ${t.color}, 0 0 12px ${t.color}66` : "none"
+                      background: b ? t.color : "#08142a",
+                      boxShadow: b ? `0 0 6px ${t.color}, 0 0 12px ${t.color}66` : "none"
                     }
                   }
                 ),
@@ -2089,7 +2085,7 @@ function ei({
                       position: "relative",
                       overflow: "hidden"
                     },
-                    children: g && /* @__PURE__ */ e(
+                    children: b && /* @__PURE__ */ e(
                       "div",
                       {
                         style: {
@@ -2582,20 +2578,20 @@ function $e({
   brandLabel: d = "BUSAUD",
   _compact: p
 }) {
-  const [f, g] = R(n), u = ie(0), b = ie(0);
+  const [f, b] = R(n), u = ie(0), g = ie(0);
   ke(() => {
     if (!r) {
-      g(n);
+      b(n);
       return;
     }
     const w = (v) => {
-      b.current && g((S) => S + (v - b.current) * 0.027), b.current = v, u.current = requestAnimationFrame(w);
+      g.current && b((S) => S + (v - g.current) * 0.027), g.current = v, u.current = requestAnimationFrame(w);
     };
     return u.current = requestAnimationFrame(w), () => {
-      cancelAnimationFrame(u.current), b.current = 0;
+      cancelAnimationFrame(u.current), g.current = 0;
     };
   }, [r, n]);
-  const m = $[a] ?? $.online;
+  const m = C[a] ?? C.online;
   return /* @__PURE__ */ c(
     "div",
     {
@@ -2733,14 +2729,14 @@ function Mi({
   visibleAtPhase: d,
   cpuLoad: p,
   memLoad: f,
-  brandLabel: g,
+  brandLabel: b,
   dialogMetrics: u,
-  subComponents: b,
+  subComponents: g,
   graphSeries: m,
   alert: w
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -2757,11 +2753,11 @@ function Mi({
         status: a,
         context: { cpuLoad: p, memLoad: f },
         dialogMetrics: u,
-        subComponents: b,
+        subComponents: g,
         graphSeries: m
       },
       alert: w,
-      children: /* @__PURE__ */ e($e, { status: a, cpuLoad: p, memLoad: f, brandLabel: g })
+      children: /* @__PURE__ */ e($e, { status: a, cpuLoad: p, memLoad: f, brandLabel: b })
     }
   );
 }
@@ -2779,7 +2775,7 @@ function ni({
 }) {
   return /* @__PURE__ */ c(Me, { children: [
     st.map((s, l) => {
-      const h = dt(s), d = l === 0, p = Math.round(4 + h * 9), f = Math.round(12 + h * 22), g = Math.round(28 + h * 44), u = Math.round(h * 0.55 * 255).toString(16).padStart(2, "0");
+      const h = dt(s), d = l === 0, p = Math.round(4 + h * 9), f = Math.round(12 + h * 22), b = Math.round(28 + h * 44), u = Math.round(h * 0.55 * 255).toString(16).padStart(2, "0");
       return /* @__PURE__ */ e(
         "div",
         {
@@ -2791,7 +2787,7 @@ function ni({
             top: t,
             transform: `rotateY(${s}deg) translateZ(${Se}px)`,
             backfaceVisibility: "hidden",
-            background: d ? a ? "linear-gradient(180deg, rgb(0,28,62), rgb(0,18,44))" : "linear-gradient(180deg, rgba(0,28,62,0.70), rgba(0,18,44,0.76))" : `rgb(${p},${f},${g})`,
+            background: d ? a ? "linear-gradient(180deg, rgb(0,28,62), rgb(0,18,44))" : "linear-gradient(180deg, rgba(0,28,62,0.70), rgba(0,18,44,0.76))" : `rgb(${p},${f},${b})`,
             borderLeft: `1px solid ${o.color}${u}`,
             boxShadow: d ? `inset 0 0 18px ${o.color}28` : "none"
           },
@@ -2996,14 +2992,14 @@ function Ue({
       d(n);
       return;
     }
-    const u = (b) => {
-      f.current && d((m) => m + (b - f.current) * 0.027), f.current = b, p.current = requestAnimationFrame(u);
+    const u = (g) => {
+      f.current && d((m) => m + (g - f.current) * 0.027), f.current = g, p.current = requestAnimationFrame(u);
     };
     return p.current = requestAnimationFrame(u), () => {
       cancelAnimationFrame(p.current), f.current = 0;
     };
   }, [r, n]);
-  const g = $[a] ?? $.online;
+  const b = C[a] ?? C.online;
   return /* @__PURE__ */ c(
     "div",
     {
@@ -3071,7 +3067,7 @@ function Ue({
               position: "absolute",
               width: te * 2.8 * i,
               height: lt * 0.85 * i,
-              background: `radial-gradient(ellipse, ${g.glow} 0%, transparent 65%)`,
+              background: `radial-gradient(ellipse, ${b.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(50 * i)}px)`,
               pointerEvents: "none",
               top: "45%",
@@ -3105,7 +3101,7 @@ function Ue({
                   {
                     diskY: u * (Oe + gt),
                     diskIdx: u,
-                    cfg: g,
+                    cfg: b,
                     hasRingBelow: u < 2,
                     capacity: s,
                     compact: l
@@ -3133,12 +3129,12 @@ function zi({
   visibleAtPhase: d,
   capacity: p,
   dialogMetrics: f,
-  subComponents: g,
+  subComponents: b,
   graphSeries: u,
-  alert: b
+  alert: g
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -3155,16 +3151,16 @@ function zi({
         status: a,
         context: { capacity: p },
         dialogMetrics: f,
-        subComponents: g,
+        subComponents: b,
         graphSeries: u
       },
-      alert: b,
+      alert: g,
       children: /* @__PURE__ */ e(Ue, { status: a, capacity: p })
     }
   );
 }
 function yt({ status: t = "online", scale: n = 1 }) {
-  const i = ($[t] ?? $.online).color;
+  const i = (C[t] ?? C.online).color;
   return /* @__PURE__ */ e(
     "div",
     {
@@ -3286,7 +3282,7 @@ function Bi({
   visibleAtPhase: l
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -3777,20 +3773,20 @@ function mt({
   activeRoutes: h = 12,
   _compact: d
 }) {
-  const [p, f] = R(n), g = ie(0), u = ie(0);
+  const [p, f] = R(n), b = ie(0), u = ie(0);
   ke(() => {
     if (!r) {
       f(n);
       return;
     }
     const m = (w) => {
-      u.current && f((v) => v + (w - u.current) * 0.027), u.current = w, g.current = requestAnimationFrame(m);
+      u.current && f((v) => v + (w - u.current) * 0.027), u.current = w, b.current = requestAnimationFrame(m);
     };
-    return g.current = requestAnimationFrame(m), () => {
-      cancelAnimationFrame(g.current), u.current = 0;
+    return b.current = requestAnimationFrame(m), () => {
+      cancelAnimationFrame(b.current), u.current = 0;
     };
   }, [r, n]);
-  const b = $[a] ?? $.online;
+  const g = C[a] ?? C.online;
   return /* @__PURE__ */ c(
     "div",
     {
@@ -3858,7 +3854,7 @@ function mt({
               position: "absolute",
               width: he * 1.3 * i,
               height: Q * 2 * i,
-              background: `radial-gradient(ellipse, ${b.glow} 0%, transparent 65%)`,
+              background: `radial-gradient(ellipse, ${g.glow} 0%, transparent 65%)`,
               filter: `blur(${Math.round(40 * i)}px)`,
               pointerEvents: "none",
               top: "40%",
@@ -3891,7 +3887,7 @@ function mt({
                   /* @__PURE__ */ e("div", { style: Ae.front, children: /* @__PURE__ */ e(
                     oi,
                     {
-                      cfg: b,
+                      cfg: g,
                       name: s,
                       traffic: l,
                       activeRoutes: h,
@@ -3899,8 +3895,8 @@ function mt({
                     }
                   ) }),
                   /* @__PURE__ */ e("div", { style: Ae.back, children: /* @__PURE__ */ e(ri, {}) }),
-                  /* @__PURE__ */ e("div", { style: Ae.left, children: /* @__PURE__ */ e(Ct, { side: "left", color: b.color }) }),
-                  /* @__PURE__ */ e("div", { style: Ae.right, children: /* @__PURE__ */ e(Ct, { side: "right", color: b.color }) }),
+                  /* @__PURE__ */ e("div", { style: Ae.left, children: /* @__PURE__ */ e(Ct, { side: "left", color: g.color }) }),
+                  /* @__PURE__ */ e("div", { style: Ae.right, children: /* @__PURE__ */ e(Ct, { side: "right", color: g.color }) }),
                   /* @__PURE__ */ e("div", { style: Ae.top, children: /* @__PURE__ */ e(ai, { traffic: l }) }),
                   /* @__PURE__ */ e("div", { style: Ae.bottom, children: /* @__PURE__ */ e("div", { style: { width: he, height: Le, background: "#020508" } }) })
                 ]
@@ -3925,13 +3921,13 @@ function Fi({
   visibleAtPhase: d,
   traffic: p,
   activeRoutes: f,
-  dialogMetrics: g,
+  dialogMetrics: b,
   subComponents: u,
-  graphSeries: b,
+  graphSeries: g,
   alert: m
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -3947,9 +3943,9 @@ function Fi({
         name: r,
         status: a,
         context: { traffic: p, activeRoutes: f },
-        dialogMetrics: g,
+        dialogMetrics: b,
         subComponents: u,
-        graphSeries: b
+        graphSeries: g
       },
       alert: m,
       children: /* @__PURE__ */ e(mt, { status: a, traffic: p, activeRoutes: f })
@@ -4438,17 +4434,17 @@ function Dt({
   instances: d = 3,
   _compact: p
 }) {
-  const [f, g] = R(n), u = ie(0), b = ie(0);
+  const [f, b] = R(n), u = ie(0), g = ie(0);
   ke(() => {
     if (!r) {
-      g(n);
+      b(n);
       return;
     }
     const w = (v) => {
-      b.current && g((S) => S + (v - b.current) * 0.027), b.current = v, u.current = requestAnimationFrame(w);
+      g.current && b((S) => S + (v - g.current) * 0.027), g.current = v, u.current = requestAnimationFrame(w);
     };
     return u.current = requestAnimationFrame(w), () => {
-      cancelAnimationFrame(u.current), b.current = 0;
+      cancelAnimationFrame(u.current), g.current = 0;
     };
   }, [r, n]);
   const m = Pt[a] ?? Pt.online;
@@ -4587,14 +4583,14 @@ function Hi({
   visibleAtPhase: d,
   queueDepth: p,
   msgsPerSec: f,
-  instances: g,
+  instances: b,
   dialogMetrics: u,
-  subComponents: b,
+  subComponents: g,
   graphSeries: m,
   alert: w
 }) {
   return /* @__PURE__ */ e(
-    A,
+    E,
     {
       ex: t,
       ey: n,
@@ -4609,9 +4605,9 @@ function Hi({
         type: "messageServer",
         name: r,
         status: a,
-        context: { queueDepth: p, msgsPerSec: f, instances: g },
+        context: { queueDepth: p, msgsPerSec: f, instances: b },
         dialogMetrics: u,
-        subComponents: b,
+        subComponents: g,
         graphSeries: m
       },
       alert: w,
@@ -4621,13 +4617,13 @@ function Hi({
           status: a,
           queueDepth: p,
           msgsPerSec: f,
-          instances: g
+          instances: b
         }
       )
     }
   );
 }
-function L(t, n, o = 24) {
+function O(t, n, o = 24) {
   return Array.from({ length: o }, (i, r) => {
     const a = r / o;
     return Math.min(100, Math.max(0, t + Math.sin(a * Math.PI * 2) * n + (Math.random() - 0.5) * 10));
@@ -4727,34 +4723,34 @@ function fi(t, n) {
   if (t === "server") {
     const o = n.cpuLoad ?? 50, i = n.memLoad ?? 60;
     return [
-      { id: "cpu", label: "CPU-0", unit: "%", color: "#00e5ff", data: L(o, 15) },
-      { id: "cpu1", label: "CPU-1", unit: "%", color: "#00e5ff", data: L(o * 0.7, 12) },
-      { id: "heap0", label: "HEAP-0", unit: "%", color: "#8855ee", data: L(i, 18) },
-      { id: "heap1", label: "HEAP-1", unit: "%", color: "#8855ee", data: L(i * 0.85, 14) },
-      { id: "drive1", label: "DRIVE-1 I/O", unit: "%", color: "#ff8c00", data: L(40, 25) },
-      { id: "drive2", label: "DRIVE-2 I/O", unit: "%", color: "#ff8c00", data: L(35, 20) },
-      { id: "drive3", label: "DRIVE-3 I/O", unit: "%", color: "#ff8c00", data: L(30, 22) },
-      { id: "thread", label: "THREAD-POOL", unit: "%", color: "#22aaff", data: L(55, 20) }
+      { id: "cpu", label: "CPU-0", unit: "%", color: "#00e5ff", data: O(o, 15) },
+      { id: "cpu1", label: "CPU-1", unit: "%", color: "#00e5ff", data: O(o * 0.7, 12) },
+      { id: "heap0", label: "HEAP-0", unit: "%", color: "#8855ee", data: O(i, 18) },
+      { id: "heap1", label: "HEAP-1", unit: "%", color: "#8855ee", data: O(i * 0.85, 14) },
+      { id: "drive1", label: "DRIVE-1 I/O", unit: "%", color: "#ff8c00", data: O(40, 25) },
+      { id: "drive2", label: "DRIVE-2 I/O", unit: "%", color: "#ff8c00", data: O(35, 20) },
+      { id: "drive3", label: "DRIVE-3 I/O", unit: "%", color: "#ff8c00", data: O(30, 22) },
+      { id: "thread", label: "THREAD-POOL", unit: "%", color: "#22aaff", data: O(55, 20) }
     ];
   }
   if (t === "dispatcher" || t === "messageServer") {
     const o = n.traffic ?? n.queueDepth ?? 50;
     return [
-      { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: L(o, 20) },
-      { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: L(60, 25) },
-      { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: L(45, 20) },
-      { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: L(70, 30) },
-      { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: L(o * 0.9, 15) }
+      { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: O(o, 20) },
+      { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: O(60, 25) },
+      { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: O(45, 20) },
+      { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: O(70, 30) },
+      { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: O(o * 0.9, 15) }
     ];
   }
   if (t === "database") {
     const o = n.capacity ?? 70;
     return [
-      { id: "platter0", label: "PLATTER-0 I/O", unit: "%", color: "#ff8c00", data: L(40, 20) },
-      { id: "platter1", label: "PLATTER-1 I/O", unit: "%", color: "#ff8c00", data: L(55, 25) },
-      { id: "platter2", label: "PLATTER-2 I/O", unit: "%", color: "#ff8c00", data: L(35, 18) },
-      { id: "connpool", label: "CONN-POOL", unit: "%", color: "#00e5ff", data: L(o, 15) },
-      { id: "cache", label: "QUERY-CACHE", unit: "%", color: "#00ff88", data: L(75, 12) }
+      { id: "platter0", label: "PLATTER-0 I/O", unit: "%", color: "#ff8c00", data: O(40, 20) },
+      { id: "platter1", label: "PLATTER-1 I/O", unit: "%", color: "#ff8c00", data: O(55, 25) },
+      { id: "platter2", label: "PLATTER-2 I/O", unit: "%", color: "#ff8c00", data: O(35, 18) },
+      { id: "connpool", label: "CONN-POOL", unit: "%", color: "#00e5ff", data: O(o, 15) },
+      { id: "cache", label: "QUERY-CACHE", unit: "%", color: "#00ff88", data: O(75, 12) }
     ];
   }
   return [];
@@ -4768,7 +4764,7 @@ function Nt({
   delay: a = "0s",
   children: s
 }) {
-  const l = r ? $[r]?.glow ?? "rgba(0,229,255,0.4)" : "rgba(0,229,255,0.4)";
+  const l = r ? C[r]?.glow ?? "rgba(0,229,255,0.4)" : "rgba(0,229,255,0.4)";
   return /* @__PURE__ */ c(
     "div",
     {
@@ -4809,8 +4805,8 @@ function Nt({
               width: 4,
               height: 4,
               borderRadius: "50%",
-              background: $[r]?.color,
-              boxShadow: `0 0 6px ${$[r]?.color}`,
+              background: C[r]?.color,
+              boxShadow: `0 0 6px ${C[r]?.color}`,
               animation: "holo-led-blink 1.2s infinite"
             }
           }
@@ -4936,8 +4932,8 @@ function Ke({
                 width: 4,
                 height: 4,
                 borderRadius: "50%",
-                background: $[o]?.color,
-                boxShadow: `0 0 6px ${$[o]?.color}`,
+                background: C[o]?.color,
+                boxShadow: `0 0 6px ${C[o]?.color}`,
                 animation: "holo-led-blink 1.2s infinite"
               }
             }
@@ -5034,7 +5030,7 @@ function Ze({
                 width: 3,
                 height: 3,
                 borderRadius: "50%",
-                background: $[o]?.color,
+                background: C[o]?.color,
                 animation: "holo-led-blink 1.2s infinite"
               }
             }
@@ -5163,7 +5159,7 @@ function Wt({
     }
   );
 }
-function M({
+function W({
   color: t = "#00e5ff",
   label: n = "THREAD",
   status: o = "online"
@@ -5228,7 +5224,7 @@ function Qe({
                 width: 4,
                 height: 4,
                 borderRadius: "50%",
-                background: $[o]?.color,
+                background: C[o]?.color,
                 animation: "holo-led-blink 1.2s infinite"
               }
             }
@@ -5283,7 +5279,7 @@ function Y({
               width: 4,
               height: 4,
               borderRadius: "50%",
-              background: o && o !== "online" ? $[o]?.color ?? t : t,
+              background: o && o !== "online" ? C[o]?.color ?? t : t,
               boxShadow: `0 0 4px ${t}`,
               animation: o && o !== "online" && o !== "offline" ? "holo-led-blink 1s infinite" : "none"
             }
@@ -5428,7 +5424,7 @@ function hi(t, n, o, i) {
     }
   ] : [];
 }
-const D = "cubic-bezier(0.34, 1.56, 0.64, 1)", ui = "cubic-bezier(0.16, 1, 0.3, 1)";
+const I = "cubic-bezier(0.34, 1.56, 0.64, 1)", ui = "cubic-bezier(0.16, 1, 0.3, 1)";
 function bi({ items: t, revealPhase: n }) {
   return /* @__PURE__ */ e(
     "div",
@@ -5447,7 +5443,7 @@ function bi({ items: t, revealPhase: n }) {
           style: {
             opacity: n >= 0.2 + i * 0.06 ? 1 : 0,
             transform: `scale(${n >= 0.2 + i * 0.06 ? 1 : 0.6})`,
-            transition: `opacity 0.4s ${D} ${i * 0.06}s, transform 0.45s ${D} ${i * 0.06}s`
+            transition: `opacity 0.4s ${I} ${i * 0.06}s, transform 0.45s ${I} ${i * 0.06}s`
           },
           children: o.element
         },
@@ -5463,7 +5459,7 @@ function gi({
   internal: i,
   revealPhase: r
 }) {
-  const a = $[n]?.color ?? $.online.color, s = "#ff8c00";
+  const a = C[n]?.color ?? C.online.color, s = "#ff8c00";
   if (t === "server") {
     const l = o.cpuLoad ?? 50, h = o.memLoad ?? 60, d = [
       {
@@ -5556,7 +5552,7 @@ function gi({
       {
         key: "thread",
         delay: 7,
-        el: /* @__PURE__ */ e(M, { color: a, label: "THREAD-POOL", status: i[7]?.status })
+        el: /* @__PURE__ */ e(W, { color: a, label: "THREAD-POOL", status: i[7]?.status })
       },
       {
         key: "net",
@@ -5575,15 +5571,15 @@ function gi({
           alignItems: "center",
           padding: 24
         },
-        children: d.map(({ key: p, delay: f, el: g }) => /* @__PURE__ */ e(
+        children: d.map(({ key: p, delay: f, el: b }) => /* @__PURE__ */ e(
           "div",
           {
             style: {
               opacity: r >= 0.2 + f * 0.08 ? 1 : 0,
               transform: `scale(${r >= 0.2 + f * 0.08 ? 1 : 0.6})`,
-              transition: `opacity 0.4s ${D} ${f * 0.06}s, transform 0.45s ${D} ${f * 0.06}s`
+              transition: `opacity 0.4s ${I} ${f * 0.06}s, transform 0.45s ${I} ${f * 0.06}s`
             },
-            children: g
+            children: b
           },
           p
         ))
@@ -5599,7 +5595,7 @@ function gi({
           style: {
             opacity: r >= 0.25 + d * 0.04 ? 1 : 0,
             transform: `scale(${r >= 0.25 + d * 0.04 ? 1 : 0.5})`,
-            transition: `opacity 0.35s ${D} ${d * 0.04}s, transform 0.4s ${D} ${d * 0.04}s`
+            transition: `opacity 0.35s ${I} ${d * 0.04}s, transform 0.4s ${I} ${d * 0.04}s`
           },
           children: /* @__PURE__ */ e(Y, { color: a, label: `PORT-${d + 1}`, status: p?.status })
         },
@@ -5625,9 +5621,9 @@ function gi({
                 style: {
                   opacity: r >= 0.7 ? 1 : 0,
                   transform: `scale(${r >= 0.7 ? 1 : 0.6})`,
-                  transition: `all 0.4s ${D} 0.3s`
+                  transition: `all 0.4s ${I} 0.3s`
                 },
-                children: /* @__PURE__ */ e(M, { color: a, label: "HTTP-WORKER", status: i[8]?.status })
+                children: /* @__PURE__ */ e(W, { color: a, label: "HTTP-WORKER", status: i[8]?.status })
               }
             ),
             /* @__PURE__ */ e(
@@ -5636,9 +5632,9 @@ function gi({
                 style: {
                   opacity: r >= 0.8 ? 1 : 0,
                   transform: `scale(${r >= 0.8 ? 1 : 0.6})`,
-                  transition: `all 0.4s ${D} 0.4s`
+                  transition: `all 0.4s ${I} 0.4s`
                 },
-                children: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "HTTPS-WORKER", status: i[9]?.status })
+                children: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "HTTPS-WORKER", status: i[9]?.status })
               }
             )
           ] })
@@ -5665,7 +5661,7 @@ function gi({
               style: {
                 opacity: r >= 0.25 + l * 0.1 ? 1 : 0,
                 transform: `scale(${r >= 0.25 + l * 0.1 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} ${l * 0.08}s`
+                transition: `all 0.4s ${I} ${l * 0.08}s`
               },
               children: /* @__PURE__ */ e(Y, { color: "#bb55ff", label: `INST-${l}`, status: i[l]?.status })
             },
@@ -5677,9 +5673,9 @@ function gi({
               style: {
                 opacity: r >= 0.6 ? 1 : 0,
                 transform: `scale(${r >= 0.6 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} 0.25s`
+                transition: `all 0.4s ${I} 0.25s`
               },
-              children: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "QUEUE-0", status: i[3]?.status })
+              children: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "QUEUE-0", status: i[3]?.status })
             }
           ),
           [4, 5, 6].map((l) => /* @__PURE__ */ e(
@@ -5688,10 +5684,10 @@ function gi({
               style: {
                 opacity: r >= 0.7 + (l - 4) * 0.08 ? 1 : 0,
                 transform: `scale(${r >= 0.7 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} ${0.35 + (l - 4) * 0.05}s`
+                transition: `all 0.4s ${I} ${0.35 + (l - 4) * 0.05}s`
               },
               children: /* @__PURE__ */ e(
-                M,
+                W,
                 {
                   color: "#bb55ff",
                   label: `WORKER-${l - 3}`,
@@ -5724,7 +5720,7 @@ function gi({
               style: {
                 opacity: r >= 0.2 + h * 0.12 ? 1 : 0,
                 transform: `scale(${r >= 0.2 + h * 0.12 ? 1 : 0.5})`,
-                transition: `all 0.45s ${D} ${h * 0.1}s`
+                transition: `all 0.45s ${I} ${h * 0.1}s`
               },
               children: /* @__PURE__ */ e(
                 Qe,
@@ -5744,9 +5740,9 @@ function gi({
               style: {
                 opacity: r >= 0.6 ? 1 : 0,
                 transform: `scale(${r >= 0.6 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} 0.3s`
+                transition: `all 0.4s ${I} 0.3s`
               },
-              children: /* @__PURE__ */ e(M, { color: s, label: "CONN-POOL", status: i[3]?.status })
+              children: /* @__PURE__ */ e(W, { color: s, label: "CONN-POOL", status: i[3]?.status })
             }
           ),
           /* @__PURE__ */ e(
@@ -5755,9 +5751,9 @@ function gi({
               style: {
                 opacity: r >= 0.75 ? 1 : 0,
                 transform: `scale(${r >= 0.75 ? 1 : 0.6})`,
-                transition: `all 0.4s ${D} 0.4s`
+                transition: `all 0.4s ${I} 0.4s`
               },
-              children: /* @__PURE__ */ e(M, { color: "#00ff88", label: "QUERY-CACHE", status: i[4]?.status })
+              children: /* @__PURE__ */ e(W, { color: "#00ff88", label: "QUERY-CACHE", status: i[4]?.status })
             }
           )
         ]
@@ -5776,7 +5772,7 @@ function Ui({
   subComponents: s,
   graphSeries: l
 }) {
-  const h = hi(t, n, o, a), d = $[o]?.color ?? $.online.color, p = r >= 0.1 ? 1 : r * 10, f = r >= 0.2 ? "-50%" : "0%", g = r >= 0.2 ? "50%" : "0%", u = r >= 0.25 ? Math.min(1, (r - 0.25) * 1.5) : 0;
+  const h = hi(t, n, o, a), d = C[o]?.color ?? C.online.color, p = r >= 0.1 ? 1 : r * 10, f = r >= 0.2 ? "-50%" : "0%", b = r >= 0.2 ? "50%" : "0%", u = r >= 0.25 ? Math.min(1, (r - 0.25) * 1.5) : 0;
   return /* @__PURE__ */ c(
     "div",
     {
@@ -5788,7 +5784,7 @@ function Ui({
         flexDirection: "row",
         pointerEvents: "auto"
       },
-      onClick: (b) => b.stopPropagation(),
+      onClick: (g) => g.stopPropagation(),
       children: [
         /* @__PURE__ */ e(
           "div",
@@ -5850,7 +5846,7 @@ function Ui({
                           borderRight: `2px solid ${d}44`,
                           boxShadow: "4px 0 32px rgba(0,0,0,0.6)",
                           transform: `translateX(${f})`,
-                          transition: `transform 0.7s ${D}`
+                          transition: `transform 0.7s ${I}`
                         }
                       }
                     ),
@@ -5864,8 +5860,8 @@ function Ui({
                           background: "linear-gradient(90deg, rgba(2, 12, 28, 0.95) 0%, rgba(2, 8, 20, 0.98) 100%)",
                           borderLeft: `2px solid ${d}44`,
                           boxShadow: "-4px 0 32px rgba(0,0,0,0.6)",
-                          transform: `translateX(${g})`,
-                          transition: `transform 0.7s ${D}`
+                          transform: `translateX(${b})`,
+                          transition: `transform 0.7s ${I}`
                         }
                       }
                     )
@@ -5888,7 +5884,7 @@ function Ui({
                     display: "flex",
                     flexDirection: "column",
                     opacity: u >= 0.1 ? 1 : 0,
-                    transition: `opacity 0.5s ${D} 0.2s`
+                    transition: `opacity 0.5s ${I} 0.2s`
                   },
                   children: [
                     /* @__PURE__ */ c(
@@ -6118,38 +6114,38 @@ function wi(t) {
   return t;
 }
 function Si({ config: t, children: n }) {
-  const [o, i] = R({}), [r, a] = R(null), [s, l] = R(!1), [h, d] = R(null), [p, f] = R(null), g = ie(t);
-  g.current = t;
+  const [o, i] = R({}), [r, a] = R(null), [s, l] = R(!1), [h, d] = R(null), [p, f] = R(null), b = ie(t);
+  b.current = t;
   const u = ie(r);
   u.current = r;
-  const b = Ge(async () => {
-    const v = u.current, S = g.current;
+  const g = Ge(async () => {
+    const v = u.current, S = b.current;
     if (v) {
       l(!0);
       try {
         const y = await Promise.allSettled(
-          S.queries.map((P) => {
-            const O = S.endpoint.includes("?") ? "&" : "?", I = `${S.endpoint}${O}query=${encodeURIComponent(P)}`;
-            return fetch(I, {
+          S.queries.map(($) => {
+            const H = S.endpoint.includes("?") ? "&" : "?", L = `${S.endpoint}${H}query=${encodeURIComponent($)}`;
+            return fetch(L, {
               method: "GET",
               headers: {
                 "access-key": v.accessKey,
                 "access-secret-key": v.secretKey
               }
-            }).then((z) => {
-              if (!z.ok) throw new Error(`HTTP ${z.status}`);
-              return z.text();
-            }).then((z) => ({ query: P, data: z.trim() }));
+            }).then((M) => {
+              if (!M.ok) throw new Error(`HTTP ${M.status}`);
+              return M.text();
+            }).then((M) => ({ query: $, data: M.trim() }));
           })
         ), x = {};
-        let C = 0;
-        for (const P of y)
-          P.status === "fulfilled" ? x[P.value.query] = P.value.data : C++;
-        i((P) => ({ ...P, ...x }));
+        let A = 0;
+        for (const $ of y)
+          $.status === "fulfilled" ? x[$.value.query] = $.value.data : A++;
+        i(($) => ({ ...$, ...x }));
         const k = S.queries.length;
         d(
-          C > 0 ? `${C} of ${k} queries failed to refresh` : null
-        ), C < k && f(/* @__PURE__ */ new Date());
+          A > 0 ? `${A} of ${k} queries failed to refresh` : null
+        ), A < k && f(/* @__PURE__ */ new Date());
       } catch (y) {
         const x = y instanceof Error ? y.message : "Refresh failed";
         d(x);
@@ -6160,10 +6156,10 @@ function Si({ config: t, children: n }) {
   }, []);
   ke(() => {
     if (!r) return;
-    b();
-    const v = g.current.refreshInterval ?? 6e4, S = window.setInterval(b, v);
+    g();
+    const v = b.current.refreshInterval ?? 6e4, S = window.setInterval(g, v);
     return () => clearInterval(S);
-  }, [r, b]);
+  }, [r, g]);
   const m = Ge((v) => {
     a(v);
   }, []), w = {
@@ -6209,30 +6205,30 @@ function At({
   dataTransform: h,
   children: d
 }) {
-  const p = xi(), [f] = R(20), [g] = R(!1), [u] = R(!0), [b] = R(0.45), [m] = R(3.3), [w, v] = R("compact"), [S, y] = R(0), [x, C] = R(null), [k, P] = R(null), [O, I] = R(0), z = (T) => {
-    w === "compact" && (C(T), v("expanding"), y(0), setTimeout(() => y(1), 50), setTimeout(() => y(2), 800), setTimeout(() => y(3), 1200), setTimeout(() => y(4), 1600), setTimeout(() => y(5), 2e3), setTimeout(() => {
+  const p = xi(), [f] = R(20), [b] = R(!1), [u] = R(!0), [g] = R(0.45), [m] = R(3.3), [w, v] = R("compact"), [S, y] = R(0), [x, A] = R(null), [k, $] = R(null), [H, L] = R(0), M = (T) => {
+    w === "compact" && (A(T), v("expanding"), y(0), setTimeout(() => y(1), 50), setTimeout(() => y(2), 800), setTimeout(() => y(3), 1200), setTimeout(() => y(4), 1600), setTimeout(() => y(5), 2e3), setTimeout(() => {
       y(6), v("expanded");
     }, 2400));
   }, K = () => {
-    k ? (P(null), I(0)) : w === "expanded" && (v("collapsing"), y(0), C(null), setTimeout(() => {
+    k ? ($(null), L(0)) : w === "expanded" && (v("collapsing"), y(0), A(null), setTimeout(() => {
       v((T) => T === "collapsing" ? "compact" : T);
     }, 1e3));
   }, Z = Ge((T) => {
-    P(T), I(0);
+    $(T), L(0);
   }, []), ye = Ge((T) => {
-    P(T);
+    $(T);
   }, []);
   q.useEffect(() => {
     if (!k) return;
-    const T = performance.now(), j = 1200, re = () => {
-      const V = performance.now() - T, ae = Math.min(1, V / j);
-      I(ae), ae < 1 && requestAnimationFrame(re);
-    }, ee = requestAnimationFrame(re);
+    const T = performance.now(), j = 1200, oe = () => {
+      const V = performance.now() - T, re = Math.min(1, V / j);
+      L(re), re < 1 && requestAnimationFrame(oe);
+    }, ee = requestAnimationFrame(oe);
     return () => cancelAnimationFrame(ee);
   }, [k]);
   const me = () => {
-    P(null), I(0);
-  }, N = h ?? wi, U = p?.data, { enhancedChildren: ne, liveAlerts: Be } = Tt(() => {
+    $(null), L(0);
+  }, D = h ?? wi, U = p?.data, { enhancedChildren: ne, liveAlerts: Be } = Tt(() => {
     const T = {};
     if (!U || !l) return { enhancedChildren: d, liveAlerts: T };
     const j = {};
@@ -6240,16 +6236,16 @@ function At({
       if (!q.isValidElement(ee)) return ee;
       const V = ee.props.name;
       if (!V || !l[V]) return ee;
-      const ae = l[V], ve = {}, le = {};
-      for (const [pe, F] of Object.entries(ae)) {
-        const rt = typeof F == "string" ? F : F.query, at = typeof F == "object" && F.transform ? F.transform : N, Ye = U[rt];
+      const re = l[V], ve = {}, ae = {};
+      for (const [pe, B] of Object.entries(re)) {
+        const rt = typeof B == "string" ? B : B.query, at = typeof B == "object" && B.transform ? B.transform : D, Ye = U[rt];
         if (Ye === void 0) continue;
         const we = at(Ye);
-        if (ve[pe] = we, typeof F == "object" && F.alert && typeof we == "number") {
-          const { prop: H, warnAt: Ve = 70, critAt: St = 85, label: Ft } = F.alert, _e = Ft ?? pe, je = Math.round(we);
+        if (ve[pe] = we, typeof B == "object" && B.alert && typeof we == "number") {
+          const { prop: F, warnAt: Ve = 70, critAt: St = 85, label: Ft } = B.alert, _e = Ft ?? pe, je = Math.round(we);
           if (we >= St) {
-            const He = le[H];
-            (!He || He.severity < 2) && (le[H] = {
+            const He = ae[F];
+            (!He || He.severity < 2) && (ae[F] = {
               msg: `${_e} critical — ${je}%`,
               internalRef: pe,
               severity: 2
@@ -6258,8 +6254,8 @@ function At({
               message: `${_e} at ${je}% — exceeds critical threshold (${St}%)`
             });
           } else if (we >= Ve) {
-            const He = le[H];
-            (!He || He.severity < 1) && (le[H] = {
+            const He = ae[F];
+            (!He || He.severity < 1) && (ae[F] = {
               msg: `${_e} elevated — ${je}%`,
               internalRef: pe,
               severity: 1
@@ -6270,11 +6266,11 @@ function At({
           }
         }
       }
-      for (const [pe, F] of Object.entries(le))
-        ve[pe] = { msg: F.msg, internalRef: F.internalRef };
+      for (const [pe, B] of Object.entries(ae))
+        ve[pe] = { msg: B.msg, internalRef: B.internalRef };
       return Object.keys(ve).length > 0 ? q.cloneElement(ee, ve) : ee;
     }), liveAlerts: j };
-  }, [d, U, l, N]), oe = o.find((T) => T.name === x), Fe = oe?.status ?? "online", J = oe?.dbSync ?? !0, B = oe?.metrics, _ = Be[x ?? ""] ?? [], se = oe?.alerts ?? [], de = _.length > 0 ? [..._, ...se.filter((T) => T.level !== "info")] : se, Ce = p?.lastRefreshError ?? null, it = 330, nt = 340, xe = k ? 1.15 : 1, ce = k ? -(k.ex - it) * 0.06 : 0, ot = k ? -(k.ey - nt) * 0.06 : 0;
+  }, [d, U, l, D]), le = o.find((T) => T.name === x), Fe = le?.status ?? "online", J = le?.dbSync ?? !0, z = le?.metrics, _ = Be[x ?? ""] ?? [], se = le?.alerts ?? [], de = _.length > 0 ? [..._, ...se.filter((T) => T.level !== "info")] : se, Ce = p?.lastRefreshError ?? null, it = 330, nt = 340, xe = k ? 1.15 : 1, ce = k ? -(k.ex - it) * 0.06 : 0, ot = k ? -(k.ey - nt) * 0.06 : 0;
   return /* @__PURE__ */ c("div", { className: "app", style: s ? { fontFamily: s } : void 0, children: [
     /* @__PURE__ */ e(
       "div",
@@ -6322,22 +6318,22 @@ function At({
             animPhase: S,
             selectedSystem: x,
             selectedComponent: k,
-            drillAnimPhase: O,
+            drillAnimPhase: H,
             rotateY: f,
-            autoRotateComponents: g,
-            componentScale: b,
+            autoRotateComponents: b,
+            componentScale: g,
             drillZoom: m,
             autoRotateCarousel: u,
             carouselSpeed: a,
             logoUrl: r,
-            onSelectSystem: z,
+            onSelectSystem: M,
             onBackgroundClick: K,
             onComponentClick: Z,
             onComponentUpdate: ye,
             onCloseDrill: me,
             selectedSystemStatus: Fe,
             selectedSystemDbSync: J,
-            selectedSystemMetrics: B,
+            selectedSystemMetrics: z,
             selectedSystemAlerts: de,
             children: ne
           }
@@ -6346,7 +6342,7 @@ function At({
     )
   ] });
 }
-function E(t, n, o = 24) {
+function P(t, n, o = 24) {
   return Array.from({ length: o }, (i, r) => {
     const a = r / o;
     return Math.min(100, Math.max(0, t + Math.sin(a * Math.PI * 2) * n + (Math.random() - 0.5) * 10));
@@ -6365,21 +6361,21 @@ function Ne(t, n, o) {
     { id: "drive-1", label: "DRIVE-1", status: "online", element: /* @__PURE__ */ e(De, { color: r, label: "DRIVE-1", status: "online", activity: !0 }) },
     { id: "drive-2", label: "DRIVE-2", status: "online", element: /* @__PURE__ */ e(De, { color: r, label: "DRIVE-2", status: "online", activity: a > 30 }) },
     { id: "drive-3", label: "DRIVE-3", status: "online", element: /* @__PURE__ */ e(De, { color: r, label: "DRIVE-3", status: "online", activity: a > 50 }) },
-    { id: "thread-pool", label: "THREAD-POOL", status: d, detail: d === "critical" ? "Thread exhaustion" : void 0, element: /* @__PURE__ */ e(M, { color: r, label: "THREAD-POOL", status: d }) },
+    { id: "thread-pool", label: "THREAD-POOL", status: d, detail: d === "critical" ? "Thread exhaustion" : void 0, element: /* @__PURE__ */ e(W, { color: r, label: "THREAD-POOL", status: d }) },
     { id: "network", label: "NET", status: p, element: /* @__PURE__ */ e(Wt, { color: r, label: "NET", status: p }) }
   ];
 }
 function We(t) {
   const n = t?.cpuLoad ?? 50, o = t?.memLoad ?? 60;
   return [
-    { id: "cpu", label: "CPU-0", unit: "%", color: "#00e5ff", data: E(n, 15) },
-    { id: "cpu1", label: "CPU-1", unit: "%", color: "#00e5ff", data: E(n * 0.7, 12) },
-    { id: "heap0", label: "HEAP-0", unit: "%", color: "#8855ee", data: E(o, 18) },
-    { id: "heap1", label: "HEAP-1", unit: "%", color: "#8855ee", data: E(o * 0.85, 14) },
-    { id: "drive1", label: "DRIVE-1 I/O", unit: "%", color: "#ff8c00", data: E(40, 25) },
-    { id: "drive2", label: "DRIVE-2 I/O", unit: "%", color: "#ff8c00", data: E(35, 20) },
-    { id: "drive3", label: "DRIVE-3 I/O", unit: "%", color: "#ff8c00", data: E(30, 22) },
-    { id: "thread", label: "THREAD-POOL", unit: "%", color: "#22aaff", data: E(55, 20) }
+    { id: "cpu", label: "CPU-0", unit: "%", color: "#00e5ff", data: P(n, 15) },
+    { id: "cpu1", label: "CPU-1", unit: "%", color: "#00e5ff", data: P(n * 0.7, 12) },
+    { id: "heap0", label: "HEAP-0", unit: "%", color: "#8855ee", data: P(o, 18) },
+    { id: "heap1", label: "HEAP-1", unit: "%", color: "#8855ee", data: P(o * 0.85, 14) },
+    { id: "drive1", label: "DRIVE-1 I/O", unit: "%", color: "#ff8c00", data: P(40, 25) },
+    { id: "drive2", label: "DRIVE-2 I/O", unit: "%", color: "#ff8c00", data: P(35, 20) },
+    { id: "drive3", label: "DRIVE-3 I/O", unit: "%", color: "#ff8c00", data: P(30, 22) },
+    { id: "thread", label: "THREAD-POOL", unit: "%", color: "#22aaff", data: P(55, 20) }
   ];
 }
 function zt(t, n, o) {
@@ -6393,18 +6389,18 @@ function zt(t, n, o) {
     { id: "port-6", label: "PORT-6", status: "online", element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-6", status: "online" }) },
     { id: "port-7", label: "PORT-7", status: "online", element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-7", status: "online" }) },
     { id: "port-8", label: "PORT-8", status: "online", element: /* @__PURE__ */ e(Y, { color: r, label: "PORT-8", status: "online" }) },
-    { id: "http-worker", label: "HTTP-WORKER", status: l, detail: l === "critical" ? "Worker timeout" : void 0, element: /* @__PURE__ */ e(M, { color: r, label: "HTTP-WORKER", status: l }) },
-    { id: "https-worker", label: "HTTPS-WORKER", status: "online", element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "HTTPS-WORKER", status: "online" }) }
+    { id: "http-worker", label: "HTTP-WORKER", status: l, detail: l === "critical" ? "Worker timeout" : void 0, element: /* @__PURE__ */ e(W, { color: r, label: "HTTP-WORKER", status: l }) },
+    { id: "https-worker", label: "HTTPS-WORKER", status: "online", element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "HTTPS-WORKER", status: "online" }) }
   ];
 }
 function Bt(t) {
   const n = t?.traffic ?? 50;
   return [
-    { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: E(n, 20) },
-    { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: E(60, 25) },
-    { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: E(45, 20) },
-    { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: E(70, 30) },
-    { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: E(n * 0.9, 15) }
+    { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: P(n, 20) },
+    { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: P(60, 25) },
+    { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: P(45, 20) },
+    { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: P(70, 30) },
+    { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: P(n * 0.9, 15) }
   ];
 }
 function $i(t, n, o) {
@@ -6413,20 +6409,20 @@ function $i(t, n, o) {
     { id: "inst-0", label: "INST-0", status: "online", element: /* @__PURE__ */ e(Y, { color: "#bb55ff", label: "INST-0", status: "online" }) },
     { id: "inst-1", label: "INST-1", status: "online", element: /* @__PURE__ */ e(Y, { color: "#bb55ff", label: "INST-1", status: "online" }) },
     { id: "inst-2", label: "INST-2", status: r, detail: r === "critical" ? "Instance unreachable" : void 0, element: /* @__PURE__ */ e(Y, { color: "#bb55ff", label: "INST-2", status: r }) },
-    { id: "queue-0", label: "QUEUE-0", status: a, detail: i === "critical" ? "Queue full" : i === "offline" ? "Unreachable" : i === "warning" ? "Queue depth warning" : void 0, element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "QUEUE-0", status: a }) },
-    { id: "worker-1", label: "WORKER-1", status: "online", element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "WORKER-1", status: "online" }) },
-    { id: "worker-2", label: "WORKER-2", status: "online", element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "WORKER-2", status: "online" }) },
-    { id: "worker-3", label: "WORKER-3", status: s, detail: s === "critical" ? "Worker timeout" : void 0, element: /* @__PURE__ */ e(M, { color: "#bb55ff", label: "WORKER-3", status: s }) }
+    { id: "queue-0", label: "QUEUE-0", status: a, detail: i === "critical" ? "Queue full" : i === "offline" ? "Unreachable" : i === "warning" ? "Queue depth warning" : void 0, element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "QUEUE-0", status: a }) },
+    { id: "worker-1", label: "WORKER-1", status: "online", element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "WORKER-1", status: "online" }) },
+    { id: "worker-2", label: "WORKER-2", status: "online", element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "WORKER-2", status: "online" }) },
+    { id: "worker-3", label: "WORKER-3", status: s, detail: s === "critical" ? "Worker timeout" : void 0, element: /* @__PURE__ */ e(W, { color: "#bb55ff", label: "WORKER-3", status: s }) }
   ];
 }
 function ki(t) {
   const n = t?.queueDepth ?? 50;
   return [
-    { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: E(n, 20) },
-    { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: E(60, 25) },
-    { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: E(45, 20) },
-    { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: E(70, 30) },
-    { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: E(n * 0.9, 15) }
+    { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: P(n, 20) },
+    { id: "port1", label: "PORT-1", unit: "kbps", color: "#22aaff", data: P(60, 25) },
+    { id: "port2", label: "PORT-2", unit: "kbps", color: "#22aaff", data: P(45, 20) },
+    { id: "port3", label: "PORT-3", unit: "kbps", color: "#22aaff", data: P(70, 30) },
+    { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: P(n * 0.9, 15) }
   ];
 }
 function Je(t, n, o) {
@@ -6435,18 +6431,18 @@ function Je(t, n, o) {
     { id: "platter-0", label: "PLATTER-0", status: "online", element: /* @__PURE__ */ e(Qe, { color: r, label: "PLATTER-0", status: "online", capacityPercent: a }) },
     { id: "platter-1", label: "PLATTER-1", status: s, detail: i === "critical" ? "I/O failure" : i === "offline" ? "Connection lost" : i === "warning" ? "Slow queries" : void 0, element: /* @__PURE__ */ e(Qe, { color: r, label: "PLATTER-1", status: s, capacityPercent: a }) },
     { id: "platter-2", label: "PLATTER-2", status: l, detail: l === "warning" ? "Replication lag" : void 0, element: /* @__PURE__ */ e(Qe, { color: r, label: "PLATTER-2", status: l, capacityPercent: a }) },
-    { id: "conn-pool", label: "CONN-POOL", status: h, detail: h === "critical" ? "Pool exhausted" : void 0, element: /* @__PURE__ */ e(M, { color: r, label: "CONN-POOL", status: h }) },
-    { id: "query-cache", label: "QUERY-CACHE", status: d, detail: d === "warning" ? "Cache miss rate" : void 0, element: /* @__PURE__ */ e(M, { color: "#00ff88", label: "QUERY-CACHE", status: d }) }
+    { id: "conn-pool", label: "CONN-POOL", status: h, detail: h === "critical" ? "Pool exhausted" : void 0, element: /* @__PURE__ */ e(W, { color: r, label: "CONN-POOL", status: h }) },
+    { id: "query-cache", label: "QUERY-CACHE", status: d, detail: d === "warning" ? "Cache miss rate" : void 0, element: /* @__PURE__ */ e(W, { color: "#00ff88", label: "QUERY-CACHE", status: d }) }
   ];
 }
 function et(t) {
   const n = t?.capacity ?? 70;
   return [
-    { id: "platter0", label: "PLATTER-0 I/O", unit: "%", color: "#ff8c00", data: E(40, 20) },
-    { id: "platter1", label: "PLATTER-1 I/O", unit: "%", color: "#ff8c00", data: E(55, 25) },
-    { id: "platter2", label: "PLATTER-2 I/O", unit: "%", color: "#ff8c00", data: E(35, 18) },
-    { id: "connpool", label: "CONN-POOL", unit: "%", color: "#00e5ff", data: E(n, 15) },
-    { id: "cache", label: "QUERY-CACHE", unit: "%", color: "#00ff88", data: E(75, 12) }
+    { id: "platter0", label: "PLATTER-0 I/O", unit: "%", color: "#ff8c00", data: P(40, 20) },
+    { id: "platter1", label: "PLATTER-1 I/O", unit: "%", color: "#ff8c00", data: P(55, 25) },
+    { id: "platter2", label: "PLATTER-2 I/O", unit: "%", color: "#ff8c00", data: P(35, 18) },
+    { id: "connpool", label: "CONN-POOL", unit: "%", color: "#00e5ff", data: P(n, 15) },
+    { id: "cache", label: "QUERY-CACHE", unit: "%", color: "#00ff88", data: P(75, 12) }
   ];
 }
 function vt(t) {
@@ -6509,7 +6505,7 @@ function Ci({ config: t }) {
   const n = q.useContext(Re), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { wdStatus: r, msStatus: a, srv1Status: s, srv2Status: l, srv3Status: h, pdbStatus: d, sdbStatus: p, dbSync: f } = t;
   return /* @__PURE__ */ c(Me, { children: [
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 120,
@@ -6521,7 +6517,7 @@ function Ci({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 220,
         ey: 260,
@@ -6554,7 +6550,7 @@ function Ci({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 440,
         ey: 260,
@@ -6588,7 +6584,7 @@ function Ci({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 165,
         ey: 390,
@@ -6621,7 +6617,7 @@ function Ci({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 390,
@@ -6654,7 +6650,7 @@ function Ci({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 495,
         ey: 390,
@@ -6687,7 +6683,7 @@ function Ci({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 200,
         ey: 520,
@@ -6720,7 +6716,7 @@ function Ci({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 460,
         ey: 520,
@@ -6753,7 +6749,7 @@ function Ci({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 520,
@@ -6772,7 +6768,7 @@ function Pi({ config: t }) {
   const n = q.useContext(Re), { wdStatus: o, msStatus: i, srv1Status: r, srv2Status: a, srv3Status: s, pdbStatus: l, sdbStatus: h, dbSync: d } = t, p = n?.isSelected && n?.isExpandedPos;
   return n?.isSelected ? /* @__PURE__ */ c("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 220,
         ey: 260,
@@ -6787,7 +6783,7 @@ function Pi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 440,
         ey: 260,
@@ -6802,7 +6798,7 @@ function Pi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 165,
         ey: 390,
@@ -6817,7 +6813,7 @@ function Pi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 330,
         ey: 390,
@@ -6832,7 +6828,7 @@ function Pi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 495,
         ey: 390,
@@ -6847,7 +6843,7 @@ function Pi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 200,
         ey: 520,
@@ -6862,7 +6858,7 @@ function Pi({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 460,
         ey: 520,
@@ -6877,7 +6873,7 @@ function Pi({ config: t }) {
       }
     ),
     !d && /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 330,
         ey: 520,
@@ -6960,7 +6956,7 @@ function Ai({ config: t }) {
   const n = q.useContext(Re), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { dispStatus: r, srv1Status: a, srv2Status: s, srv3Status: l, pdbStatus: h, sdbStatus: d, dbSync: p } = t;
   return /* @__PURE__ */ c(Me, { children: [
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 120,
@@ -6972,7 +6968,7 @@ function Ai({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 260,
@@ -7005,7 +7001,7 @@ function Ai({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 165,
         ey: 390,
@@ -7038,7 +7034,7 @@ function Ai({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 390,
@@ -7071,7 +7067,7 @@ function Ai({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 495,
         ey: 390,
@@ -7104,7 +7100,7 @@ function Ai({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 200,
         ey: 520,
@@ -7137,7 +7133,7 @@ function Ai({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 460,
         ey: 520,
@@ -7170,7 +7166,7 @@ function Ai({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      A,
+      E,
       {
         ex: 330,
         ey: 520,
@@ -7189,7 +7185,7 @@ function Ti({ config: t }) {
   const n = q.useContext(Re), { dispStatus: o, srv1Status: i, srv2Status: r, srv3Status: a, pdbStatus: s, sdbStatus: l, dbSync: h } = t, d = n?.isSelected && n?.isExpandedPos;
   return n?.isSelected ? /* @__PURE__ */ c("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 330,
         ey: 260,
@@ -7204,7 +7200,7 @@ function Ti({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 165,
         ey: 390,
@@ -7219,7 +7215,7 @@ function Ti({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 330,
         ey: 390,
@@ -7234,7 +7230,7 @@ function Ti({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 495,
         ey: 390,
@@ -7249,7 +7245,7 @@ function Ti({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 200,
         ey: 520,
@@ -7264,7 +7260,7 @@ function Ti({ config: t }) {
       }
     ),
     /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 460,
         ey: 520,
@@ -7279,7 +7275,7 @@ function Ti({ config: t }) {
       }
     ),
     !h && /* @__PURE__ */ e(
-      W,
+      N,
       {
         ex: 330,
         ey: 520,
@@ -7333,21 +7329,21 @@ export {
   Dt as MessageServer3D,
   Hi as MessageServerNode,
   Wt as NetworkBlock3D,
-  W as NodeCallout,
+  N as NodeCallout,
   Qe as Platter3D,
   Y as Port3D,
   Xi as SAPService,
   Ri as SAP_CONNECTIONS,
-  $ as STATUS_CFG,
+  C as STATUS_CFG,
   $e as Server3D,
   Mi as ServerNode,
   Lt as Service,
   Re as ServiceContext,
   Ut as ServiceDialog,
-  A as ServiceNode,
+  E as ServiceNode,
   qt as SvgConnection,
   It as SyncBridge,
-  M as ThreadPool3D,
+  W as ThreadPool3D,
   mt as WebDispatcher3D,
   Fi as WebDispatcherNode,
   Qi as computeExchangeDialogAlerts,