@almadar/ui 5.116.1 → 5.118.0

package/dist/runtime/index.cjs

@@ -34744,6 +34744,23 @@ function getGroupColor(group, groups) {
   const idx = groups.indexOf(group);
   return GROUP_COLORS2[idx % GROUP_COLORS2.length];
 }
+function hashSeed(str) {
+  let h = 1779033703 ^ str.length;
+  for (let i = 0; i < str.length; i++) {
+    h = Math.imul(h ^ str.charCodeAt(i), 3432918353);
+    h = h << 13 | h >>> 19;
+  }
+  return (h ^= h >>> 16) >>> 0;
+}
+function mulberry32(a) {
+  return function() {
+    a |= 0;
+    a = a + 1831565813 | 0;
+    let t = Math.imul(a ^ a >>> 15, 1 | a);
+    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
 function resolveColor3(color, el) {
   const m = /^var\((--[^,)]+)(?:,\s*([^)]+))?\)$/.exec(color.trim());
   if (!m) return color;
@@ -34775,6 +34792,7 @@ var init_GraphCanvas = __esm({
       title,
       nodes: propNodes = [],
       edges: propEdges = [],
+      similarity: propSimilarity = [],
       height = 400,
       showLabels = true,
       interactive = true,
@@ -34806,6 +34824,7 @@ var init_GraphCanvas = __esm({
       offsetRef.current = offset;
       const [hoveredNode, setHoveredNode] = React81.useState(null);
       const nodesRef = React81.useRef([]);
+      const laidOutRef = React81.useRef(false);
       const [, forceUpdate] = React81.useState(0);
       const [logicalW, setLogicalW] = React81.useState(800);
       React81.useEffect(() => {
@@ -34894,13 +34913,19 @@ var init_GraphCanvas = __esm({
               x = gapX * (idx % cols + 1);
               y = gapY * (Math.floor(idx / cols) + 1);
             } else {
-              x = w * 0.2 + Math.random() * w * 0.6;
-              y = h * 0.2 + Math.random() * h * 0.6;
+              const rand = mulberry32(hashSeed(n.id));
+              x = w * 0.2 + rand() * w * 0.6;
+              y = h * 0.2 + rand() * h * 0.6;
             }
           }
           return { ...n, x, y, vx: 0, vy: 0, fx: 0, fy: 0 };
         });
         nodesRef.current = simNodes;
+        const prevIds = /* @__PURE__ */ new Set([...prevPos.keys()]);
+        const newIdList = simNodes.map((n) => n.id);
+        const kept = newIdList.filter((id) => prevIds.has(id)).length;
+        const overlap = prevIds.size === 0 ? 0 : kept / Math.max(prevIds.size, newIdList.length);
+        const fullRelayout = !laidOutRef.current || overlap < 0.5;
         if (layout === "force") {
           const maxIterations = 300;
           const tick = () => {
@@ -34925,22 +34950,43 @@ var init_GraphCanvas = __esm({
                 nodes[j].fy += fy;
               }
             }
-            for (const edge of propEdges) {
-              const source = nodes.find((n) => n.id === edge.source);
-              const target = nodes.find((n) => n.id === edge.target);
-              if (!source || !target) continue;
-              const dx = target.x - source.x;
-              const dy = target.y - source.y;
-              const dist = Math.sqrt(dx * dx + dy * dy) || 1;
-              const w2 = Math.min(1, Math.max(0, edge.weight ?? 1));
-              const linkTarget = linkDistance * (0.5 + (1 - w2) * 1.5);
-              const force = (dist - linkTarget) * (0.04 + 0.1 * w2);
-              const fx = dx / dist * force;
-              const fy = dy / dist * force;
-              source.fx += fx;
-              source.fy += fy;
-              target.fx -= fx;
-              target.fy -= fy;
+            const nodeById = new Map(nodes.map((n) => [n.id, n]));
+            if (propSimilarity.length > 0) {
+              for (const pair of propSimilarity) {
+                const source = nodeById.get(pair.source);
+                const target = nodeById.get(pair.target);
+                if (!source || !target) continue;
+                const dx = target.x - source.x;
+                const dy = target.y - source.y;
+                const dist = Math.sqrt(dx * dx + dy * dy) || 1;
+                const w2 = Math.min(1, Math.max(0, pair.weight));
+                const linkTarget = linkDistance * (1 - w2);
+                const force = (dist - linkTarget) * (0.04 + 0.1 * w2);
+                const fx = dx / dist * force;
+                const fy = dy / dist * force;
+                source.fx += fx;
+                source.fy += fy;
+                target.fx -= fx;
+                target.fy -= fy;
+              }
+            } else {
+              for (const edge of propEdges) {
+                const source = nodeById.get(edge.source);
+                const target = nodeById.get(edge.target);
+                if (!source || !target) continue;
+                const dx = target.x - source.x;
+                const dy = target.y - source.y;
+                const dist = Math.sqrt(dx * dx + dy * dy) || 1;
+                const w2 = Math.min(1, Math.max(0, edge.weight ?? 1));
+                const linkTarget = linkDistance * (0.5 + (1 - w2) * 1.5);
+                const force = (dist - linkTarget) * (0.04 + 0.1 * w2);
+                const fx = dx / dist * force;
+                const fy = dy / dist * force;
+                source.fx += fx;
+                source.fy += fy;
+                target.fx -= fx;
+                target.fy -= fy;
+              }
             }
             const centroids = /* @__PURE__ */ new Map();
             for (const node of nodes) {
@@ -35007,7 +35053,38 @@ var init_GraphCanvas = __esm({
               }
             }
           };
-          for (let i = 0; i < maxIterations; i++) tick();
+          if (fullRelayout) {
+            for (let i = 0; i < maxIterations; i++) tick();
+            laidOutRef.current = true;
+          } else {
+            const centroids = /* @__PURE__ */ new Map();
+            for (const node of simNodes) {
+              if (!prevPos.has(node.id)) continue;
+              const g = node.group ?? "__none__";
+              let c = centroids.get(g);
+              if (!c) {
+                c = { x: 0, y: 0, n: 0 };
+                centroids.set(g, c);
+              }
+              c.x += node.x;
+              c.y += node.y;
+              c.n += 1;
+            }
+            const ringCount = /* @__PURE__ */ new Map();
+            for (const node of simNodes) {
+              if (prevPos.has(node.id)) continue;
+              const g = node.group ?? "__none__";
+              const c = centroids.get(g);
+              const cx = c && c.n > 0 ? c.x / c.n : w / 2;
+              const cy = c && c.n > 0 ? c.y / c.n : h / 2;
+              const k = ringCount.get(g) ?? 0;
+              ringCount.set(g, k + 1);
+              const angle = k * 2.399963;
+              const r = 22 + k * 8;
+              node.x = Math.max(30, Math.min(w - 30, cx + r * Math.cos(angle)));
+              node.y = Math.max(30, Math.min(h - 30, cy + r * Math.sin(angle)));
+            }
+          }
           forceUpdate((n) => n + 1);
         } else {
           forceUpdate((n) => n + 1);
@@ -35015,7 +35092,7 @@ var init_GraphCanvas = __esm({
         return () => {
           cancelAnimationFrame(animRef.current);
         };
-      }, [propNodes, propEdges, layout, repulsion, linkDistance, nodeSpacing, showLabels, logicalW, height]);
+      }, [propNodes, propEdges, propSimilarity, layout, repulsion, linkDistance, nodeSpacing, showLabels]);
       React81.useEffect(() => {
         const canvas = canvasRef.current;
         if (!canvas) return;

package/dist/runtime/index.js

@@ -34700,6 +34700,23 @@ function getGroupColor(group, groups) {
   const idx = groups.indexOf(group);
   return GROUP_COLORS2[idx % GROUP_COLORS2.length];
 }
+function hashSeed(str) {
+  let h = 1779033703 ^ str.length;
+  for (let i = 0; i < str.length; i++) {
+    h = Math.imul(h ^ str.charCodeAt(i), 3432918353);
+    h = h << 13 | h >>> 19;
+  }
+  return (h ^= h >>> 16) >>> 0;
+}
+function mulberry32(a) {
+  return function() {
+    a |= 0;
+    a = a + 1831565813 | 0;
+    let t = Math.imul(a ^ a >>> 15, 1 | a);
+    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
 function resolveColor3(color, el) {
   const m = /^var\((--[^,)]+)(?:,\s*([^)]+))?\)$/.exec(color.trim());
   if (!m) return color;
@@ -34731,6 +34748,7 @@ var init_GraphCanvas = __esm({
       title,
       nodes: propNodes = [],
       edges: propEdges = [],
+      similarity: propSimilarity = [],
       height = 400,
       showLabels = true,
       interactive = true,
@@ -34762,6 +34780,7 @@ var init_GraphCanvas = __esm({
       offsetRef.current = offset;
       const [hoveredNode, setHoveredNode] = useState(null);
       const nodesRef = useRef([]);
+      const laidOutRef = useRef(false);
       const [, forceUpdate] = useState(0);
       const [logicalW, setLogicalW] = useState(800);
       useEffect(() => {
@@ -34850,13 +34869,19 @@ var init_GraphCanvas = __esm({
               x = gapX * (idx % cols + 1);
               y = gapY * (Math.floor(idx / cols) + 1);
             } else {
-              x = w * 0.2 + Math.random() * w * 0.6;
-              y = h * 0.2 + Math.random() * h * 0.6;
+              const rand = mulberry32(hashSeed(n.id));
+              x = w * 0.2 + rand() * w * 0.6;
+              y = h * 0.2 + rand() * h * 0.6;
             }
           }
           return { ...n, x, y, vx: 0, vy: 0, fx: 0, fy: 0 };
         });
         nodesRef.current = simNodes;
+        const prevIds = /* @__PURE__ */ new Set([...prevPos.keys()]);
+        const newIdList = simNodes.map((n) => n.id);
+        const kept = newIdList.filter((id) => prevIds.has(id)).length;
+        const overlap = prevIds.size === 0 ? 0 : kept / Math.max(prevIds.size, newIdList.length);
+        const fullRelayout = !laidOutRef.current || overlap < 0.5;
         if (layout === "force") {
           const maxIterations = 300;
           const tick = () => {
@@ -34881,22 +34906,43 @@ var init_GraphCanvas = __esm({
                 nodes[j].fy += fy;
               }
             }
-            for (const edge of propEdges) {
-              const source = nodes.find((n) => n.id === edge.source);
-              const target = nodes.find((n) => n.id === edge.target);
-              if (!source || !target) continue;
-              const dx = target.x - source.x;
-              const dy = target.y - source.y;
-              const dist = Math.sqrt(dx * dx + dy * dy) || 1;
-              const w2 = Math.min(1, Math.max(0, edge.weight ?? 1));
-              const linkTarget = linkDistance * (0.5 + (1 - w2) * 1.5);
-              const force = (dist - linkTarget) * (0.04 + 0.1 * w2);
-              const fx = dx / dist * force;
-              const fy = dy / dist * force;
-              source.fx += fx;
-              source.fy += fy;
-              target.fx -= fx;
-              target.fy -= fy;
+            const nodeById = new Map(nodes.map((n) => [n.id, n]));
+            if (propSimilarity.length > 0) {
+              for (const pair of propSimilarity) {
+                const source = nodeById.get(pair.source);
+                const target = nodeById.get(pair.target);
+                if (!source || !target) continue;
+                const dx = target.x - source.x;
+                const dy = target.y - source.y;
+                const dist = Math.sqrt(dx * dx + dy * dy) || 1;
+                const w2 = Math.min(1, Math.max(0, pair.weight));
+                const linkTarget = linkDistance * (1 - w2);
+                const force = (dist - linkTarget) * (0.04 + 0.1 * w2);
+                const fx = dx / dist * force;
+                const fy = dy / dist * force;
+                source.fx += fx;
+                source.fy += fy;
+                target.fx -= fx;
+                target.fy -= fy;
+              }
+            } else {
+              for (const edge of propEdges) {
+                const source = nodeById.get(edge.source);
+                const target = nodeById.get(edge.target);
+                if (!source || !target) continue;
+                const dx = target.x - source.x;
+                const dy = target.y - source.y;
+                const dist = Math.sqrt(dx * dx + dy * dy) || 1;
+                const w2 = Math.min(1, Math.max(0, edge.weight ?? 1));
+                const linkTarget = linkDistance * (0.5 + (1 - w2) * 1.5);
+                const force = (dist - linkTarget) * (0.04 + 0.1 * w2);
+                const fx = dx / dist * force;
+                const fy = dy / dist * force;
+                source.fx += fx;
+                source.fy += fy;
+                target.fx -= fx;
+                target.fy -= fy;
+              }
             }
             const centroids = /* @__PURE__ */ new Map();
             for (const node of nodes) {
@@ -34963,7 +35009,38 @@ var init_GraphCanvas = __esm({
               }
             }
           };
-          for (let i = 0; i < maxIterations; i++) tick();
+          if (fullRelayout) {
+            for (let i = 0; i < maxIterations; i++) tick();
+            laidOutRef.current = true;
+          } else {
+            const centroids = /* @__PURE__ */ new Map();
+            for (const node of simNodes) {
+              if (!prevPos.has(node.id)) continue;
+              const g = node.group ?? "__none__";
+              let c = centroids.get(g);
+              if (!c) {
+                c = { x: 0, y: 0, n: 0 };
+                centroids.set(g, c);
+              }
+              c.x += node.x;
+              c.y += node.y;
+              c.n += 1;
+            }
+            const ringCount = /* @__PURE__ */ new Map();
+            for (const node of simNodes) {
+              if (prevPos.has(node.id)) continue;
+              const g = node.group ?? "__none__";
+              const c = centroids.get(g);
+              const cx = c && c.n > 0 ? c.x / c.n : w / 2;
+              const cy = c && c.n > 0 ? c.y / c.n : h / 2;
+              const k = ringCount.get(g) ?? 0;
+              ringCount.set(g, k + 1);
+              const angle = k * 2.399963;
+              const r = 22 + k * 8;
+              node.x = Math.max(30, Math.min(w - 30, cx + r * Math.cos(angle)));
+              node.y = Math.max(30, Math.min(h - 30, cy + r * Math.sin(angle)));
+            }
+          }
           forceUpdate((n) => n + 1);
         } else {
           forceUpdate((n) => n + 1);
@@ -34971,7 +35048,7 @@ var init_GraphCanvas = __esm({
         return () => {
           cancelAnimationFrame(animRef.current);
         };
-      }, [propNodes, propEdges, layout, repulsion, linkDistance, nodeSpacing, showLabels, logicalW, height]);
+      }, [propNodes, propEdges, propSimilarity, layout, repulsion, linkDistance, nodeSpacing, showLabels]);
       useEffect(() => {
         const canvas = canvasRef.current;
         if (!canvas) return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@almadar/ui",
-  "version": "5.116.1",
+  "version": "5.118.0",
   "description": "React UI components, hooks, and providers for Almadar",
   "type": "module",
   "sideEffects": [