force-3d-graph 1.2.6 → 1.3.7

package/dist/force-3d-graph.js

@@ -1,8 +1,8 @@
-var ot = Object.defineProperty;
-var nt = (d, e, s) => e in d ? ot(d, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : d[e] = s;
-var l = (d, e, s) => nt(d, typeof e != "symbol" ? e + "" : e, s);
-import * as y from "three";
-import { EventDispatcher as at, Vector3 as S, MOUSE as $, TOUCH as G, Spherical as ze, Quaternion as Te, Vector2 as T, Ray as rt, Plane as lt, MathUtils as ct } from "three";
+var it = Object.defineProperty;
+var ot = (h, e, s) => e in h ? it(h, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : h[e] = s;
+var l = (h, e, s) => ot(h, typeof e != "symbol" ? e + "" : e, s);
+import * as x from "three";
+import { EventDispatcher as nt, Vector3 as S, MOUSE as j, TOUCH as $, Spherical as Se, Quaternion as ze, Vector2 as k, Ray as at, Plane as rt, MathUtils as lt } from "three";
 const P = {
   backgroundColor: 657930,
   cameraPosition: { x: 0, y: 0, z: 80 },
@@ -28,99 +28,100 @@ const P = {
   searchPlaceholder: "Search nodes or relationships...",
   initialViewMode: "3d",
   showViewToggle: !0,
+  showLegend: !0,
   targetFPS: 60,
   maxVisibleNodes: 1e4
 };
-var X = /* @__PURE__ */ ((d) => (d[d.HIGH = 0] = "HIGH", d[d.MEDIUM = 1] = "MEDIUM", d[d.LOW = 2] = "LOW", d))(X || {});
-function ht() {
-  const d = document.createElement("div");
-  return d.id = "force-graph-3d-container", d.style.cssText = `
+var _ = /* @__PURE__ */ ((h) => (h[h.HIGH = 0] = "HIGH", h[h.MEDIUM = 1] = "MEDIUM", h[h.LOW = 2] = "LOW", h))(_ || {});
+function ct() {
+  const h = document.createElement("div");
+  return h.id = "force-graph-3d-container", h.style.cssText = `
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0;
     left: 0;
     overflow: hidden;
-  `, document.body.appendChild(d), d;
+  `, document.body.appendChild(h), h;
 }
-function dt(d) {
-  return d && d instanceof HTMLElement ? d : (console.warn("[ForceGraph3D] No container provided, creating one automatically"), ht());
+function dt(h) {
+  return h && h instanceof HTMLElement ? h : (console.warn("[ForceGraph3D] No container provided, creating one automatically"), ct());
 }
-function ke(d) {
-  const e = d.getBoundingClientRect();
+function ke(h) {
+  const e = h.getBoundingClientRect();
   return {
     width: e.width || window.innerWidth,
     height: e.height || window.innerHeight
   };
 }
-function He(d) {
-  if (!d || typeof d != "object")
+function Fe(h) {
+  if (!h || typeof h != "object")
     return console.warn("[ForceGraph3D] Invalid node: must be an object"), !1;
-  const e = d;
-  return typeof e.id != "string" || e.id.trim() === "" ? (console.warn("[ForceGraph3D] Invalid node: id must be a non-empty string"), !1) : typeof e.label != "string" ? (console.warn("[ForceGraph3D] Invalid node: label must be a string"), !1) : e.color !== void 0 && typeof e.color != "number" ? (console.warn("[ForceGraph3D] Invalid node: color must be a number (hex)"), !1) : e.position !== void 0 && !gt(e.position) ? (console.warn("[ForceGraph3D] Invalid node: position must have x, y, z numbers"), !1) : !0;
+  const e = h;
+  return typeof e.id != "string" || e.id.trim() === "" ? (console.warn("[ForceGraph3D] Invalid node: id must be a non-empty string"), !1) : typeof e.label != "string" ? (console.warn("[ForceGraph3D] Invalid node: label must be a string"), !1) : e.color !== void 0 && typeof e.color != "number" ? (console.warn("[ForceGraph3D] Invalid node: color must be a number (hex)"), !1) : e.position !== void 0 && !pt(e.position) ? (console.warn("[ForceGraph3D] Invalid node: position must have x, y, z numbers"), !1) : !0;
 }
-function De(d) {
-  if (!d || typeof d != "object")
+function De(h) {
+  if (!h || typeof h != "object")
     return console.warn("[ForceGraph3D] Invalid edge: must be an object"), !1;
-  const e = d;
+  const e = h;
   return typeof e.source != "string" || e.source.trim() === "" ? (console.warn("[ForceGraph3D] Invalid edge: source must be a non-empty string"), !1) : typeof e.target != "string" || e.target.trim() === "" ? (console.warn("[ForceGraph3D] Invalid edge: target must be a non-empty string"), !1) : !0;
 }
-function pt(d) {
-  return typeof d != "string" || d.trim() === "" ? (console.warn("[ForceGraph3D] Invalid node ID: must be a non-empty string"), !1) : !0;
+function ht(h) {
+  return typeof h != "string" || h.trim() === "" ? (console.warn("[ForceGraph3D] Invalid node ID: must be a non-empty string"), !1) : !0;
 }
-function gt(d) {
-  if (!d || typeof d != "object") return !1;
-  const e = d;
+function pt(h) {
+  if (!h || typeof h != "object") return !1;
+  const e = h;
   return typeof e.x == "number" && typeof e.y == "number" && typeof e.z == "number";
 }
-function D(d, e) {
-  return d === e ? `${d}-${e}` : d < e ? `${d}-${e}` : `${e}-${d}`;
+function Dt(h, e) {
+  return h === e ? `${h}-${e}` : h < e ? `${h}-${e}` : `${e}-${h}`;
 }
-const Pe = { type: "change" }, ce = { type: "start" }, Re = { type: "end" }, J = new rt(), Ie = new lt(), ut = Math.cos(70 * ct.DEG2RAD);
-class ft extends at {
+const Te = { type: "change" }, le = { type: "start" }, Pe = { type: "end" }, Q = new at(), Le = new rt(), gt = Math.cos(70 * lt.DEG2RAD);
+class ut extends nt {
   constructor(e, s) {
-    super(), this.object = e, this.domElement = s, this.domElement.style.touchAction = "none", this.enabled = !0, this.target = new S(), this.cursor = new S(), this.minDistance = 0, this.maxDistance = 1 / 0, this.minZoom = 0, this.maxZoom = 1 / 0, this.minTargetRadius = 0, this.maxTargetRadius = 1 / 0, this.minPolarAngle = 0, this.maxPolarAngle = Math.PI, this.minAzimuthAngle = -1 / 0, this.maxAzimuthAngle = 1 / 0, this.enableDamping = !1, this.dampingFactor = 0.05, this.enableZoom = !0, this.zoomSpeed = 1, this.enableRotate = !0, this.rotateSpeed = 1, this.enablePan = !0, this.panSpeed = 1, this.screenSpacePanning = !0, this.keyPanSpeed = 7, this.zoomToCursor = !1, this.autoRotate = !1, this.autoRotateSpeed = 2, this.keys = { LEFT: "ArrowLeft", UP: "ArrowUp", RIGHT: "ArrowRight", BOTTOM: "ArrowDown" }, this.mouseButtons = { LEFT: $.ROTATE, MIDDLE: $.DOLLY, RIGHT: $.PAN }, this.touches = { ONE: G.ROTATE, TWO: G.DOLLY_PAN }, this.target0 = this.target.clone(), this.position0 = this.object.position.clone(), this.zoom0 = this.object.zoom, this._domElementKeyEvents = null, this.getPolarAngle = function() {
+    super(), this.object = e, this.domElement = s, this.domElement.style.touchAction = "none", this.enabled = !0, this.target = new S(), this.cursor = new S(), this.minDistance = 0, this.maxDistance = 1 / 0, this.minZoom = 0, this.maxZoom = 1 / 0, this.minTargetRadius = 0, this.maxTargetRadius = 1 / 0, this.minPolarAngle = 0, this.maxPolarAngle = Math.PI, this.minAzimuthAngle = -1 / 0, this.maxAzimuthAngle = 1 / 0, this.enableDamping = !1, this.dampingFactor = 0.05, this.enableZoom = !0, this.zoomSpeed = 1, this.enableRotate = !0, this.rotateSpeed = 1, this.enablePan = !0, this.panSpeed = 1, this.screenSpacePanning = !0, this.keyPanSpeed = 7, this.zoomToCursor = !1, this.autoRotate = !1, this.autoRotateSpeed = 2, this.keys = { LEFT: "ArrowLeft", UP: "ArrowUp", RIGHT: "ArrowRight", BOTTOM: "ArrowDown" }, this.mouseButtons = { LEFT: j.ROTATE, MIDDLE: j.DOLLY, RIGHT: j.PAN }, this.touches = { ONE: $.ROTATE, TWO: $.DOLLY_PAN }, this.target0 = this.target.clone(), this.position0 = this.object.position.clone(), this.zoom0 = this.object.zoom, this._domElementKeyEvents = null, this.getPolarAngle = function() {
       return r.phi;
     }, this.getAzimuthalAngle = function() {
       return r.theta;
     }, this.getDistance = function() {
       return this.object.position.distanceTo(this.target);
-    }, this.listenToKeyEvents = function(n) {
-      n.addEventListener("keydown", re), this._domElementKeyEvents = n;
+    }, this.listenToKeyEvents = function(a) {
+      a.addEventListener("keydown", ae), this._domElementKeyEvents = a;
     }, this.stopListenToKeyEvents = function() {
-      this._domElementKeyEvents.removeEventListener("keydown", re), this._domElementKeyEvents = null;
+      this._domElementKeyEvents.removeEventListener("keydown", ae), this._domElementKeyEvents = null;
     }, this.saveState = function() {
       t.target0.copy(t.target), t.position0.copy(t.object.position), t.zoom0 = t.object.zoom;
     }, this.reset = function() {
-      t.target.copy(t.target0), t.object.position.copy(t.position0), t.object.zoom = t.zoom0, t.object.updateProjectionMatrix(), t.dispatchEvent(Pe), t.update(), o = i.NONE;
+      t.target.copy(t.target0), t.object.position.copy(t.position0), t.object.zoom = t.zoom0, t.object.updateProjectionMatrix(), t.dispatchEvent(Te), t.update(), o = i.NONE;
     }, this.update = function() {
-      const n = new S(), g = new Te().setFromUnitVectors(e.up, new S(0, 1, 0)), v = g.clone().invert(), w = new S(), C = new Te(), F = new S(), z = 2 * Math.PI;
-      return function(it = null) {
-        const Se = t.object.position;
-        n.copy(Se).sub(t.target), n.applyQuaternion(g), r.setFromVector3(n), t.autoRotate && o === i.NONE && B(Ae(it)), t.enableDamping ? (r.theta += c.theta * t.dampingFactor, r.phi += c.phi * t.dampingFactor) : (r.theta += c.theta, r.phi += c.phi);
-        let I = t.minAzimuthAngle, L = t.maxAzimuthAngle;
-        isFinite(I) && isFinite(L) && (I < -Math.PI ? I += z : I > Math.PI && (I -= z), L < -Math.PI ? L += z : L > Math.PI && (L -= z), I <= L ? r.theta = Math.max(I, Math.min(L, r.theta)) : r.theta = r.theta > (I + L) / 2 ? Math.max(I, r.theta) : Math.min(L, r.theta)), r.phi = Math.max(t.minPolarAngle, Math.min(t.maxPolarAngle, r.phi)), r.makeSafe(), t.enableDamping === !0 ? t.target.addScaledVector(p, t.dampingFactor) : t.target.add(p), t.target.sub(t.cursor), t.target.clampLength(t.minTargetRadius, t.maxTargetRadius), t.target.add(t.cursor), t.zoomToCursor && H || t.object.isOrthographicCamera ? r.radius = ne(r.radius) : r.radius = ne(r.radius * h), n.setFromSpherical(r), n.applyQuaternion(v), Se.copy(t.target).add(n), t.object.lookAt(t.target), t.enableDamping === !0 ? (c.theta *= 1 - t.dampingFactor, c.phi *= 1 - t.dampingFactor, p.multiplyScalar(1 - t.dampingFactor)) : (c.set(0, 0, 0), p.set(0, 0, 0));
-        let le = !1;
-        if (t.zoomToCursor && H) {
-          let U = null;
+      const a = new S(), g = new ze().setFromUnitVectors(e.up, new S(0, 1, 0)), v = g.clone().invert(), M = new S(), C = new ze(), F = new S(), z = 2 * Math.PI;
+      return function(st = null) {
+        const Ne = t.object.position;
+        a.copy(Ne).sub(t.target), a.applyQuaternion(g), r.setFromVector3(a), t.autoRotate && o === i.NONE && Y(He(st)), t.enableDamping ? (r.theta += d.theta * t.dampingFactor, r.phi += d.phi * t.dampingFactor) : (r.theta += d.theta, r.phi += d.phi);
+        let R = t.minAzimuthAngle, I = t.maxAzimuthAngle;
+        isFinite(R) && isFinite(I) && (R < -Math.PI ? R += z : R > Math.PI && (R -= z), I < -Math.PI ? I += z : I > Math.PI && (I -= z), R <= I ? r.theta = Math.max(R, Math.min(I, r.theta)) : r.theta = r.theta > (R + I) / 2 ? Math.max(R, r.theta) : Math.min(I, r.theta)), r.phi = Math.max(t.minPolarAngle, Math.min(t.maxPolarAngle, r.phi)), r.makeSafe(), t.enableDamping === !0 ? t.target.addScaledVector(p, t.dampingFactor) : t.target.add(p), t.target.sub(t.cursor), t.target.clampLength(t.minTargetRadius, t.maxTargetRadius), t.target.add(t.cursor), t.zoomToCursor && D || t.object.isOrthographicCamera ? r.radius = oe(r.radius) : r.radius = oe(r.radius * c), a.setFromSpherical(r), a.applyQuaternion(v), Ne.copy(t.target).add(a), t.object.lookAt(t.target), t.enableDamping === !0 ? (d.theta *= 1 - t.dampingFactor, d.phi *= 1 - t.dampingFactor, p.multiplyScalar(1 - t.dampingFactor)) : (d.set(0, 0, 0), p.set(0, 0, 0));
+        let re = !1;
+        if (t.zoomToCursor && D) {
+          let K = null;
           if (t.object.isPerspectiveCamera) {
-            const _ = n.length();
-            U = ne(_ * h);
-            const Q = _ - U;
-            t.object.position.addScaledVector(Y, Q), t.object.updateMatrixWorld();
+            const U = a.length();
+            K = oe(U * c);
+            const Z = U - K;
+            t.object.position.addScaledVector(G, Z), t.object.updateMatrixWorld();
           } else if (t.object.isOrthographicCamera) {
-            const _ = new S(k.x, k.y, 0);
-            _.unproject(t.object), t.object.zoom = Math.max(t.minZoom, Math.min(t.maxZoom, t.object.zoom / h)), t.object.updateProjectionMatrix(), le = !0;
-            const Q = new S(k.x, k.y, 0);
-            Q.unproject(t.object), t.object.position.sub(Q).add(_), t.object.updateMatrixWorld(), U = n.length();
+            const U = new S(T.x, T.y, 0);
+            U.unproject(t.object), t.object.zoom = Math.max(t.minZoom, Math.min(t.maxZoom, t.object.zoom / c)), t.object.updateProjectionMatrix(), re = !0;
+            const Z = new S(T.x, T.y, 0);
+            Z.unproject(t.object), t.object.position.sub(Z).add(U), t.object.updateMatrixWorld(), K = a.length();
           } else
             console.warn("WARNING: OrbitControls.js encountered an unknown camera type - zoom to cursor disabled."), t.zoomToCursor = !1;
-          U !== null && (this.screenSpacePanning ? t.target.set(0, 0, -1).transformDirection(t.object.matrix).multiplyScalar(U).add(t.object.position) : (J.origin.copy(t.object.position), J.direction.set(0, 0, -1).transformDirection(t.object.matrix), Math.abs(t.object.up.dot(J.direction)) < ut ? e.lookAt(t.target) : (Ie.setFromNormalAndCoplanarPoint(t.object.up, t.target), J.intersectPlane(Ie, t.target))));
-        } else t.object.isOrthographicCamera && (t.object.zoom = Math.max(t.minZoom, Math.min(t.maxZoom, t.object.zoom / h)), t.object.updateProjectionMatrix(), le = !0);
-        return h = 1, H = !1, le || w.distanceToSquared(t.object.position) > a || 8 * (1 - C.dot(t.object.quaternion)) > a || F.distanceToSquared(t.target) > 0 ? (t.dispatchEvent(Pe), w.copy(t.object.position), C.copy(t.object.quaternion), F.copy(t.target), !0) : !1;
+          K !== null && (this.screenSpacePanning ? t.target.set(0, 0, -1).transformDirection(t.object.matrix).multiplyScalar(K).add(t.object.position) : (Q.origin.copy(t.object.position), Q.direction.set(0, 0, -1).transformDirection(t.object.matrix), Math.abs(t.object.up.dot(Q.direction)) < gt ? e.lookAt(t.target) : (Le.setFromNormalAndCoplanarPoint(t.object.up, t.target), Q.intersectPlane(Le, t.target))));
+        } else t.object.isOrthographicCamera && (t.object.zoom = Math.max(t.minZoom, Math.min(t.maxZoom, t.object.zoom / c)), t.object.updateProjectionMatrix(), re = !0);
+        return c = 1, D = !1, re || M.distanceToSquared(t.object.position) > n || 8 * (1 - C.dot(t.object.quaternion)) > n || F.distanceToSquared(t.target) > 0 ? (t.dispatchEvent(Te), M.copy(t.object.position), C.copy(t.object.quaternion), F.copy(t.target), !0) : !1;
       };
     }(), this.dispose = function() {
-      t.domElement.removeEventListener("contextmenu", Ce), t.domElement.removeEventListener("pointerdown", Me), t.domElement.removeEventListener("pointercancel", K), t.domElement.removeEventListener("wheel", we), t.domElement.removeEventListener("pointermove", ae), t.domElement.removeEventListener("pointerup", K), t._domElementKeyEvents !== null && (t._domElementKeyEvents.removeEventListener("keydown", re), t._domElementKeyEvents = null);
+      t.domElement.removeEventListener("contextmenu", Ee), t.domElement.removeEventListener("pointerdown", ve), t.domElement.removeEventListener("pointercancel", B), t.domElement.removeEventListener("wheel", we), t.domElement.removeEventListener("pointermove", ne), t.domElement.removeEventListener("pointerup", B), t._domElementKeyEvents !== null && (t._domElementKeyEvents.removeEventListener("keydown", ae), t._domElementKeyEvents = null);
     };
     const t = this, i = {
       NONE: -1,
@@ -133,174 +134,174 @@ class ft extends at {
       TOUCH_DOLLY_ROTATE: 6
     };
     let o = i.NONE;
-    const a = 1e-6, r = new ze(), c = new ze();
-    let h = 1;
-    const p = new S(), x = new T(), m = new T(), u = new T(), f = new T(), b = new T(), M = new T(), N = new T(), O = new T(), R = new T(), Y = new S(), k = new T();
-    let H = !1;
-    const E = [], q = {};
-    let se = !1;
-    function Ae(n) {
-      return n !== null ? 2 * Math.PI / 60 * t.autoRotateSpeed * n : 2 * Math.PI / 60 / 60 * t.autoRotateSpeed;
-    }
-    function W(n) {
-      const g = Math.abs(n * 0.01);
+    const n = 1e-6, r = new Se(), d = new Se();
+    let c = 1;
+    const p = new S(), f = new k(), m = new k(), u = new k(), y = new k(), b = new k(), w = new k(), N = new k(), O = new k(), L = new k(), G = new S(), T = new k();
+    let D = !1;
+    const E = [], V = {};
+    let te = !1;
+    function He(a) {
+      return a !== null ? 2 * Math.PI / 60 * t.autoRotateSpeed * a : 2 * Math.PI / 60 / 60 * t.autoRotateSpeed;
+    }
+    function q(a) {
+      const g = Math.abs(a * 0.01);
       return Math.pow(0.95, t.zoomSpeed * g);
     }
-    function B(n) {
-      c.theta -= n;
+    function Y(a) {
+      d.theta -= a;
     }
-    function Z(n) {
-      c.phi -= n;
+    function W(a) {
+      d.phi -= a;
     }
-    const he = function() {
-      const n = new S();
-      return function(v, w) {
-        n.setFromMatrixColumn(w, 0), n.multiplyScalar(-v), p.add(n);
+    const ce = function() {
+      const a = new S();
+      return function(v, M) {
+        a.setFromMatrixColumn(M, 0), a.multiplyScalar(-v), p.add(a);
       };
     }(), de = function() {
-      const n = new S();
-      return function(v, w) {
-        t.screenSpacePanning === !0 ? n.setFromMatrixColumn(w, 1) : (n.setFromMatrixColumn(w, 0), n.crossVectors(t.object.up, n)), n.multiplyScalar(v), p.add(n);
+      const a = new S();
+      return function(v, M) {
+        t.screenSpacePanning === !0 ? a.setFromMatrixColumn(M, 1) : (a.setFromMatrixColumn(M, 0), a.crossVectors(t.object.up, a)), a.multiplyScalar(v), p.add(a);
       };
-    }(), A = function() {
-      const n = new S();
-      return function(v, w) {
+    }(), H = function() {
+      const a = new S();
+      return function(v, M) {
         const C = t.domElement;
         if (t.object.isPerspectiveCamera) {
           const F = t.object.position;
-          n.copy(F).sub(t.target);
-          let z = n.length();
-          z *= Math.tan(t.object.fov / 2 * Math.PI / 180), he(2 * v * z / C.clientHeight, t.object.matrix), de(2 * w * z / C.clientHeight, t.object.matrix);
-        } else t.object.isOrthographicCamera ? (he(v * (t.object.right - t.object.left) / t.object.zoom / C.clientWidth, t.object.matrix), de(w * (t.object.top - t.object.bottom) / t.object.zoom / C.clientHeight, t.object.matrix)) : (console.warn("WARNING: OrbitControls.js encountered an unknown camera type - pan disabled."), t.enablePan = !1);
+          a.copy(F).sub(t.target);
+          let z = a.length();
+          z *= Math.tan(t.object.fov / 2 * Math.PI / 180), ce(2 * v * z / C.clientHeight, t.object.matrix), de(2 * M * z / C.clientHeight, t.object.matrix);
+        } else t.object.isOrthographicCamera ? (ce(v * (t.object.right - t.object.left) / t.object.zoom / C.clientWidth, t.object.matrix), de(M * (t.object.top - t.object.bottom) / t.object.zoom / C.clientHeight, t.object.matrix)) : (console.warn("WARNING: OrbitControls.js encountered an unknown camera type - pan disabled."), t.enablePan = !1);
       };
     }();
-    function ie(n) {
-      t.object.isPerspectiveCamera || t.object.isOrthographicCamera ? h /= n : (console.warn("WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled."), t.enableZoom = !1);
+    function se(a) {
+      t.object.isPerspectiveCamera || t.object.isOrthographicCamera ? c /= a : (console.warn("WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled."), t.enableZoom = !1);
     }
-    function pe(n) {
-      t.object.isPerspectiveCamera || t.object.isOrthographicCamera ? h *= n : (console.warn("WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled."), t.enableZoom = !1);
+    function he(a) {
+      t.object.isPerspectiveCamera || t.object.isOrthographicCamera ? c *= a : (console.warn("WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled."), t.enableZoom = !1);
     }
-    function oe(n, g) {
+    function ie(a, g) {
       if (!t.zoomToCursor)
         return;
-      H = !0;
-      const v = t.domElement.getBoundingClientRect(), w = n - v.left, C = g - v.top, F = v.width, z = v.height;
-      k.x = w / F * 2 - 1, k.y = -(C / z) * 2 + 1, Y.set(k.x, k.y, 1).unproject(t.object).sub(t.object.position).normalize();
+      D = !0;
+      const v = t.domElement.getBoundingClientRect(), M = a - v.left, C = g - v.top, F = v.width, z = v.height;
+      T.x = M / F * 2 - 1, T.y = -(C / z) * 2 + 1, G.set(T.x, T.y, 1).unproject(t.object).sub(t.object.position).normalize();
     }
-    function ne(n) {
-      return Math.max(t.minDistance, Math.min(t.maxDistance, n));
+    function oe(a) {
+      return Math.max(t.minDistance, Math.min(t.maxDistance, a));
     }
-    function ge(n) {
-      x.set(n.clientX, n.clientY);
+    function pe(a) {
+      f.set(a.clientX, a.clientY);
     }
-    function je(n) {
-      oe(n.clientX, n.clientX), N.set(n.clientX, n.clientY);
+    function Ae(a) {
+      ie(a.clientX, a.clientX), N.set(a.clientX, a.clientY);
     }
-    function ue(n) {
-      f.set(n.clientX, n.clientY);
+    function ge(a) {
+      y.set(a.clientX, a.clientY);
     }
-    function $e(n) {
-      m.set(n.clientX, n.clientY), u.subVectors(m, x).multiplyScalar(t.rotateSpeed);
+    function je(a) {
+      m.set(a.clientX, a.clientY), u.subVectors(m, f).multiplyScalar(t.rotateSpeed);
       const g = t.domElement;
-      B(2 * Math.PI * u.x / g.clientHeight), Z(2 * Math.PI * u.y / g.clientHeight), x.copy(m), t.update();
+      Y(2 * Math.PI * u.x / g.clientHeight), W(2 * Math.PI * u.y / g.clientHeight), f.copy(m), t.update();
     }
-    function Ge(n) {
-      O.set(n.clientX, n.clientY), R.subVectors(O, N), R.y > 0 ? ie(W(R.y)) : R.y < 0 && pe(W(R.y)), N.copy(O), t.update();
+    function $e(a) {
+      O.set(a.clientX, a.clientY), L.subVectors(O, N), L.y > 0 ? se(q(L.y)) : L.y < 0 && he(q(L.y)), N.copy(O), t.update();
     }
-    function Ye(n) {
-      b.set(n.clientX, n.clientY), M.subVectors(b, f).multiplyScalar(t.panSpeed), A(M.x, M.y), f.copy(b), t.update();
+    function Ge(a) {
+      b.set(a.clientX, a.clientY), w.subVectors(b, y).multiplyScalar(t.panSpeed), H(w.x, w.y), y.copy(b), t.update();
     }
-    function Be(n) {
-      oe(n.clientX, n.clientY), n.deltaY < 0 ? pe(W(n.deltaY)) : n.deltaY > 0 && ie(W(n.deltaY)), t.update();
+    function Ye(a) {
+      ie(a.clientX, a.clientY), a.deltaY < 0 ? he(q(a.deltaY)) : a.deltaY > 0 && se(q(a.deltaY)), t.update();
     }
-    function Ke(n) {
+    function Be(a) {
       let g = !1;
-      switch (n.code) {
+      switch (a.code) {
         case t.keys.UP:
-          n.ctrlKey || n.metaKey || n.shiftKey ? Z(2 * Math.PI * t.rotateSpeed / t.domElement.clientHeight) : A(0, t.keyPanSpeed), g = !0;
+          a.ctrlKey || a.metaKey || a.shiftKey ? W(2 * Math.PI * t.rotateSpeed / t.domElement.clientHeight) : H(0, t.keyPanSpeed), g = !0;
           break;
         case t.keys.BOTTOM:
-          n.ctrlKey || n.metaKey || n.shiftKey ? Z(-2 * Math.PI * t.rotateSpeed / t.domElement.clientHeight) : A(0, -t.keyPanSpeed), g = !0;
+          a.ctrlKey || a.metaKey || a.shiftKey ? W(-2 * Math.PI * t.rotateSpeed / t.domElement.clientHeight) : H(0, -t.keyPanSpeed), g = !0;
           break;
         case t.keys.LEFT:
-          n.ctrlKey || n.metaKey || n.shiftKey ? B(2 * Math.PI * t.rotateSpeed / t.domElement.clientHeight) : A(t.keyPanSpeed, 0), g = !0;
+          a.ctrlKey || a.metaKey || a.shiftKey ? Y(2 * Math.PI * t.rotateSpeed / t.domElement.clientHeight) : H(t.keyPanSpeed, 0), g = !0;
           break;
         case t.keys.RIGHT:
-          n.ctrlKey || n.metaKey || n.shiftKey ? B(-2 * Math.PI * t.rotateSpeed / t.domElement.clientHeight) : A(-t.keyPanSpeed, 0), g = !0;
+          a.ctrlKey || a.metaKey || a.shiftKey ? Y(-2 * Math.PI * t.rotateSpeed / t.domElement.clientHeight) : H(-t.keyPanSpeed, 0), g = !0;
           break;
       }
-      g && (n.preventDefault(), t.update());
+      g && (a.preventDefault(), t.update());
     }
-    function fe(n) {
+    function ue(a) {
       if (E.length === 1)
-        x.set(n.pageX, n.pageY);
+        f.set(a.pageX, a.pageY);
       else {
-        const g = j(n), v = 0.5 * (n.pageX + g.x), w = 0.5 * (n.pageY + g.y);
-        x.set(v, w);
+        const g = A(a), v = 0.5 * (a.pageX + g.x), M = 0.5 * (a.pageY + g.y);
+        f.set(v, M);
       }
     }
-    function me(n) {
+    function fe(a) {
       if (E.length === 1)
-        f.set(n.pageX, n.pageY);
+        y.set(a.pageX, a.pageY);
       else {
-        const g = j(n), v = 0.5 * (n.pageX + g.x), w = 0.5 * (n.pageY + g.y);
-        f.set(v, w);
+        const g = A(a), v = 0.5 * (a.pageX + g.x), M = 0.5 * (a.pageY + g.y);
+        y.set(v, M);
       }
     }
-    function ye(n) {
-      const g = j(n), v = n.pageX - g.x, w = n.pageY - g.y, C = Math.sqrt(v * v + w * w);
+    function me(a) {
+      const g = A(a), v = a.pageX - g.x, M = a.pageY - g.y, C = Math.sqrt(v * v + M * M);
       N.set(0, C);
     }
-    function Ue(n) {
-      t.enableZoom && ye(n), t.enablePan && me(n);
+    function Ke(a) {
+      t.enableZoom && me(a), t.enablePan && fe(a);
     }
-    function _e(n) {
-      t.enableZoom && ye(n), t.enableRotate && fe(n);
+    function Ue(a) {
+      t.enableZoom && me(a), t.enableRotate && ue(a);
     }
-    function xe(n) {
+    function ye(a) {
       if (E.length == 1)
-        m.set(n.pageX, n.pageY);
+        m.set(a.pageX, a.pageY);
       else {
-        const v = j(n), w = 0.5 * (n.pageX + v.x), C = 0.5 * (n.pageY + v.y);
-        m.set(w, C);
+        const v = A(a), M = 0.5 * (a.pageX + v.x), C = 0.5 * (a.pageY + v.y);
+        m.set(M, C);
       }
-      u.subVectors(m, x).multiplyScalar(t.rotateSpeed);
+      u.subVectors(m, f).multiplyScalar(t.rotateSpeed);
       const g = t.domElement;
-      B(2 * Math.PI * u.x / g.clientHeight), Z(2 * Math.PI * u.y / g.clientHeight), x.copy(m);
+      Y(2 * Math.PI * u.x / g.clientHeight), W(2 * Math.PI * u.y / g.clientHeight), f.copy(m);
     }
-    function be(n) {
+    function xe(a) {
       if (E.length === 1)
-        b.set(n.pageX, n.pageY);
+        b.set(a.pageX, a.pageY);
       else {
-        const g = j(n), v = 0.5 * (n.pageX + g.x), w = 0.5 * (n.pageY + g.y);
-        b.set(v, w);
+        const g = A(a), v = 0.5 * (a.pageX + g.x), M = 0.5 * (a.pageY + g.y);
+        b.set(v, M);
       }
-      M.subVectors(b, f).multiplyScalar(t.panSpeed), A(M.x, M.y), f.copy(b);
+      w.subVectors(b, y).multiplyScalar(t.panSpeed), H(w.x, w.y), y.copy(b);
     }
-    function ve(n) {
-      const g = j(n), v = n.pageX - g.x, w = n.pageY - g.y, C = Math.sqrt(v * v + w * w);
-      O.set(0, C), R.set(0, Math.pow(O.y / N.y, t.zoomSpeed)), ie(R.y), N.copy(O);
-      const F = (n.pageX + g.x) * 0.5, z = (n.pageY + g.y) * 0.5;
-      oe(F, z);
+    function be(a) {
+      const g = A(a), v = a.pageX - g.x, M = a.pageY - g.y, C = Math.sqrt(v * v + M * M);
+      O.set(0, C), L.set(0, Math.pow(O.y / N.y, t.zoomSpeed)), se(L.y), N.copy(O);
+      const F = (a.pageX + g.x) * 0.5, z = (a.pageY + g.y) * 0.5;
+      ie(F, z);
     }
-    function Xe(n) {
-      t.enableZoom && ve(n), t.enablePan && be(n);
+    function _e(a) {
+      t.enableZoom && be(a), t.enablePan && xe(a);
     }
-    function Ve(n) {
-      t.enableZoom && ve(n), t.enableRotate && xe(n);
+    function Xe(a) {
+      t.enableZoom && be(a), t.enableRotate && ye(a);
     }
-    function Me(n) {
-      t.enabled !== !1 && (E.length === 0 && (t.domElement.setPointerCapture(n.pointerId), t.domElement.addEventListener("pointermove", ae), t.domElement.addEventListener("pointerup", K)), tt(n), n.pointerType === "touch" ? Je(n) : qe(n));
+    function ve(a) {
+      t.enabled !== !1 && (E.length === 0 && (t.domElement.setPointerCapture(a.pointerId), t.domElement.addEventListener("pointermove", ne), t.domElement.addEventListener("pointerup", B)), et(a), a.pointerType === "touch" ? Qe(a) : Ve(a));
     }
-    function ae(n) {
-      t.enabled !== !1 && (n.pointerType === "touch" ? et(n) : We(n));
+    function ne(a) {
+      t.enabled !== !1 && (a.pointerType === "touch" ? Je(a) : qe(a));
     }
-    function K(n) {
-      st(n), E.length === 0 && (t.domElement.releasePointerCapture(n.pointerId), t.domElement.removeEventListener("pointermove", ae), t.domElement.removeEventListener("pointerup", K)), t.dispatchEvent(Re), o = i.NONE;
+    function B(a) {
+      tt(a), E.length === 0 && (t.domElement.releasePointerCapture(a.pointerId), t.domElement.removeEventListener("pointermove", ne), t.domElement.removeEventListener("pointerup", B)), t.dispatchEvent(Pe), o = i.NONE;
     }
-    function qe(n) {
+    function Ve(a) {
       let g;
-      switch (n.button) {
+      switch (a.button) {
         case 0:
           g = t.mouseButtons.LEFT;
           break;
@@ -314,57 +315,57 @@ class ft extends at {
           g = -1;
       }
       switch (g) {
-        case $.DOLLY:
+        case j.DOLLY:
           if (t.enableZoom === !1) return;
-          je(n), o = i.DOLLY;
+          Ae(a), o = i.DOLLY;
           break;
-        case $.ROTATE:
-          if (n.ctrlKey || n.metaKey || n.shiftKey) {
+        case j.ROTATE:
+          if (a.ctrlKey || a.metaKey || a.shiftKey) {
             if (t.enablePan === !1) return;
-            ue(n), o = i.PAN;
+            ge(a), o = i.PAN;
           } else {
             if (t.enableRotate === !1) return;
-            ge(n), o = i.ROTATE;
+            pe(a), o = i.ROTATE;
           }
           break;
-        case $.PAN:
-          if (n.ctrlKey || n.metaKey || n.shiftKey) {
+        case j.PAN:
+          if (a.ctrlKey || a.metaKey || a.shiftKey) {
             if (t.enableRotate === !1) return;
-            ge(n), o = i.ROTATE;
+            pe(a), o = i.ROTATE;
           } else {
             if (t.enablePan === !1) return;
-            ue(n), o = i.PAN;
+            ge(a), o = i.PAN;
           }
           break;
         default:
           o = i.NONE;
       }
-      o !== i.NONE && t.dispatchEvent(ce);
+      o !== i.NONE && t.dispatchEvent(le);
     }
-    function We(n) {
+    function qe(a) {
       switch (o) {
         case i.ROTATE:
           if (t.enableRotate === !1) return;
-          $e(n);
+          je(a);
           break;
         case i.DOLLY:
           if (t.enableZoom === !1) return;
-          Ge(n);
+          $e(a);
           break;
         case i.PAN:
           if (t.enablePan === !1) return;
-          Ye(n);
+          Ge(a);
           break;
       }
     }
-    function we(n) {
-      t.enabled === !1 || t.enableZoom === !1 || o !== i.NONE || (n.preventDefault(), t.dispatchEvent(ce), Be(Ze(n)), t.dispatchEvent(Re));
+    function we(a) {
+      t.enabled === !1 || t.enableZoom === !1 || o !== i.NONE || (a.preventDefault(), t.dispatchEvent(le), Ye(We(a)), t.dispatchEvent(Pe));
     }
-    function Ze(n) {
-      const g = n.deltaMode, v = {
-        clientX: n.clientX,
-        clientY: n.clientY,
-        deltaY: n.deltaY
+    function We(a) {
+      const g = a.deltaMode, v = {
+        clientX: a.clientX,
+        clientY: a.clientY,
+        deltaY: a.deltaY
       };
       switch (g) {
         case 1:
@@ -374,28 +375,28 @@ class ft extends at {
           v.deltaY *= 100;
           break;
       }
-      return n.ctrlKey && !se && (v.deltaY *= 10), v;
+      return a.ctrlKey && !te && (v.deltaY *= 10), v;
     }
-    function Qe(n) {
-      n.key === "Control" && (se = !0, document.addEventListener("keyup", Ee, { passive: !0, capture: !0 }));
+    function Ze(a) {
+      a.key === "Control" && (te = !0, document.addEventListener("keyup", Me, { passive: !0, capture: !0 }));
     }
-    function Ee(n) {
-      n.key === "Control" && (se = !1, document.removeEventListener("keyup", Ee, { passive: !0, capture: !0 }));
+    function Me(a) {
+      a.key === "Control" && (te = !1, document.removeEventListener("keyup", Me, { passive: !0, capture: !0 }));
     }
-    function re(n) {
-      t.enabled === !1 || t.enablePan === !1 || Ke(n);
+    function ae(a) {
+      t.enabled === !1 || t.enablePan === !1 || Be(a);
     }
-    function Je(n) {
-      switch (Ne(n), E.length) {
+    function Qe(a) {
+      switch (Ce(a), E.length) {
         case 1:
           switch (t.touches.ONE) {
-            case G.ROTATE:
+            case $.ROTATE:
               if (t.enableRotate === !1) return;
-              fe(n), o = i.TOUCH_ROTATE;
+              ue(a), o = i.TOUCH_ROTATE;
               break;
-            case G.PAN:
+            case $.PAN:
               if (t.enablePan === !1) return;
-              me(n), o = i.TOUCH_PAN;
+              fe(a), o = i.TOUCH_PAN;
               break;
             default:
               o = i.NONE;
@@ -403,13 +404,13 @@ class ft extends at {
           break;
         case 2:
           switch (t.touches.TWO) {
-            case G.DOLLY_PAN:
+            case $.DOLLY_PAN:
               if (t.enableZoom === !1 && t.enablePan === !1) return;
-              Ue(n), o = i.TOUCH_DOLLY_PAN;
+              Ke(a), o = i.TOUCH_DOLLY_PAN;
               break;
-            case G.DOLLY_ROTATE:
+            case $.DOLLY_ROTATE:
               if (t.enableZoom === !1 && t.enableRotate === !1) return;
-              _e(n), o = i.TOUCH_DOLLY_ROTATE;
+              Ue(a), o = i.TOUCH_DOLLY_ROTATE;
               break;
             default:
               o = i.NONE;
@@ -418,56 +419,56 @@ class ft extends at {
         default:
           o = i.NONE;
       }
-      o !== i.NONE && t.dispatchEvent(ce);
+      o !== i.NONE && t.dispatchEvent(le);
     }
-    function et(n) {
-      switch (Ne(n), o) {
+    function Je(a) {
+      switch (Ce(a), o) {
         case i.TOUCH_ROTATE:
           if (t.enableRotate === !1) return;
-          xe(n), t.update();
+          ye(a), t.update();
           break;
         case i.TOUCH_PAN:
           if (t.enablePan === !1) return;
-          be(n), t.update();
+          xe(a), t.update();
           break;
         case i.TOUCH_DOLLY_PAN:
           if (t.enableZoom === !1 && t.enablePan === !1) return;
-          Xe(n), t.update();
+          _e(a), t.update();
           break;
         case i.TOUCH_DOLLY_ROTATE:
           if (t.enableZoom === !1 && t.enableRotate === !1) return;
-          Ve(n), t.update();
+          Xe(a), t.update();
           break;
         default:
           o = i.NONE;
       }
     }
-    function Ce(n) {
-      t.enabled !== !1 && n.preventDefault();
+    function Ee(a) {
+      t.enabled !== !1 && a.preventDefault();
     }
-    function tt(n) {
-      E.push(n.pointerId);
+    function et(a) {
+      E.push(a.pointerId);
     }
-    function st(n) {
-      delete q[n.pointerId];
+    function tt(a) {
+      delete V[a.pointerId];
       for (let g = 0; g < E.length; g++)
-        if (E[g] == n.pointerId) {
+        if (E[g] == a.pointerId) {
           E.splice(g, 1);
           return;
         }
     }
-    function Ne(n) {
-      let g = q[n.pointerId];
-      g === void 0 && (g = new T(), q[n.pointerId] = g), g.set(n.pageX, n.pageY);
+    function Ce(a) {
+      let g = V[a.pointerId];
+      g === void 0 && (g = new k(), V[a.pointerId] = g), g.set(a.pageX, a.pageY);
     }
-    function j(n) {
-      const g = n.pointerId === E[0] ? E[1] : E[0];
-      return q[g];
+    function A(a) {
+      const g = a.pointerId === E[0] ? E[1] : E[0];
+      return V[g];
     }
-    t.domElement.addEventListener("contextmenu", Ce), t.domElement.addEventListener("pointerdown", Me), t.domElement.addEventListener("pointercancel", K), t.domElement.addEventListener("wheel", we, { passive: !1 }), document.addEventListener("keydown", Qe, { passive: !0, capture: !0 }), this.update();
+    t.domElement.addEventListener("contextmenu", Ee), t.domElement.addEventListener("pointerdown", ve), t.domElement.addEventListener("pointercancel", B), t.domElement.addEventListener("wheel", we, { passive: !1 }), document.addEventListener("keydown", Ze, { passive: !0, capture: !0 }), this.update();
   }
 }
-class mt {
+class ft {
   constructor(e, s) {
     l(this, "scene");
     l(this, "camera");
@@ -475,35 +476,35 @@ class mt {
     l(this, "controls");
     l(this, "container");
     l(this, "resizeHandler");
-    this.container = e, this.scene = new y.Scene(), this.scene.background = new y.Color(
+    this.container = e, this.scene = new x.Scene(), this.scene.background = new x.Color(
       s.backgroundColor ?? 657930
     );
     const { width: t, height: i } = ke(e), o = s.cameraFov ?? 75;
-    this.camera = new y.PerspectiveCamera(o, t / i, 0.1, 2e3);
-    const a = s.cameraPosition ?? { x: 0, y: 0, z: 80 };
-    this.camera.position.set(a.x, a.y, a.z), this.renderer = new y.WebGLRenderer({
+    this.camera = new x.PerspectiveCamera(o, t / i, 0.1, 2e3);
+    const n = s.cameraPosition ?? { x: 0, y: 0, z: 80 };
+    this.camera.position.set(n.x, n.y, n.z), this.renderer = new x.WebGLRenderer({
       antialias: !0,
       alpha: !0,
       powerPreference: "high-performance"
-    }), this.renderer.setSize(t, i), this.renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2)), this.renderer.toneMapping = y.ACESFilmicToneMapping, this.renderer.toneMappingExposure = 1, this.renderer.shadowMap.enabled = !0, this.renderer.shadowMap.type = y.PCFSoftShadowMap, e.appendChild(this.renderer.domElement), this.controls = new ft(this.camera, this.renderer.domElement), this.controls.enableDamping = !0, this.controls.dampingFactor = 0.05, this.controls.rotateSpeed = 0.8, this.controls.zoomSpeed = 1.2, this.controls.minDistance = 10, this.controls.maxDistance = 2e3, this.setupLighting(), this.resizeHandler = this.onWindowResize.bind(this), window.addEventListener("resize", this.resizeHandler);
+    }), this.renderer.setSize(t, i), this.renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2)), this.renderer.toneMapping = x.ACESFilmicToneMapping, this.renderer.toneMappingExposure = 1, this.renderer.shadowMap.enabled = !0, this.renderer.shadowMap.type = x.PCFSoftShadowMap, e.appendChild(this.renderer.domElement), this.controls = new ut(this.camera, this.renderer.domElement), this.controls.enableDamping = !0, this.controls.dampingFactor = 0.05, this.controls.rotateSpeed = 0.8, this.controls.zoomSpeed = 1.2, this.controls.minDistance = 10, this.controls.maxDistance = 2e3, this.setupLighting(), this.resizeHandler = this.onWindowResize.bind(this), window.addEventListener("resize", this.resizeHandler);
   }
   /**
    * Sets up scene lighting for gradient glass on dark background
    */
   setupLighting() {
-    const e = new y.AmbientLight(16777215, 0.4);
+    const e = new x.AmbientLight(16777215, 0.4);
     this.scene.add(e);
-    const s = new y.DirectionalLight(16777215, 0.9);
+    const s = new x.DirectionalLight(16777215, 0.9);
     s.position.set(50, 60, 40), s.castShadow = !0, s.shadow.mapSize.width = 1024, s.shadow.mapSize.height = 1024, this.scene.add(s);
-    const t = new y.DirectionalLight(16773344, 0.4);
+    const t = new x.DirectionalLight(16773344, 0.4);
     t.position.set(-50, 30, -40), this.scene.add(t);
-    const i = new y.DirectionalLight(16777215, 0.3);
+    const i = new x.DirectionalLight(16777215, 0.3);
     i.position.set(0, -30, -50), this.scene.add(i);
-    const o = new y.PointLight(16750950, 0.5, 150);
+    const o = new x.PointLight(16750950, 0.5, 150);
     o.position.set(40, 20, 40), this.scene.add(o);
-    const a = new y.PointLight(16764057, 0.4, 150);
-    a.position.set(-40, -20, 40), this.scene.add(a);
-    const r = new y.PointLight(6724095, 0.2, 100);
+    const n = new x.PointLight(16764057, 0.4, 150);
+    n.position.set(-40, -20, 40), this.scene.add(n);
+    const r = new x.PointLight(6724095, 0.2, 100);
     r.position.set(0, 40, -40), this.scene.add(r);
   }
   /**
@@ -545,7 +546,7 @@ class mt {
    * Gets the camera's forward direction
    */
   getCameraDirection() {
-    const e = new y.Vector3();
+    const e = new x.Vector3();
     return this.camera.getWorldDirection(e), e;
   }
   /**
@@ -558,7 +559,7 @@ class mt {
     }
   }
 }
-const V = class V {
+const X = class X {
   constructor(e, s) {
     l(this, "sceneManager");
     l(this, "nodeFactory");
@@ -577,18 +578,18 @@ const V = class V {
    * Call this before adding nodes in bulk.
    */
   static setExpectedNodeCount(e) {
-    V.expectedNodeCount = e;
+    X.expectedNodeCount = e;
   }
   /**
    * Adds a node to the graph
    * @returns true if added, false if node already exists or invalid
    */
   addNode(e, s = 0) {
-    if (!He(e))
+    if (!Fe(e))
       return !1;
     if (this.nodes.has(e.id))
       return console.warn(`[ForceGraph3D] Node with id "${e.id}" already exists`), !1;
-    const t = Math.max(50, Math.cbrt(V.expectedNodeCount) * 10), i = e.position ?? {
+    const t = Math.max(50, Math.cbrt(X.expectedNodeCount) * 10), i = e.position ?? {
       x: (Math.random() - 0.5) * t,
       y: (Math.random() - 0.5) * t,
       z: (Math.random() - 0.5) * t
@@ -597,11 +598,11 @@ const V = class V {
       position: i,
       velocity: { x: 0, y: 0, z: 0 },
       mass: 1
-    }, a = this.nodeFactory.createNode(
+    }, n = this.nodeFactory.createNode(
       { ...e, position: i },
       s
     );
-    return this.sceneManager.add(a.group), this.nodes.set(e.id, o), this.nodeObjects.set(e.id, a), !0;
+    return this.sceneManager.add(n.group), this.nodes.set(e.id, o), this.nodeObjects.set(e.id, n), !0;
   }
   /**
    * Removes a node from the graph
@@ -692,16 +693,23 @@ const V = class V {
   }
 };
 // Scale spawn volume with expected graph size
-l(V, "expectedNodeCount", 100);
-let te = V;
-class yt {
+l(X, "expectedNodeCount", 100);
+let ee = X;
+class mt {
   constructor(e, s, t) {
     l(this, "sceneManager");
     l(this, "nodeManager");
     l(this, "edgeFactory");
+    // Full relationship list (includes duplicates between same pair)
     l(this, "edges", []);
+    // One visual line per directed pair (source -> target)
     l(this, "edgeObjects", []);
+    // Tracks which directed pairs currently have at least one relationship
     l(this, "edgeKeySet", /* @__PURE__ */ new Set());
+    // Maps directed pair key to the relationship list for that pair
+    l(this, "edgeGroups", /* @__PURE__ */ new Map());
+    // Maps directed pair key to the corresponding visual line
+    l(this, "edgeObjectMap", /* @__PURE__ */ new Map());
     l(this, "highlightedEdgeKey", null);
     this.sceneManager = e, this.nodeManager = s, this.edgeFactory = t;
   }
@@ -709,12 +717,12 @@ class yt {
    * Checks if an edge exists
    */
   hasEdge(e, s) {
-    const t = D(e, s);
+    const t = this.createDirectedEdgeKey(e, s);
     return this.edgeKeySet.has(t);
   }
   /**
    * Adds an edge to the graph
-   * @returns true if added, false if edge already exists or nodes don't exist
+   * @returns true if added, false if invalid or nodes don't exist
    */
   addEdge(e) {
     if (!De(e))
@@ -723,54 +731,78 @@ class yt {
       return console.warn(`[ForceGraph3D] Source node "${e.source}" does not exist`), !1;
     if (!this.nodeManager.hasNode(e.target))
       return console.warn(`[ForceGraph3D] Target node "${e.target}" does not exist`), !1;
-    const s = D(e.source, e.target);
-    if (this.edgeKeySet.has(s))
-      return console.warn(`[ForceGraph3D] Edge "${e.source}" -> "${e.target}" already exists`), !1;
-    const t = this.nodeManager.getNode(e.source), i = this.nodeManager.getNode(e.target), o = this.edgeFactory.createEdge(
+    const s = this.nodeManager.getNode(e.source), t = this.nodeManager.getNode(e.target), i = this.createDirectedEdgeKey(e.source, e.target);
+    this.edges.push(e);
+    const o = this.edgeGroups.get(i);
+    if (o) {
+      o.push(e);
+      const r = this.edgeObjectMap.get(i);
+      return r && this.updateEdgeUserData(r, o, s, t), !0;
+    }
+    const n = this.edgeFactory.createEdge(
       e,
+      s,
       t,
-      i,
-      t.position,
-      i.position
+      s.position,
+      t.position
     );
-    return this.sceneManager.add(o.line), this.edges.push(e), this.edgeObjects.push(o), this.edgeKeySet.add(s), !0;
+    return this.sceneManager.add(n.line), this.edgeGroups.set(i, [e]), this.edgeObjectMap.set(i, n), this.edgeObjects.push(n), this.edgeKeySet.add(i), this.updateEdgeUserData(n, [e], s, t), !0;
   }
   /**
    * Removes an edge from the graph
+   * Removes one relationship instance for source -> target.
    * @returns true if removed, false if not found
    */
   removeEdge(e, s) {
-    const t = D(e, s);
+    const t = this.createDirectedEdgeKey(e, s);
     if (!this.edgeKeySet.has(t))
       return !1;
     const i = this.edges.findIndex(
-      (a) => D(a.source, a.target) === t
+      (c) => c.source === e && c.target === s
     );
     if (i === -1)
       return !1;
-    const o = this.edgeObjects[i];
-    return this.sceneManager.remove(o.line), this.edgeFactory.disposeEdge(o), this.edges.splice(i, 1), this.edgeObjects.splice(i, 1), this.edgeKeySet.delete(t), this.highlightedEdgeKey === t && (this.highlightedEdgeKey = null), !0;
+    const o = this.edges[i];
+    this.edges.splice(i, 1);
+    const n = this.edgeGroups.get(t);
+    if (!n)
+      return !0;
+    const r = n.findIndex((c) => c === o);
+    if (r !== -1)
+      n.splice(r, 1);
+    else {
+      const c = n.findIndex((p) => p.source === e && p.target === s);
+      c !== -1 && n.splice(c, 1);
+    }
+    const d = this.edgeObjectMap.get(t);
+    if (!d)
+      return !0;
+    if (n.length === 0) {
+      this.sceneManager.remove(d.line), this.edgeFactory.disposeEdge(d);
+      const c = this.edgeObjects.findIndex((p) => p === d);
+      c !== -1 && this.edgeObjects.splice(c, 1), this.edgeGroups.delete(t), this.edgeObjectMap.delete(t), this.edgeKeySet.delete(t), this.highlightedEdgeKey === t && (this.highlightedEdgeKey = null);
+    } else {
+      const c = this.nodeManager.getNode(e), p = this.nodeManager.getNode(s);
+      c && p && this.updateEdgeUserData(d, n, c, p);
+    }
+    return !0;
   }
   /**
    * Highlights an edge
    */
   highlightEdge(e, s) {
-    const t = D(e, s);
+    const t = this.createDirectedEdgeKey(e, s);
     this.highlightedEdgeKey && this.highlightedEdgeKey !== t && this.unhighlightCurrentEdge();
-    const i = this.edges.findIndex(
-      (o) => D(o.source, o.target) === t
-    );
-    i !== -1 && (this.edgeFactory.highlightEdge(this.edgeObjects[i]), this.highlightedEdgeKey = t);
+    const i = this.edgeObjectMap.get(t);
+    i && (this.edgeFactory.highlightEdge(i), this.highlightedEdgeKey = t);
   }
   /**
    * Unhighlights the currently highlighted edge
    */
   unhighlightCurrentEdge() {
     if (!this.highlightedEdgeKey) return;
-    const e = this.edges.findIndex(
-      (s) => D(s.source, s.target) === this.highlightedEdgeKey
-    );
-    e !== -1 && this.edgeFactory.unhighlightEdge(this.edgeObjects[e]), this.highlightedEdgeKey = null;
+    const e = this.edgeObjectMap.get(this.highlightedEdgeKey);
+    e && this.edgeFactory.unhighlightEdge(e), this.highlightedEdgeKey = null;
   }
   /**
    * Removes all edges connected to a node
@@ -802,12 +834,12 @@ class yt {
    * Updates all edge positions based on current node positions
    */
   updateEdgePositions() {
-    this.edgeObjects.forEach((e, s) => {
-      const t = this.edges[s], i = this.nodeManager.getNode(t.source), o = this.nodeManager.getNode(t.target);
-      i && o && this.edgeFactory.updateEdgePositions(
+    this.edgeObjects.forEach((e) => {
+      const s = this.nodeManager.getNode(e.source), t = this.nodeManager.getNode(e.target);
+      s && t && this.edgeFactory.updateEdgePositions(
         e,
-        i.position,
-        o.position
+        s.position,
+        t.position
       );
     });
   }
@@ -835,7 +867,29 @@ class yt {
   clear() {
     this.edgeObjects.forEach((e) => {
       this.sceneManager.remove(e.line), this.edgeFactory.disposeEdge(e);
-    }), this.edges = [], this.edgeObjects = [], this.edgeKeySet.clear(), this.highlightedEdgeKey = null;
+    }), this.edges = [], this.edgeObjects = [], this.edgeKeySet.clear(), this.edgeGroups.clear(), this.edgeObjectMap.clear(), this.highlightedEdgeKey = null;
+  }
+  /**
+   * Creates a directed key (source -> target)
+   */
+  createDirectedEdgeKey(e, s) {
+    return `${e}->${s}`;
+  }
+  /**
+   * Syncs relationship metadata to the line for hover/click UI
+   */
+  updateEdgeUserData(e, s, t, i) {
+    const o = s[0];
+    e.line.userData = {
+      ...e.line.userData,
+      source: e.source,
+      target: e.target,
+      edge: o,
+      relationships: [...s],
+      relationshipCount: s.length,
+      sourceNode: t,
+      targetNode: i
+    };
   }
   /**
    * Dispose resources
@@ -844,7 +898,7 @@ class yt {
     this.clear();
   }
 }
-class Le {
+class Re {
   constructor(e, s, t = {}) {
     l(this, "nodes");
     l(this, "edges");
@@ -880,17 +934,19 @@ class Le {
     const e = /* @__PURE__ */ new Map();
     for (const i of this.edges)
       e.set(i.source, (e.get(i.source) || 0) + 1), e.set(i.target, (e.get(i.target) || 0) + 1);
+    console.log(`[ForceGraph3D] initializeNodeMassAndPin: ${this.edges.length} edges, ${this.nodes.size} nodes, ${e.size} unique endpoints`);
     let s = 0, t = null;
     for (const [i, o] of e) {
       o > s && (s = o, t = i);
-      const a = this.nodes.get(i);
-      a && (a.mass = 1 + Math.log2(1 + o));
+      const n = this.nodes.get(i);
+      n && (n.mass = 1 + Math.log2(1 + o));
     }
-    if (t && s > 10) {
+    if (console.log(`[ForceGraph3D] Hub detected: id="${t}", degree=${s}, threshold=10`), t && s > 10) {
       this.pinnedNodeId = t;
       const i = this.nodes.get(t);
-      i && (i.position.x = 0, i.position.y = 0, i.position.z = 0, i.velocity.x = 0, i.velocity.y = 0, i.velocity.z = 0);
-    }
+      i ? (i.position.x = 0, i.position.y = 0, i.position.z = 0, i.velocity.x = 0, i.velocity.y = 0, i.velocity.z = 0, console.log(`[ForceGraph3D] ✅ Hub node "${t}" pinned at origin`)) : console.warn(`[ForceGraph3D] ⚠️ Hub node "${t}" found in edges but NOT in nodes map!`);
+    } else
+      console.log(`[ForceGraph3D] No hub pinned (maxDegree=${s} <= 10 or hubId=${t})`);
   }
   /**
    * Computes effective repulsion strength scaled by node count.
@@ -915,13 +971,13 @@ class Le {
     const e = Array.from(this.nodes.values()), s = e.length, t = this.getEffectiveRepulsion();
     for (let i = 0; i < s; i++) {
       const o = e[i];
-      for (let a = i + 1; a < s; a++) {
-        const r = e[a], c = r.position.x - o.position.x, h = r.position.y - o.position.y, p = r.position.z - o.position.z;
-        let x = c * c + h * h + p * p;
-        if (x > this.REPULSION_CUTOFF_SQ) continue;
-        x < 0.01 && (x = 0.01);
-        const m = Math.sqrt(x), u = t * this.alpha / x, f = c / m * u, b = h / m * u, M = p / m * u;
-        o.velocity.x -= f / o.mass, o.velocity.y -= b / o.mass, o.velocity.z -= M / o.mass, r.velocity.x += f / r.mass, r.velocity.y += b / r.mass, r.velocity.z += M / r.mass;
+      for (let n = i + 1; n < s; n++) {
+        const r = e[n], d = r.position.x - o.position.x, c = r.position.y - o.position.y, p = r.position.z - o.position.z;
+        let f = d * d + c * c + p * p;
+        if (f > this.REPULSION_CUTOFF_SQ) continue;
+        f < 0.01 && (f = 0.01);
+        const m = Math.sqrt(f), u = t * this.alpha / f, y = d / m * u, b = c / m * u, w = p / m * u;
+        o.velocity.x -= y / o.mass, o.velocity.y -= b / o.mass, o.velocity.z -= w / o.mass, r.velocity.x += y / r.mass, r.velocity.y += b / r.mass, r.velocity.z += w / r.mass;
       }
     }
   }
@@ -929,7 +985,7 @@ class Le {
    * Barnes-Hut approximation - O(n log n)
    */
   calculateRepulsionBarnesHut() {
-    const e = Array.from(this.nodes.values()), s = new xt(e);
+    const e = Array.from(this.nodes.values()), s = new yt(e);
     for (const t of e)
       this.calculateForceFromOctree(t, s.root);
   }
@@ -942,26 +998,26 @@ class Le {
       return;
     }
     if (s.mass === 0) return;
-    const t = s.centerOfMass.x - e.position.x, i = s.centerOfMass.y - e.position.y, o = s.centerOfMass.z - e.position.z, a = t * t + i * i + o * o;
-    if (a > this.REPULSION_CUTOFF_SQ) return;
-    const r = Math.sqrt(a), c = this.getEffectiveRepulsion();
+    const t = s.centerOfMass.x - e.position.x, i = s.centerOfMass.y - e.position.y, o = s.centerOfMass.z - e.position.z, n = t * t + i * i + o * o;
+    if (n > this.REPULSION_CUTOFF_SQ) return;
+    const r = Math.sqrt(n), d = this.getEffectiveRepulsion();
     if (r > 0 && s.size / r < this.barnesHutTheta) {
-      const h = Math.max(a, 0.01), p = c * this.alpha * s.mass / h;
+      const c = Math.max(n, 0.01), p = d * this.alpha * s.mass / c;
       e.velocity.x -= t / r * p / e.mass, e.velocity.y -= i / r * p / e.mass, e.velocity.z -= o / r * p / e.mass;
     } else
-      for (const h of s.children)
-        h && this.calculateForceFromOctree(e, h);
+      for (const c of s.children)
+        c && this.calculateForceFromOctree(e, c);
   }
   /**
    * Apply repulsion between two nodes (with cutoff)
    */
   applyRepulsionBetween(e, s) {
     const t = s.position.x - e.position.x, i = s.position.y - e.position.y, o = s.position.z - e.position.z;
-    let a = t * t + i * i + o * o;
-    if (a > this.REPULSION_CUTOFF_SQ) return;
-    a < 0.01 && (a = 0.01);
-    const r = Math.sqrt(a), h = this.getEffectiveRepulsion() * this.alpha / a;
-    e.velocity.x -= t / r * h / e.mass, e.velocity.y -= i / r * h / e.mass, e.velocity.z -= o / r * h / e.mass;
+    let n = t * t + i * i + o * o;
+    if (n > this.REPULSION_CUTOFF_SQ) return;
+    n < 0.01 && (n = 0.01);
+    const r = Math.sqrt(n), c = this.getEffectiveRepulsion() * this.alpha / n;
+    e.velocity.x -= t / r * c / e.mass, e.velocity.y -= i / r * c / e.mass, e.velocity.z -= o / r * c / e.mass;
   }
   /**
    * Calculate attraction forces along edges
@@ -971,10 +1027,10 @@ class Le {
     for (const t of this.edges) {
       const i = this.nodes.get(t.source), o = this.nodes.get(t.target);
       if (!i || !o) continue;
-      const a = o.position.x - i.position.x, r = o.position.y - i.position.y, c = o.position.z - i.position.z, h = Math.sqrt(a * a + r * r + c * c);
-      if (h < 0.01) continue;
-      const x = (h - 15) * this.attractionStrength * s * this.alpha, m = a / h * x, u = r / h * x, f = c / h * x;
-      i.velocity.x += m / i.mass, i.velocity.y += u / i.mass, i.velocity.z += f / i.mass, o.velocity.x -= m / o.mass, o.velocity.y -= u / o.mass, o.velocity.z -= f / o.mass;
+      const n = o.position.x - i.position.x, r = o.position.y - i.position.y, d = o.position.z - i.position.z, c = Math.sqrt(n * n + r * r + d * d);
+      if (c < 0.01) continue;
+      const f = (c - 15) * this.attractionStrength * s * this.alpha, m = n / c * f, u = r / c * f, y = d / c * f;
+      i.velocity.x += m / i.mass, i.velocity.y += u / i.mass, i.velocity.z += y / i.mass, o.velocity.x -= m / o.mass, o.velocity.y -= u / o.mass, o.velocity.z -= y / o.mass;
     }
   }
   /**
@@ -1031,7 +1087,7 @@ class Le {
     e.repulsionStrength !== void 0 && (this.repulsionStrength = e.repulsionStrength), e.attractionStrength !== void 0 && (this.attractionStrength = e.attractionStrength), e.damping !== void 0 && (this.damping = e.damping);
   }
 }
-class xt {
+class yt {
   constructor(e) {
     l(this, "root");
     const s = this.calculateBounds(e);
@@ -1067,54 +1123,54 @@ class xt {
       };
     if (e.length === 1 || t > 20) {
       let u = 0;
-      const f = { x: 0, y: 0, z: 0 };
+      const y = { x: 0, y: 0, z: 0 };
       for (const b of e)
-        u += b.mass, f.x += b.position.x * b.mass, f.y += b.position.y * b.mass, f.z += b.position.z * b.mass;
-      return u > 0 && (f.x /= u, f.y /= u, f.z /= u), {
+        u += b.mass, y.x += b.position.x * b.mass, y.y += b.position.y * b.mass, y.z += b.position.z * b.mass;
+      return u > 0 && (y.x /= u, y.y /= u, y.z /= u), {
         bounds: s,
         size: i,
-        centerOfMass: f,
+        centerOfMass: y,
         mass: u,
         isLeaf: !0,
         node: e[0],
         children: []
       };
     }
-    const o = (s.min.x + s.max.x) / 2, a = (s.min.y + s.max.y) / 2, r = (s.min.z + s.max.z) / 2, c = [[], [], [], [], [], [], [], []];
+    const o = (s.min.x + s.max.x) / 2, n = (s.min.y + s.max.y) / 2, r = (s.min.z + s.max.z) / 2, d = [[], [], [], [], [], [], [], []];
     for (const u of e) {
-      const f = (u.position.x >= o ? 1 : 0) + (u.position.y >= a ? 2 : 0) + (u.position.z >= r ? 4 : 0);
-      c[f].push(u);
-    }
-    const h = [
-      { min: { x: s.min.x, y: s.min.y, z: s.min.z }, max: { x: o, y: a, z: r } },
-      { min: { x: o, y: s.min.y, z: s.min.z }, max: { x: s.max.x, y: a, z: r } },
-      { min: { x: s.min.x, y: a, z: s.min.z }, max: { x: o, y: s.max.y, z: r } },
-      { min: { x: o, y: a, z: s.min.z }, max: { x: s.max.x, y: s.max.y, z: r } },
-      { min: { x: s.min.x, y: s.min.y, z: r }, max: { x: o, y: a, z: s.max.z } },
-      { min: { x: o, y: s.min.y, z: r }, max: { x: s.max.x, y: a, z: s.max.z } },
-      { min: { x: s.min.x, y: a, z: r }, max: { x: o, y: s.max.y, z: s.max.z } },
-      { min: { x: o, y: a, z: r }, max: { x: s.max.x, y: s.max.y, z: s.max.z } }
+      const y = (u.position.x >= o ? 1 : 0) + (u.position.y >= n ? 2 : 0) + (u.position.z >= r ? 4 : 0);
+      d[y].push(u);
+    }
+    const c = [
+      { min: { x: s.min.x, y: s.min.y, z: s.min.z }, max: { x: o, y: n, z: r } },
+      { min: { x: o, y: s.min.y, z: s.min.z }, max: { x: s.max.x, y: n, z: r } },
+      { min: { x: s.min.x, y: n, z: s.min.z }, max: { x: o, y: s.max.y, z: r } },
+      { min: { x: o, y: n, z: s.min.z }, max: { x: s.max.x, y: s.max.y, z: r } },
+      { min: { x: s.min.x, y: s.min.y, z: r }, max: { x: o, y: n, z: s.max.z } },
+      { min: { x: o, y: s.min.y, z: r }, max: { x: s.max.x, y: n, z: s.max.z } },
+      { min: { x: s.min.x, y: n, z: r }, max: { x: o, y: s.max.y, z: s.max.z } },
+      { min: { x: o, y: n, z: r }, max: { x: s.max.x, y: s.max.y, z: s.max.z } }
     ], p = [];
-    let x = 0;
+    let f = 0;
     const m = { x: 0, y: 0, z: 0 };
     for (let u = 0; u < 8; u++)
-      if (c[u].length > 0) {
-        const f = this.buildTree(c[u], h[u], t + 1);
-        p.push(f), x += f.mass, m.x += f.centerOfMass.x * f.mass, m.y += f.centerOfMass.y * f.mass, m.z += f.centerOfMass.z * f.mass;
+      if (d[u].length > 0) {
+        const y = this.buildTree(d[u], c[u], t + 1);
+        p.push(y), f += y.mass, m.x += y.centerOfMass.x * y.mass, m.y += y.centerOfMass.y * y.mass, m.z += y.centerOfMass.z * y.mass;
       } else
         p.push(null);
-    return x > 0 && (m.x /= x, m.y /= x, m.z /= x), {
+    return f > 0 && (m.x /= f, m.y /= f, m.z /= f), {
       bounds: s,
       size: i,
       centerOfMass: m,
-      mass: x,
+      mass: f,
       isLeaf: !1,
       node: null,
       children: p
     };
   }
 }
-class bt {
+class xt {
   constructor(e, s, t, i = 60) {
     l(this, "sceneManager");
     l(this, "animationId", null);
@@ -1179,7 +1235,7 @@ class bt {
     this.stop();
   }
 }
-class vt {
+class bt {
   constructor() {
     l(this, "envMap", null);
     l(this, "materialCache", /* @__PURE__ */ new Map());
@@ -1220,7 +1276,7 @@ class vt {
     for (const i of t) {
       const o = document.createElement("canvas");
       o.width = 256, o.height = 256;
-      const a = o.getContext("2d"), r = a.createRadialGradient(
+      const n = o.getContext("2d"), r = n.createRadialGradient(
         256 / 2,
         256 / 2,
         0,
@@ -1228,15 +1284,15 @@ class vt {
         256 / 2,
         256 * 0.8
       );
-      r.addColorStop(0, i.colors[0]), r.addColorStop(0.5, i.colors[1]), r.addColorStop(1, i.colors[2]), a.fillStyle = r, a.fillRect(0, 0, 256, 256);
-      const c = a.getImageData(0, 0, 256, 256);
-      for (let h = 0; h < c.data.length; h += 4) {
+      r.addColorStop(0, i.colors[0]), r.addColorStop(0.5, i.colors[1]), r.addColorStop(1, i.colors[2]), n.fillStyle = r, n.fillRect(0, 0, 256, 256);
+      const d = n.getImageData(0, 0, 256, 256);
+      for (let c = 0; c < d.data.length; c += 4) {
         const p = (Math.random() - 0.5) * 5;
-        c.data[h] = Math.min(255, Math.max(0, c.data[h] + p)), c.data[h + 1] = Math.min(255, Math.max(0, c.data[h + 1] + p)), c.data[h + 2] = Math.min(255, Math.max(0, c.data[h + 2] + p));
+        d.data[c] = Math.min(255, Math.max(0, d.data[c] + p)), d.data[c + 1] = Math.min(255, Math.max(0, d.data[c + 1] + p)), d.data[c + 2] = Math.min(255, Math.max(0, d.data[c + 2] + p));
       }
-      a.putImageData(c, 0, 0), s.push(o);
+      n.putImageData(d, 0, 0), s.push(o);
     }
-    this.envMap = new y.CubeTexture(s.map((i) => {
+    this.envMap = new x.CubeTexture(s.map((i) => {
       const o = new Image();
       return o.src = i.toDataURL(), o;
     })), this.envMap.needsUpdate = !0;
@@ -1255,11 +1311,11 @@ class vt {
     const t = "glass-single";
     if (this.materialCache.has(t))
       return this.materialCache.get(t).clone();
-    const i = new y.Color(16750950), o = new y.ShaderMaterial({
+    const i = new x.Color(16750950), o = new x.ShaderMaterial({
       uniforms: {
         uColor: { value: i },
         uEnvMap: { value: this.envMap },
-        uGlowColor: { value: new y.Color(16777215) },
+        uGlowColor: { value: new x.Color(16777215) },
         uGlowIntensity: { value: 0.8 },
         uReflectivity: { value: 0.4 },
         uFresnelPower: { value: 2.5 }
@@ -1325,9 +1381,9 @@ class vt {
                 }
             `,
       transparent: !0,
-      side: y.FrontSide,
+      side: x.FrontSide,
       depthWrite: !0,
-      blending: y.NormalBlending
+      blending: x.NormalBlending
     });
     return this.materialCache.set(t, o), o.clone();
   }
@@ -1335,7 +1391,7 @@ class vt {
    * Creates material for edges (light color for dark background)
    */
   createEdgeMaterial(e = 6710886, s = 0.4) {
-    return new y.LineBasicMaterial({
+    return new x.LineBasicMaterial({
       color: e,
       transparent: !0,
       opacity: s,
@@ -1346,7 +1402,7 @@ class vt {
    * Creates highlighted edge material
    */
   createHighlightedEdgeMaterial() {
-    return new y.LineBasicMaterial({
+    return new x.LineBasicMaterial({
       color: 16750950,
       // Tangerine highlight
       transparent: !1,
@@ -1360,10 +1416,10 @@ class vt {
   createLabelMaterial(e, s = 24) {
     const t = document.createElement("canvas"), i = t.getContext("2d");
     i.font = `600 ${s}px Inter, -apple-system, sans-serif`;
-    const a = i.measureText(e).width;
-    t.width = Math.max(128, a + 24), t.height = s + 20, i.clearRect(0, 0, t.width, t.height), i.font = `600 ${s}px Inter, -apple-system, sans-serif`, i.textAlign = "center", i.textBaseline = "middle", i.shadowColor = "rgba(0, 0, 0, 0.8)", i.shadowBlur = 4, i.shadowOffsetX = 1, i.shadowOffsetY = 1, i.fillStyle = "rgba(255, 255, 255, 0.95)", i.fillText(e, t.width / 2, t.height / 2);
-    const r = new y.CanvasTexture(t);
-    return r.needsUpdate = !0, new y.SpriteMaterial({
+    const n = i.measureText(e).width;
+    t.width = Math.max(128, n + 24), t.height = s + 20, i.clearRect(0, 0, t.width, t.height), i.font = `600 ${s}px Inter, -apple-system, sans-serif`, i.textAlign = "center", i.textBaseline = "middle", i.shadowColor = "rgba(0, 0, 0, 0.8)", i.shadowBlur = 4, i.shadowOffsetX = 1, i.shadowOffsetY = 1, i.fillStyle = "rgba(255, 255, 255, 0.95)", i.fillText(e, t.width / 2, t.height / 2);
+    const r = new x.CanvasTexture(t);
+    return r.needsUpdate = !0, new x.SpriteMaterial({
       map: r,
       transparent: !0,
       depthTest: !1,
@@ -1383,7 +1439,7 @@ class vt {
     this.materialCache.forEach((e) => e.dispose()), this.materialCache.clear(), this.envMap && this.envMap.dispose();
   }
 }
-class Mt {
+class vt {
   constructor(e, s = 2, t = [32, 16, 8], i = 16750950) {
     l(this, "materialFactory");
     l(this, "geometryCache", /* @__PURE__ */ new Map());
@@ -1400,7 +1456,7 @@ class Mt {
       const t = `lod-${s}`;
       this.geometryCache.set(
         t,
-        new y.SphereGeometry(this.nodeRadius, e, e)
+        new x.SphereGeometry(this.nodeRadius, e, e)
       );
     });
   }
@@ -1415,21 +1471,21 @@ class Mt {
    * Creates a node visual (glass ball + label)
    */
   createNode(e, s = 0) {
-    const t = new y.Group();
+    const t = new x.Group();
     t.name = `node-${e.id}`, t.userData = { nodeId: e.id, nodeData: e };
     const i = this.getGeometry(s), o = this.materialFactory.createGlassMaterial(
       e.color ?? this.defaultNodeColor
-    ), a = new y.Mesh(i, o);
-    a.castShadow = !0, a.receiveShadow = !0, t.add(a);
-    const r = this.materialFactory.createLabelMaterial(e.label), c = new y.Sprite(r);
-    return c.position.y = this.nodeRadius + 1.5, c.scale.set(4, 1, 1), t.add(c), e.position && t.position.set(
+    ), n = new x.Mesh(i, o);
+    n.castShadow = !0, n.receiveShadow = !0, t.add(n);
+    const r = this.materialFactory.createLabelMaterial(e.label), d = new x.Sprite(r);
+    return d.position.y = this.nodeRadius + 1.5, d.scale.set(4, 1, 1), t.add(d), e.position && t.position.set(
       e.position.x,
       e.position.y,
       e.position.z
     ), {
       group: t,
-      sphere: a,
-      label: c,
+      sphere: n,
+      label: d,
       lodLevel: s
     };
   }
@@ -1445,19 +1501,19 @@ class Mt {
    * Updates the color of a node
    */
   updateNodeColor(e, s) {
-    e.sphere.material instanceof y.Material && e.sphere.material.dispose(), e.sphere.material = this.materialFactory.createGlassMaterial(s);
+    e.sphere.material instanceof x.Material && e.sphere.material.dispose(), e.sphere.material = this.materialFactory.createGlassMaterial(s);
   }
   /**
    * Updates the label of a node
    */
   updateNodeLabel(e, s) {
-    e.label.material instanceof y.SpriteMaterial && (e.label.material.map && e.label.material.map.dispose(), e.label.material.dispose()), e.label.material = this.materialFactory.createLabelMaterial(s);
+    e.label.material instanceof x.SpriteMaterial && (e.label.material.map && e.label.material.map.dispose(), e.label.material.dispose()), e.label.material = this.materialFactory.createLabelMaterial(s);
   }
   /**
    * Disposes a node's resources
    */
   disposeNode(e) {
-    e.sphere.material instanceof y.Material && e.sphere.material.dispose(), e.label.material instanceof y.SpriteMaterial && (e.label.material.map && e.label.material.map.dispose(), e.label.material.dispose());
+    e.sphere.material instanceof x.Material && e.sphere.material.dispose(), e.label.material instanceof x.SpriteMaterial && (e.label.material.map && e.label.material.map.dispose(), e.label.material.dispose());
   }
   /**
    * Dispose factory resources
@@ -1494,7 +1550,7 @@ class wt {
    * Creates an edge line between two positions
    */
   createEdge(e, s, t, i, o) {
-    const a = new y.BufferGeometry(), r = new Float32Array([
+    const n = new x.BufferGeometry(), r = new Float32Array([
       i.x,
       i.y,
       i.z,
@@ -1502,16 +1558,16 @@ class wt {
       o.y,
       o.z
     ]);
-    a.setAttribute("position", new y.BufferAttribute(r, 3));
-    const c = this.getDefaultMaterial().clone(), h = new y.Line(a, c);
-    return h.name = `edge-${e.source}-${e.target}`, h.userData = {
+    n.setAttribute("position", new x.BufferAttribute(r, 3));
+    const d = this.getDefaultMaterial().clone(), c = new x.Line(n, d);
+    return c.name = `edge-${e.source}-${e.target}`, c.userData = {
       source: e.source,
       target: e.target,
       edge: e,
       sourceNode: s,
       targetNode: t
-    }, h.frustumCulled = !0, {
-      line: h,
+    }, c.frustumCulled = !0, {
+      line: c,
       source: e.source,
       target: e.target
     };
@@ -1520,13 +1576,13 @@ class wt {
    * Highlights an edge
    */
   highlightEdge(e) {
-    e.line.material instanceof y.Material && e.line.material.dispose(), e.line.material = this.getHighlightMaterial().clone();
+    e.line.material instanceof x.Material && e.line.material.dispose(), e.line.material = this.getHighlightMaterial().clone();
   }
   /**
    * Resets an edge to default appearance
    */
   unhighlightEdge(e) {
-    e.line.material instanceof y.Material && e.line.material.dispose(), e.line.material = this.getDefaultMaterial().clone();
+    e.line.material instanceof x.Material && e.line.material.dispose(), e.line.material = this.getDefaultMaterial().clone();
   }
   /**
    * Updates an edge's positions
@@ -1539,7 +1595,7 @@ class wt {
    * Disposes an edge's resources
    */
   disposeEdge(e) {
-    e.line.geometry.dispose(), e.line.material instanceof y.Material && e.line.material.dispose();
+    e.line.geometry.dispose(), e.line.material instanceof x.Material && e.line.material.dispose();
   }
   /**
    * Dispose factory resources
@@ -1548,7 +1604,7 @@ class wt {
     this.defaultMaterial && this.defaultMaterial.dispose(), this.highlightMaterial && this.highlightMaterial.dispose();
   }
 }
-class Et {
+class Mt {
   constructor(e, s = [50, 100, 200], t = !0) {
     l(this, "camera");
     l(this, "lodDistances");
@@ -1560,9 +1616,9 @@ class Et {
    */
   getLODLevel(e) {
     if (!this.enabled)
-      return X.HIGH;
+      return _.HIGH;
     const s = e.x - this.camera.position.x, t = e.y - this.camera.position.y, i = e.z - this.camera.position.z, o = Math.sqrt(s * s + t * t + i * i);
-    return o < this.lodDistances[0] ? X.HIGH : o < this.lodDistances[1] ? X.MEDIUM : X.LOW;
+    return o < this.lodDistances[0] ? _.HIGH : o < this.lodDistances[1] ? _.MEDIUM : _.LOW;
   }
   /**
    * Checks if a node should be visible based on distance
@@ -1584,13 +1640,13 @@ class Et {
     this.enabled = e;
   }
 }
-class Ct {
+class Et {
   constructor(e, s = !0) {
     l(this, "camera");
     l(this, "frustum");
     l(this, "projScreenMatrix");
     l(this, "enabled");
-    this.camera = e, this.frustum = new y.Frustum(), this.projScreenMatrix = new y.Matrix4(), this.enabled = s;
+    this.camera = e, this.frustum = new x.Frustum(), this.projScreenMatrix = new x.Matrix4(), this.enabled = s;
   }
   /**
    * Updates the frustum from the camera
@@ -1606,7 +1662,7 @@ class Ct {
    */
   isPointVisible(e) {
     if (!this.enabled) return !0;
-    const s = new y.Vector3(e.x, e.y, e.z);
+    const s = new x.Vector3(e.x, e.y, e.z);
     return this.frustum.containsPoint(s);
   }
   /**
@@ -1614,8 +1670,8 @@ class Ct {
    */
   isSphereVisible(e, s) {
     if (!this.enabled) return !0;
-    const t = new y.Sphere(
-      new y.Vector3(e.x, e.y, e.z),
+    const t = new x.Sphere(
+      new x.Vector3(e.x, e.y, e.z),
       s
     );
     return this.frustum.intersectsSphere(t);
@@ -1625,14 +1681,14 @@ class Ct {
    */
   isLineVisible(e, s) {
     if (!this.enabled) return !0;
-    const t = new y.Vector3(e.x, e.y, e.z), i = new y.Vector3(s.x, s.y, s.z);
+    const t = new x.Vector3(e.x, e.y, e.z), i = new x.Vector3(s.x, s.y, s.z);
     if (this.frustum.containsPoint(t) || this.frustum.containsPoint(i))
       return !0;
-    const o = new y.Vector3(
+    const o = new x.Vector3(
       (e.x + s.x) / 2,
       (e.y + s.y) / 2,
       (e.z + s.z) / 2
-    ), a = o.distanceTo(t), r = new y.Sphere(o, a);
+    ), n = o.distanceTo(t), r = new x.Sphere(o, n);
     return this.frustum.intersectsSphere(r);
   }
   /**
@@ -1642,7 +1698,7 @@ class Ct {
     this.enabled = e;
   }
 }
-class Nt {
+class Ct {
   constructor(e, s) {
     l(this, "sceneManager");
     l(this, "raycaster");
@@ -1656,7 +1712,7 @@ class Nt {
     l(this, "hoveredEdgeKey", null);
     l(this, "nodeObjects", []);
     l(this, "edgeObjects", []);
-    this.sceneManager = e, this.container = s, this.raycaster = new y.Raycaster(), this.raycaster.params.Line = { threshold: 1.5 }, this.mouse = new y.Vector2(), this.handleClick = this.handleClick.bind(this), this.handleMouseMove = this.handleMouseMove.bind(this), s.addEventListener("click", this.handleClick), s.addEventListener("mousemove", this.handleMouseMove);
+    this.sceneManager = e, this.container = s, this.raycaster = new x.Raycaster(), this.raycaster.params.Line = { threshold: 1.5 }, this.mouse = new x.Vector2(), this.handleClick = this.handleClick.bind(this), this.handleMouseMove = this.handleMouseMove.bind(this), s.addEventListener("click", this.handleClick), s.addEventListener("mousemove", this.handleMouseMove);
   }
   /**
    * Updates the list of node objects to raycast against
@@ -1745,13 +1801,17 @@ class Nt {
     const t = this.raycaster.intersectObjects(this.edgeObjects, !1);
     if (t.length > 0) {
       const i = t[0].object, o = i.userData;
-      if (o != null && o.edge && (o != null && o.sourceNode) && (o != null && o.targetNode))
+      if (o != null && o.edge && (o != null && o.sourceNode) && (o != null && o.targetNode)) {
+        const n = Array.isArray(o.relationships) ? o.relationships : [o.edge];
         return {
           edge: o.edge,
+          relationships: n,
+          relationshipCount: typeof o.relationshipCount == "number" ? o.relationshipCount : n.length,
           sourceNode: o.sourceNode,
           targetNode: o.targetNode,
           edgeLine: i
         };
+      }
     }
     return null;
   }
@@ -1764,11 +1824,11 @@ class Nt {
     this.mouse.x = (e - t.left) / t.width * 2 - 1, this.mouse.y = -((s - t.top) / t.height) * 2 + 1, this.raycaster.setFromCamera(this.mouse, this.sceneManager.camera);
     const i = this.raycaster.intersectObjects(this.nodeObjects, !0);
     if (i.length > 0) {
-      let a = i[0].object;
-      for (; a; ) {
-        if ((o = a.userData) != null && o.nodeId)
-          return a.userData.nodeId;
-        a = a.parent;
+      let n = i[0].object;
+      for (; n; ) {
+        if ((o = n.userData) != null && o.nodeId)
+          return n.userData.nodeId;
+        n = n.parent;
       }
     }
     return null;
@@ -1780,7 +1840,7 @@ class Nt {
     this.container.removeEventListener("click", this.handleClick), this.container.removeEventListener("mousemove", this.handleMouseMove);
   }
 }
-class St {
+class Nt {
   constructor(e) {
     l(this, "container");
     l(this, "panel", null);
@@ -1803,17 +1863,15 @@ class St {
       width: 280px;
       max-height: 80vh;
       overflow-y: auto;
-      background: rgba(15, 15, 25, 0.85);
+      background: rgba(255, 255, 255, 0.08);
       backdrop-filter: blur(20px);
       -webkit-backdrop-filter: blur(20px);
-      border: 1px solid rgba(255, 255, 255, 0.1);
-      border-radius: 16px;
+      border: 1px solid rgba(255, 255, 255, 0.12);
+      border-radius: 12px;
       padding: 24px;
       color: white;
-      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
-      box-shadow: 
-        0 8px 32px rgba(0, 0, 0, 0.4),
-        inset 0 0 0 1px rgba(255, 255, 255, 0.05);
+      font-family: inherit;
+      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
       z-index: 1000;
       opacity: 0;
       pointer-events: none;
@@ -1857,8 +1915,8 @@ class St {
         this.onExpand(this.currentNodeId, r);
       }
     });
-    const a = this.panel.querySelector('[data-action="close"]');
-    a && a.addEventListener("click", () => {
+    const n = this.panel.querySelector('[data-action="close"]');
+    n && n.addEventListener("click", () => {
       this.hide();
     }), this.panel.style.opacity = "1", this.panel.style.pointerEvents = "auto", this.panel.style.transform = "translateY(-50%) translateX(0)", this.visible = !0;
   }
@@ -1871,8 +1929,8 @@ class St {
       <style>
         .force-graph-panel h2 {
           margin: 0 0 16px 0;
-          font-size: 20px;
-          font-weight: 600;
+          font-size: 19px;
+          font-weight: 650;
           letter-spacing: -0.5px;
           display: flex;
           align-items: center;
@@ -1890,13 +1948,13 @@ class St {
           height: 12px;
           border-radius: 50%;
           background: ${t};
-          box-shadow: 0 0 10px ${t}80;
+          box-shadow: 0 0 12px ${t}80;
         }
         .force-graph-panel .info-row {
           display: flex;
           justify-content: space-between;
           padding: 8px 0;
-          border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+          border-bottom: 1px solid rgba(255, 255, 255, 0.08);
           font-size: 13px;
         }
         .force-graph-panel .info-row:last-child {
@@ -1916,19 +1974,24 @@ class St {
         }
         .force-graph-panel .neighbors-section {
           margin-top: 16px;
+          padding: 10px;
+          background: rgba(255, 255, 255, 0.04);
+          border: 1px solid rgba(255, 255, 255, 0.08);
+          border-radius: 10px;
         }
         .force-graph-panel .neighbors-title {
           font-size: 12px;
           text-transform: uppercase;
           letter-spacing: 1px;
-          color: rgba(255, 255, 255, 0.5);
+          color: rgba(255, 255, 255, 0.55);
           margin-bottom: 8px;
         }
         .force-graph-panel .neighbor-chip {
           display: inline-block;
           padding: 4px 10px;
           margin: 2px;
-          background: rgba(255, 255, 255, 0.1);
+          background: rgba(255, 255, 255, 0.08);
+          border: 1px solid rgba(255, 255, 255, 0.12);
           border-radius: 12px;
           font-size: 12px;
         }
@@ -1938,7 +2001,7 @@ class St {
         }
         .force-graph-panel .depth-label {
           font-size: 12px;
-          color: rgba(255, 255, 255, 0.6);
+          color: rgba(255, 255, 255, 0.65);
           margin-bottom: 6px;
           text-transform: uppercase;
           letter-spacing: 0.5px;
@@ -1946,9 +2009,9 @@ class St {
         .force-graph-panel select {
           width: 100%;
           padding: 8px 12px;
-          background: rgba(255, 255, 255, 0.1);
-          border: 1px solid rgba(255, 255, 255, 0.15);
-          border-radius: 6px;
+          background: rgba(255, 255, 255, 0.08);
+          border: 1px solid rgba(255, 255, 255, 0.12);
+          border-radius: 8px;
           color: white;
           font-size: 13px;
           cursor: pointer;
@@ -1956,10 +2019,11 @@ class St {
           transition: all 0.2s ease;
         }
         .force-graph-panel select:hover {
-          background: rgba(255, 255, 255, 0.15);
+          background: rgba(255, 255, 255, 0.12);
         }
         .force-graph-panel select:focus {
-          border-color: rgba(96, 165, 250, 0.5);
+          border-color: rgba(255, 153, 102, 0.5);
+          box-shadow: 0 0 20px rgba(255, 153, 102, 0.15);
         }
         .force-graph-panel .btn-row {
           display: flex;
@@ -1969,28 +2033,33 @@ class St {
         .force-graph-panel button {
           flex: 1;
           padding: 10px 16px;
-          border: none;
+          border: 1px solid rgba(255, 255, 255, 0.12);
           border-radius: 8px;
           font-size: 13px;
-          font-weight: 500;
+          font-weight: 600;
           cursor: pointer;
           transition: all 0.2s ease;
         }
         .force-graph-panel .btn-expand {
-          background: linear-gradient(135deg, #60a5fa, #a78bfa);
+          background: linear-gradient(135deg, rgba(255, 153, 102, 0.3), rgba(255, 102, 153, 0.2));
+          border-color: rgba(255, 153, 102, 0.35);
           color: white;
         }
         .force-graph-panel .btn-expand:hover {
           transform: translateY(-1px);
-          box-shadow: 0 4px 12px rgba(96, 165, 250, 0.4);
+          box-shadow: 0 0 15px rgba(255, 153, 102, 0.2);
         }
         .force-graph-panel .btn-close {
-          background: rgba(255, 255, 255, 0.1);
+          background: rgba(255, 255, 255, 0.08);
           color: rgba(255, 255, 255, 0.8);
         }
         .force-graph-panel .btn-close:hover {
-          background: rgba(255, 255, 255, 0.15);
+          background: rgba(255, 255, 255, 0.12);
         }
+        .force-graph-panel::-webkit-scrollbar { width: 6px; }
+        .force-graph-panel::-webkit-scrollbar-track { background: transparent; }
+        .force-graph-panel::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.15); border-radius: 3px; }
+        .force-graph-panel::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.25); }
       </style>
       
       <h2>
@@ -2066,7 +2135,7 @@ class St {
     this.panel && this.panel.parentNode && this.panel.parentNode.removeChild(this.panel), this.panel = null;
   }
 }
-class zt {
+class St {
   constructor(e) {
     l(this, "container");
     l(this, "panel", null);
@@ -2089,17 +2158,15 @@ class zt {
             width: 300px;
             max-height: 80vh;
             overflow-y: auto;
-            background: rgba(15, 15, 25, 0.85);
+            background: rgba(255, 255, 255, 0.08);
             backdrop-filter: blur(20px);
             -webkit-backdrop-filter: blur(20px);
-            border: 1px solid rgba(255, 255, 255, 0.1);
-            border-radius: 16px;
+            border: 1px solid rgba(255, 255, 255, 0.12);
+            border-radius: 12px;
             padding: 24px;
             color: white;
-            font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
-            box-shadow: 
-                0 8px 32px rgba(0, 0, 0, 0.4),
-                inset 0 0 0 1px rgba(255, 255, 255, 0.05);
+            font-family: inherit;
+            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
             z-index: 1000;
             opacity: 0;
             pointer-events: none;
@@ -2127,29 +2194,34 @@ class zt {
   /**
    * Shows the panel with edge/relationship information
    */
-  show(e, s, t) {
+  show(e, s, t, i = [e]) {
     if (!this.panel) return;
     this.currentEdgeKey = `${e.source}-${e.target}`;
-    let i;
-    this.panelTemplate ? i = this.panelTemplate(e, s, t) : i = this.generateDefaultContent(e, s, t), this.panel.innerHTML = i;
-    const o = this.panel.querySelector('[data-action="close"]');
-    o && o.addEventListener("click", () => {
+    let o;
+    this.panelTemplate ? o = this.panelTemplate(e, s, t) : o = this.generateDefaultContent(e, s, t, i), this.panel.innerHTML = o;
+    const n = this.panel.querySelector('[data-action="close"]');
+    n && n.addEventListener("click", () => {
       this.hide(), this.onClose && this.onClose();
     });
-    const a = this.panel.querySelector('[data-action="goto-source"]');
-    a && this.onNodeClick && a.addEventListener("click", () => {
+    const r = this.panel.querySelector('[data-action="goto-source"]');
+    r && this.onNodeClick && r.addEventListener("click", () => {
       this.onNodeClick && this.onNodeClick(e.source);
     });
-    const r = this.panel.querySelector('[data-action="goto-target"]');
-    r && this.onNodeClick && r.addEventListener("click", () => {
+    const d = this.panel.querySelector('[data-action="goto-target"]');
+    d && this.onNodeClick && d.addEventListener("click", () => {
       this.onNodeClick && this.onNodeClick(e.target);
     }), this.panel.style.opacity = "1", this.panel.style.pointerEvents = "auto", this.panel.style.transform = "translateY(-50%) translateX(0)", this.visible = !0;
   }
   /**
    * Generates default panel content
    */
-  generateDefaultContent(e, s, t) {
-    const i = s.color ? `#${s.color.toString(16).padStart(6, "0")}` : "#ff9966", o = t.color ? `#${t.color.toString(16).padStart(6, "0")}` : "#ff9966", a = e.relationship || "connected to";
+  generateDefaultContent(e, s, t, i = [e]) {
+    const o = s.color ? `#${s.color.toString(16).padStart(6, "0")}` : "#ff9966", n = t.color ? `#${t.color.toString(16).padStart(6, "0")}` : "#ff9966", r = this.getRelationshipLabel(e), d = i.length > 0 ? i : [e], c = this.summarizeRelationships(d), p = c.slice(0, 10).map((m) => `
+                <div class="relationship-item">
+                    <span class="relationship-item-label">${this.escapeHtml(m.label)}</span>
+                    <span class="relationship-item-count">${m.count}</span>
+                </div>
+            `).join(""), f = c.length - Math.min(c.length, 10);
     return `
             <style>
                 .force-graph-edge-panel .panel-header {
@@ -2159,28 +2231,72 @@ class zt {
                     margin-bottom: 20px;
                 }
                 .force-graph-edge-panel .panel-title {
-                    font-size: 14px;
+                    font-size: 12px;
                     text-transform: uppercase;
                     letter-spacing: 1px;
-                    color: rgba(255, 255, 255, 0.6);
+                    color: rgba(255, 255, 255, 0.55);
                     margin: 0;
                 }
                 .force-graph-edge-panel .relationship-section {
-                    background: rgba(255, 255, 255, 0.05);
+                    background: rgba(255, 255, 255, 0.04);
+                    border: 1px solid rgba(255, 255, 255, 0.08);
                     border-radius: 12px;
                     padding: 16px;
                     text-align: center;
-                    margin-bottom: 20px;
+                    margin-bottom: 14px;
                 }
                 .force-graph-edge-panel .relationship-label {
                     font-size: 18px;
                     font-weight: 600;
-                    color: #a78bfa;
+                    color: rgba(255, 153, 102, 0.95);
                     letter-spacing: 0.5px;
                 }
+                .force-graph-edge-panel .relationship-count {
+                    margin-top: 6px;
+                    font-size: 11px;
+                    text-transform: uppercase;
+                    letter-spacing: 0.8px;
+                    color: rgba(255, 255, 255, 0.6);
+                }
+                .force-graph-edge-panel .relationship-list {
+                    margin-bottom: 16px;
+                    max-height: 190px;
+                    overflow-y: auto;
+                    padding-right: 4px;
+                }
+                .force-graph-edge-panel .relationship-item {
+                    display: flex;
+                    justify-content: space-between;
+                    gap: 12px;
+                    padding: 8px 10px;
+                    background: rgba(255, 255, 255, 0.04);
+                    border: 1px solid rgba(255, 255, 255, 0.08);
+                    border-radius: 8px;
+                    margin-bottom: 6px;
+                }
+                .force-graph-edge-panel .relationship-item-label {
+                    font-size: 12px;
+                    color: rgba(255, 255, 255, 0.88);
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                    white-space: nowrap;
+                }
+                .force-graph-edge-panel .relationship-item-count {
+                    font-size: 12px;
+                    font-weight: 700;
+                    color: rgba(255, 153, 102, 0.95);
+                    min-width: 24px;
+                    text-align: right;
+                }
+                .force-graph-edge-panel .relationship-more {
+                    font-size: 11px;
+                    color: rgba(255, 255, 255, 0.45);
+                    text-align: center;
+                    margin-top: 2px;
+                }
                 .force-graph-edge-panel .node-card {
-                    background: rgba(255, 255, 255, 0.05);
-                    border: 1px solid rgba(255, 255, 255, 0.1);
+                    background: rgba(255, 255, 255, 0.06);
+                    border: 1px solid rgba(255, 255, 255, 0.12);
                     border-radius: 12px;
                     padding: 14px;
                     margin-bottom: 12px;
@@ -2189,8 +2305,9 @@ class zt {
                 }
                 .force-graph-edge-panel .node-card:hover {
                     background: rgba(255, 255, 255, 0.1);
-                    border-color: rgba(255, 255, 255, 0.2);
+                    border-color: rgba(255, 153, 102, 0.35);
                     transform: translateX(4px);
+                    box-shadow: 0 0 15px rgba(255, 153, 102, 0.15);
                 }
                 .force-graph-edge-panel .node-card-header {
                     display: flex;
@@ -2227,18 +2344,18 @@ class zt {
                 .force-graph-edge-panel .btn-close {
                     width: 100%;
                     padding: 12px 16px;
-                    border: none;
+                    border: 1px solid rgba(255, 255, 255, 0.12);
                     border-radius: 8px;
                     font-size: 13px;
-                    font-weight: 500;
+                    font-weight: 600;
                     cursor: pointer;
                     transition: all 0.2s ease;
-                    background: rgba(255, 255, 255, 0.1);
+                    background: rgba(255, 255, 255, 0.08);
                     color: rgba(255, 255, 255, 0.8);
                     margin-top: 16px;
                 }
                 .force-graph-edge-panel .btn-close:hover {
-                    background: rgba(255, 255, 255, 0.15);
+                    background: rgba(255, 255, 255, 0.12);
                 }
                 .force-graph-edge-panel .hint-text {
                     font-size: 11px;
@@ -2246,6 +2363,10 @@ class zt {
                     text-align: center;
                     margin-top: 8px;
                 }
+                .force-graph-edge-panel .relationship-list::-webkit-scrollbar { width: 6px; }
+                .force-graph-edge-panel .relationship-list::-webkit-scrollbar-track { background: transparent; }
+                .force-graph-edge-panel .relationship-list::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.15); border-radius: 3px; }
+                .force-graph-edge-panel .relationship-list::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.25); }
             </style>
             
             <div class="panel-header">
@@ -2253,13 +2374,19 @@ class zt {
             </div>
             
             <div class="relationship-section">
-                <span class="relationship-label">${this.escapeHtml(a)}</span>
+                <span class="relationship-label">${this.escapeHtml(r)}</span>
+                <div class="relationship-count">${d.length} relationships</div>
+            </div>
+
+            <div class="relationship-list">
+                ${p}
+                ${f > 0 ? `<div class="relationship-more">+ ${f} more</div>` : ""}
             </div>
             
             <div class="node-card" data-action="goto-source" title="Click to focus on ${this.escapeHtml(s.label)}">
                 <div class="node-type">Source</div>
                 <div class="node-card-header">
-                    <span class="color-dot" style="background: ${i}; box-shadow: 0 0 8px ${i}80;"></span>
+                    <span class="color-dot" style="background: ${o}; box-shadow: 0 0 8px ${o}80;"></span>
                     <span class="node-label">${this.escapeHtml(s.label)}</span>
                 </div>
             </div>
@@ -2269,7 +2396,7 @@ class zt {
             <div class="node-card" data-action="goto-target" title="Click to focus on ${this.escapeHtml(t.label)}">
                 <div class="node-type">Target</div>
                 <div class="node-card-header">
-                    <span class="color-dot" style="background: ${o}; box-shadow: 0 0 8px ${o}80;"></span>
+                    <span class="color-dot" style="background: ${n}; box-shadow: 0 0 8px ${n}80;"></span>
                     <span class="node-label">${this.escapeHtml(t.label)}</span>
                 </div>
             </div>
@@ -2286,6 +2413,17 @@ class zt {
     const s = document.createElement("div");
     return s.textContent = e, s.innerHTML;
   }
+  getRelationshipLabel(e) {
+    return e.relationship || e.label || "connected to";
+  }
+  summarizeRelationships(e) {
+    const s = /* @__PURE__ */ new Map();
+    for (const t of e) {
+      const i = this.getRelationshipLabel(t);
+      s.set(i, (s.get(i) || 0) + 1);
+    }
+    return Array.from(s.entries()).map(([t, i]) => ({ label: t, count: i })).sort((t, i) => i.count - t.count);
+  }
   /**
    * Hides the panel
    */
@@ -2311,7 +2449,7 @@ class zt {
     this.panel && this.panel.parentNode && this.panel.parentNode.removeChild(this.panel), this.panel = null;
   }
 }
-class Tt {
+class zt {
   constructor() {
     l(this, "tooltip", null);
     l(this, "visible", !1);
@@ -2358,28 +2496,51 @@ class Tt {
   positionTooltip(e, s) {
     if (!this.tooltip) return;
     const t = this.tooltip.getBoundingClientRect(), i = window.innerWidth, o = window.innerHeight;
-    let a = e + 15, r = s + 15;
-    a + t.width > i - 10 && (a = e - t.width - 15), r + t.height > o - 10 && (r = s - t.height - 15), a < 10 && (a = 10), r < 10 && (r = 10), this.tooltip.style.left = `${a}px`, this.tooltip.style.top = `${r}px`;
+    let n = e + 15, r = s + 15;
+    n + t.width > i - 10 && (n = e - t.width - 15), r + t.height > o - 10 && (r = s - t.height - 15), n < 10 && (n = 10), r < 10 && (r = 10), this.tooltip.style.left = `${n}px`, this.tooltip.style.top = `${r}px`;
   }
   /**
    * Shows the tooltip with edge info
    */
-  show(e, s, t, i, o) {
+  show(e, s, t, i, o, n = [e]) {
     if (!this.tooltip) return;
-    const a = e.relationship || "connected to";
-    this.tooltip.innerHTML = `
-            <div style="display: flex; flex-direction: column; gap: 4px;">
-                <div style="display: flex; align-items: center; gap: 6px; flex-wrap: wrap;">
-                    <span style="font-weight: 600; color: #ff9966;">${this.escapeHtml(s.label)}</span>
-                </div>
-                <div style="color: rgba(255, 255, 255, 0.6); font-style: italic; font-size: 12px; padding-left: 8px;">
-                    ↳ ${this.escapeHtml(a)}
+    const r = n.length > 0 ? n : [e], d = this.summarizeRelationships(r), c = r.length;
+    if (c <= 1) {
+      const p = this.getRelationshipLabel(r[0]);
+      this.tooltip.innerHTML = `
+                <div style="display: flex; flex-direction: column; gap: 4px;">
+                    <div style="display: flex; align-items: center; gap: 6px; flex-wrap: wrap;">
+                        <span style="font-weight: 600; color: #ff9966;">${this.escapeHtml(s.label)}</span>
+                    </div>
+                    <div style="color: rgba(255, 255, 255, 0.6); font-style: italic; font-size: 12px; padding-left: 8px;">
+                        ↳ ${this.escapeHtml(p)}
+                    </div>
+                    <div style="display: flex; align-items: center; gap: 6px; flex-wrap: wrap;">
+                        <span style="font-weight: 600; color: #ff9966;">${this.escapeHtml(t.label)}</span>
+                    </div>
                 </div>
-                <div style="display: flex; align-items: center; gap: 6px; flex-wrap: wrap;">
-                    <span style="font-weight: 600; color: #ff9966;">${this.escapeHtml(t.label)}</span>
+            `;
+    } else {
+      const p = d.slice(0, 4), f = d.length - p.length, m = p.map((u) => `<div style="display:flex; justify-content:space-between; gap:10px; font-size:12px; color: rgba(255,255,255,0.8);">
+                    <span style="overflow:hidden; text-overflow:ellipsis; white-space:nowrap;">${this.escapeHtml(u.label)}</span>
+                    <span style="color: rgba(255,153,102,0.9); font-weight:600;">${u.count}</span>
+                </div>`).join("");
+      this.tooltip.innerHTML = `
+                <div style="display:flex; flex-direction:column; gap:8px; min-width:220px;">
+                    <div style="font-size:13px; font-weight:600; color:#ff9966;">
+                        ${this.escapeHtml(s.label)} → ${this.escapeHtml(t.label)}
+                    </div>
+                    <div style="font-size:11px; letter-spacing:0.4px; text-transform:uppercase; color: rgba(255,255,255,0.6);">
+                        ${c} relationships
+                    </div>
+                    <div style="display:flex; flex-direction:column; gap:4px;">
+                        ${m}
+                    </div>
+                    ${f > 0 ? `<div style="font-size:11px; color: rgba(255,255,255,0.45);">+ ${f} more</div>` : ""}
                 </div>
-            </div>
-        `, this.positionTooltip(i, o), this.tooltip.style.opacity = "1", this.tooltip.style.transform = "translateY(0)", this.visible = !0;
+            `;
+    }
+    this.positionTooltip(i, o), this.tooltip.style.opacity = "1", this.tooltip.style.transform = "translateY(0)", this.visible = !0;
   }
   /**
    * Updates tooltip position (called externally on mouse move)
@@ -2406,6 +2567,17 @@ class Tt {
     const s = document.createElement("div");
     return s.textContent = e, s.innerHTML;
   }
+  getRelationshipLabel(e) {
+    return e.relationship || e.label || "connected to";
+  }
+  summarizeRelationships(e) {
+    const s = /* @__PURE__ */ new Map();
+    for (const t of e) {
+      const i = this.getRelationshipLabel(t);
+      s.set(i, (s.get(i) || 0) + 1);
+    }
+    return Array.from(s.entries()).map(([t, i]) => ({ label: t, count: i })).sort((t, i) => i.count - t.count);
+  }
   /**
    * Dispose the tooltip
    */
@@ -2558,24 +2730,24 @@ class kt {
     }
     let i = "";
     s.length > 0 && (i += '<div class="f3d-search-section-header">Nodes</div>', s.slice(0, 10).forEach((o) => {
-      const a = o.type || "Node";
+      const n = o.type || "Node";
       i += `
                     <div class="f3d-search-result-item" data-node-id="${this.escapeHtml(o.id)}">
                         <div class="f3d-result-label">${this.escapeHtml(o.label)}</div>
-                        <div class="f3d-result-type">${this.escapeHtml(a)}</div>
+                        <div class="f3d-result-type">${this.escapeHtml(n)}</div>
                     </div>
                 `;
-    }), s.length > 10 && (i += `<div class="f3d-no-results">+ ${s.length - 10} more nodes</div>`)), t.length > 0 && (i += '<div class="f3d-search-section-header">Relationships</div>', t.slice(0, 5).forEach(({ edge: o, sourceNode: a, targetNode: r }) => {
+    }), s.length > 10 && (i += `<div class="f3d-no-results">+ ${s.length - 10} more nodes</div>`)), t.length > 0 && (i += '<div class="f3d-search-section-header">Relationships</div>', t.slice(0, 5).forEach(({ edge: o, sourceNode: n, targetNode: r }) => {
       i += `
                     <div class="f3d-search-result-item" data-node-id="${this.escapeHtml(o.source)}">
-                        <div class="f3d-result-label">${this.escapeHtml(a.label)} → ${this.escapeHtml(r.label)}</div>
+                        <div class="f3d-result-label">${this.escapeHtml(n.label)} → ${this.escapeHtml(r.label)}</div>
                         <div class="f3d-result-relationship">${this.escapeHtml(o.relationship || "connected")}</div>
                     </div>
                 `;
     }), t.length > 5 && (i += `<div class="f3d-no-results">+ ${t.length - 5} more relationships</div>`)), this.searchResults.innerHTML = i, this.searchResults.style.display = "block", this.searchResults.querySelectorAll(".f3d-search-result-item").forEach((o) => {
       o.addEventListener("click", () => {
-        const a = o.dataset.nodeId;
-        a && (this.onResultClick(a), this.searchResults && (this.searchResults.style.display = "none"), this.searchInput && this.searchInput.blur());
+        const n = o.dataset.nodeId;
+        n && (this.onResultClick(n), this.searchResults && (this.searchResults.style.display = "none"), this.searchInput && this.searchInput.blur());
       });
     });
   }
@@ -2587,7 +2759,7 @@ class kt {
     this.searchContainer && this.searchContainer.parentNode && this.searchContainer.parentNode.removeChild(this.searchContainer);
   }
 }
-class Pt {
+class Tt {
   constructor(e, s) {
     l(this, "container");
     l(this, "toggleContainer", null);
@@ -2679,7 +2851,90 @@ class Pt {
     this.toggleContainer && this.toggleContainer.parentNode && this.toggleContainer.parentNode.removeChild(this.toggleContainer);
   }
 }
-const Rt = {
+class Pt {
+  constructor(e) {
+    l(this, "container");
+    l(this, "legendContainer", null);
+    l(this, "nodeCountElement", null);
+    l(this, "linkCountElement", null);
+    this.container = e, this.init();
+  }
+  init() {
+    this.createLegendUI(), this.injectStyles();
+  }
+  createLegendUI() {
+    this.legendContainer = document.createElement("div"), this.legendContainer.className = "f3d-legend-container";
+    const e = document.createElement("div");
+    e.className = "f3d-legend-title", e.textContent = "Graph";
+    const s = this.createStatRow("Nodes"), t = this.createStatRow("Links");
+    this.nodeCountElement = s.valueElement, this.linkCountElement = t.valueElement, this.legendContainer.appendChild(e), this.legendContainer.appendChild(s.rowElement), this.legendContainer.appendChild(t.rowElement), this.container.appendChild(this.legendContainer);
+  }
+  createStatRow(e) {
+    const s = document.createElement("div");
+    s.className = "f3d-legend-row";
+    const t = document.createElement("span");
+    t.className = "f3d-legend-label", t.textContent = e;
+    const i = document.createElement("span");
+    return i.className = "f3d-legend-value", i.textContent = "0", s.appendChild(t), s.appendChild(i), { rowElement: s, valueElement: i };
+  }
+  injectStyles() {
+    const e = "f3d-legend-styles";
+    if (document.getElementById(e))
+      return;
+    const s = document.createElement("style");
+    s.id = e, s.textContent = `
+            .f3d-legend-container {
+                position: absolute;
+                right: 20px;
+                bottom: 20px;
+                z-index: 100;
+                min-width: 140px;
+                padding: 10px 12px;
+                display: flex;
+                flex-direction: column;
+                gap: 8px;
+                background: rgba(255, 255, 255, 0.08);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
+                border: 1px solid rgba(255, 255, 255, 0.12);
+                border-radius: 12px;
+                box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
+                color: white;
+                font-family: inherit;
+                pointer-events: none;
+            }
+            .f3d-legend-title {
+                font-size: 10px;
+                letter-spacing: 1px;
+                text-transform: uppercase;
+                font-weight: 700;
+                color: rgba(255, 255, 255, 0.55);
+            }
+            .f3d-legend-row {
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+                gap: 12px;
+            }
+            .f3d-legend-label {
+                font-size: 12px;
+                color: rgba(255, 255, 255, 0.75);
+            }
+            .f3d-legend-value {
+                font-size: 13px;
+                font-weight: 700;
+                color: rgba(255, 153, 102, 0.95);
+            }
+        `, document.head.appendChild(s);
+  }
+  updateCounts(e, s) {
+    this.nodeCountElement && (this.nodeCountElement.textContent = e.toString()), this.linkCountElement && (this.linkCountElement.textContent = s.toString());
+  }
+  dispose() {
+    this.legendContainer && this.legendContainer.parentNode && this.legendContainer.parentNode.removeChild(this.legendContainer);
+  }
+}
+const Lt = {
   backgroundColor: "#0a0a0a",
   gridColor: "rgba(255, 255, 255, 0.03)",
   nodeRadius: 24,
@@ -2692,7 +2947,7 @@ const Rt = {
   damping: 0.85
   // Fast energy dissipation
 };
-class It {
+class Rt {
   constructor(e, s = {}) {
     l(this, "container");
     l(this, "canvas");
@@ -2719,7 +2974,7 @@ class It {
     l(this, "isSimulating", !0);
     // Resize handler
     l(this, "resizeHandler");
-    this.container = e, this.options = { ...Rt, ...s }, this.canvas = document.createElement("canvas"), this.canvas.style.position = "absolute", this.canvas.style.top = "0", this.canvas.style.left = "0", this.canvas.style.width = "100%", this.canvas.style.height = "100%", this.canvas.style.cursor = "grab", e.appendChild(this.canvas);
+    this.container = e, this.options = { ...Lt, ...s }, this.canvas = document.createElement("canvas"), this.canvas.style.position = "absolute", this.canvas.style.top = "0", this.canvas.style.left = "0", this.canvas.style.width = "100%", this.canvas.style.height = "100%", this.canvas.style.cursor = "grab", e.appendChild(this.canvas);
     const t = this.canvas.getContext("2d");
     if (!t)
       throw new Error("Failed to get 2D context");
@@ -2732,21 +2987,21 @@ class It {
   setupInteractions() {
     this.canvas.addEventListener("wheel", (e) => {
       e.preventDefault();
-      const s = this.canvas.getBoundingClientRect(), t = e.clientX - s.left, i = e.clientY - s.top, o = e.deltaY > 0 ? 0.9 : 1.1, a = Math.max(0.1, Math.min(5, this.transform.scale * o)), r = a / this.transform.scale;
-      this.transform.x = t - (t - this.transform.x) * r, this.transform.y = i - (i - this.transform.y) * r, this.transform.scale = a;
+      const s = this.canvas.getBoundingClientRect(), t = e.clientX - s.left, i = e.clientY - s.top, o = e.deltaY > 0 ? 0.9 : 1.1, n = Math.max(0.1, Math.min(5, this.transform.scale * o)), r = n / this.transform.scale;
+      this.transform.x = t - (t - this.transform.x) * r, this.transform.y = i - (i - this.transform.y) * r, this.transform.scale = n;
     }), this.canvas.addEventListener("mousedown", (e) => {
-      const s = this.canvas.getBoundingClientRect(), t = e.clientX - s.left, i = e.clientY - s.top, o = this.screenToWorld(t, i), a = this.findNodeAt(o.x, o.y);
-      this.dragStartPos = { x: e.clientX, y: e.clientY }, a ? (this.isDragging = !0, this.draggedNode = a, this.canvas.style.cursor = "grabbing", this.isSimulating = !0) : (this.isPanning = !0, this.canvas.style.cursor = "grabbing"), this.lastMousePos = { x: e.clientX, y: e.clientY };
+      const s = this.canvas.getBoundingClientRect(), t = e.clientX - s.left, i = e.clientY - s.top, o = this.screenToWorld(t, i), n = this.findNodeAt(o.x, o.y);
+      this.dragStartPos = { x: e.clientX, y: e.clientY }, n ? (this.isDragging = !0, this.draggedNode = n, this.canvas.style.cursor = "grabbing", this.isSimulating = !0) : (this.isPanning = !0, this.canvas.style.cursor = "grabbing"), this.lastMousePos = { x: e.clientX, y: e.clientY };
     }), this.canvas.addEventListener("mousemove", (e) => {
       const s = this.canvas.getBoundingClientRect(), t = e.clientX - s.left, i = e.clientY - s.top, o = this.screenToWorld(t, i);
       if (this.isDragging && this.draggedNode)
         this.draggedNode.x = o.x, this.draggedNode.y = o.y, this.draggedNode.vx = 0, this.draggedNode.vy = 0;
       else if (this.isPanning) {
-        const a = e.clientX - this.lastMousePos.x, r = e.clientY - this.lastMousePos.y;
-        this.transform.x += a, this.transform.y += r, this.lastMousePos = { x: e.clientX, y: e.clientY };
+        const n = e.clientX - this.lastMousePos.x, r = e.clientY - this.lastMousePos.y;
+        this.transform.x += n, this.transform.y += r, this.lastMousePos = { x: e.clientX, y: e.clientY };
       } else {
-        const a = this.findNodeAt(o.x, o.y);
-        if (a !== this.hoveredNode && (this.hoveredNode = a, a ? (this.hoveredEdge && (this.hoveredEdge = null, this.options.onEdgeHover && this.options.onEdgeHover(null)), this.canvas.style.cursor = "pointer", this.options.onNodeHover && this.options.onNodeHover(a.data)) : this.options.onNodeHover && this.options.onNodeHover(null)), !a) {
+        const n = this.findNodeAt(o.x, o.y);
+        if (n !== this.hoveredNode && (this.hoveredNode = n, n ? (this.hoveredEdge && (this.hoveredEdge = null, this.options.onEdgeHover && this.options.onEdgeHover(null)), this.canvas.style.cursor = "pointer", this.options.onNodeHover && this.options.onNodeHover(n.data)) : this.options.onNodeHover && this.options.onNodeHover(null)), !n) {
           const r = this.findEdgeAt(o.x, o.y);
           r !== this.hoveredEdge && (this.hoveredEdge = r, this.canvas.style.cursor = r ? "pointer" : "grab", this.options.onEdgeHover && this.options.onEdgeHover(r ? r.data : null, e));
         }
@@ -2756,7 +3011,7 @@ class It {
       if (this.isDragging && this.draggedNode)
         i && this.options.onNodeClick && (this.selectedNode = this.draggedNode, this.options.onNodeClick(this.draggedNode.data));
       else if (i) {
-        const o = this.canvas.getBoundingClientRect(), a = this.screenToWorld(e.clientX - o.left, e.clientY - o.top), r = this.findEdgeAt(a.x, a.y);
+        const o = this.canvas.getBoundingClientRect(), n = this.screenToWorld(e.clientX - o.left, e.clientY - o.top), r = this.findEdgeAt(n.x, n.y);
         r && this.options.onEdgeClick && this.options.onEdgeClick(r.data);
       }
       this.isDragging = !1, this.isPanning = !1, this.draggedNode = null, this.canvas.style.cursor = this.hoveredNode ? "pointer" : "grab";
@@ -2780,12 +3035,12 @@ class It {
   }
   findEdgeAt(e, s) {
     for (const i of this.edges) {
-      const o = this.nodes.get(i.source), a = this.nodes.get(i.target);
-      if (!o || !a) continue;
-      const r = a.x - o.x, c = a.y - o.y, h = r * r + c * c;
-      if (h === 0) continue;
-      const p = Math.max(0, Math.min(1, ((e - o.x) * r + (s - o.y) * c) / h)), x = o.x + p * r, m = o.y + p * c, u = e - x, f = s - m;
-      if (Math.sqrt(u * u + f * f) < 12)
+      const o = this.nodes.get(i.source), n = this.nodes.get(i.target);
+      if (!o || !n) continue;
+      const r = n.x - o.x, d = n.y - o.y, c = r * r + d * d;
+      if (c === 0) continue;
+      const p = Math.max(0, Math.min(1, ((e - o.x) * r + (s - o.y) * d) / c)), f = o.x + p * r, m = o.y + p * d, u = e - f, y = s - m;
+      if (Math.sqrt(u * u + y * y) < 12)
         return i;
     }
     return null;
@@ -2802,29 +3057,29 @@ class It {
     const t = 60, i = 5;
     let o = 0;
     for (let r = 0; r < s; r++)
-      for (let c = r + 1; c < s; c++) {
-        const h = e[r], p = e[c];
-        let x = p.x - h.x, m = p.y - h.y, u = Math.sqrt(x * x + m * m);
+      for (let d = r + 1; d < s; d++) {
+        const c = e[r], p = e[d];
+        let f = p.x - c.x, m = p.y - c.y, u = Math.sqrt(f * f + m * m);
         if (u < t * 3) {
           u < 1 && (u = 1);
-          const f = this.options.repulsionStrength / (u * u), b = x / u * f, M = m / u * f;
-          h.vx -= b, h.vy -= M, p.vx += b, p.vy += M;
+          const y = this.options.repulsionStrength / (u * u), b = f / u * y, w = m / u * y;
+          c.vx -= b, c.vy -= w, p.vx += b, p.vy += w;
         }
       }
-    const a = 80;
+    const n = 80;
     for (const r of this.edges) {
-      const c = this.nodes.get(r.source), h = this.nodes.get(r.target);
-      if (!c || !h) continue;
-      let p = h.x - c.x, x = h.y - c.y, m = Math.sqrt(p * p + x * x);
+      const d = this.nodes.get(r.source), c = this.nodes.get(r.target);
+      if (!d || !c) continue;
+      let p = c.x - d.x, f = c.y - d.y, m = Math.sqrt(p * p + f * f);
       m < 1 && (m = 1);
-      const f = (m - a) * this.options.attractionStrength, b = p / m * f, M = x / m * f;
-      c.vx += b, c.vy += M, h.vx -= b, h.vy -= M;
+      const y = (m - n) * this.options.attractionStrength, b = p / m * y, w = f / m * y;
+      d.vx += b, d.vy += w, c.vx -= b, c.vy -= w;
     }
     for (const r of e) {
       if (this.draggedNode === r) continue;
       r.vx *= this.options.damping, r.vy *= this.options.damping;
-      const c = Math.sqrt(r.vx * r.vx + r.vy * r.vy);
-      c > i && (r.vx = r.vx / c * i, r.vy = r.vy / c * i), r.x += r.vx, r.y += r.vy, o += r.vx * r.vx + r.vy * r.vy;
+      const d = Math.sqrt(r.vx * r.vx + r.vy * r.vy);
+      d > i && (r.vx = r.vx / d * i, r.vy = r.vy / d * i), r.x += r.vx, r.y += r.vy, o += r.vx * r.vx + r.vy * r.vy;
     }
     o < 0.01 && !this.draggedNode && (this.isSimulating = !1);
   }
@@ -2833,49 +3088,49 @@ class It {
     e.fillStyle = this.options.backgroundColor, e.fillRect(0, 0, s, t), this.renderGrid(s, t), e.save(), e.translate(this.transform.x, this.transform.y), e.scale(this.transform.scale, this.transform.scale), this.renderEdges(), this.renderNodes(), e.restore();
   }
   renderGrid(e, s) {
-    const t = this.ctx, i = 40 * this.transform.scale, o = 1.5, a = this.transform.x % i, r = this.transform.y % i;
+    const t = this.ctx, i = 40 * this.transform.scale, o = 1.5, n = this.transform.x % i, r = this.transform.y % i;
     t.fillStyle = this.options.gridColor;
-    for (let c = a; c < e; c += i)
-      for (let h = r; h < s; h += i)
-        t.beginPath(), t.arc(c, h, o, 0, Math.PI * 2), t.fill();
+    for (let d = n; d < e; d += i)
+      for (let c = r; c < s; c += i)
+        t.beginPath(), t.arc(d, c, o, 0, Math.PI * 2), t.fill();
   }
   renderEdges() {
     const e = this.ctx;
     for (const s of this.edges) {
       const t = this.nodes.get(s.source), i = this.nodes.get(s.target);
       if (!t || !i) continue;
-      const o = s === this.hoveredEdge, a = e.createLinearGradient(t.x, t.y, i.x, i.y);
-      o ? (a.addColorStop(0, "rgba(255, 153, 102, 0.8)"), a.addColorStop(0.5, "rgba(255, 255, 255, 0.5)"), a.addColorStop(1, "rgba(102, 153, 255, 0.8)"), e.lineWidth = 3) : (a.addColorStop(0, "rgba(255, 153, 102, 0.3)"), a.addColorStop(0.5, "rgba(255, 255, 255, 0.15)"), a.addColorStop(1, "rgba(102, 153, 255, 0.3)"), e.lineWidth = 1.5), e.beginPath(), e.moveTo(t.x, t.y), e.lineTo(i.x, i.y), e.strokeStyle = a, e.stroke();
+      const o = s === this.hoveredEdge, n = e.createLinearGradient(t.x, t.y, i.x, i.y);
+      o ? (n.addColorStop(0, "rgba(255, 153, 102, 0.8)"), n.addColorStop(0.5, "rgba(255, 255, 255, 0.5)"), n.addColorStop(1, "rgba(102, 153, 255, 0.8)"), e.lineWidth = 3) : (n.addColorStop(0, "rgba(255, 153, 102, 0.3)"), n.addColorStop(0.5, "rgba(255, 255, 255, 0.15)"), n.addColorStop(1, "rgba(102, 153, 255, 0.3)"), e.lineWidth = 1.5), e.beginPath(), e.moveTo(t.x, t.y), e.lineTo(i.x, i.y), e.strokeStyle = n, e.stroke();
     }
   }
   renderNodes() {
     const e = this.ctx;
     for (const s of this.nodes.values()) {
-      const t = s === this.hoveredNode, i = s === this.selectedNode, o = this.hoveredEdge && (s.data.id === this.hoveredEdge.source || s.data.id === this.hoveredEdge.target), a = s.radius * (t ? 1.1 : 1);
+      const t = s === this.hoveredNode, i = s === this.selectedNode, o = this.hoveredEdge && (s.data.id === this.hoveredEdge.source || s.data.id === this.hoveredEdge.target), n = s.radius * (t ? 1.1 : 1);
       if (t || i || o) {
-        const f = e.createRadialGradient(
+        const y = e.createRadialGradient(
           s.x,
           s.y,
-          a * 0.5,
+          n * 0.5,
           s.x,
           s.y,
-          a * 2
+          n * 2
         ), b = t || i ? 0.4 : 0.25;
-        f.addColorStop(0, `rgba(255, 153, 102, ${b})`), f.addColorStop(1, "rgba(255, 153, 102, 0)"), e.fillStyle = f, e.beginPath(), e.arc(s.x, s.y, a * 2, 0, Math.PI * 2), e.fill();
+        y.addColorStop(0, `rgba(255, 153, 102, ${b})`), y.addColorStop(1, "rgba(255, 153, 102, 0)"), e.fillStyle = y, e.beginPath(), e.arc(s.x, s.y, n * 2, 0, Math.PI * 2), e.fill();
       }
       const r = e.createRadialGradient(
-        s.x - a * 0.3,
-        s.y - a * 0.3,
+        s.x - n * 0.3,
+        s.y - n * 0.3,
         0,
         s.x,
         s.y,
-        a
-      ), c = s.color >> 16 & 255, h = s.color >> 8 & 255, p = s.color & 255;
-      r.addColorStop(0, `rgba(${Math.min(255, c + 60)}, ${Math.min(255, h + 60)}, ${Math.min(255, p + 60)}, 0.95)`), r.addColorStop(0.7, `rgba(${c}, ${h}, ${p}, 0.9)`), r.addColorStop(1, `rgba(${Math.max(0, c - 40)}, ${Math.max(0, h - 40)}, ${Math.max(0, p - 40)}, 0.85)`), e.beginPath(), e.arc(s.x, s.y, a, 0, Math.PI * 2), e.fillStyle = r, e.fill(), e.strokeStyle = "rgba(255, 255, 255, 0.2)", e.lineWidth = 1, e.stroke(), e.beginPath(), e.arc(s.x - a * 0.25, s.y - a * 0.25, a * 0.3, 0, Math.PI * 2), e.fillStyle = "rgba(255, 255, 255, 0.15)", e.fill(), e.fillStyle = "white", e.font = "600 11px Inter, -apple-system, BlinkMacSystemFont, sans-serif", e.textAlign = "center", e.textBaseline = "middle";
-      const x = a * 1.6;
+        n
+      ), d = s.color >> 16 & 255, c = s.color >> 8 & 255, p = s.color & 255;
+      r.addColorStop(0, `rgba(${Math.min(255, d + 60)}, ${Math.min(255, c + 60)}, ${Math.min(255, p + 60)}, 0.95)`), r.addColorStop(0.7, `rgba(${d}, ${c}, ${p}, 0.9)`), r.addColorStop(1, `rgba(${Math.max(0, d - 40)}, ${Math.max(0, c - 40)}, ${Math.max(0, p - 40)}, 0.85)`), e.beginPath(), e.arc(s.x, s.y, n, 0, Math.PI * 2), e.fillStyle = r, e.fill(), e.strokeStyle = "rgba(255, 255, 255, 0.2)", e.lineWidth = 1, e.stroke(), e.beginPath(), e.arc(s.x - n * 0.25, s.y - n * 0.25, n * 0.3, 0, Math.PI * 2), e.fillStyle = "rgba(255, 255, 255, 0.15)", e.fill(), e.fillStyle = "white", e.font = "600 11px Inter, -apple-system, BlinkMacSystemFont, sans-serif", e.textAlign = "center", e.textBaseline = "middle";
+      const f = n * 1.6;
       let m = s.label, u = e.measureText(m).width;
-      if (u > x) {
-        for (; u > x && m.length > 3; )
+      if (u > f) {
+        for (; u > f && m.length > 3; )
           m = m.slice(0, -1), u = e.measureText(m + "...").width;
         m += "...";
       }
@@ -2978,11 +3233,11 @@ class It {
   focusOnNode(e) {
     const s = this.nodes.get(e);
     if (!s) return;
-    const t = this.canvas.width / 2 / (window.devicePixelRatio || 1) - s.x * this.transform.scale, i = this.canvas.height / 2 / (window.devicePixelRatio || 1) - s.y * this.transform.scale, o = this.transform.x, a = this.transform.y, r = 500, c = performance.now(), h = () => {
-      const p = performance.now() - c, x = Math.min(p / r, 1), m = 1 - Math.pow(1 - x, 3);
-      this.transform.x = o + (t - o) * m, this.transform.y = a + (i - a) * m, x < 1 ? requestAnimationFrame(h) : this.selectedNode = s;
+    const t = this.canvas.width / 2 / (window.devicePixelRatio || 1) - s.x * this.transform.scale, i = this.canvas.height / 2 / (window.devicePixelRatio || 1) - s.y * this.transform.scale, o = this.transform.x, n = this.transform.y, r = 500, d = performance.now(), c = () => {
+      const p = performance.now() - d, f = Math.min(p / r, 1), m = 1 - Math.pow(1 - f, 3);
+      this.transform.x = o + (t - o) * m, this.transform.y = n + (i - n) * m, f < 1 ? requestAnimationFrame(c) : this.selectedNode = s;
     };
-    h();
+    c();
   }
   /**
    * Updates node positions from 3D data
@@ -3050,6 +3305,7 @@ class Ht {
     l(this, "edgeTooltipManager");
     l(this, "searchManager", null);
     l(this, "viewToggleManager", null);
+    l(this, "legendManager", null);
     // 2D Renderer
     l(this, "forceGraph2D", null);
     // Event system
@@ -3059,7 +3315,7 @@ class Ht {
     l(this, "devControls", null);
     l(this, "viewMode", "3d");
     l(this, "graphData", null);
-    this.options = { ...P, ...s }, this.container = dt(e), this.materialFactory = new vt(), this.nodeFactory = new Mt(
+    this.options = { ...P, ...s }, this.container = dt(e), this.materialFactory = new bt(), this.nodeFactory = new vt(
       this.materialFactory,
       this.options.nodeRadius ?? P.nodeRadius,
       this.options.lodSegments ?? P.lodSegments,
@@ -3068,14 +3324,14 @@ class Ht {
       this.materialFactory,
       this.options.edgeColor ?? P.edgeColor,
       this.options.edgeOpacity ?? P.edgeOpacity
-    ), this.sceneManager = new mt(this.container, this.options), this.lodManager = new Et(
+    ), this.sceneManager = new ft(this.container, this.options), this.lodManager = new Mt(
       this.sceneManager.camera,
       this.options.lodDistances ?? P.lodDistances,
       this.options.enableLOD ?? P.enableLOD
-    ), this.frustumCuller = new Ct(
+    ), this.frustumCuller = new Et(
       this.sceneManager.camera,
       this.options.enableEdgeCulling ?? P.enableEdgeCulling
-    ), this.nodeManager = new te(this.sceneManager, this.nodeFactory), this.edgeManager = new yt(this.sceneManager, this.nodeManager, this.edgeFactory), this.graphEngine = new Le(
+    ), this.nodeManager = new ee(this.sceneManager, this.nodeFactory), this.edgeManager = new mt(this.sceneManager, this.nodeManager, this.edgeFactory), this.graphEngine = new Re(
       this.nodeManager.getAllNodes(),
       this.edgeManager.getAllEdges(),
       {
@@ -3085,12 +3341,12 @@ class Ht {
         useBarnesHut: this.options.useBarnesHut,
         barnesHutTheta: this.options.barnesHutTheta
       }
-    ), this.rendererManager = new bt(
+    ), this.rendererManager = new xt(
       this.sceneManager,
       () => this.onSimulate(),
       () => this.onRender(),
       this.options.targetFPS ?? P.targetFPS
-    ), this.raycasterManager = new Nt(this.sceneManager, this.container), this.panelManager = new St(this.container), this.edgePanelManager = new zt(this.container), this.edgeTooltipManager = new Tt(), this.edgePanelManager.setNodeClickCallback((t) => {
+    ), this.raycasterManager = new Ct(this.sceneManager, this.container), this.panelManager = new Nt(this.container), this.edgePanelManager = new St(this.container), this.edgeTooltipManager = new zt(), this.edgePanelManager.setNodeClickCallback((t) => {
       this.edgePanelManager.hide(), this.focusOnNode(t), setTimeout(() => {
         this.showNodePanel(t);
       }, 400);
@@ -3105,12 +3361,12 @@ class Ht {
           this.showNodePanel(t);
         }, 400);
       }
-    })), this.options.showViewToggle !== !1 && (this.viewMode = this.options.initialViewMode || "3d", this.viewToggleManager = new Pt(this.container, {
+    })), this.options.showViewToggle !== !1 && (this.viewMode = this.options.initialViewMode || "3d", this.viewToggleManager = new Tt(this.container, {
       initialMode: this.viewMode,
       onViewChange: (t) => {
         this.switchView(t);
       }
-    })), this.setupCallbacks(), this.rendererManager.start(), this.initialized = !0, this.emit("ready");
+    })), this.options.showLegend !== !1 && (this.legendManager = new Pt(this.container), this.updateLegendCounts()), this.setupCallbacks(), this.rendererManager.start(), this.initialized = !0, this.emit("ready");
   }
   /**
    * Sets up internal callbacks
@@ -3133,7 +3389,14 @@ class Ht {
     if (e) {
       this.edgeManager.highlightEdge(e.edge.source, e.edge.target);
       const s = this.container.getBoundingClientRect(), t = s.left + s.width / 2, i = s.top + s.height / 2;
-      this.edgeTooltipManager.show(e.edge, e.sourceNode, e.targetNode, t, i), this.options.onEdgeHover && this.options.onEdgeHover(e.edge, e.sourceNode, e.targetNode), this.emit("edgeHover", e.edge, e.sourceNode, e.targetNode);
+      this.edgeTooltipManager.show(
+        e.edge,
+        e.sourceNode,
+        e.targetNode,
+        t,
+        i,
+        e.relationships
+      ), this.options.onEdgeHover && this.options.onEdgeHover(e.edge, e.sourceNode, e.targetNode), this.emit("edgeHover", e.edge, e.sourceNode, e.targetNode);
     } else
       this.edgeManager.unhighlightCurrentEdge(), this.edgeTooltipManager.hide(), this.options.onEdgeHover && this.options.onEdgeHover(null, null, null), this.emit("edgeHover", null, null, null);
   }
@@ -3149,7 +3412,7 @@ class Ht {
    * Handles edge click
    */
   onEdgeClick(e) {
-    this.panelManager.hide(), this.edgeTooltipManager.hide(), this.edgeManager.highlightEdge(e.edge.source, e.edge.target), this.edgePanelManager.show(e.edge, e.sourceNode, e.targetNode), this.focusOnEdge(e.edge.source, e.edge.target), this.emit("edgeClick", e.edge, e.sourceNode, e.targetNode);
+    this.panelManager.hide(), this.edgeTooltipManager.hide(), this.edgeManager.highlightEdge(e.edge.source, e.edge.target), this.edgePanelManager.show(e.edge, e.sourceNode, e.targetNode, e.relationships), this.focusOnEdge(e.edge.source, e.edge.target), this.emit("edgeClick", e.edge, e.sourceNode, e.targetNode);
   }
   /**
    * Called every simulation step
@@ -3169,6 +3432,12 @@ class Ht {
   onRender() {
     this.frustumCuller.update(), this.raycasterManager.setNodeObjects(this.nodeManager.getAllNodeObjects()), this.raycasterManager.setEdgeObjects(this.edgeManager.getAllEdgeLines());
   }
+  /**
+   * Updates bottom-right legend counts
+   */
+  updateLegendCounts() {
+    this.legendManager && this.legendManager.updateCounts(this.getNodeCount(), this.getEdgeCount());
+  }
   // ==========================================================================
   // Public API
   // ==========================================================================
@@ -3176,8 +3445,8 @@ class Ht {
    * Sets the graph data
    */
   setData(e) {
-    var a;
-    const s = (a = e.data) != null && a.nodes ? e.data : e, i = (s.edges || s.links || []).map((r) => ({
+    var n;
+    const s = (n = e.data) != null && n.nodes ? e.data : e, i = (s.edges || s.links || []).map((r) => ({
       ...r,
       relationship: r.relationship || r.label || "related_to"
     })), o = {
@@ -3185,14 +3454,14 @@ class Ht {
       edges: i
     };
     if (this.graphData = o, this.edgeManager.clear(), this.nodeManager.clear(), o.nodes && Array.isArray(o.nodes)) {
-      te.setExpectedNodeCount(o.nodes.length);
+      ee.setExpectedNodeCount(o.nodes.length);
       for (const r of o.nodes)
         this.addNode(r);
     }
     if (o.edges && Array.isArray(o.edges))
       for (const r of o.edges)
         this.addEdge(r);
-    this.graphEngine = new Le(
+    this.graphEngine = new Re(
       this.nodeManager.getAllNodes(),
       this.edgeManager.getAllEdges(),
       {
@@ -3202,28 +3471,28 @@ class Ht {
         useBarnesHut: this.options.useBarnesHut,
         barnesHutTheta: this.options.barnesHutTheta
       }
-    ), this.graphEngine.restart(), this.forceGraph2D && this.forceGraph2D.setData(o);
+    ), this.graphEngine.restart(), this.forceGraph2D && this.forceGraph2D.setData(o), this.updateLegendCounts();
   }
   /**
    * Adds a node to the graph
    * @returns true if added, false if node already exists or invalid
    */
   addNode(e) {
-    if (!He(e))
+    if (!Fe(e))
       return !1;
     const s = this.nodeManager.addNode(e);
-    return s && (this.graphEngine.restart(), this.forceGraph2D && this.forceGraph2D.addNode(e), this.options.onNodeAdd && this.options.onNodeAdd(e), this.emit("nodeAdd", e)), s;
+    return s && (this.graphEngine.restart(), this.forceGraph2D && this.forceGraph2D.addNode(e), this.options.onNodeAdd && this.options.onNodeAdd(e), this.emit("nodeAdd", e), this.updateLegendCounts()), s;
   }
   /**
    * Removes a node from the graph
    * @returns true if removed, false if not found
    */
   removeNode(e) {
-    if (!pt(e))
+    if (!ht(e))
       return !1;
     this.edgeManager.removeEdgesForNode(e);
     const s = this.nodeManager.removeNode(e);
-    return s && (this.graphEngine.restart(), this.options.onNodeRemove && this.options.onNodeRemove(e), this.emit("nodeRemove", e), this.panelManager.getCurrentNodeId() === e && this.panelManager.hide()), s;
+    return s && (this.graphEngine.restart(), this.options.onNodeRemove && this.options.onNodeRemove(e), this.emit("nodeRemove", e), this.panelManager.getCurrentNodeId() === e && this.panelManager.hide(), this.updateLegendCounts()), s;
   }
   /**
    * Updates a node's properties
@@ -3233,13 +3502,13 @@ class Ht {
   }
   /**
    * Adds an edge to the graph
-   * @returns true if added, false if edge already exists or nodes don't exist
+   * @returns true if added, false if invalid or nodes don't exist
    */
   addEdge(e) {
     if (!De(e))
       return !1;
     const s = this.edgeManager.addEdge(e);
-    return s && (this.graphEngine.setEdges(this.edgeManager.getAllEdges()), this.graphEngine.restart(), this.forceGraph2D && this.forceGraph2D.addEdge(e), this.options.onEdgeAdd && this.options.onEdgeAdd(e), this.emit("edgeAdd", e)), s;
+    return s && (this.graphEngine.setEdges(this.edgeManager.getAllEdges()), this.graphEngine.restart(), this.forceGraph2D && this.forceGraph2D.addEdge(e), this.options.onEdgeAdd && this.options.onEdgeAdd(e), this.emit("edgeAdd", e), this.updateLegendCounts()), s;
   }
   /**
    * Removes an edge from the graph
@@ -3247,7 +3516,7 @@ class Ht {
    */
   removeEdge(e, s) {
     const t = this.edgeManager.removeEdge(e, s);
-    return t && (this.graphEngine.setEdges(this.edgeManager.getAllEdges()), this.options.onEdgeRemove && this.options.onEdgeRemove({ source: e, target: s }), this.emit("edgeRemove", { source: e, target: s })), t;
+    return t && (this.graphEngine.setEdges(this.edgeManager.getAllEdges()), this.options.onEdgeRemove && this.options.onEdgeRemove({ source: e, target: s }), this.emit("edgeRemove", { source: e, target: s }), this.updateLegendCounts()), t;
   }
   /**
    * Expands a node by fetching more data
@@ -3262,11 +3531,11 @@ class Ht {
     try {
       const o = await i(e, s);
       if (o.nodes && Array.isArray(o.nodes))
-        for (const a of o.nodes)
-          this.addNode(a);
+        for (const n of o.nodes)
+          this.addNode(n);
       if (o.edges && Array.isArray(o.edges))
-        for (const a of o.edges)
-          this.addEdge(a);
+        for (const n of o.edges)
+          this.addEdge(n);
       return this.panelManager.hide(), this.emit("expand", e, o), !0;
     } catch (o) {
       return console.error("[ForceGraph3D] Error expanding node:", o), !1;
@@ -3316,13 +3585,13 @@ class Ht {
       console.warn(`[ForceGraph3D] Node "${e}" not found`);
       return;
     }
-    const i = t.position, o = this.sceneManager.camera, a = this.sceneManager.controls, r = o.position.clone().sub(a.target).normalize(), c = {
+    const i = t.position, o = this.sceneManager.camera, n = this.sceneManager.controls, r = o.position.clone().sub(n.target).normalize(), d = {
       x: i.x + r.x * s,
       y: i.y + r.y * s,
       z: i.z + r.z * s
-    }, h = { x: o.position.x, y: o.position.y, z: o.position.z }, p = { x: a.target.x, y: a.target.y, z: a.target.z }, x = 800, m = performance.now(), u = () => {
-      const f = performance.now() - m, b = Math.min(f / x, 1), M = 1 - Math.pow(1 - b, 3);
-      o.position.x = h.x + (c.x - h.x) * M, o.position.y = h.y + (c.y - h.y) * M, o.position.z = h.z + (c.z - h.z) * M, a.target.x = p.x + (i.x - p.x) * M, a.target.y = p.y + (i.y - p.y) * M, a.target.z = p.z + (i.z - p.z) * M, a.update(), b < 1 && requestAnimationFrame(u);
+    }, c = { x: o.position.x, y: o.position.y, z: o.position.z }, p = { x: n.target.x, y: n.target.y, z: n.target.z }, f = 800, m = performance.now(), u = () => {
+      const y = performance.now() - m, b = Math.min(y / f, 1), w = 1 - Math.pow(1 - b, 3);
+      o.position.x = c.x + (d.x - c.x) * w, o.position.y = c.y + (d.y - c.y) * w, o.position.z = c.z + (d.z - c.z) * w, n.target.x = p.x + (i.x - p.x) * w, n.target.y = p.y + (i.y - p.y) * w, n.target.z = p.z + (i.z - p.z) * w, n.update(), b < 1 && requestAnimationFrame(u);
     };
     u();
   }
@@ -3336,19 +3605,19 @@ class Ht {
       console.warn(`[ForceGraph3D] Could not find nodes for edge "${e}" -> "${s}"`);
       return;
     }
-    const a = this.sceneManager.camera, r = this.sceneManager.controls, c = {
+    const n = this.sceneManager.camera, r = this.sceneManager.controls, d = {
       x: (i.position.x + o.position.x) / 2,
       y: (i.position.y + o.position.y) / 2,
       z: (i.position.z + o.position.z) / 2
-    }, h = o.position.x - i.position.x, p = o.position.y - i.position.y, x = o.position.z - i.position.z, m = Math.sqrt(h * h + p * p + x * x), u = Math.max(m * t, 40), f = a.position.clone().sub(r.target).normalize(), b = {
-      x: c.x + f.x * u,
-      y: c.y + f.y * u,
-      z: c.z + f.z * u
-    }, M = { x: a.position.x, y: a.position.y, z: a.position.z }, N = { x: r.target.x, y: r.target.y, z: r.target.z }, O = 800, R = performance.now(), Y = () => {
-      const k = performance.now() - R, H = Math.min(k / O, 1), E = 1 - Math.pow(1 - H, 3);
-      a.position.x = M.x + (b.x - M.x) * E, a.position.y = M.y + (b.y - M.y) * E, a.position.z = M.z + (b.z - M.z) * E, r.target.x = N.x + (c.x - N.x) * E, r.target.y = N.y + (c.y - N.y) * E, r.target.z = N.z + (c.z - N.z) * E, r.update(), H < 1 && requestAnimationFrame(Y);
+    }, c = o.position.x - i.position.x, p = o.position.y - i.position.y, f = o.position.z - i.position.z, m = Math.sqrt(c * c + p * p + f * f), u = Math.max(m * t, 40), y = n.position.clone().sub(r.target).normalize(), b = {
+      x: d.x + y.x * u,
+      y: d.y + y.y * u,
+      z: d.z + y.z * u
+    }, w = { x: n.position.x, y: n.position.y, z: n.position.z }, N = { x: r.target.x, y: r.target.y, z: r.target.z }, O = 800, L = performance.now(), G = () => {
+      const T = performance.now() - L, D = Math.min(T / O, 1), E = 1 - Math.pow(1 - D, 3);
+      n.position.x = w.x + (b.x - w.x) * E, n.position.y = w.y + (b.y - w.y) * E, n.position.z = w.z + (b.z - w.z) * E, r.target.x = N.x + (d.x - N.x) * E, r.target.y = N.y + (d.y - N.y) * E, r.target.z = N.z + (d.z - N.z) * E, r.update(), D < 1 && requestAnimationFrame(G);
     };
-    Y();
+    G();
   }
   /**
    * Shows the info panel for a specific node
@@ -3371,9 +3640,9 @@ class Ht {
       return [];
     const s = e.toLowerCase().trim(), t = this.nodeManager.getAllNodes(), i = [];
     return t.forEach((o) => {
-      var h, p, x;
-      const a = (h = o.label) == null ? void 0 : h.toLowerCase().includes(s), r = (p = o.id) == null ? void 0 : p.toLowerCase().includes(s), c = (x = o.type) == null ? void 0 : x.toLowerCase().includes(s);
-      (a || r || c) && i.push(o);
+      var c, p, f;
+      const n = (c = o.label) == null ? void 0 : c.toLowerCase().includes(s), r = (p = o.id) == null ? void 0 : p.toLowerCase().includes(s), d = (f = o.type) == null ? void 0 : f.toLowerCase().includes(s);
+      (n || r || d) && i.push(o);
     }), i;
   }
   /**
@@ -3385,10 +3654,10 @@ class Ht {
     if (!e || e.trim() === "")
       return [];
     const s = e.toLowerCase().trim(), t = this.edgeManager.getAllEdges(), i = [];
-    for (const a of t)
-      if ((o = a.relationship) == null ? void 0 : o.toLowerCase().includes(s)) {
-        const c = this.nodeManager.getNode(a.source), h = this.nodeManager.getNode(a.target);
-        c && h && i.push({ edge: a, sourceNode: c, targetNode: h });
+    for (const n of t)
+      if ((o = n.relationship) == null ? void 0 : o.toLowerCase().includes(s)) {
+        const d = this.nodeManager.getNode(n.source), c = this.nodeManager.getNode(n.target);
+        d && c && i.push({ edge: n, sourceNode: d, targetNode: c });
       }
     return i;
   }
@@ -3421,7 +3690,7 @@ class Ht {
    * Switches between 2D and 3D view modes
    */
   switchView(e) {
-    this.viewMode !== e && (this.viewMode = e, this.panelManager.hide(), this.edgePanelManager.hide(), this.edgeTooltipManager.hide(), e === "2d" ? (this.sceneManager.renderer.domElement.style.display = "none", this.rendererManager.stop(), this.forceGraph2D ? (this.forceGraph2D.show(), this.forceGraph2D.syncFrom3D(this.nodeManager.getAllNodes())) : (this.forceGraph2D = new It(this.container, {
+    this.viewMode !== e && (this.viewMode = e, this.panelManager.hide(), this.edgePanelManager.hide(), this.edgeTooltipManager.hide(), e === "2d" ? (this.sceneManager.renderer.domElement.style.display = "none", this.rendererManager.stop(), this.forceGraph2D ? (this.forceGraph2D.show(), this.forceGraph2D.syncFrom3D(this.nodeManager.getAllNodes())) : (this.forceGraph2D = new Rt(this.container, {
       backgroundColor: "#0a0a0a",
       nodeRadius: 24,
       onNodeClick: (s) => {
@@ -3433,19 +3702,31 @@ class Ht {
       onEdgeHover: (s, t) => {
         if (s && t) {
           const i = this.nodeManager.getNode(s.source), o = this.nodeManager.getNode(s.target);
-          i && o && this.edgeTooltipManager.show(
-            s,
-            i,
-            o,
-            t.clientX,
-            t.clientY
-          );
+          if (i && o) {
+            const n = this.edgeManager.getAllEdges().filter((r) => r.source === s.source && r.target === s.target);
+            this.edgeTooltipManager.show(
+              s,
+              i,
+              o,
+              t.clientX,
+              t.clientY,
+              n.length > 0 ? n : [s]
+            );
+          }
         } else
           this.edgeTooltipManager.hide();
       },
       onEdgeClick: (s) => {
         const t = this.nodeManager.getNode(s.source), i = this.nodeManager.getNode(s.target);
-        t && i && this.edgePanelManager.show(s, t, i);
+        if (t && i) {
+          const o = this.edgeManager.getAllEdges().filter((n) => n.source === s.source && n.target === s.target);
+          this.edgePanelManager.show(
+            s,
+            t,
+            i,
+            o.length > 0 ? o : [s]
+          );
+        }
       }
     }), this.graphData && (this.forceGraph2D.setData(this.graphData), this.forceGraph2D.syncFrom3D(this.nodeManager.getAllNodes())))) : (this.forceGraph2D && this.forceGraph2D.hide(), this.sceneManager.renderer.domElement.style.display = "block", this.rendererManager.start()), this.emit("viewChange", e));
   }
@@ -3546,18 +3827,18 @@ class Ht {
       const i = parseFloat(t.value) / 100;
       this.setPhysicsParams({ damping: i }), this.devControls.querySelector("#dev-damping-val").textContent = i.toFixed(2);
     }), setInterval(() => {
-      const i = this.devControls.querySelector("#dev-node-count"), o = this.devControls.querySelector("#dev-edge-count"), a = this.devControls.querySelector("#dev-fps");
-      i && (i.textContent = this.getNodeCount().toString()), o && (o.textContent = this.getEdgeCount().toString()), a && (a.textContent = this.rendererManager.getFPS().toString());
+      const i = this.devControls.querySelector("#dev-node-count"), o = this.devControls.querySelector("#dev-edge-count"), n = this.devControls.querySelector("#dev-fps");
+      i && (i.textContent = this.getNodeCount().toString()), o && (o.textContent = this.getEdgeCount().toString()), n && (n.textContent = this.rendererManager.getFPS().toString());
     }, 500);
   }
   /**
    * Destroys the graph and releases all resources
    */
   destroy() {
-    this.rendererManager.dispose(), this.panelManager.dispose(), this.raycasterManager.dispose(), this.edgeTooltipManager.dispose(), this.searchManager && this.searchManager.dispose(), this.viewToggleManager && this.viewToggleManager.dispose(), this.forceGraph2D && this.forceGraph2D.dispose(), this.edgeManager.dispose(), this.nodeManager.dispose(), this.nodeFactory.dispose(), this.materialFactory.dispose(), this.sceneManager.dispose(), this.devControls && this.devControls.parentNode && this.devControls.parentNode.removeChild(this.devControls), this.eventCallbacks.clear(), this.initialized = !1;
+    this.rendererManager.dispose(), this.panelManager.dispose(), this.raycasterManager.dispose(), this.edgeTooltipManager.dispose(), this.searchManager && this.searchManager.dispose(), this.viewToggleManager && this.viewToggleManager.dispose(), this.legendManager && this.legendManager.dispose(), this.forceGraph2D && this.forceGraph2D.dispose(), this.edgeManager.dispose(), this.nodeManager.dispose(), this.nodeFactory.dispose(), this.materialFactory.dispose(), this.sceneManager.dispose(), this.devControls && this.devControls.parentNode && this.devControls.parentNode.removeChild(this.devControls), this.eventCallbacks.clear(), this.initialized = !1;
   }
 }
-const Oe = [
+const Ie = [
   "Alpha",
   "Beta",
   "Gamma",
@@ -3588,7 +3869,7 @@ const Oe = [
   "Link",
   "Point",
   "Vertex"
-], ee = [
+], J = [
   "connects to",
   "links with",
   "relates to",
@@ -3599,7 +3880,7 @@ const Oe = [
   "partners with",
   "collaborates with",
   "supports"
-], Fe = [
+], Oe = [
   16777215,
   // White
   16750950,
@@ -3611,14 +3892,14 @@ const Oe = [
   16746564
   // Darker tangerine
 ];
-function Dt(d = 30) {
+function At(h = 30) {
   const e = [], s = [];
-  for (let i = 0; i < d; i++) {
-    const o = i < Oe.length ? Oe[i] : `Node ${i + 1}`;
+  for (let i = 0; i < h; i++) {
+    const o = i < Ie.length ? Ie[i] : `Node ${i + 1}`;
     e.push({
       id: `node-${i}`,
       label: o,
-      color: Fe[i % Fe.length],
+      color: Oe[i % Oe.length],
       position: {
         x: (Math.random() - 0.5) * 60,
         y: (Math.random() - 0.5) * 60,
@@ -3626,52 +3907,52 @@ function Dt(d = 30) {
       }
     });
   }
-  for (let i = 1; i < d; i++) {
+  for (let i = 1; i < h; i++) {
     const o = Math.floor(Math.random() * i);
     s.push({
       source: `node-${i}`,
       target: `node-${o}`,
-      relationship: ee[Math.floor(Math.random() * ee.length)]
+      relationship: J[Math.floor(Math.random() * J.length)]
     });
   }
-  const t = Math.floor(d * 0.5);
+  const t = Math.floor(h * 0.5);
   for (let i = 0; i < t; i++) {
-    const o = Math.floor(Math.random() * d);
-    let a = Math.floor(Math.random() * d);
-    o === a && (a = (a + 1) % d);
-    const r = `node-${o}`, c = `node-${a}`;
+    const o = Math.floor(Math.random() * h);
+    let n = Math.floor(Math.random() * h);
+    o === n && (n = (n + 1) % h);
+    const r = `node-${o}`, d = `node-${n}`;
     s.some(
-      (p) => p.source === r && p.target === c || p.source === c && p.target === r
+      (p) => p.source === r && p.target === d || p.source === d && p.target === r
     ) || s.push({
       source: r,
-      target: c,
-      relationship: ee[Math.floor(Math.random() * ee.length)]
+      target: d,
+      relationship: J[Math.floor(Math.random() * J.length)]
     });
   }
   return { nodes: e, edges: s };
 }
-function At(d = 1e3) {
-  const e = [], s = [], t = Math.ceil(d / 50), i = [];
+function jt(h = 1e3) {
+  const e = [], s = [], t = Math.ceil(h / 50), i = [];
   for (let o = 0; o < t; o++)
     i.push({
       x: (Math.random() - 0.5) * 200,
       y: (Math.random() - 0.5) * 200,
       z: (Math.random() - 0.5) * 200
     });
-  for (let o = 0; o < d; o++) {
-    const a = i[o % t];
+  for (let o = 0; o < h; o++) {
+    const n = i[o % t];
     e.push({
       id: `node-${o}`,
       label: `N${o}`,
       position: {
-        x: a.x + (Math.random() - 0.5) * 40,
-        y: a.y + (Math.random() - 0.5) * 40,
-        z: a.z + (Math.random() - 0.5) * 40
+        x: n.x + (Math.random() - 0.5) * 40,
+        y: n.y + (Math.random() - 0.5) * 40,
+        z: n.z + (Math.random() - 0.5) * 40
       }
     });
   }
-  for (let o = 1; o < d; o++) {
-    const a = Math.floor(o / 50) * 50, r = a === 0 ? Math.floor(Math.random() * o) : a + Math.floor(Math.random() * Math.min(o - a, 50));
+  for (let o = 1; o < h; o++) {
+    const n = Math.floor(o / 50) * 50, r = n === 0 ? Math.floor(Math.random() * o) : n + Math.floor(Math.random() * Math.min(o - n, 50));
     s.push({
       source: `node-${o}`,
       target: `node-${Math.min(r, o - 1)}`,
@@ -3679,9 +3960,9 @@ function At(d = 1e3) {
     });
   }
   for (let o = 1; o < t; o++) {
-    const a = o * 50, r = (o - 1) * 50 + Math.floor(Math.random() * 50);
+    const n = o * 50, r = (o - 1) * 50 + Math.floor(Math.random() * 50);
     s.push({
-      source: `node-${a}`,
+      source: `node-${n}`,
       target: `node-${r}`,
       relationship: "bridges to"
     });
@@ -3691,11 +3972,11 @@ function At(d = 1e3) {
 export {
   P as DEFAULT_OPTIONS,
   Ht as ForceGraph3D,
-  X as LODLevel,
-  D as createEdgeKey,
-  At as generateLargeSampleData,
-  Dt as generateSampleData,
+  _ as LODLevel,
+  Dt as createEdgeKey,
+  jt as generateLargeSampleData,
+  At as generateSampleData,
   De as validateEdgeData,
-  He as validateNodeData
+  Fe as validateNodeData
 };
 //# sourceMappingURL=force-3d-graph.js.map