system-canvas-react 0.2.13 → 0.2.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/EdgeRenderer.d.ts.map +1 -1
- package/dist/components/EdgeRenderer.js +7 -3
- package/dist/components/EdgeRenderer.js.map +1 -1
- package/dist/hooks/__tests__/selfLoop.test.d.ts +2 -0
- package/dist/hooks/__tests__/selfLoop.test.d.ts.map +1 -0
- package/dist/hooks/__tests__/selfLoop.test.js +94 -0
- package/dist/hooks/__tests__/selfLoop.test.js.map +1 -0
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EdgeRenderer.d.ts","sourceRoot":"","sources":["../../src/components/EdgeRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EACV,UAAU,EACV,YAAY,EACZ,WAAW,EACX,SAAS,EACV,MAAM,eAAe,CAAA;AAQtB,UAAU,iBAAiB;IACzB,KAAK,EAAE,UAAU,EAAE,CAAA;IACnB,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,CAAA;IAClC,KAAK,EAAE,WAAW,CAAA;IAClB,gBAAgB,EAAE,SAAS,CAAA;IAC3B,OAAO,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IAC5D,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IACnE,aAAa,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IAClE,wDAAwD;IACxD,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,6EAA6E;IAC7E,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,iHAAiH;IACjH,aAAa,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IAC3B,6EAA6E;IAC7E,cAAc,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAC/D;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,KAAK,EACL,gBAAgB,EAChB,OAAO,EACP,aAAa,EACb,aAAa,EACb,UAAU,EACV,SAAS,EACT,aAAa,EACb,cAAc,GACf,EAAE,iBAAiB,
|
|
1
|
+
{"version":3,"file":"EdgeRenderer.d.ts","sourceRoot":"","sources":["../../src/components/EdgeRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EACV,UAAU,EACV,YAAY,EACZ,WAAW,EACX,SAAS,EACV,MAAM,eAAe,CAAA;AAQtB,UAAU,iBAAiB;IACzB,KAAK,EAAE,UAAU,EAAE,CAAA;IACnB,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,CAAA;IAClC,KAAK,EAAE,WAAW,CAAA;IAClB,gBAAgB,EAAE,SAAS,CAAA;IAC3B,OAAO,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IAC5D,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IACnE,aAAa,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IAClE,wDAAwD;IACxD,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,6EAA6E;IAC7E,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,iHAAiH;IACjH,aAAa,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IAC3B,6EAA6E;IAC7E,cAAc,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAC/D;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,KAAK,EACL,gBAAgB,EAChB,OAAO,EACP,aAAa,EACb,aAAa,EACb,UAAU,EACV,SAAS,EACT,aAAa,EACb,cAAc,GACf,EAAE,iBAAiB,2CAyJnB"}
|
|
@@ -1,11 +1,15 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { computeEdgePath, computeEdgeMidpoint, resolveColor, measureTextWidth, } from 'system-canvas';
|
|
3
3
|
/**
|
|
4
4
|
* Renders all edges. Edges are drawn before nodes in the SVG so they
|
|
5
5
|
* appear behind node rectangles (painter's model).
|
|
6
6
|
*/
|
|
7
7
|
export function EdgeRenderer({ edges, nodeMap, theme, defaultEdgeStyle, onClick, onDoubleClick, onContextMenu, selectedId, editingId, dimmedNodeIds, parallelGroups, }) {
|
|
8
|
-
return (_jsxs(_Fragment, { children: [
|
|
8
|
+
return (_jsxs(_Fragment, { children: [_jsxs("defs", { children: [_jsx("style", { children: `
|
|
9
|
+
@keyframes system-canvas-march {
|
|
10
|
+
to { stroke-dashoffset: -20; }
|
|
11
|
+
}
|
|
12
|
+
` }), _jsx("marker", { id: "system-canvas-arrowhead", markerWidth: theme.edge.arrowSize, markerHeight: theme.edge.arrowSize * 0.7, refX: theme.edge.arrowSize - 1, refY: theme.edge.arrowSize * 0.35, orient: "auto", markerUnits: "userSpaceOnUse", children: _jsx("polygon", { points: `0 0, ${theme.edge.arrowSize} ${theme.edge.arrowSize * 0.35}, 0 ${theme.edge.arrowSize * 0.7}`, fill: "context-stroke" }) })] }), [...edges]
|
|
9
13
|
.map((edge, i) => ({ edge, i }))
|
|
10
14
|
.sort((a, b) => {
|
|
11
15
|
const aSel = selectedId === a.edge.id ? 2 : 0;
|
|
@@ -44,7 +48,7 @@ export function EdgeRenderer({ edges, nodeMap, theme, defaultEdgeStyle, onClick,
|
|
|
44
48
|
const fromEnd = edge.fromEnd ?? 'none';
|
|
45
49
|
const arrowId = 'system-canvas-arrowhead';
|
|
46
50
|
const isEdgeDimmed = (dimmedNodeIds?.has(edge.fromNode) || dimmedNodeIds?.has(edge.toNode)) ?? false;
|
|
47
|
-
return (_jsxs("g", { className: "system-canvas-edge", style: { cursor: 'pointer' }, onClick: (e) => onClick(edge, e), onDoubleClick: (e) => onDoubleClick?.(edge, e), onContextMenu: (e) => onContextMenu(edge, e), children: [_jsx("path", { d: pathD, fill: "none", stroke: "transparent", strokeWidth: 12 }), _jsx("path", { d: pathD, fill: "none", stroke: edgeColor, strokeWidth: strokeWidth, strokeDasharray: isEdgeDimmed ? '4 4' : undefined, strokeOpacity: isEdgeDimmed ? 0.3 : 1, markerEnd: toEnd === 'arrow' ? `url(#${arrowId})` : undefined, markerStart: fromEnd === 'arrow' ? `url(#${arrowId})` : undefined }), edge.label && !isEditing && (_jsx(_Fragment, { children: (() => {
|
|
51
|
+
return (_jsxs("g", { className: "system-canvas-edge", style: { cursor: 'pointer' }, onClick: (e) => onClick(edge, e), onDoubleClick: (e) => onDoubleClick?.(edge, e), onContextMenu: (e) => onContextMenu(edge, e), children: [_jsx("path", { d: pathD, fill: "none", stroke: "transparent", strokeWidth: 12 }), _jsx("path", { d: pathD, fill: "none", stroke: edgeColor, strokeWidth: strokeWidth, strokeDasharray: edge.animated ? '6 4' : (isEdgeDimmed ? '4 4' : undefined), style: edge.animated ? { animation: 'system-canvas-march 0.6s linear infinite' } : undefined, strokeOpacity: isEdgeDimmed ? 0.3 : 1, markerEnd: toEnd === 'arrow' ? `url(#${arrowId})` : undefined, markerStart: fromEnd === 'arrow' ? `url(#${arrowId})` : undefined }), edge.label && !isEditing && (_jsx(_Fragment, { children: (() => {
|
|
48
52
|
const labelFontSize = theme.edge.labelFontSize;
|
|
49
53
|
const pillPadX = 8;
|
|
50
54
|
const pillPadY = 3;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EdgeRenderer.js","sourceRoot":"","sources":["../../src/components/EdgeRenderer.tsx"],"names":[],"mappings":";AAOA,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,YAAY,EACZ,gBAAgB,GACjB,MAAM,eAAe,CAAA;AAoBtB;;;GAGG;AACH,MAAM,UAAU,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,KAAK,EACL,gBAAgB,EAChB,OAAO,EACP,aAAa,EACb,aAAa,EACb,UAAU,EACV,SAAS,EACT,aAAa,EACb,cAAc,GACI;IAClB,OAAO,CACL,8BAOE,
|
|
1
|
+
{"version":3,"file":"EdgeRenderer.js","sourceRoot":"","sources":["../../src/components/EdgeRenderer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"selfLoop.test.d.ts","sourceRoot":"","sources":["../../../src/hooks/__tests__/selfLoop.test.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
import { describe, it, expect } from 'vitest';
|
|
2
|
+
import { computeSelfLoopPath, computeEdgePath, computeEdgeMidpoint } from 'system-canvas';
|
|
3
|
+
function makeNode(overrides = {}) {
|
|
4
|
+
return {
|
|
5
|
+
id: 'n1',
|
|
6
|
+
type: 'text',
|
|
7
|
+
x: 100,
|
|
8
|
+
y: 100,
|
|
9
|
+
width: 200,
|
|
10
|
+
height: 100,
|
|
11
|
+
text: 'Node',
|
|
12
|
+
resolvedFill: '#fff',
|
|
13
|
+
resolvedStroke: '#000',
|
|
14
|
+
...overrides,
|
|
15
|
+
};
|
|
16
|
+
}
|
|
17
|
+
function makeEdge(overrides = {}) {
|
|
18
|
+
return {
|
|
19
|
+
id: 'e1',
|
|
20
|
+
fromNode: 'n1',
|
|
21
|
+
toNode: 'n1',
|
|
22
|
+
...overrides,
|
|
23
|
+
};
|
|
24
|
+
}
|
|
25
|
+
describe('computeSelfLoopPath', () => {
|
|
26
|
+
it('returns a non-empty SVG d string starting with M', () => {
|
|
27
|
+
const node = makeNode();
|
|
28
|
+
const path = computeSelfLoopPath(node);
|
|
29
|
+
expect(path).toBeTruthy();
|
|
30
|
+
expect(path.trimStart()).toMatch(/^M /);
|
|
31
|
+
});
|
|
32
|
+
it('contains a cubic bezier segment (C command)', () => {
|
|
33
|
+
const node = makeNode();
|
|
34
|
+
const path = computeSelfLoopPath(node);
|
|
35
|
+
expect(path).toContain(' C ');
|
|
36
|
+
});
|
|
37
|
+
it('scales loop size with node dimensions', () => {
|
|
38
|
+
const small = makeNode({ width: 100, height: 50 });
|
|
39
|
+
const large = makeNode({ width: 400, height: 200 });
|
|
40
|
+
const smallPath = computeSelfLoopPath(small);
|
|
41
|
+
const largePath = computeSelfLoopPath(large);
|
|
42
|
+
// cp1y is the 5th token in the path string (after "M x y C cp1x")
|
|
43
|
+
const getCP1Y = (d) => parseFloat(d.split(' ')[4]);
|
|
44
|
+
expect(Math.abs(getCP1Y(largePath))).toBeGreaterThan(Math.abs(getCP1Y(smallPath)));
|
|
45
|
+
});
|
|
46
|
+
it('respects the exitSide parameter', () => {
|
|
47
|
+
const node = makeNode();
|
|
48
|
+
const topPath = computeSelfLoopPath(node, 'top');
|
|
49
|
+
const rightPath = computeSelfLoopPath(node, 'right');
|
|
50
|
+
expect(topPath).not.toBe(rightPath);
|
|
51
|
+
});
|
|
52
|
+
});
|
|
53
|
+
describe('computeEdgePath with self-loop', () => {
|
|
54
|
+
it('returns same result as computeSelfLoopPath when fromNode === toNode', () => {
|
|
55
|
+
const node = makeNode();
|
|
56
|
+
const edge = makeEdge();
|
|
57
|
+
expect(computeEdgePath(edge, node, node)).toBe(computeSelfLoopPath(node, 'top'));
|
|
58
|
+
});
|
|
59
|
+
it('uses edge.fromSide to control loop exit direction', () => {
|
|
60
|
+
const node = makeNode();
|
|
61
|
+
const edgeTop = makeEdge({ fromSide: 'top' });
|
|
62
|
+
const edgeRight = makeEdge({ fromSide: 'right' });
|
|
63
|
+
expect(computeEdgePath(edgeTop, node, node)).toBe(computeSelfLoopPath(node, 'top'));
|
|
64
|
+
expect(computeEdgePath(edgeRight, node, node)).toBe(computeSelfLoopPath(node, 'right'));
|
|
65
|
+
});
|
|
66
|
+
it('does not regress on normal edges (fromNode !== toNode)', () => {
|
|
67
|
+
const from = makeNode({ id: 'a', x: 0, y: 0 });
|
|
68
|
+
const to = makeNode({ id: 'b', x: 400, y: 0 });
|
|
69
|
+
const edge = { id: 'e2', fromNode: 'a', toNode: 'b' };
|
|
70
|
+
const path = computeEdgePath(edge, from, to);
|
|
71
|
+
expect(path).toMatch(/^M /);
|
|
72
|
+
expect(path).not.toContain('NaN');
|
|
73
|
+
});
|
|
74
|
+
});
|
|
75
|
+
describe('computeEdgeMidpoint with self-loop', () => {
|
|
76
|
+
it('returns a point outside the node bounding box (the arc tip)', () => {
|
|
77
|
+
const node = makeNode({ x: 100, y: 100, width: 200, height: 100 });
|
|
78
|
+
const edge = makeEdge();
|
|
79
|
+
const mid = computeEdgeMidpoint(edge, node, node);
|
|
80
|
+
const outsideBox = mid.x < node.x ||
|
|
81
|
+
mid.x > node.x + node.width ||
|
|
82
|
+
mid.y < node.y ||
|
|
83
|
+
mid.y > node.y + node.height;
|
|
84
|
+
expect(outsideBox).toBe(true);
|
|
85
|
+
});
|
|
86
|
+
it('returns a valid finite numeric point', () => {
|
|
87
|
+
const node = makeNode();
|
|
88
|
+
const edge = makeEdge();
|
|
89
|
+
const mid = computeEdgeMidpoint(edge, node, node);
|
|
90
|
+
expect(Number.isFinite(mid.x)).toBe(true);
|
|
91
|
+
expect(Number.isFinite(mid.y)).toBe(true);
|
|
92
|
+
});
|
|
93
|
+
});
|
|
94
|
+
//# sourceMappingURL=selfLoop.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"selfLoop.test.js","sourceRoot":"","sources":["../../../src/hooks/__tests__/selfLoop.test.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "system-canvas-react",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.15",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"d3-selection": "^3.0.0",
|
|
36
36
|
"d3-transition": "^3.0.0",
|
|
37
37
|
"d3-zoom": "^3.0.0",
|
|
38
|
-
"system-canvas": "^0.2.
|
|
38
|
+
"system-canvas": "^0.2.15"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
41
|
"react": "^18.0.0 || ^19.0.0",
|