react-dashstream 0.0.4 → 0.0.6

package/README.md

@@ -287,7 +287,7 @@ All 3D models accept: `rotateX`, `rotateY`, `rotateZ`, `scale`, `autoRotate`.
 | --------------- | ------------------------------------ | ---------------------------------------------------------------- |
 | `SyncBridge`    | `synced`, `latencyMs`                | Database replication bridge between primary and standby.         |
 | `NodeCallout`   | `status`, `title`, `msg`, `ex`, `ey` | Alert callout with leader line (auto-rendered by `ServiceNode`). |
-| `HoloBase`      | `size`, `color`, `widthRatio`        | Neon holographic base platform (auto-rendered by `Service`).     |
+| `HoloBase`      | `size`, `color`, `widthRatio`        | Neon holographic base platform (auto-rendered by `Service`). Position via `baseConfig` on `Service`. |
 | `SvgConnection` | `x1`, `y1`, `x2`, `y2`, `show`       | Animated dashed SVG connection line.                             |
 
 ### Dialogs
@@ -321,6 +321,28 @@ Compose compound nodes inside a `Service` container. Each node needs:
 - **`zIndex`** — Stacking order (higher tiers get higher values).
 - **`visibleAtPhase`** — When the node fades in during expansion (0–6). Use `2` for top-tier nodes, `3` for middle, etc.
 
