elseware-ui 2.20.0 → 2.20.1

package/build/components/data-display/graphs/types.d.ts

@@ -19,9 +19,9 @@ export interface GraphNodeType {
 }
 export interface GraphEdgeType {
     id?: string;
-    source: string | GraphNodeType;
-    target: string | GraphNodeType;
-    label?: string;
+    from: string | GraphNodeType;
+    to: string | GraphNodeType;
+    weight?: string;
     color?: string;
     width?: number;
 }

package/build/index.es.js

@@ -21023,8 +21023,14 @@ new Transform$1(1, 0, 0);
 Transform$1.prototype;
 
 var createForceLayout = function (nodes, edges, width, height) {
+    // Convert app edges -> D3 compatible edges
+    var d3Links = edges.map(function (e) { return ({
+        source: typeof e.from === "string" ? e.from : e.from.id,
+        target: typeof e.to === "string" ? e.to : e.to.id,
+        weight: e.weight,
+    }); });
     return simulation(nodes)
-        .force("link", link$2(edges)
+        .force("link", link$2(d3Links)
         .id(function (d) { return d.id; })
         .distance(120)
         .strength(0.7))
@@ -21046,7 +21052,7 @@ function createTreeLayout(nodes, edges, width, height) {
     levelMap[root.id] = 0;
     edges.forEach(function (edge) {
         var _a;
-        levelMap[edge.target] = ((_a = levelMap[edge.source]) !== null && _a !== void 0 ? _a : 0) + 1;
+        levelMap[edge.to] = ((_a = levelMap[edge.from]) !== null && _a !== void 0 ? _a : 0) + 1;
     });
     var maxLevel = Math.max.apply(Math, Object.values(levelMap));
     var levelGroups = {};
@@ -21096,14 +21102,14 @@ function isNode$1(obj) {
 }
 var GraphEdge = function (_a) {
     var edge = _a.edge, nodes = _a.nodes;
-    // ---------- Resolve source ----------
-    var sourceNode = isNode$1(edge.source)
-        ? edge.source
-        : nodes.find(function (n) { return n.id === edge.source; });
-    // ---------- Resolve target ----------
-    var targetNode = isNode$1(edge.target)
-        ? edge.target
-        : nodes.find(function (n) { return n.id === edge.target; });
+    // ---------- Resolve FROM ----------
+    var sourceNode = isNode$1(edge.from)
+        ? edge.from
+        : nodes.find(function (n) { return n.id === edge.from; });
+    // ---------- Resolve TO ----------
+    var targetNode = isNode$1(edge.to)
+        ? edge.to
+        : nodes.find(function (n) { return n.id === edge.to; });
     if (!sourceNode || !targetNode)
         return null;
     if (sourceNode.x == null ||
@@ -21112,7 +21118,12 @@ var GraphEdge = function (_a) {
         targetNode.y == null) {
         return null;
     }
-    return (jsx("line", { x1: sourceNode.x, y1: sourceNode.y, x2: targetNode.x, y2: targetNode.y, stroke: "#64748b", strokeWidth: 1.5, opacity: 0.85, vectorEffect: "non-scaling-stroke" }));
+    // ---------- Label position (center of edge) ----------
+    var labelX = (sourceNode.x + targetNode.x) / 2;
+    var labelY = (sourceNode.y + targetNode.y) / 2;
+    return (jsxs("g", { children: [jsx("line", { x1: sourceNode.x, y1: sourceNode.y, x2: targetNode.x, y2: targetNode.y, stroke: "#64748b", strokeWidth: 1.5, opacity: 0.85, vectorEffect: "non-scaling-stroke" }), edge.weight && (jsx("text", __assign$1({ x: labelX, y: labelY - 4, textAnchor: "middle", fontSize: 10, fill: "#e5e7eb", pointerEvents: "none", style: {
+                    userSelect: "none",
+                } }, { children: edge.weight })))] }));
 };
 
 var GraphRenderer = function (_a) {

package/build/index.js

@@ -21050,8 +21050,14 @@ new Transform$1(1, 0, 0);
 Transform$1.prototype;
 
 var createForceLayout = function (nodes, edges, width, height) {
+    // Convert app edges -> D3 compatible edges
+    var d3Links = edges.map(function (e) { return ({
+        source: typeof e.from === "string" ? e.from : e.from.id,
+        target: typeof e.to === "string" ? e.to : e.to.id,
+        weight: e.weight,
+    }); });
     return simulation(nodes)
-        .force("link", link$2(edges)
+        .force("link", link$2(d3Links)
         .id(function (d) { return d.id; })
         .distance(120)
         .strength(0.7))
@@ -21073,7 +21079,7 @@ function createTreeLayout(nodes, edges, width, height) {
     levelMap[root.id] = 0;
     edges.forEach(function (edge) {
         var _a;
-        levelMap[edge.target] = ((_a = levelMap[edge.source]) !== null && _a !== void 0 ? _a : 0) + 1;
+        levelMap[edge.to] = ((_a = levelMap[edge.from]) !== null && _a !== void 0 ? _a : 0) + 1;
     });
     var maxLevel = Math.max.apply(Math, Object.values(levelMap));
     var levelGroups = {};
@@ -21123,14 +21129,14 @@ function isNode$1(obj) {
 }
 var GraphEdge = function (_a) {
     var edge = _a.edge, nodes = _a.nodes;
-    // ---------- Resolve source ----------
-    var sourceNode = isNode$1(edge.source)
-        ? edge.source
-        : nodes.find(function (n) { return n.id === edge.source; });
-    // ---------- Resolve target ----------
-    var targetNode = isNode$1(edge.target)
-        ? edge.target
-        : nodes.find(function (n) { return n.id === edge.target; });
+    // ---------- Resolve FROM ----------
+    var sourceNode = isNode$1(edge.from)
+        ? edge.from
+        : nodes.find(function (n) { return n.id === edge.from; });
+    // ---------- Resolve TO ----------
+    var targetNode = isNode$1(edge.to)
+        ? edge.to
+        : nodes.find(function (n) { return n.id === edge.to; });
     if (!sourceNode || !targetNode)
         return null;
     if (sourceNode.x == null ||
@@ -21139,7 +21145,12 @@ var GraphEdge = function (_a) {
         targetNode.y == null) {
         return null;
     }
-    return (jsxRuntime.jsx("line", { x1: sourceNode.x, y1: sourceNode.y, x2: targetNode.x, y2: targetNode.y, stroke: "#64748b", strokeWidth: 1.5, opacity: 0.85, vectorEffect: "non-scaling-stroke" }));
+    // ---------- Label position (center of edge) ----------
+    var labelX = (sourceNode.x + targetNode.x) / 2;
+    var labelY = (sourceNode.y + targetNode.y) / 2;
+    return (jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("line", { x1: sourceNode.x, y1: sourceNode.y, x2: targetNode.x, y2: targetNode.y, stroke: "#64748b", strokeWidth: 1.5, opacity: 0.85, vectorEffect: "non-scaling-stroke" }), edge.weight && (jsxRuntime.jsx("text", __assign$1({ x: labelX, y: labelY - 4, textAnchor: "middle", fontSize: 10, fill: "#e5e7eb", pointerEvents: "none", style: {
+                    userSelect: "none",
+                } }, { children: edge.weight })))] }));
 };
 
 var GraphRenderer = function (_a) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "elseware-ui",
-  "version": "2.20.0",
+  "version": "2.20.1",
   "private": false,
   "description": "A modern and customizable React UI component library by elseware Technology.",
   "keywords": [