+### HoloBase position
+
+The holographic base platform rendered by each `Service` can be repositioned via `baseConfig`:
+
+```tsx
+<Service
+  name="My Service"
+  baseConfig={{
+    size: 90,
+    color: "#00e5ff",
+    widthRatio: 3,
+    expandedX: 330,   // absolute X in expanded view (default: container centre)
+    expandedY: 500,   // absolute Y in expanded view (default: 570)
+    compactOffsetX: 0, // horizontal nudge in compact carousel view
+    compactOffsetY: -20, // vertical nudge in compact carousel view
+  }}
+  ...
+>
+```
+
+### Connection lines
+
 Define connection lines between nodes via the `connections` prop on `Service`:
 
 ```tsx

package/dist/components/Service.d.ts

@@ -70,11 +70,26 @@ export interface ServiceProps {
     /**
      * Configuration for the holographic base platform.
      * Defaults to `{ size: 90, color: "#00e5ff", widthRatio: 3 }`.
+     *
+     * Use `expandedX` / `expandedY` to reposition the base in the expanded
+     * (topology) view.  Values are absolute pixel coordinates; the base is
+     * centred on this point.  Defaults: centred horizontally, `y = 570`.
+     *
+     * Use `compactOffsetX` / `compactOffsetY` to nudge the base relative to
+     * its default compact-carousel position.  Defaults: `0`.
      */
     baseConfig?: {
         size?: number;
         color?: string;
         widthRatio?: number;
+        /** Absolute X position in the expanded view (default: container centre). */
+        expandedX?: number;
+        /** Absolute Y position in the expanded view (default: 570). */
+        expandedY?: number;
+        /** Horizontal offset in the compact carousel view (default: 0). */
+        compactOffsetX?: number;
+        /** Vertical offset in the compact carousel view (default: 0). */
+        compactOffsetY?: number;
     };
     /** Child nodes (ServiceNode, NodeCallout, bare ServiceNode with SyncBridge, etc.). */
     children: React.ReactNode;

package/dist/components/Service.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Service.d.ts","sourceRoot":"","sources":["../../src/components/Service.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Service.d.ts","sourceRoot":"","sources":["../../src/components/Service.tsx"],"names":[],"mappings":"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"}

package/dist/index.css

@@ -1 +1 @@
-@keyframes status-change-pulse{0%{opacity:0;transform:scale(.6)}10%{opacity:1;transform:scale(1.15)}25%{opacity:.1;transform:scale(.95)}40%{opacity:.9;transform:scale(1.1)}60%{opacity:.15;transform:scale(1)}to{opacity:0;transform:scale(1.3)}}.app{display:grid;grid-template-rows:52px 1fr;width:100%;height:100vh;overflow:hidden;position:relative;background:#020810;color:#c8dff0;font-family:var(--aiops-font-family, "Segoe UI", system-ui, -apple-system, sans-serif);-webkit-font-smoothing:antialiased}.app-header{display:flex;align-items:center;gap:18px;padding:0 24px;border-bottom:1px solid rgba(0,229,255,.08);background:#020810eb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:relative;z-index:10}.hdr-brand{display:flex;align-items:center;gap:8px}.brand-pulse{width:7px;height:7px;border-radius:50%;background:#00e5ff;box-shadow:0 0 8px #00e5ff,0 0 18px #00e5ff80;animation:holo-led-blink 2s linear infinite}.brand-text{font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#00e5ff;opacity:.7}.hdr-right{display:flex;align-items:center;gap:8px;margin-left:auto}.hdr-tag{font-size:9px;letter-spacing:.2em;color:#00e5ff59;border:1px solid rgba(0,229,255,.15);padding:3px 8px;border-radius:2px}.scene{display:flex;flex-direction:column;align-items:center;overflow:hidden;padding:0;position:relative;z-index:1;gap:0;background:transparent}.float-node{display:flex;flex-direction:column;align-items:center;position:relative}.float-node--interactive:before{content:"";position:absolute;inset:-40px -35px -15px}.float-body{position:relative;animation:holo-float 4s ease-in-out infinite}.scan-line{position:absolute;top:0;left:0;right:0;height:1.5px;animation:holo-scan 3.5s linear infinite;pointer-events:none;z-index:10}.node-tag{font-size:24px;letter-spacing:.2em;text-transform:uppercase;font-family:var(--aiops-font-family, "Courier New", monospace);margin-top:14px;text-align:center;text-shadow:0 0 6px currentColor}.node-subtag{font-size:11px;letter-spacing:.15em;text-transform:uppercase;font-family:var(--aiops-font-family, "Courier New", monospace);margin-top:4px;text-align:center}.sync-bridge{display:flex;flex-direction:column;align-items:center;justify-content:center;width:110px;gap:6px;flex-shrink:0;font-family:var(--aiops-font-family, "Courier New", monospace)}.sync-arrows{display:flex;align-items:center;width:100%;gap:4px}.sync-line{flex:1;height:2px;border-radius:1px;animation:holo-beam-pulse 1.8s ease-in-out infinite}.sync-status{font-size:8px;letter-spacing:.18em;text-transform:uppercase;text-align:center}.sync-latency{font-size:6.5px;letter-spacing:.1em;text-align:center;font-family:var(--aiops-font-family, "Courier New", monospace)}.base-ring{position:absolute;top:50%;left:50%;border-style:solid;border-radius:50%;transform:translate(-50%,-50%) scaleY(.22);animation:holo-ring-pulse 2.5s ease-in-out infinite}.base-hotspot{position:absolute;top:50%;left:50%;width:8%;height:8%;border-radius:50%;transform:translate(-50%,-50%) scaleY(.22);background:radial-gradient(circle,#ffffff 0%,#ff8c00 35%,transparent 70%);box-shadow:0 0 20px #ff8c00,0 0 40px #ff8c0080}@keyframes refresh-error-pulse{0%,to{opacity:1;box-shadow:0 0 6px #f25,0 0 14px #f256}50%{opacity:.5;box-shadow:0 0 3px #f25}}.hdr-refresh-error{display:flex;align-items:center;gap:7px;padding:3px 10px;border:1px solid rgba(255,34,85,.35);border-radius:3px;background:#ff22550f;animation:refresh-error-pulse 2s ease-in-out infinite}.refresh-error-dot{width:6px;height:6px;border-radius:50%;background:#f25;box-shadow:0 0 6px #f25;flex-shrink:0}.refresh-error-text{font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:#f25;white-space:nowrap;font-family:var(--aiops-font-family, "Courier New", monospace)}@keyframes cred-panel-glow{0%,to{border-color:#00e5ff2e;box-shadow:0 0 40px #00e5ff14,0 20px 80px #000c,inset 0 0 60px #00000080}50%{border-color:#00e5ff59;box-shadow:0 0 60px #00e5ff26,0 20px 80px #000c,inset 0 0 60px #00000080}}@keyframes cred-fade-in{0%{opacity:0}to{opacity:1}}@keyframes cred-panel-enter{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes cred-icon-pop{0%{opacity:0;transform:scale(.4) translateY(10px)}60%{opacity:1;transform:scale(1.1) translateY(-3px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes cred-scanline-sweep{0%{top:-2px;opacity:0}5%{opacity:.7}90%{opacity:.4}to{top:100%;opacity:0}}@keyframes cred-btn-shine{0%{left:-100%}to{left:200%}}.cred-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:#020810e0;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);animation:cred-fade-in .4s ease-out}.cred-panel{position:relative;width:380px;padding:40px 36px 32px;border:1px solid rgba(0,229,255,.18);border-radius:6px;background:linear-gradient(170deg,#061226f7,#030a16fa);animation:cred-panel-enter .5s ease-out,cred-panel-glow 4s ease-in-out infinite;overflow:hidden}.cred-scanline{position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(0,229,255,.5) 50%,transparent 100%);animation:cred-scanline-sweep 4s linear infinite;pointer-events:none;z-index:2}.cred-corner{position:absolute;width:18px;height:18px;pointer-events:none;z-index:3}.cred-corner:before,.cred-corner:after{content:"";position:absolute;background:#00e5ff73}.cred-corner:before{top:0;left:0;width:18px;height:1px}.cred-corner:after{top:0;left:0;width:1px;height:18px}.cred-corner--tl{top:-1px;left:-1px}.cred-corner--tr{top:-1px;right:-1px;transform:scaleX(-1)}.cred-corner--bl{bottom:-1px;left:-1px;transform:scaleY(-1)}.cred-corner--br{bottom:-1px;right:-1px;transform:scale(-1)}.cred-icon{display:flex;justify-content:center;margin-bottom:18px;animation:cred-icon-pop .6s ease-out .15s both}.cred-title{text-align:center;font-size:13px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:#00e5ff;margin-bottom:6px}.cred-subtitle{text-align:center;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:#00e5ff59;margin-bottom:28px;font-family:var(--aiops-font-family, "Courier New", monospace)}.cred-field{margin-bottom:18px}.cred-label{display:block;font-size:8px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#00e5ff8c;margin-bottom:6px;font-family:var(--aiops-font-family, "Courier New", monospace)}.cred-input{width:100%;padding:10px 14px;border:1px solid rgba(0,229,255,.15);border-radius:4px;background:#000a19b3;color:#c8dff0;font-size:13px;font-family:var(--aiops-font-family, "Courier New", monospace);letter-spacing:.04em;outline:none;transition:border-color .25s,box-shadow .25s;box-sizing:border-box}.cred-input::placeholder{color:#c8dff02e;letter-spacing:.06em}.cred-btn{position:relative;display:block;width:100%;margin-top:26px;padding:12px 0;border:1px solid rgba(0,229,255,.3);border-radius:4px;background:#00e5ff0f;color:#00e5ff;font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;font-family:inherit;transition:background .25s,box-shadow .25s,opacity .25s;overflow:hidden}.cred-btn-glow{position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(0,229,255,.08),transparent);pointer-events:none;animation:cred-btn-shine 3s ease-in-out infinite}.cred-footer{margin-top:20px;text-align:center;font-size:7px;letter-spacing:.2em;text-transform:uppercase;color:#c8dff02e;font-family:var(--aiops-font-family, "Courier New", monospace)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{font-family:var(--aiops-font-family, "Segoe UI", system-ui, -apple-system, sans-serif);background-color:#020810;color:#c8dff0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#1e508c66;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#22d3ee4d}*{scrollbar-width:thin;scrollbar-color:rgba(30,80,140,.4) transparent}@keyframes holo-ring-pulse{0%,to{transform:scaleY(.22) scale(1)}50%{transform:scaleY(.22) scale(.965)}}@keyframes holo-beam-pulse{0%{opacity:.75;filter:brightness(1)}40%{opacity:1;filter:brightness(1.35)}70%{opacity:.55;filter:brightness(.7)}to{opacity:.75;filter:brightness(1)}}@keyframes holo-scan{0%{top:-3px;opacity:0}6%{opacity:1}90%{opacity:.6}to{top:110%;opacity:0}}@keyframes holo-led-blink{0%,88%,to{opacity:1}93%{opacity:.15}}@keyframes holo-float{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes holo-base-spin{0%{transform:translate(-50%) scaleY(.22) rotate(0)}to{transform:translate(-50%) scaleY(.22) rotate(360deg)}}@keyframes component-drill-pulse{0%,to{box-shadow:0 0 #f253}50%{box-shadow:0 0 12px 2px #ff225526}}@keyframes comp-dialog-border-glow{0%,to{border-color:var(--dialog-color, #00e5ff)33;box-shadow:0 0 30px var(--dialog-color, #00e5ff) 18,0 12px 60px #000000bf,inset 0 0 40px #0006}50%{border-color:var(--dialog-color, #00e5ff)66;box-shadow:0 0 50px var(--dialog-color, #00e5ff) 30,0 12px 60px #000000bf,inset 0 0 40px #0006}}@keyframes comp-dialog-icon-pop{0%{opacity:0;transform:scale(.3) translateY(14px)}60%{opacity:1;transform:scale(1.08) translateY(-3px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes comp-dialog-metric-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}
+@keyframes status-change-pulse{0%{opacity:0;transform:scale(.6)}10%{opacity:1;transform:scale(1.15)}25%{opacity:.1;transform:scale(.95)}40%{opacity:.9;transform:scale(1.1)}60%{opacity:.15;transform:scale(1)}to{opacity:0;transform:scale(1.3)}}.app{display:grid;grid-template-rows:52px 1fr;width:100%;height:100vh;overflow:hidden;position:relative;background:#020810;color:#c8dff0;font-family:var(--aiops-font-family, "Segoe UI", system-ui, -apple-system, sans-serif);-webkit-font-smoothing:antialiased}.app-header{display:flex;align-items:center;gap:18px;padding:0 24px;border-bottom:1px solid rgba(0,229,255,.08);background:#020810eb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:relative;z-index:10}.hdr-brand{display:flex;align-items:center;gap:8px}.brand-pulse{width:7px;height:7px;border-radius:50%;background:#00e5ff;box-shadow:0 0 8px #00e5ff,0 0 18px #00e5ff80;animation:holo-led-blink 2s linear infinite}.brand-text{font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#00e5ff;opacity:.7}.hdr-right{display:flex;align-items:center;gap:8px;margin-left:auto}.hdr-tag{font-size:9px;letter-spacing:.2em;color:#00e5ff59;border:1px solid rgba(0,229,255,.15);padding:3px 8px;border-radius:2px}.scene{display:flex;flex-direction:column;align-items:center;overflow:hidden;padding:0;position:relative;z-index:1;gap:0;background:transparent}.float-node{display:flex;flex-direction:column;align-items:center;position:relative}.float-node--interactive:before{content:"";position:absolute;inset:-40px -35px -15px}.float-body{position:relative;animation:holo-float 4s ease-in-out infinite}.scan-line{position:absolute;top:0;left:0;right:0;height:1.5px;animation:holo-scan 3.5s linear infinite;pointer-events:none;z-index:10}.node-tag{font-size:24px;letter-spacing:.2em;text-transform:uppercase;font-family:var(--aiops-font-family, "Courier New", monospace);margin-top:24px;text-align:center;text-shadow:0 0 6px currentColor}.node-subtag{font-size:11px;letter-spacing:.15em;text-transform:uppercase;font-family:var(--aiops-font-family, "Courier New", monospace);margin-top:4px;text-align:center}.sync-bridge{display:flex;flex-direction:column;align-items:center;justify-content:center;width:110px;gap:6px;flex-shrink:0;font-family:var(--aiops-font-family, "Courier New", monospace)}.sync-arrows{display:flex;align-items:center;width:100%;gap:4px}.sync-line{flex:1;height:2px;border-radius:1px;animation:holo-beam-pulse 1.8s ease-in-out infinite}.sync-status{font-size:8px;letter-spacing:.18em;text-transform:uppercase;text-align:center}.sync-latency{font-size:6.5px;letter-spacing:.1em;text-align:center;font-family:var(--aiops-font-family, "Courier New", monospace)}.base-ring{position:absolute;top:50%;left:50%;border-style:solid;border-radius:50%;transform:translate(-50%,-50%) scaleY(.22);animation:holo-ring-pulse 2.5s ease-in-out infinite}.base-hotspot{position:absolute;top:50%;left:50%;width:8%;height:8%;border-radius:50%;transform:translate(-50%,-50%) scaleY(.22);background:radial-gradient(circle,#ffffff 0%,#ff8c00 35%,transparent 70%);box-shadow:0 0 20px #ff8c00,0 0 40px #ff8c0080}@keyframes refresh-error-pulse{0%,to{opacity:1;box-shadow:0 0 6px #f25,0 0 14px #f256}50%{opacity:.5;box-shadow:0 0 3px #f25}}.hdr-refresh-error{display:flex;align-items:center;gap:7px;padding:3px 10px;border:1px solid rgba(255,34,85,.35);border-radius:3px;background:#ff22550f;animation:refresh-error-pulse 2s ease-in-out infinite}.refresh-error-dot{width:6px;height:6px;border-radius:50%;background:#f25;box-shadow:0 0 6px #f25;flex-shrink:0}.refresh-error-text{font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:#f25;white-space:nowrap;font-family:var(--aiops-font-family, "Courier New", monospace)}@keyframes cred-panel-glow{0%,to{border-color:#00e5ff2e;box-shadow:0 0 40px #00e5ff14,0 20px 80px #000c,inset 0 0 60px #00000080}50%{border-color:#00e5ff59;box-shadow:0 0 60px #00e5ff26,0 20px 80px #000c,inset 0 0 60px #00000080}}@keyframes cred-fade-in{0%{opacity:0}to{opacity:1}}@keyframes cred-panel-enter{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes cred-icon-pop{0%{opacity:0;transform:scale(.4) translateY(10px)}60%{opacity:1;transform:scale(1.1) translateY(-3px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes cred-scanline-sweep{0%{top:-2px;opacity:0}5%{opacity:.7}90%{opacity:.4}to{top:100%;opacity:0}}@keyframes cred-btn-shine{0%{left:-100%}to{left:200%}}.cred-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:#020810e0;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);animation:cred-fade-in .4s ease-out}.cred-panel{position:relative;width:380px;padding:40px 36px 32px;border:1px solid rgba(0,229,255,.18);border-radius:6px;background:linear-gradient(170deg,#061226f7,#030a16fa);animation:cred-panel-enter .5s ease-out,cred-panel-glow 4s ease-in-out infinite;overflow:hidden}.cred-scanline{position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(0,229,255,.5) 50%,transparent 100%);animation:cred-scanline-sweep 4s linear infinite;pointer-events:none;z-index:2}.cred-corner{position:absolute;width:18px;height:18px;pointer-events:none;z-index:3}.cred-corner:before,.cred-corner:after{content:"";position:absolute;background:#00e5ff73}.cred-corner:before{top:0;left:0;width:18px;height:1px}.cred-corner:after{top:0;left:0;width:1px;height:18px}.cred-corner--tl{top:-1px;left:-1px}.cred-corner--tr{top:-1px;right:-1px;transform:scaleX(-1)}.cred-corner--bl{bottom:-1px;left:-1px;transform:scaleY(-1)}.cred-corner--br{bottom:-1px;right:-1px;transform:scale(-1)}.cred-icon{display:flex;justify-content:center;margin-bottom:18px;animation:cred-icon-pop .6s ease-out .15s both}.cred-title{text-align:center;font-size:13px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:#00e5ff;margin-bottom:6px}.cred-subtitle{text-align:center;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:#00e5ff59;margin-bottom:28px;font-family:var(--aiops-font-family, "Courier New", monospace)}.cred-field{margin-bottom:18px}.cred-label{display:block;font-size:8px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#00e5ff8c;margin-bottom:6px;font-family:var(--aiops-font-family, "Courier New", monospace)}.cred-input{width:100%;padding:10px 14px;border:1px solid rgba(0,229,255,.15);border-radius:4px;background:#000a19b3;color:#c8dff0;font-size:13px;font-family:var(--aiops-font-family, "Courier New", monospace);letter-spacing:.04em;outline:none;transition:border-color .25s,box-shadow .25s;box-sizing:border-box}.cred-input::placeholder{color:#c8dff02e;letter-spacing:.06em}.cred-btn{position:relative;display:block;width:100%;margin-top:26px;padding:12px 0;border:1px solid rgba(0,229,255,.3);border-radius:4px;background:#00e5ff0f;color:#00e5ff;font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;font-family:inherit;transition:background .25s,box-shadow .25s,opacity .25s;overflow:hidden}.cred-btn-glow{position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(0,229,255,.08),transparent);pointer-events:none;animation:cred-btn-shine 3s ease-in-out infinite}.cred-footer{margin-top:20px;text-align:center;font-size:7px;letter-spacing:.2em;text-transform:uppercase;color:#c8dff02e;font-family:var(--aiops-font-family, "Courier New", monospace)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{font-family:var(--aiops-font-family, "Segoe UI", system-ui, -apple-system, sans-serif);background-color:#020810;color:#c8dff0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#1e508c66;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#22d3ee4d}*{scrollbar-width:thin;scrollbar-color:rgba(30,80,140,.4) transparent}@keyframes holo-ring-pulse{0%,to{transform:scaleY(.22) scale(1)}50%{transform:scaleY(.22) scale(.965)}}@keyframes holo-beam-pulse{0%{opacity:.75;filter:brightness(1)}40%{opacity:1;filter:brightness(1.35)}70%{opacity:.55;filter:brightness(.7)}to{opacity:.75;filter:brightness(1)}}@keyframes holo-scan{0%{top:-3px;opacity:0}6%{opacity:1}90%{opacity:.6}to{top:110%;opacity:0}}@keyframes holo-led-blink{0%,88%,to{opacity:1}93%{opacity:.15}}@keyframes holo-float{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes holo-base-spin{0%{transform:translate(-50%) scaleY(.22) rotate(0)}to{transform:translate(-50%) scaleY(.22) rotate(360deg)}}@keyframes component-drill-pulse{0%,to{box-shadow:0 0 #f253}50%{box-shadow:0 0 12px 2px #ff225526}}@keyframes comp-dialog-border-glow{0%,to{border-color:var(--dialog-color, #00e5ff)33;box-shadow:0 0 30px var(--dialog-color, #00e5ff) 18,0 12px 60px #000000bf,inset 0 0 40px #0006}50%{border-color:var(--dialog-color, #00e5ff)66;box-shadow:0 0 50px var(--dialog-color, #00e5ff) 30,0 12px 60px #000000bf,inset 0 0 40px #0006}}@keyframes comp-dialog-icon-pop{0%{opacity:0;transform:scale(.3) translateY(14px)}60%{opacity:1;transform:scale(1.08) translateY(-3px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes comp-dialog-metric-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}

package/dist/index.js

@@ -1,11 +1,11 @@
 import { jsxs as c, jsx as e, Fragment as ze } from "react/jsx-runtime";
 import X, { createContext as et, useContext as xe, useState as C, useCallback as _e, useEffect as de, useMemo as Be, useRef as q } from "react";
-const Xt = {
+const Gt = {
   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 qt({
+function Zt({
   name: t,
   status: n,
   dbSync: o = !0,
@@ -146,7 +146,7 @@ function qt({
                 }
               ),
               d.map((p, f) => {
-                const b = Xt[p.level];
+                const b = Gt[p.level];
                 return /* @__PURE__ */ c(
                   "div",
                   {
@@ -182,7 +182,7 @@ const E = {
   warning: { color: "#ff8c00", glow: "rgba(255,140,0,0.55)" },
   critical: { color: "#ff2255", glow: "rgba(255,34,85,0.55)" },
   offline: { color: "#1e3a5a", glow: "rgba(30,58,90,0.25)" }
-}, _i = "#00e5ff", ji = "#0055cc", Ue = "linear-gradient(180deg, #071428 0%, #040c1c 60%, #030810 100%)", dt = "linear-gradient(180deg, rgba(10,25,50,0.35) 0%, rgba(5,15,35,0.25) 60%, rgba(3,10,20,0.15) 100%)";
+}, Qi = "#00e5ff", Ki = "#0055cc", Ue = "linear-gradient(180deg, #071428 0%, #040c1c 60%, #030810 100%)", dt = "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 ct(t, n, o) {
   const i = {
     position: "absolute",
@@ -237,13 +237,13 @@ const lt = "cubic-bezier(0.34, 1.56, 0.64, 1)", qe = "cubic-bezier(0.16, 1, 0.3,
 function Pt(t) {
   return E[t]?.color ?? E.online.color;
 }
-function Qt(t, n, o) {
+function Jt(t, n, o) {
   return t >= o ? "#ff2255" : t >= n ? "#ff8c00" : "#00e5ff";
 }
 function Xe(t, n, o, i) {
   return t === "offline" ? "offline" : t === "critical" && n >= i ? "critical" : (t === "critical" || t === "warning") && n >= o ? "warning" : "online";
 }
-function Kt({
+function ei({
   component: t,
   onClose: n,
   visible: o,
@@ -521,7 +521,7 @@ function Kt({
               position: "relative",
               zIndex: 2
             },
-            children: $.map((g) => /* @__PURE__ */ e(Gt, { metric: g, visible: o, accentColor: f }, g.id))
+            children: $.map((g) => /* @__PURE__ */ e(ti, { metric: g, visible: o, accentColor: f }, g.id))
           }
         ),
         /* @__PURE__ */ c(
@@ -570,7 +570,7 @@ function Kt({
     }
   );
 }
-function Gt({
+function ti({
   metric: t,
   visible: n,
   accentColor: o
@@ -586,7 +586,7 @@ function Gt({
     colorOverride: p,
     warnAt: f = 70,
     critAt: b = 85
-  } = t, h = p ?? Qt(a, f, b), y = p ?? Pt(l);
+  } = t, h = p ?? Jt(a, f, b), y = p ?? Pt(l);
   return /* @__PURE__ */ c(
     "div",
     {
@@ -618,7 +618,7 @@ function Gt({
               animation: n ? `comp-dialog-icon-pop 0.5s ${lt} ${0.35 + d * 0.12}s both` : "none"
             },
             children: [
-              /* @__PURE__ */ e(Zt, { type: u, color: y }),
+              /* @__PURE__ */ e(ii, { type: u, color: y }),
               (l === "warning" || l === "critical") && /* @__PURE__ */ e(
                 "div",
                 {
@@ -813,7 +813,7 @@ function Gt({
     }
   );
 }
-function Zt({ type: t, color: n }) {
+function ii({ type: t, color: n }) {
   return t === "cpu" ? /* @__PURE__ */ c("svg", { width: 28, height: 28, viewBox: "0 0 24 24", fill: "none", children: [
     /* @__PURE__ */ e("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2", stroke: n, strokeWidth: "1.5" }),
     /* @__PURE__ */ e(
@@ -899,13 +899,13 @@ function Zt({ type: t, color: n }) {
   ] });
 }
 const pt = et(null), ft = et({ index: 0 });
-function Xi() {
+function Gi() {
   return xe(pt);
 }
-function qi() {
+function Zi() {
   return xe(ft);
 }
-function Jt({
+function ni({
   children: t,
   logoUrl: n,
   viewState: o,
@@ -1012,7 +1012,7 @@ function Jt({
       we
     ] }),
     r && /* @__PURE__ */ e("div", { onClick: (S) => S.stopPropagation(), children: /* @__PURE__ */ e(
-      qt,
+      Zt,
       {
         name: r,
         status: R,
@@ -1023,7 +1023,7 @@ function Jt({
       }
     ) }),
     a && /* @__PURE__ */ e("div", { onClick: (S) => S.stopPropagation(), children: /* @__PURE__ */ e(
-      Kt,
+      ei,
       {
         component: a,
         onClose: g,
@@ -1034,7 +1034,7 @@ function Jt({
     ) })
   ] });
 }
-function ei({
+function oi({
   x1: t,
   y1: n,
   x2: o,
@@ -1101,14 +1101,14 @@ function ei({
     ] })
   ] });
 }
-const ti = [
+const ri = [
   { 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 ii({
+function ai({
   children: t,
   size: n = 230,
   widthRatio: o = 1,
@@ -1274,7 +1274,7 @@ function ii({
         background: `radial-gradient(ellipse, ${i}88 0%, ${i}33 40%, transparent 72%)`,
         filter: "blur(12px)"
       } }),
-      ti.map((s, l) => /* @__PURE__ */ e("div", { style: {
+      ri.map((s, l) => /* @__PURE__ */ e("div", { style: {
         position: "absolute",
         width: a * s.scale,
         height: n * s.scale,
@@ -1317,7 +1317,7 @@ function ii({
     }, children: r })
   ] });
 }
-const Re = et(null), ni = "cubic-bezier(0.34, 1.56, 0.64, 1)", vt = 330, wt = 340, oi = 660;
+const Re = et(null), li = "cubic-bezier(0.34, 1.56, 0.64, 1)", vt = 330, wt = 340, si = 660;
 function At({
   name: t,
   status: n = "online",
@@ -1342,19 +1342,27 @@ function At({
   const g = xe(pt), R = xe(ft), A = a ?? R.index, L = s ?? g?.totalSystems ?? 1, w = l ?? g?.carouselRotation ?? 0, I = u ?? g?.viewState ?? "compact", H = d ?? g?.animPhase ?? 0, D = p ?? g?.selectedSystem ?? null, ee = f ?? g?.selectedComponent ?? null, ce = b ?? g?.rotateY ?? 20, pe = h ?? g?.autoRotateComponents ?? !0, se = y ?? g?.componentScale ?? 0.35, ve = m ?? g?.drillZoom ?? 3.3, we = k ?? g?.onSelectSystem, Se = v ?? g?.onComponentClick, G = g?.onComponentDataUpdate, S = $ ?? g?.containerWidth ?? 950, P = g?.onNodeAlertsChange, M = q(P);
   M.current = P;
   const Y = q(/* @__PURE__ */ new Map()), Z = _e(
-    (J, Ve, _t) => {
+    (J, Ve, Qt) => {
       const it = Y.current;
-      Ve && Ve !== "online" ? it.set(J, { severity: Ve, msg: _t }) : it.delete(J);
+      Ve && Ve !== "online" ? it.set(J, { severity: Ve, msg: Qt }) : it.delete(J);
       const xt = [];
-      for (const [jt, nt] of it)
+      for (const [Kt, nt] of it)
         xt.push({
           level: nt.severity === "critical" || nt.severity === "offline" ? "critical" : "warning",
-          message: `${jt}: ${nt.msg}`
+          message: `${Kt}: ${nt.msg}`
         });
       M.current?.(t, xt);
     },
     [t]
-  ), Q = D === t, z = Q && (I === "expanded" || I === "expanding" && H >= 1), oe = !z, fe = (S - oi) / 2, ue = vt + fe, he = A / L * Math.PI * 2 + w, Fe = 420, Ce = 160, re = ue + Math.cos(he) * Fe, x = 450 + Math.sin(he) * Ce, V = Math.round(x), ae = !Q && (I === "expanding" || I === "expanded"), _ = ae ? 0 : 1, j = oe ? 0.3 + (Math.sin(he) + 1) * 0.1 : 1, B = oe ? j : se, Ee = I === "compact" || I === "collapsing" ? "none" : "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)", Ye = Q && ee, tt = Ye ? ve : 1, Bt = ee?.ex ?? 330, Ut = ee?.ey ?? 300, { size: Ft = 90, color: Ht = "#00e5ff", widthRatio: Yt = 3 } = i ?? {}, Vt = {
+  ), Q = D === t, z = Q && (I === "expanded" || I === "expanding" && H >= 1), oe = !z, fe = (S - si) / 2, ue = vt + fe, he = A / L * Math.PI * 2 + w, Fe = 420, Ce = 160, re = ue + Math.cos(he) * Fe, x = 450 + Math.sin(he) * Ce, V = Math.round(x), ae = !Q && (I === "expanding" || I === "expanded"), _ = ae ? 0 : 1, j = oe ? 0.3 + (Math.sin(he) + 1) * 0.1 : 1, B = oe ? j : se, Ee = I === "compact" || I === "collapsing" ? "none" : "all 1s cubic-bezier(0.34, 1.56, 0.64, 1)", Ye = Q && ee, tt = Ye ? ve : 1, Bt = ee?.ex ?? 330, Ut = ee?.ey ?? 300, {
+    size: Ft = 90,
+    color: Ht = "#00e5ff",
+    widthRatio: Yt = 3,
+    expandedX: Vt,
+    expandedY: _t = 570,
+    compactOffsetX: jt = 0,
+    compactOffsetY: Xt = 0
+  } = i ?? {}, qt = {
     name: t,
     isSelected: Q,
     isExpandedPos: z,
@@ -1373,7 +1381,7 @@ function At({
     expandedOffsetX: fe,
     registerNodeAlert: Z
   };
-  return /* @__PURE__ */ e(Re.Provider, { value: Vt, children: /* @__PURE__ */ c(
+  return /* @__PURE__ */ e(Re.Provider, { value: qt, children: /* @__PURE__ */ c(
     "div",
     {
       style: {
@@ -1384,7 +1392,7 @@ function At({
         height: "100%",
         pointerEvents: "none",
         opacity: _,
-        transition: `opacity 0.8s ease, filter 0.5s ease, transform 0.6s ${ni}`,
+        transition: `opacity 0.8s ease, filter 0.5s ease, transform 0.6s ${li}`,
         filter: oe && Math.sin(he) < -0.5 ? "brightness(0.5) blur(2px)" : "none",
         zIndex: Q ? 500 : ae ? 0 : V,
         transformOrigin: `${ue}px ${wt}px`,
@@ -1497,7 +1505,7 @@ function At({
               transition: Ee
             },
             children: o.map((J, Ve) => /* @__PURE__ */ e(
-              ei,
+              oi,
               {
                 x1: J.from[0],
                 y1: J.from[1],
@@ -1516,13 +1524,13 @@ function At({
           {
             style: {
               position: "absolute",
-              left: z ? ue : re,
-              top: z ? 570 : x + 70,
+              left: z ? Vt ?? ue : re + jt,
+              top: z ? _t : x + 70 + Xt,
               transform: `translate(-50%, -50%) scaleX(${z ? 1 : 0.4}) scaleY(${z ? 1 : 0.6}) scale(${z ? 1 : j})`,
               transition: Ee,
               zIndex: 1
             },
-            children: /* @__PURE__ */ e(ii, { size: Ft, color: Ht, widthRatio: Yt, children: /* @__PURE__ */ e("div", { className: "base-hotspot" }) })
+            children: /* @__PURE__ */ e(ai, { size: Ft, color: Ht, widthRatio: Yt, children: /* @__PURE__ */ e("div", { className: "base-hotspot" }) })
           }
         ),
         r
@@ -1677,21 +1685,21 @@ function U({
     }
   );
 }
-const Tt = 70, Ot = 85, ri = {
+const Tt = 70, Ot = 85, di = {
   online: 0,
   warning: 1,
   offline: 2,
   critical: 3
 };
 function St(t) {
-  return ri[t] ?? 0;
+  return di[t] ?? 0;
 }
-function ai(t) {
+function ci(t) {
   if (!t) return null;
   const n = t.dialogMetrics ?? t.context?.dialogMetrics;
-  return n && n.length > 0 ? li(n) : si(t.context);
+  return n && n.length > 0 ? pi(n) : fi(t.context);
 }
-function li(t) {
+function pi(t) {
   let n = null;
   for (const r of t) {
     if (r.color) continue;
@@ -1706,7 +1714,7 @@ function li(t) {
     internalRef: o.id.toUpperCase()
   };
 }
-function si(t) {
+function fi(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" });
@@ -1721,8 +1729,8 @@ function si(t) {
     internalRef: i.id
   };
 }
-function di(t, n) {
-  const o = t?.status ?? "online", i = St(o), r = ai(t), a = r ? St(r.severity) : 0, s = i >= a ? o : r.severity;
+function ui(t, n) {
+  const o = t?.status ?? "online", i = St(o), r = ci(t), a = r ? St(r.severity) : 0, s = i >= a ? o : r.severity;
   if (i === 0 && a === 0)
     return { effectiveSeverity: "online", callout: null };
   let l;
@@ -1765,7 +1773,7 @@ function O({
     registerNodeAlert: H,
     onComponentDataUpdate: D
   } = y, ce = p === 0 || y.isSelected && k >= p ? 1 : 0, pe = v + o.x, se = $ + o.y, ve = m ? t + I : pe, we = m ? n : se, Se = f !== void 0 ? f : y.isCompact ? g : R, G = !!d && !!w && d.name === w, { effectiveSeverity: S, callout: P } = Be(
-    () => di(d, h),
+    () => ui(d, h),
     [d, h]
   );
   de(() => (d?.name && H && H(
@@ -1844,7 +1852,7 @@ function O({
             }
           ),
           b ? re : /* @__PURE__ */ e(
-            ci,
+            hi,
             {
               statusColor: fe,
               label: s,
@@ -1878,7 +1886,7 @@ function O({
     )
   ] });
 }
-function ci({
+function hi({
   children: t,
   statusColor: n,
   label: o,
@@ -1997,7 +2005,7 @@ function It({ synced: t, latencyMs: n }) {
   ] });
 }
 const be = 140, te = 240, me = 160, Pe = ct(be, te, me);
-function pi({
+function bi({
   cfg: t,
   name: n,
   cpuLoad: o,
@@ -2409,7 +2417,7 @@ function pi({
     }
   );
 }
-function fi() {
+function gi() {
   return /* @__PURE__ */ c(
     "div",
     {
@@ -2623,7 +2631,7 @@ function $t({
     }
   );
 }
-function ui({ cpuLoad: t }) {
+function yi({ 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((me - 18) / 7);
   return /* @__PURE__ */ c(
     "div",
@@ -2820,7 +2828,7 @@ function ke({
                 },
                 children: [
                   /* @__PURE__ */ e("div", { style: Pe.front, children: /* @__PURE__ */ e(
-                    pi,
+                    bi,
                     {
                       cfg: m,
                       name: s,
@@ -2831,10 +2839,10 @@ function ke({
                       brandLabel: d
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: Pe.back, children: /* @__PURE__ */ e(fi, {}) }),
+                  /* @__PURE__ */ e("div", { style: Pe.back, children: /* @__PURE__ */ e(gi, {}) }),
                   /* @__PURE__ */ e("div", { style: Pe.left, children: /* @__PURE__ */ e($t, { side: "left", color: m.color, brandLabel: d }) }),
                   /* @__PURE__ */ e("div", { style: Pe.right, children: /* @__PURE__ */ e($t, { side: "right", color: m.color, brandLabel: d }) }),
-                  /* @__PURE__ */ e("div", { style: Pe.top, children: /* @__PURE__ */ e(ui, { cpuLoad: l }) }),
+                  /* @__PURE__ */ e("div", { style: Pe.top, children: /* @__PURE__ */ e(yi, { cpuLoad: l }) }),
                   /* @__PURE__ */ e("div", { style: Pe.bottom, children: /* @__PURE__ */ e(
                     "div",
                     {
@@ -2854,7 +2862,7 @@ function ke({
     }
   );
 }
-function Qi({
+function Ji({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -2904,7 +2912,7 @@ const st = 12, $e = 55, le = $e * 2, Ie = 52, ut = 10, ot = 3 * Ie + 2 * ut, Ae
 function at(t) {
   return Math.cos(t * Math.PI / 180) * 0.42 + 0.58;
 }
-function hi({
+function mi({
   diskY: t,
   diskIdx: n,
   cfg: o,
@@ -3236,7 +3244,7 @@ function je({
                   transition: r ? "none" : "transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94)"
                 },
                 children: [0, 1, 2].map((h) => /* @__PURE__ */ e(
-                  hi,
+                  mi,
                   {
                     diskY: h * (Ie + ut),
                     diskIdx: h,
@@ -3255,7 +3263,7 @@ function je({
     }
   );
 }
-function Ki({
+function en({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -3411,7 +3419,7 @@ function ht({ status: t = "online", scale: n = 1 }) {
     }
   );
 }
-function Gi({
+function tn({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -3435,7 +3443,7 @@ function Gi({
   );
 }
 const ge = 190, ie = 72, Le = 120, Te = ct(ge, ie, Le);
-function bi({
+function xi({
   cfg: t,
   name: n,
   traffic: o,
@@ -3697,7 +3705,7 @@ function bi({
     }
   );
 }
-function gi() {
+function vi() {
   return /* @__PURE__ */ c(
     "div",
     {
@@ -3842,7 +3850,7 @@ function kt({ side: t, color: n }) {
     }
   );
 }
-function yi({ traffic: t }) {
+function wi({ traffic: t }) {
   const n = Math.floor((Le - 14) / 7);
   return /* @__PURE__ */ c(
     "div",
@@ -4025,7 +4033,7 @@ function bt({
                 },
                 children: [
                   /* @__PURE__ */ e("div", { style: Te.front, children: /* @__PURE__ */ e(
-                    bi,
+                    xi,
                     {
                       cfg: y,
                       name: s,
@@ -4034,10 +4042,10 @@ function bt({
                       compact: d
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: Te.back, children: /* @__PURE__ */ e(gi, {}) }),
+                  /* @__PURE__ */ e("div", { style: Te.back, children: /* @__PURE__ */ e(vi, {}) }),
                   /* @__PURE__ */ e("div", { style: Te.left, children: /* @__PURE__ */ e(kt, { side: "left", color: y.color }) }),
                   /* @__PURE__ */ e("div", { style: Te.right, children: /* @__PURE__ */ e(kt, { side: "right", color: y.color }) }),
-                  /* @__PURE__ */ e("div", { style: Te.top, children: /* @__PURE__ */ e(yi, { traffic: l }) }),
+                  /* @__PURE__ */ e("div", { style: Te.top, children: /* @__PURE__ */ e(wi, { traffic: l }) }),
                   /* @__PURE__ */ e("div", { style: Te.bottom, children: /* @__PURE__ */ e("div", { style: { width: ge, height: Le, background: "#020508" } }) })
                 ]
               }
@@ -4048,7 +4056,7 @@ function bt({
     }
   );
 }
-function Zi({
+function nn({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -4099,7 +4107,7 @@ const ye = 190, ne = 72, De = 120, Oe = ct(ye, ne, De), Rt = {
   critical: { color: "#ff2255", glow: "rgba(255,34,85,0.50)" },
   offline: { color: "#1e3a5a", glow: "rgba(30,58,90,0.25)" }
 };
-function mi({
+function Si({
   cfg: t,
   name: n,
   queueDepth: o,
@@ -4358,7 +4366,7 @@ function mi({
     }
   );
 }
-function xi() {
+function $i() {
   return /* @__PURE__ */ c(
     "div",
     {
@@ -4503,7 +4511,7 @@ function Ct({ side: t, color: n }) {
     }
   );
 }
-function vi({ queueDepth: t, color: n }) {
+function ki({ queueDepth: t, color: n }) {
   const o = Math.floor((De - 14) / 7);
   return /* @__PURE__ */ c(
     "div",
@@ -4687,7 +4695,7 @@ function Lt({
                 },
                 children: [
                   /* @__PURE__ */ e("div", { style: Oe.front, children: /* @__PURE__ */ e(
-                    mi,
+                    Si,
                     {
                       cfg: m,
                       name: s,
@@ -4697,10 +4705,10 @@ function Lt({
                       compact: p
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { style: Oe.back, children: /* @__PURE__ */ e(xi, {}) }),
+                  /* @__PURE__ */ e("div", { style: Oe.back, children: /* @__PURE__ */ e($i, {}) }),
                   /* @__PURE__ */ e("div", { style: Oe.left, children: /* @__PURE__ */ e(Ct, { side: "left", color: m.color }) }),
                   /* @__PURE__ */ e("div", { style: Oe.right, children: /* @__PURE__ */ e(Ct, { side: "right", color: m.color }) }),
-                  /* @__PURE__ */ e("div", { style: Oe.top, children: /* @__PURE__ */ e(vi, { queueDepth: l, color: m.color }) }),
+                  /* @__PURE__ */ e("div", { style: Oe.top, children: /* @__PURE__ */ e(ki, { queueDepth: l, color: m.color }) }),
                   /* @__PURE__ */ e("div", { style: Oe.bottom, children: /* @__PURE__ */ e("div", { style: { width: ye, height: De, background: "#020508" } }) })
                 ]
               }
@@ -4711,13 +4719,13 @@ function Lt({
     }
   );
 }
-const wi = {
+const Ri = {
   online: "#bb55ff",
   warning: "#ff8c00",
   critical: "#ff2255",
   offline: "#1e3a5a"
 };
-function Ji({
+function on({
   ex: t,
   ey: n,
   compactOffset: o,
@@ -4736,7 +4744,7 @@ function Ji({
   graphSeries: m,
   alert: k
 }) {
-  const v = wi[a] ?? l ?? "#bb55ff";
+  const v = Ri[a] ?? l ?? "#bb55ff";
   return /* @__PURE__ */ e(
     O,
     {
@@ -4777,7 +4785,7 @@ function N(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 Ci({ data: t, color: n, height: o = 28 }) {
   const r = o, a = Math.max(...t, 1), s = t.map((l, u) => {
     const d = u / (t.length - 1) * 120, p = r - l / a * (r - 4) - 2;
     return `${d},${p}`;
@@ -4795,7 +4803,7 @@ function Si({ data: t, color: n, height: o = 28 }) {
     }
   ) });
 }
-function $i({
+function Ei({
   type: t,
   name: n,
   context: o = {},
@@ -4803,7 +4811,7 @@ function $i({
   animPhase: r,
   series: a
 }) {
-  const s = i === "critical" || i === "offline" ? "#ff2255" : i === "warning" ? "#ff8c00" : "#00e5ff", l = a ? a.map((p) => ({ ...p })) : ki(t, o), u = r >= 0.3 ? 0 : -280, d = r >= 0.2 ? 1 : 0;
+  const s = i === "critical" || i === "offline" ? "#ff2255" : i === "warning" ? "#ff8c00" : "#00e5ff", l = a ? a.map((p) => ({ ...p })) : Pi(t, o), u = r >= 0.3 ? 0 : -280, d = r >= 0.2 ? 1 : 0;
   return /* @__PURE__ */ c(
     "div",
     {
@@ -4858,7 +4866,7 @@ function $i({
                   p.unit
                 ] })
               ] }),
-              /* @__PURE__ */ e(Si, { data: p.data, color: p.color, height: 26 })
+              /* @__PURE__ */ e(Ci, { data: p.data, color: p.color, height: 26 })
             ]
           },
           p.id
@@ -4867,7 +4875,7 @@ function $i({
     }
   );
 }
-function ki(t, n) {
+function Pi(t, n) {
   if (t === "server") {
     const o = n.cpuLoad ?? 50, i = n.memLoad ?? 60;
     return [
@@ -5468,7 +5476,7 @@ function K({
     }
   );
 }
-function Ri(t, n, o, i) {
+function Ai(t, n, o, i) {
   const r = o === "online" ? "online" : o;
   return t === "server" ? [
     {
@@ -5572,8 +5580,8 @@ function Ri(t, n, o, i) {
     }
   ] : [];
 }
-const W = "cubic-bezier(0.34, 1.56, 0.64, 1)", Ci = "cubic-bezier(0.16, 1, 0.3, 1)";
-function Ei({ items: t, revealPhase: n }) {
+const W = "cubic-bezier(0.34, 1.56, 0.64, 1)", Ti = "cubic-bezier(0.16, 1, 0.3, 1)";
+function Oi({ items: t, revealPhase: n }) {
   return /* @__PURE__ */ e(
     "div",
     {
@@ -5600,7 +5608,7 @@ function Ei({ items: t, revealPhase: n }) {
     }
   );
 }
-function Pi({
+function Ii({
   type: t,
   status: n,
   context: o,
@@ -5910,7 +5918,7 @@ function Pi({
   }
   return null;
 }
-function en({
+function rn({
   type: t,
   name: n,
   status: o,
@@ -5920,7 +5928,7 @@ function en({
   subComponents: s,
   graphSeries: l
 }) {
-  const u = Ri(t, n, o, a), d = E[o]?.color ?? E.online.color, p = r >= 0.1 ? 1 : r * 10, f = r >= 0.2 ? "-50%" : "0%", b = r >= 0.2 ? "50%" : "0%", h = r >= 0.25 ? Math.min(1, (r - 0.25) * 1.5) : 0;
+  const u = Ai(t, n, o, a), d = E[o]?.color ?? E.online.color, p = r >= 0.1 ? 1 : r * 10, f = r >= 0.2 ? "-50%" : "0%", b = r >= 0.2 ? "50%" : "0%", h = r >= 0.25 ? Math.min(1, (r - 0.25) * 1.5) : 0;
   return /* @__PURE__ */ c(
     "div",
     {
@@ -5944,13 +5952,13 @@ function en({
               backdropFilter: "blur(10px)",
               WebkitBackdropFilter: "blur(10px)",
               opacity: p,
-              transition: `opacity 0.4s ${Ci}`
+              transition: `opacity 0.4s ${Ti}`
             },
             onClick: i
           }
         ),
         /* @__PURE__ */ e(
-          $i,
+          Ei,
           {
             type: t,
             name: n,
@@ -6120,8 +6128,8 @@ function en({
                         }
                       }
                     ),
-                    /* @__PURE__ */ e("div", { style: { flex: 1, padding: "8px 0 24px" }, children: s ? /* @__PURE__ */ e(Ei, { items: s, revealPhase: h }) : /* @__PURE__ */ e(
-                      Pi,
+                    /* @__PURE__ */ e("div", { style: { flex: 1, padding: "8px 0 24px" }, children: s ? /* @__PURE__ */ e(Oi, { items: s, revealPhase: h }) : /* @__PURE__ */ e(
+                      Ii,
                       {
                         type: t,
                         name: n,
@@ -6141,7 +6149,7 @@ function en({
     }
   );
 }
-function Ai({ onSubmit: t }) {
+function Li({ onSubmit: t }) {
   const [n, o] = C(""), [i, r] = C(""), [a, s] = C(null), [l, u] = C(!1), d = n.trim().length > 0 && i.trim().length > 0;
   return /* @__PURE__ */ e("div", { className: "cred-overlay", children: /* @__PURE__ */ c("form", { className: "cred-panel", onSubmit: (f) => {
     f.preventDefault(), d && t({ accessKey: n.trim(), secretKey: i.trim() });
@@ -6233,27 +6241,27 @@ function Ai({ onSubmit: t }) {
   ] }) });
 }
 const gt = et(null);
-function Ti() {
+function Di() {
   const t = xe(gt);
   if (!t)
     throw new Error("useAIOpsData must be used within an AIOPsDashboard with dataEndpoint configured");
   return t;
 }
-function Oi() {
+function Ni() {
   return xe(gt);
 }
-function tn(t) {
-  const { data: n } = Ti();
+function an(t) {
+  const { data: n } = Di();
   return n[t] ?? null;
 }
-function Ii(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 Li(t) {
+function Mi(t) {
   if (typeof t == "number") return t;
   if (typeof t == "string") {
     const n = Number(t);
@@ -6261,7 +6269,7 @@ function Li(t) {
   }
   return t;
 }
-function Di({ config: t, children: n }) {
+function zi({ config: t, children: n }) {
   const [o, i] = C({}), [r, a] = C(null), [s, l] = C(!1), [u, d] = C(null), [p, f] = C(null), b = q(t);
   b.current = t;
   const h = q(r);
@@ -6320,20 +6328,20 @@ function Di({ config: t, children: n }) {
   };
   return /* @__PURE__ */ c(gt.Provider, { value: k, children: [
     n,
-    !r && /* @__PURE__ */ e(Ai, { onSubmit: m })
+    !r && /* @__PURE__ */ e(Li, { onSubmit: m })
   ] });
 }
-function nn(t) {
+function ln(t) {
   const { liveData: n, dataEndpoint: o, dataBindings: i, dataRefreshInterval: r, serviceDataBindings: a } = t;
   if (n && o && i) {
-    const s = Ii(i), l = [];
+    const s = Wi(i), l = [];
     if (a)
       for (const d of Object.values(a))
         for (const p of d)
           s.includes(p.query) || l.push(p.query);
     const u = [...s, ...l];
     return /* @__PURE__ */ e(
-      Di,
+      zi,
       {
         config: {
           endpoint: o,
@@ -6359,7 +6367,7 @@ function Et({
   serviceDataBindings: d,
   children: p
 }) {
-  const f = Oi(), [b] = C(20), [h] = C(!1), [y] = C(!0), [m] = C(0.45), [k] = C(3.3), [v, $] = C("compact"), [g, R] = C(0), [A, L] = C(null), [w, I] = C(null), [H, D] = C(0), [ee, ce] = C(0), pe = (x) => {
+  const f = Ni(), [b] = C(20), [h] = C(!1), [y] = C(!0), [m] = C(0.45), [k] = C(3.3), [v, $] = C("compact"), [g, R] = C(0), [A, L] = C(null), [w, I] = C(null), [H, D] = C(0), [ee, ce] = C(0), pe = (x) => {
     v === "compact" && (L(x), $("expanding"), R(0), setTimeout(() => R(1), 50), setTimeout(() => R(2), 800), setTimeout(() => R(3), 1200), setTimeout(() => R(4), 1600), setTimeout(() => R(5), 2e3), setTimeout(() => {
       R(6), $("expanded");
     }, 2400));
@@ -6382,7 +6390,7 @@ function Et({
   }, [ee]);
   const Se = () => {
     I(null), D(0);
-  }, G = o.find((x) => x.name === A), S = G?.status ?? "online", P = G?.dbSync ?? !0, M = G?.alerts, Y = f?.data, Z = u ?? Li, Q = Be(() => {
+  }, G = o.find((x) => x.name === A), S = G?.status ?? "online", P = G?.dbSync ?? !0, M = G?.alerts, Y = f?.data, Z = u ?? Mi, Q = Be(() => {
     if (!Y || !d) return null;
     const x = {};
     for (const [V, ae] of Object.entries(d))
@@ -6459,7 +6467,7 @@ function Et({
             },
             onClick: se,
             children: /* @__PURE__ */ e(
-              Jt,
+              ni,
               {
                 viewState: v,
                 animPhase: g,
@@ -6552,7 +6560,7 @@ function zt(t) {
     { id: "worker", label: "WORKER", unit: "%", color: "#bb55ff", data: T(n * 0.9, 15) }
   ];
 }
-function Ni(t, n, o) {
+function Bi(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(K, { color: "#bb55ff", label: "INST-0", status: "online" }) },
@@ -6564,7 +6572,7 @@ function Ni(t, n, o) {
     { id: "worker-3", label: "WORKER-3", status: s, detail: s === "critical" ? "Worker timeout" : void 0, element: /* @__PURE__ */ e(F, { color: "#bb55ff", label: "WORKER-3", status: s }) }
   ];
 }
-function Wi(t) {
+function Ui(t) {
   const n = t?.queueDepth ?? 50;
   return [
     { id: "traffic", label: "TRAFFIC", unit: "%", color: "#00e5ff", data: T(n, 20) },
@@ -6606,7 +6614,7 @@ function yt(t) {
   ];
   return n.includes("critical") ? "critical" : n.includes("warning") ? "warning" : n.includes("offline") ? "offline" : "online";
 }
-function on(t) {
+function sn(t) {
   const n = yt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     {
@@ -6628,7 +6636,7 @@ function on(t) {
     }
   ];
 }
-function rn(t) {
+function dn(t) {
   const n = yt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     ...t.dbSync ? [] : [{ level: "warning", message: "DB Replication Lag Detected" }],
@@ -6637,7 +6645,7 @@ function rn(t) {
     ...!o && !i && t.dbSync ? [{ level: "info", message: "All Systems Nominal" }] : []
   ];
 }
-const Mi = [
+const Fi = [
   { from: [330, 120], to: [220, 260], visibleAtPhase: 3 },
   { from: [330, 120], to: [440, 260], visibleAtPhase: 3 },
   { from: [220, 260], to: [165, 390], visibleAtPhase: 4 },
@@ -6650,7 +6658,7 @@ const Mi = [
   { from: [330, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" },
   { from: [495, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" }
 ];
-function zi({ config: t }) {
+function Hi({ config: t }) {
   const n = X.useContext(Re), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { wdStatus: r, msStatus: a, srv1Status: s, srv2Status: l, srv3Status: u, pdbStatus: d, sdbStatus: p, dbSync: f } = t;
   return /* @__PURE__ */ c(ze, { children: [
     /* @__PURE__ */ e(
@@ -6714,8 +6722,8 @@ function zi({ config: t }) {
           name: "MSG-SRV",
           status: a,
           context: { queueDepth: 45 },
-          subComponents: Ni(a),
-          graphSeries: Wi({ queueDepth: 45 })
+          subComponents: Bi(a),
+          graphSeries: Ui({ queueDepth: 45 })
         },
         children: /* @__PURE__ */ e(
           Lt,
@@ -6910,10 +6918,10 @@ function zi({ config: t }) {
         children: /* @__PURE__ */ e(It, { synced: f, latencyMs: f ? 8 : 342 })
       }
     ),
-    /* @__PURE__ */ e(Bi, { config: t })
+    /* @__PURE__ */ e(Yi, { config: t })
   ] });
 }
-function Bi({ config: t }) {
+function Yi({ config: t }) {
   const n = X.useContext(Re), { wdStatus: o, msStatus: i, srv1Status: r, srv2Status: a, srv3Status: s, pdbStatus: l, sdbStatus: u, dbSync: d } = t, p = n?.isSelected && n?.isExpandedPos;
   return n?.isSelected ? /* @__PURE__ */ c("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
@@ -7038,15 +7046,15 @@ function Bi({ config: t }) {
     )
   ] }) : null;
 }
-function an({ config: t, ...n }) {
+function cn({ config: t, ...n }) {
   return /* @__PURE__ */ e(
     At,
     {
       name: t.name,
       status: yt(t),
-      connections: Mi,
+      connections: Fi,
       ...n,
-      children: /* @__PURE__ */ e(zi, { config: t })
+      children: /* @__PURE__ */ e(Hi, { config: t })
     }
   );
 }
@@ -7061,7 +7069,7 @@ function mt(t) {
   ];
   return n.includes("critical") ? "critical" : n.includes("warning") ? "warning" : n.includes("offline") ? "offline" : "online";
 }
-function ln(t) {
+function pn(t) {
   const n = mt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     {
@@ -7083,7 +7091,7 @@ function ln(t) {
     }
   ];
 }
-function sn(t) {
+function fn(t) {
   const n = mt(t), o = n === "critical" || n === "offline", i = n === "warning";
   return [
     ...t.dbSync ? [] : [{ level: "warning", message: "DB Replication Lag Detected" }],
@@ -7092,7 +7100,7 @@ function sn(t) {
     ...!o && !i && t.dbSync ? [{ level: "info", message: "All Systems Nominal" }] : []
   ];
 }
-const Ui = [
+const Vi = [
   { from: [330, 120], to: [330, 260], visibleAtPhase: 3 },
   { from: [330, 260], to: [165, 390], visibleAtPhase: 4 },
   { from: [330, 260], to: [330, 390], visibleAtPhase: 4 },
@@ -7101,7 +7109,7 @@ const Ui = [
   { from: [330, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" },
   { from: [495, 390], to: [200, 520], visibleAtPhase: 5, color: "#ff8c00" }
 ];
-function Fi({ config: t }) {
+function _i({ config: t }) {
   const n = X.useContext(Re), o = n?.rotateY ?? 20, i = n?.autoRotateComponents ?? !0, { dispStatus: r, srv1Status: a, srv2Status: s, srv3Status: l, pdbStatus: u, sdbStatus: d, dbSync: p } = t;
   return /* @__PURE__ */ c(ze, { children: [
     /* @__PURE__ */ e(
@@ -7327,10 +7335,10 @@ function Fi({ config: t }) {
         children: /* @__PURE__ */ e(It, { synced: p, latencyMs: p ? 8 : 342 })
       }
     ),
-    /* @__PURE__ */ e(Hi, { config: t })
+    /* @__PURE__ */ e(ji, { config: t })
   ] });
 }
-function Hi({ config: t }) {
+function ji({ config: t }) {
   const n = X.useContext(Re), { dispStatus: o, srv1Status: i, srv2Status: r, srv3Status: a, pdbStatus: s, sdbStatus: l, dbSync: u } = t, d = n?.isSelected && n?.isExpandedPos;
   return n?.isSelected ? /* @__PURE__ */ c("div", { style: { pointerEvents: "none" }, children: [
     /* @__PURE__ */ e(
@@ -7440,80 +7448,80 @@ function Hi({ config: t }) {
     )
   ] }) : null;
 }
-function dn({ config: t, ...n }) {
+function un({ config: t, ...n }) {
   return /* @__PURE__ */ e(
     At,
     {
       name: t.name,
       status: mt(t),
-      connections: Ui,
+      connections: Vi,
       ...n,
-      children: /* @__PURE__ */ e(Fi, { config: t })
+      children: /* @__PURE__ */ e(_i, { config: t })
     }
   );
 }
 export {
-  nn as AIOPsDashboard,
+  ln as AIOPsDashboard,
   Ke as CPU3D,
-  Jt as Carousel,
+  ni as Carousel,
   pt as CarouselContext,
   ft as CarouselItemContext,
-  Kt as ComponentDialog,
-  en as ComponentDrillView,
-  Di as DataProvider,
+  ei as ComponentDialog,
+  rn as ComponentDrillView,
+  zi as DataProvider,
   je as Database3D,
-  Ki as DatabaseNode,
+  en as DatabaseNode,
   Ne as DriveBay3D,
-  Ui as EXCHANGE_CONNECTIONS,
-  dn as ExchangeService,
-  ji as HOLO_BLUE,
-  _i as HOLO_CYAN,
+  Vi as EXCHANGE_CONNECTIONS,
+  un as ExchangeService,
+  Ki as HOLO_BLUE,
+  Qi as HOLO_CYAN,
   dt as HOLO_GLASS,
   Ue as HOLO_SURFACE,
-  $i as HistoricalGraphPanel,
-  ii as HoloBase,
+  Ei as HistoricalGraphPanel,
+  ai as HoloBase,
   ht as Human3D,
-  Gi as HumanNode,
+  tn as HumanNode,
   Ge as Memory3D,
   Lt as MessageServer3D,
-  Ji as MessageServerNode,
+  on as MessageServerNode,
   Nt as NetworkBlock3D,
   U as NodeCallout,
   Qe as Platter3D,
   K as Port3D,
-  an as SAPService,
-  Mi as SAP_CONNECTIONS,
+  cn as SAPService,
+  Fi as SAP_CONNECTIONS,
   E as STATUS_CFG,
   ke as Server3D,
-  Qi as ServerNode,
+  Ji as ServerNode,
   At as Service,
   Re as ServiceContext,
-  qt as ServiceDialog,
+  Zt as ServiceDialog,
   O as ServiceNode,
-  ei as SvgConnection,
+  oi as SvgConnection,
   It as SyncBridge,
   F as ThreadPool3D,
   bt as WebDispatcher3D,
-  Zi as WebDispatcherNode,
-  sn as computeExchangeDialogAlerts,
-  ln as computeExchangeDialogMetrics,
+  nn as WebDispatcherNode,
+  fn as computeExchangeDialogAlerts,
+  pn as computeExchangeDialogMetrics,
   mt as computeExchangeServiceStatus,
-  rn as computeSAPDialogAlerts,
-  on as computeSAPDialogMetrics,
+  dn as computeSAPDialogAlerts,
+  sn as computeSAPDialogMetrics,
   yt as computeSAPServiceStatus,
-  Li as defaultDataTransform,
+  Mi as defaultDataTransform,
   Je as getDatabaseGraphSeries,
   Ze as getDatabaseSubComponents,
   zt as getDispatcherGraphSeries,
   Mt as getDispatcherSubComponents,
-  Wi as getMessageServerGraphSeries,
-  Ni as getMessageServerSubComponents,
+  Ui as getMessageServerGraphSeries,
+  Bi as getMessageServerSubComponents,
   Me as getServerGraphSeries,
   We as getServerSubComponents,
   ct as makeFaceStyles,
-  Ti as useAIOpsData,
-  Oi as useAIOpsDataOptional,
-  Xi as useCarouselContext,
-  qi as useCarouselItemContext,
-  tn as useQueryResult
+  Di as useAIOpsData,
+  Ni as useAIOpsDataOptional,
+  Gi as useCarouselContext,
+  Zi as useCarouselItemContext,
+  an as useQueryResult
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-dashstream",
-    "version": "0.0.4",
+    "version": "0.0.6",
     "type": "module",
     "author": "Busaud",
     "license": "MIT",