UNPKG

40.6 kBJavaScriptView Raw
1import { p as parser$1, f as flowDb } from "./flowDb-ab4144b2.js";
2import { h as has, u as uniqueId, r as range, p as pick, l as layout, d as defaults, f as forEach, G as Graph } from "./layout-e57aec3f.js";
3import { j as select, o as curveLinear, p as getStylesFromArray, q as evaluate, c as getConfig, f as common, l as log, r as interpolateToCurve, t as setupGraphViewbox } from "./mermaid-4b4b971d.js";
4import { a as applyStyle, b as addHtmlLabel, i as isSubgraph, c as applyTransition, e as edgeToId, d as applyClass, f as flowRendererV2, g as flowStyles } from "./styles-8f10a3c1.js";
5import { l as line } from "./line-53c588d2.js";
6import { s as selectAll } from "./selectAll-f3da6cb0.js";
7import "./index-f7dc402e.js";
8import "./edges-a0c69811.js";
9import "./createText-b06b2794.js";
10import "./svgDraw-1b15aedc.js";
11import "./array-b7dcf730.js";
12import "./constant-b644328d.js";
13function responseText(response) {
14 if (!response.ok)
15 throw new Error(response.status + " " + response.statusText);
16 return response.text();
17}
18function text(input, init) {
19 return fetch(input, init).then(responseText);
20}
21function parser(type) {
22 return (input, init) => text(input, init).then((text2) => new DOMParser().parseFromString(text2, type));
23}
24var svg = parser("image/svg+xml");
25var arrows = {
26 normal,
27 vee,
28 undirected
29};
30function setArrows(value) {
31 arrows = value;
32}
33function normal(parent, id, edge, type) {
34 var marker = parent.append("marker").attr("id", id).attr("viewBox", "0 0 10 10").attr("refX", 9).attr("refY", 5).attr("markerUnits", "strokeWidth").attr("markerWidth", 8).attr("markerHeight", 6).attr("orient", "auto");
35 var path = marker.append("path").attr("d", "M 0 0 L 10 5 L 0 10 z").style("stroke-width", 1).style("stroke-dasharray", "1,0");
36 applyStyle(path, edge[type + "Style"]);
37 if (edge[type + "Class"]) {
38 path.attr("class", edge[type + "Class"]);
39 }
40}
41function vee(parent, id, edge, type) {
42 var marker = parent.append("marker").attr("id", id).attr("viewBox", "0 0 10 10").attr("refX", 9).attr("refY", 5).attr("markerUnits", "strokeWidth").attr("markerWidth", 8).attr("markerHeight", 6).attr("orient", "auto");
43 var path = marker.append("path").attr("d", "M 0 0 L 10 5 L 0 10 L 4 5 z").style("stroke-width", 1).style("stroke-dasharray", "1,0");
44 applyStyle(path, edge[type + "Style"]);
45 if (edge[type + "Class"]) {
46 path.attr("class", edge[type + "Class"]);
47 }
48}
49function undirected(parent, id, edge, type) {
50 var marker = parent.append("marker").attr("id", id).attr("viewBox", "0 0 10 10").attr("refX", 9).attr("refY", 5).attr("markerUnits", "strokeWidth").attr("markerWidth", 8).attr("markerHeight", 6).attr("orient", "auto");
51 var path = marker.append("path").attr("d", "M 0 5 L 10 5").style("stroke-width", 1).style("stroke-dasharray", "1,0");
52 applyStyle(path, edge[type + "Style"]);
53 if (edge[type + "Class"]) {
54 path.attr("class", edge[type + "Class"]);
55 }
56}
57function addSVGLabel(root, node) {
58 var domNode = root;
59 domNode.node().appendChild(node.label);
60 applyStyle(domNode, node.labelStyle);
61 return domNode;
62}
63function addTextLabel(root, node) {
64 var domNode = root.append("text");
65 var lines = processEscapeSequences(node.label).split("\n");
66 for (var i = 0; i < lines.length; i++) {
67 domNode.append("tspan").attr("xml:space", "preserve").attr("dy", "1em").attr("x", "1").text(lines[i]);
68 }
69 applyStyle(domNode, node.labelStyle);
70 return domNode;
71}
72function processEscapeSequences(text2) {
73 var newText = "";
74 var escaped = false;
75 var ch;
76 for (var i = 0; i < text2.length; ++i) {
77 ch = text2[i];
78 if (escaped) {
79 switch (ch) {
80 case "n":
81 newText += "\n";
82 break;
83 default:
84 newText += ch;
85 }
86 escaped = false;
87 } else if (ch === "\\") {
88 escaped = true;
89 } else {
90 newText += ch;
91 }
92 }
93 return newText;
94}
95function addLabel(root, node, location2) {
96 var label = node.label;
97 var labelSvg = root.append("g");
98 if (node.labelType === "svg") {
99 addSVGLabel(labelSvg, node);
100 } else if (typeof label !== "string" || node.labelType === "html") {
101 addHtmlLabel(labelSvg, node);
102 } else {
103 addTextLabel(labelSvg, node);
104 }
105 var labelBBox = labelSvg.node().getBBox();
106 var y;
107 switch (location2) {
108 case "top":
109 y = -node.height / 2;
110 break;
111 case "bottom":
112 y = node.height / 2 - labelBBox.height;
113 break;
114 default:
115 y = -labelBBox.height / 2;
116 }
117 labelSvg.attr("transform", "translate(" + -labelBBox.width / 2 + "," + y + ")");
118 return labelSvg;
119}
120var createClusters = function(selection, g) {
121 var clusters = g.nodes().filter(function(v) {
122 return isSubgraph(g, v);
123 });
124 var svgClusters = selection.selectAll("g.cluster").data(clusters, function(v) {
125 return v;
126 });
127 applyTransition(svgClusters.exit(), g).style("opacity", 0).remove();
128 var enterSelection = svgClusters.enter().append("g").attr("class", "cluster").attr("id", function(v) {
129 var node = g.node(v);
130 return node.id;
131 }).style("opacity", 0).each(function(v) {
132 var node = g.node(v);
133 var thisGroup = select(this);
134 select(this).append("rect");
135 var labelGroup = thisGroup.append("g").attr("class", "label");
136 addLabel(labelGroup, node, node.clusterLabelPos);
137 });
138 svgClusters = svgClusters.merge(enterSelection);
139 svgClusters = applyTransition(svgClusters, g).style("opacity", 1);
140 svgClusters.selectAll("rect").each(function(c) {
141 var node = g.node(c);
142 var domCluster = select(this);
143 applyStyle(domCluster, node.style);
144 });
145 return svgClusters;
146};
147function setCreateClusters(value) {
148 createClusters = value;
149}
150let createEdgeLabels = function(selection, g) {
151 var svgEdgeLabels = selection.selectAll("g.edgeLabel").data(g.edges(), function(e) {
152 return edgeToId(e);
153 }).classed("update", true);
154 svgEdgeLabels.exit().remove();
155 svgEdgeLabels.enter().append("g").classed("edgeLabel", true).style("opacity", 0);
156 svgEdgeLabels = selection.selectAll("g.edgeLabel");
157 svgEdgeLabels.each(function(e) {
158 var root = select(this);
159 root.select(".label").remove();
160 var edge = g.edge(e);
161 var label = addLabel(root, g.edge(e), 0).classed("label", true);
162 var bbox = label.node().getBBox();
163 if (edge.labelId) {
164 label.attr("id", edge.labelId);
165 }
166 if (!has(edge, "width")) {
167 edge.width = bbox.width;
168 }
169 if (!has(edge, "height")) {
170 edge.height = bbox.height;
171 }
172 });
173 var exitSelection;
174 if (svgEdgeLabels.exit) {
175 exitSelection = svgEdgeLabels.exit();
176 } else {
177 exitSelection = svgEdgeLabels.selectAll(null);
178 }
179 applyTransition(exitSelection, g).style("opacity", 0).remove();
180 return svgEdgeLabels;
181};
182function setCreateEdgeLabels(value) {
183 createEdgeLabels = value;
184}
185function intersectNode(node, point) {
186 return node.intersect(point);
187}
188var createEdgePaths = function(selection, g, arrows2) {
189 var previousPaths = selection.selectAll("g.edgePath").data(g.edges(), function(e) {
190 return edgeToId(e);
191 }).classed("update", true);
192 var newPaths = enter(previousPaths, g);
193 exit(previousPaths, g);
194 var svgPaths = previousPaths.merge !== void 0 ? previousPaths.merge(newPaths) : previousPaths;
195 applyTransition(svgPaths, g).style("opacity", 1);
196 svgPaths.each(function(e) {
197 var domEdge = select(this);
198 var edge = g.edge(e);
199 edge.elem = this;
200 if (edge.id) {
201 domEdge.attr("id", edge.id);
202 }
203 applyClass(
204 domEdge,
205 edge["class"],
206 (domEdge.classed("update") ? "update " : "") + "edgePath"
207 );
208 });
209 svgPaths.selectAll("path.path").each(function(e) {
210 var edge = g.edge(e);
211 edge.arrowheadId = uniqueId("arrowhead");
212 var domEdge = select(this).attr("marker-end", function() {
213 return "url(" + makeFragmentRef(location.href, edge.arrowheadId) + ")";
214 }).style("fill", "none");
215 applyTransition(domEdge, g).attr("d", function(e2) {
216 return calcPoints(g, e2);
217 });
218 applyStyle(domEdge, edge.style);
219 });
220 svgPaths.selectAll("defs *").remove();
221 svgPaths.selectAll("defs").each(function(e) {
222 var edge = g.edge(e);
223 var arrowhead = arrows2[edge.arrowhead];
224 arrowhead(select(this), edge.arrowheadId, edge, "arrowhead");
225 });
226 return svgPaths;
227};
228function setCreateEdgePaths(value) {
229 createEdgePaths = value;
230}
231function makeFragmentRef(url, fragmentId) {
232 var baseUrl = url.split("#")[0];
233 return baseUrl + "#" + fragmentId;
234}
235function calcPoints(g, e) {
236 var edge = g.edge(e);
237 var tail = g.node(e.v);
238 var head = g.node(e.w);
239 var points = edge.points.slice(1, edge.points.length - 1);
240 points.unshift(intersectNode(tail, points[0]));
241 points.push(intersectNode(head, points[points.length - 1]));
242 return createLine(edge, points);
243}
244function createLine(edge, points) {
245 var line$1 = (line || svg.line)().x(function(d) {
246 return d.x;
247 }).y(function(d) {
248 return d.y;
249 });
250 (line$1.curve || line$1.interpolate)(edge.curve);
251 return line$1(points);
252}
253function getCoords(elem) {
254 var bbox = elem.getBBox();
255 var matrix = elem.ownerSVGElement.getScreenCTM().inverse().multiply(elem.getScreenCTM()).translate(bbox.width / 2, bbox.height / 2);
256 return { x: matrix.e, y: matrix.f };
257}
258function enter(svgPaths, g) {
259 var svgPathsEnter = svgPaths.enter().append("g").attr("class", "edgePath").style("opacity", 0);
260 svgPathsEnter.append("path").attr("class", "path").attr("d", function(e) {
261 var edge = g.edge(e);
262 var sourceElem = g.node(e.v).elem;
263 var points = range(edge.points.length).map(function() {
264 return getCoords(sourceElem);
265 });
266 return createLine(edge, points);
267 });
268 svgPathsEnter.append("defs");
269 return svgPathsEnter;
270}
271function exit(svgPaths, g) {
272 var svgPathExit = svgPaths.exit();
273 applyTransition(svgPathExit, g).style("opacity", 0).remove();
274}
275var createNodes = function(selection, g, shapes2) {
276 var simpleNodes = g.nodes().filter(function(v) {
277 return !isSubgraph(g, v);
278 });
279 var svgNodes = selection.selectAll("g.node").data(simpleNodes, function(v) {
280 return v;
281 }).classed("update", true);
282 svgNodes.exit().remove();
283 svgNodes.enter().append("g").attr("class", "node").style("opacity", 0);
284 svgNodes = selection.selectAll("g.node");
285 svgNodes.each(function(v) {
286 var node = g.node(v);
287 var thisGroup = select(this);
288 applyClass(
289 thisGroup,
290 node["class"],
291 (thisGroup.classed("update") ? "update " : "") + "node"
292 );
293 thisGroup.select("g.label").remove();
294 var labelGroup = thisGroup.append("g").attr("class", "label");
295 var labelDom = addLabel(labelGroup, node);
296 var shape = shapes2[node.shape];
297 var bbox = pick(labelDom.node().getBBox(), "width", "height");
298 node.elem = this;
299 if (node.id) {
300 thisGroup.attr("id", node.id);
301 }
302 if (node.labelId) {
303 labelGroup.attr("id", node.labelId);
304 }
305 if (has(node, "width")) {
306 bbox.width = node.width;
307 }
308 if (has(node, "height")) {
309 bbox.height = node.height;
310 }
311 bbox.width += node.paddingLeft + node.paddingRight;
312 bbox.height += node.paddingTop + node.paddingBottom;
313 labelGroup.attr(
314 "transform",
315 "translate(" + (node.paddingLeft - node.paddingRight) / 2 + "," + (node.paddingTop - node.paddingBottom) / 2 + ")"
316 );
317 var root = select(this);
318 root.select(".label-container").remove();
319 var shapeSvg = shape(root, bbox, node).classed("label-container", true);
320 applyStyle(shapeSvg, node.style);
321 var shapeBBox = shapeSvg.node().getBBox();
322 node.width = shapeBBox.width;
323 node.height = shapeBBox.height;
324 });
325 var exitSelection;
326 if (svgNodes.exit) {
327 exitSelection = svgNodes.exit();
328 } else {
329 exitSelection = svgNodes.selectAll(null);
330 }
331 applyTransition(exitSelection, g).style("opacity", 0).remove();
332 return svgNodes;
333};
334function setCreateNodes(value) {
335 createNodes = value;
336}
337function positionClusters(selection, g) {
338 var created = selection.filter(function() {
339 return !select(this).classed("update");
340 });
341 function translate(v) {
342 var node = g.node(v);
343 return "translate(" + node.x + "," + node.y + ")";
344 }
345 created.attr("transform", translate);
346 applyTransition(selection, g).style("opacity", 1).attr("transform", translate);
347 applyTransition(created.selectAll("rect"), g).attr("width", function(v) {
348 return g.node(v).width;
349 }).attr("height", function(v) {
350 return g.node(v).height;
351 }).attr("x", function(v) {
352 var node = g.node(v);
353 return -node.width / 2;
354 }).attr("y", function(v) {
355 var node = g.node(v);
356 return -node.height / 2;
357 });
358}
359function positionEdgeLabels(selection, g) {
360 var created = selection.filter(function() {
361 return !select(this).classed("update");
362 });
363 function translate(e) {
364 var edge = g.edge(e);
365 return has(edge, "x") ? "translate(" + edge.x + "," + edge.y + ")" : "";
366 }
367 created.attr("transform", translate);
368 applyTransition(selection, g).style("opacity", 1).attr("transform", translate);
369}
370function positionNodes(selection, g) {
371 var created = selection.filter(function() {
372 return !select(this).classed("update");
373 });
374 function translate(v) {
375 var node = g.node(v);
376 return "translate(" + node.x + "," + node.y + ")";
377 }
378 created.attr("transform", translate);
379 applyTransition(selection, g).style("opacity", 1).attr("transform", translate);
380}
381function intersectEllipse(node, rx, ry, point) {
382 var cx = node.x;
383 var cy = node.y;
384 var px = cx - point.x;
385 var py = cy - point.y;
386 var det = Math.sqrt(rx * rx * py * py + ry * ry * px * px);
387 var dx = Math.abs(rx * ry * px / det);
388 if (point.x < cx) {
389 dx = -dx;
390 }
391 var dy = Math.abs(rx * ry * py / det);
392 if (point.y < cy) {
393 dy = -dy;
394 }
395 return { x: cx + dx, y: cy + dy };
396}
397function intersectCircle(node, rx, point) {
398 return intersectEllipse(node, rx, rx, point);
399}
400function intersectLine(p1, p2, q1, q2) {
401 var a1, a2, b1, b2, c1, c2;
402 var r1, r2, r3, r4;
403 var denom, offset, num;
404 var x, y;
405 a1 = p2.y - p1.y;
406 b1 = p1.x - p2.x;
407 c1 = p2.x * p1.y - p1.x * p2.y;
408 r3 = a1 * q1.x + b1 * q1.y + c1;
409 r4 = a1 * q2.x + b1 * q2.y + c1;
410 if (r3 !== 0 && r4 !== 0 && sameSign(r3, r4)) {
411 return;
412 }
413 a2 = q2.y - q1.y;
414 b2 = q1.x - q2.x;
415 c2 = q2.x * q1.y - q1.x * q2.y;
416 r1 = a2 * p1.x + b2 * p1.y + c2;
417 r2 = a2 * p2.x + b2 * p2.y + c2;
418 if (r1 !== 0 && r2 !== 0 && sameSign(r1, r2)) {
419 return;
420 }
421 denom = a1 * b2 - a2 * b1;
422 if (denom === 0) {
423 return;
424 }
425 offset = Math.abs(denom / 2);
426 num = b1 * c2 - b2 * c1;
427 x = num < 0 ? (num - offset) / denom : (num + offset) / denom;
428 num = a2 * c1 - a1 * c2;
429 y = num < 0 ? (num - offset) / denom : (num + offset) / denom;
430 return { x, y };
431}
432function sameSign(r1, r2) {
433 return r1 * r2 > 0;
434}
435function intersectPolygon(node, polyPoints, point) {
436 var x1 = node.x;
437 var y1 = node.y;
438 var intersections = [];
439 var minX = Number.POSITIVE_INFINITY;
440 var minY = Number.POSITIVE_INFINITY;
441 polyPoints.forEach(function(entry) {
442 minX = Math.min(minX, entry.x);
443 minY = Math.min(minY, entry.y);
444 });
445 var left = x1 - node.width / 2 - minX;
446 var top = y1 - node.height / 2 - minY;
447 for (var i = 0; i < polyPoints.length; i++) {
448 var p1 = polyPoints[i];
449 var p2 = polyPoints[i < polyPoints.length - 1 ? i + 1 : 0];
450 var intersect = intersectLine(
451 node,
452 point,
453 { x: left + p1.x, y: top + p1.y },
454 { x: left + p2.x, y: top + p2.y }
455 );
456 if (intersect) {
457 intersections.push(intersect);
458 }
459 }
460 if (!intersections.length) {
461 console.log("NO INTERSECTION FOUND, RETURN NODE CENTER", node);
462 return node;
463 }
464 if (intersections.length > 1) {
465 intersections.sort(function(p, q) {
466 var pdx = p.x - point.x;
467 var pdy = p.y - point.y;
468 var distp = Math.sqrt(pdx * pdx + pdy * pdy);
469 var qdx = q.x - point.x;
470 var qdy = q.y - point.y;
471 var distq = Math.sqrt(qdx * qdx + qdy * qdy);
472 return distp < distq ? -1 : distp === distq ? 0 : 1;
473 });
474 }
475 return intersections[0];
476}
477function intersectRect(node, point) {
478 var x = node.x;
479 var y = node.y;
480 var dx = point.x - x;
481 var dy = point.y - y;
482 var w = node.width / 2;
483 var h = node.height / 2;
484 var sx, sy;
485 if (Math.abs(dy) * w > Math.abs(dx) * h) {
486 if (dy < 0) {
487 h = -h;
488 }
489 sx = dy === 0 ? 0 : h * dx / dy;
490 sy = h;
491 } else {
492 if (dx < 0) {
493 w = -w;
494 }
495 sx = w;
496 sy = dx === 0 ? 0 : w * dy / dx;
497 }
498 return { x: x + sx, y: y + sy };
499}
500var shapes = {
501 rect,
502 ellipse,
503 circle,
504 diamond
505};
506function setShapes(value) {
507 shapes = value;
508}
509function rect(parent, bbox, node) {
510 var shapeSvg = parent.insert("rect", ":first-child").attr("rx", node.rx).attr("ry", node.ry).attr("x", -bbox.width / 2).attr("y", -bbox.height / 2).attr("width", bbox.width).attr("height", bbox.height);
511 node.intersect = function(point) {
512 return intersectRect(node, point);
513 };
514 return shapeSvg;
515}
516function ellipse(parent, bbox, node) {
517 var rx = bbox.width / 2;
518 var ry = bbox.height / 2;
519 var shapeSvg = parent.insert("ellipse", ":first-child").attr("x", -bbox.width / 2).attr("y", -bbox.height / 2).attr("rx", rx).attr("ry", ry);
520 node.intersect = function(point) {
521 return intersectEllipse(node, rx, ry, point);
522 };
523 return shapeSvg;
524}
525function circle(parent, bbox, node) {
526 var r = Math.max(bbox.width, bbox.height) / 2;
527 var shapeSvg = parent.insert("circle", ":first-child").attr("x", -bbox.width / 2).attr("y", -bbox.height / 2).attr("r", r);
528 node.intersect = function(point) {
529 return intersectCircle(node, r, point);
530 };
531 return shapeSvg;
532}
533function diamond(parent, bbox, node) {
534 var w = bbox.width * Math.SQRT2 / 2;
535 var h = bbox.height * Math.SQRT2 / 2;
536 var points = [
537 { x: 0, y: -h },
538 { x: -w, y: 0 },
539 { x: 0, y: h },
540 { x: w, y: 0 }
541 ];
542 var shapeSvg = parent.insert("polygon", ":first-child").attr(
543 "points",
544 points.map(function(p) {
545 return p.x + "," + p.y;
546 }).join(" ")
547 );
548 node.intersect = function(p) {
549 return intersectPolygon(node, points, p);
550 };
551 return shapeSvg;
552}
553function render() {
554 var fn = function(svg2, g) {
555 preProcessGraph(g);
556 var outputGroup = createOrSelectGroup(svg2, "output");
557 var clustersGroup = createOrSelectGroup(outputGroup, "clusters");
558 var edgePathsGroup = createOrSelectGroup(outputGroup, "edgePaths");
559 var edgeLabels = createEdgeLabels(createOrSelectGroup(outputGroup, "edgeLabels"), g);
560 var nodes = createNodes(createOrSelectGroup(outputGroup, "nodes"), g, shapes);
561 layout(g);
562 positionNodes(nodes, g);
563 positionEdgeLabels(edgeLabels, g);
564 createEdgePaths(edgePathsGroup, g, arrows);
565 var clusters = createClusters(clustersGroup, g);
566 positionClusters(clusters, g);
567 postProcessGraph(g);
568 };
569 fn.createNodes = function(value) {
570 if (!arguments.length)
571 return createNodes;
572 setCreateNodes(value);
573 return fn;
574 };
575 fn.createClusters = function(value) {
576 if (!arguments.length)
577 return createClusters;
578 setCreateClusters(value);
579 return fn;
580 };
581 fn.createEdgeLabels = function(value) {
582 if (!arguments.length)
583 return createEdgeLabels;
584 setCreateEdgeLabels(value);
585 return fn;
586 };
587 fn.createEdgePaths = function(value) {
588 if (!arguments.length)
589 return createEdgePaths;
590 setCreateEdgePaths(value);
591 return fn;
592 };
593 fn.shapes = function(value) {
594 if (!arguments.length)
595 return shapes;
596 setShapes(value);
597 return fn;
598 };
599 fn.arrows = function(value) {
600 if (!arguments.length)
601 return arrows;
602 setArrows(value);
603 return fn;
604 };
605 return fn;
606}
607var NODE_DEFAULT_ATTRS = {
608 paddingLeft: 10,
609 paddingRight: 10,
610 paddingTop: 10,
611 paddingBottom: 10,
612 rx: 0,
613 ry: 0,
614 shape: "rect"
615};
616var EDGE_DEFAULT_ATTRS = {
617 arrowhead: "normal",
618 curve: curveLinear
619};
620function preProcessGraph(g) {
621 g.nodes().forEach(function(v) {
622 var node = g.node(v);
623 if (!has(node, "label") && !g.children(v).length) {
624 node.label = v;
625 }
626 if (has(node, "paddingX")) {
627 defaults(node, {
628 paddingLeft: node.paddingX,
629 paddingRight: node.paddingX
630 });
631 }
632 if (has(node, "paddingY")) {
633 defaults(node, {
634 paddingTop: node.paddingY,
635 paddingBottom: node.paddingY
636 });
637 }
638 if (has(node, "padding")) {
639 defaults(node, {
640 paddingLeft: node.padding,
641 paddingRight: node.padding,
642 paddingTop: node.padding,
643 paddingBottom: node.padding
644 });
645 }
646 defaults(node, NODE_DEFAULT_ATTRS);
647 forEach(["paddingLeft", "paddingRight", "paddingTop", "paddingBottom"], function(k) {
648 node[k] = Number(node[k]);
649 });
650 if (has(node, "width")) {
651 node._prevWidth = node.width;
652 }
653 if (has(node, "height")) {
654 node._prevHeight = node.height;
655 }
656 });
657 g.edges().forEach(function(e) {
658 var edge = g.edge(e);
659 if (!has(edge, "label")) {
660 edge.label = "";
661 }
662 defaults(edge, EDGE_DEFAULT_ATTRS);
663 });
664}
665function postProcessGraph(g) {
666 forEach(g.nodes(), function(v) {
667 var node = g.node(v);
668 if (has(node, "_prevWidth")) {
669 node.width = node._prevWidth;
670 } else {
671 delete node.width;
672 }
673 if (has(node, "_prevHeight")) {
674 node.height = node._prevHeight;
675 } else {
676 delete node.height;
677 }
678 delete node._prevWidth;
679 delete node._prevHeight;
680 });
681}
682function createOrSelectGroup(root, name) {
683 var selection = root.select("g." + name);
684 if (selection.empty()) {
685 selection = root.append("g").attr("class", name);
686 }
687 return selection;
688}
689function question(parent, bbox, node) {
690 const w = bbox.width;
691 const h = bbox.height;
692 const s = (w + h) * 0.9;
693 const points = [
694 { x: s / 2, y: 0 },
695 { x: s, y: -s / 2 },
696 { x: s / 2, y: -s },
697 { x: 0, y: -s / 2 }
698 ];
699 const shapeSvg = insertPolygonShape(parent, s, s, points);
700 node.intersect = function(point) {
701 return intersectPolygon(node, points, point);
702 };
703 return shapeSvg;
704}
705function hexagon(parent, bbox, node) {
706 const f = 4;
707 const h = bbox.height;
708 const m = h / f;
709 const w = bbox.width + 2 * m;
710 const points = [
711 { x: m, y: 0 },
712 { x: w - m, y: 0 },
713 { x: w, y: -h / 2 },
714 { x: w - m, y: -h },
715 { x: m, y: -h },
716 { x: 0, y: -h / 2 }
717 ];
718 const shapeSvg = insertPolygonShape(parent, w, h, points);
719 node.intersect = function(point) {
720 return intersectPolygon(node, points, point);
721 };
722 return shapeSvg;
723}
724function rect_left_inv_arrow(parent, bbox, node) {
725 const w = bbox.width;
726 const h = bbox.height;
727 const points = [
728 { x: -h / 2, y: 0 },
729 { x: w, y: 0 },
730 { x: w, y: -h },
731 { x: -h / 2, y: -h },
732 { x: 0, y: -h / 2 }
733 ];
734 const shapeSvg = insertPolygonShape(parent, w, h, points);
735 node.intersect = function(point) {
736 return intersectPolygon(node, points, point);
737 };
738 return shapeSvg;
739}
740function lean_right(parent, bbox, node) {
741 const w = bbox.width;
742 const h = bbox.height;
743 const points = [
744 { x: -2 * h / 6, y: 0 },
745 { x: w - h / 6, y: 0 },
746 { x: w + 2 * h / 6, y: -h },
747 { x: h / 6, y: -h }
748 ];
749 const shapeSvg = insertPolygonShape(parent, w, h, points);
750 node.intersect = function(point) {
751 return intersectPolygon(node, points, point);
752 };
753 return shapeSvg;
754}
755function lean_left(parent, bbox, node) {
756 const w = bbox.width;
757 const h = bbox.height;
758 const points = [
759 { x: 2 * h / 6, y: 0 },
760 { x: w + h / 6, y: 0 },
761 { x: w - 2 * h / 6, y: -h },
762 { x: -h / 6, y: -h }
763 ];
764 const shapeSvg = insertPolygonShape(parent, w, h, points);
765 node.intersect = function(point) {
766 return intersectPolygon(node, points, point);
767 };
768 return shapeSvg;
769}
770function trapezoid(parent, bbox, node) {
771 const w = bbox.width;
772 const h = bbox.height;
773 const points = [
774 { x: -2 * h / 6, y: 0 },
775 { x: w + 2 * h / 6, y: 0 },
776 { x: w - h / 6, y: -h },
777 { x: h / 6, y: -h }
778 ];
779 const shapeSvg = insertPolygonShape(parent, w, h, points);
780 node.intersect = function(point) {
781 return intersectPolygon(node, points, point);
782 };
783 return shapeSvg;
784}
785function inv_trapezoid(parent, bbox, node) {
786 const w = bbox.width;
787 const h = bbox.height;
788 const points = [
789 { x: h / 6, y: 0 },
790 { x: w - h / 6, y: 0 },
791 { x: w + 2 * h / 6, y: -h },
792 { x: -2 * h / 6, y: -h }
793 ];
794 const shapeSvg = insertPolygonShape(parent, w, h, points);
795 node.intersect = function(point) {
796 return intersectPolygon(node, points, point);
797 };
798 return shapeSvg;
799}
800function rect_right_inv_arrow(parent, bbox, node) {
801 const w = bbox.width;
802 const h = bbox.height;
803 const points = [
804 { x: 0, y: 0 },
805 { x: w + h / 2, y: 0 },
806 { x: w, y: -h / 2 },
807 { x: w + h / 2, y: -h },
808 { x: 0, y: -h }
809 ];
810 const shapeSvg = insertPolygonShape(parent, w, h, points);
811 node.intersect = function(point) {
812 return intersectPolygon(node, points, point);
813 };
814 return shapeSvg;
815}
816function stadium(parent, bbox, node) {
817 const h = bbox.height;
818 const w = bbox.width + h / 4;
819 const shapeSvg = parent.insert("rect", ":first-child").attr("rx", h / 2).attr("ry", h / 2).attr("x", -w / 2).attr("y", -h / 2).attr("width", w).attr("height", h);
820 node.intersect = function(point) {
821 return intersectRect(node, point);
822 };
823 return shapeSvg;
824}
825function subroutine(parent, bbox, node) {
826 const w = bbox.width;
827 const h = bbox.height;
828 const points = [
829 { x: 0, y: 0 },
830 { x: w, y: 0 },
831 { x: w, y: -h },
832 { x: 0, y: -h },
833 { x: 0, y: 0 },
834 { x: -8, y: 0 },
835 { x: w + 8, y: 0 },
836 { x: w + 8, y: -h },
837 { x: -8, y: -h },
838 { x: -8, y: 0 }
839 ];
840 const shapeSvg = insertPolygonShape(parent, w, h, points);
841 node.intersect = function(point) {
842 return intersectPolygon(node, points, point);
843 };
844 return shapeSvg;
845}
846function cylinder(parent, bbox, node) {
847 const w = bbox.width;
848 const rx = w / 2;
849 const ry = rx / (2.5 + w / 50);
850 const h = bbox.height + ry;
851 const shape = "M 0," + ry + " a " + rx + "," + ry + " 0,0,0 " + w + " 0 a " + rx + "," + ry + " 0,0,0 " + -w + " 0 l 0," + h + " a " + rx + "," + ry + " 0,0,0 " + w + " 0 l 0," + -h;
852 const shapeSvg = parent.attr("label-offset-y", ry).insert("path", ":first-child").attr("d", shape).attr("transform", "translate(" + -w / 2 + "," + -(h / 2 + ry) + ")");
853 node.intersect = function(point) {
854 const pos = intersectRect(node, point);
855 const x = pos.x - node.x;
856 if (rx != 0 && (Math.abs(x) < node.width / 2 || Math.abs(x) == node.width / 2 && Math.abs(pos.y - node.y) > node.height / 2 - ry)) {
857 let y = ry * ry * (1 - x * x / (rx * rx));
858 if (y != 0) {
859 y = Math.sqrt(y);
860 }
861 y = ry - y;
862 if (point.y - node.y > 0) {
863 y = -y;
864 }
865 pos.y += y;
866 }
867 return pos;
868 };
869 return shapeSvg;
870}
871function addToRender(render2) {
872 render2.shapes().question = question;
873 render2.shapes().hexagon = hexagon;
874 render2.shapes().stadium = stadium;
875 render2.shapes().subroutine = subroutine;
876 render2.shapes().cylinder = cylinder;
877 render2.shapes().rect_left_inv_arrow = rect_left_inv_arrow;
878 render2.shapes().lean_right = lean_right;
879 render2.shapes().lean_left = lean_left;
880 render2.shapes().trapezoid = trapezoid;
881 render2.shapes().inv_trapezoid = inv_trapezoid;
882 render2.shapes().rect_right_inv_arrow = rect_right_inv_arrow;
883}
884function addToRenderV2(addShape) {
885 addShape({ question });
886 addShape({ hexagon });
887 addShape({ stadium });
888 addShape({ subroutine });
889 addShape({ cylinder });
890 addShape({ rect_left_inv_arrow });
891 addShape({ lean_right });
892 addShape({ lean_left });
893 addShape({ trapezoid });
894 addShape({ inv_trapezoid });
895 addShape({ rect_right_inv_arrow });
896}
897function insertPolygonShape(parent, w, h, points) {
898 return parent.insert("polygon", ":first-child").attr(
899 "points",
900 points.map(function(d) {
901 return d.x + "," + d.y;
902 }).join(" ")
903 ).attr("transform", "translate(" + -w / 2 + "," + h / 2 + ")");
904}
905const flowChartShapes = {
906 addToRender,
907 addToRenderV2
908};
909const conf = {};
910const setConf = function(cnf) {
911 const keys = Object.keys(cnf);
912 for (const key of keys) {
913 conf[key] = cnf[key];
914 }
915};
916const addVertices = function(vert, g, svgId, root, _doc, diagObj) {
917 const svg2 = !root ? select(`[id="${svgId}"]`) : root.select(`[id="${svgId}"]`);
918 const doc = !_doc ? document : _doc;
919 const keys = Object.keys(vert);
920 keys.forEach(function(id) {
921 const vertex = vert[id];
922 let classStr = "default";
923 if (vertex.classes.length > 0) {
924 classStr = vertex.classes.join(" ");
925 }
926 const styles = getStylesFromArray(vertex.styles);
927 let vertexText = vertex.text !== void 0 ? vertex.text : vertex.id;
928 let vertexNode;
929 if (evaluate(getConfig().flowchart.htmlLabels)) {
930 const node = {
931 label: vertexText.replace(
932 /fa[blrs]?:fa-[\w-]+/g,
933 (s) => `<i class='${s.replace(":", " ")}'></i>`
934 )
935 };
936 vertexNode = addHtmlLabel(svg2, node).node();
937 vertexNode.parentNode.removeChild(vertexNode);
938 } else {
939 const svgLabel = doc.createElementNS("http://www.w3.org/2000/svg", "text");
940 svgLabel.setAttribute("style", styles.labelStyle.replace("color:", "fill:"));
941 const rows = vertexText.split(common.lineBreakRegex);
942 for (const row of rows) {
943 const tspan = doc.createElementNS("http://www.w3.org/2000/svg", "tspan");
944 tspan.setAttributeNS("http://www.w3.org/XML/1998/namespace", "xml:space", "preserve");
945 tspan.setAttribute("dy", "1em");
946 tspan.setAttribute("x", "1");
947 tspan.textContent = row;
948 svgLabel.appendChild(tspan);
949 }
950 vertexNode = svgLabel;
951 }
952 let radious = 0;
953 let _shape = "";
954 switch (vertex.type) {
955 case "round":
956 radious = 5;
957 _shape = "rect";
958 break;
959 case "square":
960 _shape = "rect";
961 break;
962 case "diamond":
963 _shape = "question";
964 break;
965 case "hexagon":
966 _shape = "hexagon";
967 break;
968 case "odd":
969 _shape = "rect_left_inv_arrow";
970 break;
971 case "lean_right":
972 _shape = "lean_right";
973 break;
974 case "lean_left":
975 _shape = "lean_left";
976 break;
977 case "trapezoid":
978 _shape = "trapezoid";
979 break;
980 case "inv_trapezoid":
981 _shape = "inv_trapezoid";
982 break;
983 case "odd_right":
984 _shape = "rect_left_inv_arrow";
985 break;
986 case "circle":
987 _shape = "circle";
988 break;
989 case "ellipse":
990 _shape = "ellipse";
991 break;
992 case "stadium":
993 _shape = "stadium";
994 break;
995 case "subroutine":
996 _shape = "subroutine";
997 break;
998 case "cylinder":
999 _shape = "cylinder";
1000 break;
1001 case "group":
1002 _shape = "rect";
1003 break;
1004 default:
1005 _shape = "rect";
1006 }
1007 log.warn("Adding node", vertex.id, vertex.domId);
1008 g.setNode(diagObj.db.lookUpDomId(vertex.id), {
1009 labelType: "svg",
1010 labelStyle: styles.labelStyle,
1011 shape: _shape,
1012 label: vertexNode,
1013 rx: radious,
1014 ry: radious,
1015 class: classStr,
1016 style: styles.style,
1017 id: diagObj.db.lookUpDomId(vertex.id)
1018 });
1019 });
1020};
1021const addEdges = function(edges, g, diagObj) {
1022 let cnt = 0;
1023 let defaultStyle;
1024 let defaultLabelStyle;
1025 if (edges.defaultStyle !== void 0) {
1026 const defaultStyles = getStylesFromArray(edges.defaultStyle);
1027 defaultStyle = defaultStyles.style;
1028 defaultLabelStyle = defaultStyles.labelStyle;
1029 }
1030 edges.forEach(function(edge) {
1031 cnt++;
1032 const linkId = "L-" + edge.start + "-" + edge.end;
1033 const linkNameStart = "LS-" + edge.start;
1034 const linkNameEnd = "LE-" + edge.end;
1035 const edgeData = {};
1036 if (edge.type === "arrow_open") {
1037 edgeData.arrowhead = "none";
1038 } else {
1039 edgeData.arrowhead = "normal";
1040 }
1041 let style = "";
1042 let labelStyle = "";
1043 if (edge.style !== void 0) {
1044 const styles = getStylesFromArray(edge.style);
1045 style = styles.style;
1046 labelStyle = styles.labelStyle;
1047 } else {
1048 switch (edge.stroke) {
1049 case "normal":
1050 style = "fill:none";
1051 if (defaultStyle !== void 0) {
1052 style = defaultStyle;
1053 }
1054 if (defaultLabelStyle !== void 0) {
1055 labelStyle = defaultLabelStyle;
1056 }
1057 break;
1058 case "dotted":
1059 style = "fill:none;stroke-width:2px;stroke-dasharray:3;";
1060 break;
1061 case "thick":
1062 style = " stroke-width: 3.5px;fill:none";
1063 break;
1064 }
1065 }
1066 edgeData.style = style;
1067 edgeData.labelStyle = labelStyle;
1068 if (edge.interpolate !== void 0) {
1069 edgeData.curve = interpolateToCurve(edge.interpolate, curveLinear);
1070 } else if (edges.defaultInterpolate !== void 0) {
1071 edgeData.curve = interpolateToCurve(edges.defaultInterpolate, curveLinear);
1072 } else {
1073 edgeData.curve = interpolateToCurve(conf.curve, curveLinear);
1074 }
1075 if (edge.text === void 0) {
1076 if (edge.style !== void 0) {
1077 edgeData.arrowheadStyle = "fill: #333";
1078 }
1079 } else {
1080 edgeData.arrowheadStyle = "fill: #333";
1081 edgeData.labelpos = "c";
1082 if (evaluate(getConfig().flowchart.htmlLabels)) {
1083 edgeData.labelType = "html";
1084 edgeData.label = `<span id="L-${linkId}" class="edgeLabel L-${linkNameStart}' L-${linkNameEnd}" style="${edgeData.labelStyle}">${edge.text.replace(
1085 /fa[blrs]?:fa-[\w-]+/g,
1086 (s) => `<i class='${s.replace(":", " ")}'></i>`
1087 )}</span>`;
1088 } else {
1089 edgeData.labelType = "text";
1090 edgeData.label = edge.text.replace(common.lineBreakRegex, "\n");
1091 if (edge.style === void 0) {
1092 edgeData.style = edgeData.style || "stroke: #333; stroke-width: 1.5px;fill:none";
1093 }
1094 edgeData.labelStyle = edgeData.labelStyle.replace("color:", "fill:");
1095 }
1096 }
1097 edgeData.id = linkId;
1098 edgeData.class = linkNameStart + " " + linkNameEnd;
1099 edgeData.minlen = edge.length || 1;
1100 g.setEdge(diagObj.db.lookUpDomId(edge.start), diagObj.db.lookUpDomId(edge.end), edgeData, cnt);
1101 });
1102};
1103const getClasses = function(text2, diagObj) {
1104 log.info("Extracting classes");
1105 diagObj.db.clear();
1106 try {
1107 diagObj.parse(text2);
1108 return diagObj.db.getClasses();
1109 } catch (e) {
1110 log.error(e);
1111 return {};
1112 }
1113};
1114const draw = function(text2, id, _version, diagObj) {
1115 log.info("Drawing flowchart");
1116 diagObj.db.clear();
1117 const { securityLevel, flowchart: conf2 } = getConfig();
1118 let sandboxElement;
1119 if (securityLevel === "sandbox") {
1120 sandboxElement = select("#i" + id);
1121 }
1122 const root = securityLevel === "sandbox" ? select(sandboxElement.nodes()[0].contentDocument.body) : select("body");
1123 const doc = securityLevel === "sandbox" ? sandboxElement.nodes()[0].contentDocument : document;
1124 try {
1125 diagObj.parser.parse(text2);
1126 } catch (err) {
1127 log.debug("Parsing failed");
1128 }
1129 let dir = diagObj.db.getDirection();
1130 if (dir === void 0) {
1131 dir = "TD";
1132 }
1133 const nodeSpacing = conf2.nodeSpacing || 50;
1134 const rankSpacing = conf2.rankSpacing || 50;
1135 const g = new Graph({
1136 multigraph: true,
1137 compound: true
1138 }).setGraph({
1139 rankdir: dir,
1140 nodesep: nodeSpacing,
1141 ranksep: rankSpacing,
1142 marginx: 8,
1143 marginy: 8
1144 }).setDefaultEdgeLabel(function() {
1145 return {};
1146 });
1147 let subG;
1148 const subGraphs = diagObj.db.getSubGraphs();
1149 for (let i2 = subGraphs.length - 1; i2 >= 0; i2--) {
1150 subG = subGraphs[i2];
1151 diagObj.db.addVertex(subG.id, subG.title, "group", void 0, subG.classes);
1152 }
1153 const vert = diagObj.db.getVertices();
1154 log.warn("Get vertices", vert);
1155 const edges = diagObj.db.getEdges();
1156 let i = 0;
1157 for (i = subGraphs.length - 1; i >= 0; i--) {
1158 subG = subGraphs[i];
1159 selectAll("cluster").append("text");
1160 for (let j = 0; j < subG.nodes.length; j++) {
1161 log.warn(
1162 "Setting subgraph",
1163 subG.nodes[j],
1164 diagObj.db.lookUpDomId(subG.nodes[j]),
1165 diagObj.db.lookUpDomId(subG.id)
1166 );
1167 g.setParent(diagObj.db.lookUpDomId(subG.nodes[j]), diagObj.db.lookUpDomId(subG.id));
1168 }
1169 }
1170 addVertices(vert, g, id, root, doc, diagObj);
1171 addEdges(edges, g, diagObj);
1172 const render$1 = new render();
1173 flowChartShapes.addToRender(render$1);
1174 render$1.arrows().none = function normal2(parent, id2, edge, type) {
1175 const marker = parent.append("marker").attr("id", id2).attr("viewBox", "0 0 10 10").attr("refX", 9).attr("refY", 5).attr("markerUnits", "strokeWidth").attr("markerWidth", 8).attr("markerHeight", 6).attr("orient", "auto");
1176 const path = marker.append("path").attr("d", "M 0 0 L 0 0 L 0 0 z");
1177 applyStyle(path, edge[type + "Style"]);
1178 };
1179 render$1.arrows().normal = function normal2(parent, id2) {
1180 const marker = parent.append("marker").attr("id", id2).attr("viewBox", "0 0 10 10").attr("refX", 9).attr("refY", 5).attr("markerUnits", "strokeWidth").attr("markerWidth", 8).attr("markerHeight", 6).attr("orient", "auto");
1181 marker.append("path").attr("d", "M 0 0 L 10 5 L 0 10 z").attr("class", "arrowheadPath").style("stroke-width", 1).style("stroke-dasharray", "1,0");
1182 };
1183 const svg2 = root.select(`[id="${id}"]`);
1184 const element = root.select("#" + id + " g");
1185 render$1(element, g);
1186 element.selectAll("g.node").attr("title", function() {
1187 return diagObj.db.getTooltip(this.id);
1188 });
1189 diagObj.db.indexNodes("subGraph" + i);
1190 for (i = 0; i < subGraphs.length; i++) {
1191 subG = subGraphs[i];
1192 if (subG.title !== "undefined") {
1193 const clusterRects = doc.querySelectorAll(
1194 "#" + id + ' [id="' + diagObj.db.lookUpDomId(subG.id) + '"] rect'
1195 );
1196 const clusterEl = doc.querySelectorAll(
1197 "#" + id + ' [id="' + diagObj.db.lookUpDomId(subG.id) + '"]'
1198 );
1199 const xPos = clusterRects[0].x.baseVal.value;
1200 const yPos = clusterRects[0].y.baseVal.value;
1201 const _width = clusterRects[0].width.baseVal.value;
1202 const cluster = select(clusterEl[0]);
1203 const te = cluster.select(".label");
1204 te.attr("transform", `translate(${xPos + _width / 2}, ${yPos + 14})`);
1205 te.attr("id", id + "Text");
1206 for (let j = 0; j < subG.classes.length; j++) {
1207 clusterEl[0].classList.add(subG.classes[j]);
1208 }
1209 }
1210 }
1211 if (!conf2.htmlLabels) {
1212 const labels = doc.querySelectorAll('[id="' + id + '"] .edgeLabel .label');
1213 for (const label of labels) {
1214 const dim = label.getBBox();
1215 const rect2 = doc.createElementNS("http://www.w3.org/2000/svg", "rect");
1216 rect2.setAttribute("rx", 0);
1217 rect2.setAttribute("ry", 0);
1218 rect2.setAttribute("width", dim.width);
1219 rect2.setAttribute("height", dim.height);
1220 label.insertBefore(rect2, label.firstChild);
1221 }
1222 }
1223 setupGraphViewbox(g, svg2, conf2.diagramPadding, conf2.useMaxWidth);
1224 const keys = Object.keys(vert);
1225 keys.forEach(function(key) {
1226 const vertex = vert[key];
1227 if (vertex.link) {
1228 const node = root.select("#" + id + ' [id="' + diagObj.db.lookUpDomId(key) + '"]');
1229 if (node) {
1230 const link = doc.createElementNS("http://www.w3.org/2000/svg", "a");
1231 link.setAttributeNS("http://www.w3.org/2000/svg", "class", vertex.classes.join(" "));
1232 link.setAttributeNS("http://www.w3.org/2000/svg", "href", vertex.link);
1233 link.setAttributeNS("http://www.w3.org/2000/svg", "rel", "noopener");
1234 if (securityLevel === "sandbox") {
1235 link.setAttributeNS("http://www.w3.org/2000/svg", "target", "_top");
1236 } else if (vertex.linkTarget) {
1237 link.setAttributeNS("http://www.w3.org/2000/svg", "target", vertex.linkTarget);
1238 }
1239 const linkNode = node.insert(function() {
1240 return link;
1241 }, ":first-child");
1242 const shape = node.select(".label-container");
1243 if (shape) {
1244 linkNode.append(function() {
1245 return shape.node();
1246 });
1247 }
1248 const label = node.select(".label");
1249 if (label) {
1250 linkNode.append(function() {
1251 return label.node();
1252 });
1253 }
1254 }
1255 }
1256 });
1257};
1258const flowRenderer = {
1259 setConf,
1260 addVertices,
1261 addEdges,
1262 getClasses,
1263 draw
1264};
1265const diagram = {
1266 parser: parser$1,
1267 db: flowDb,
1268 renderer: flowRendererV2,
1269 styles: flowStyles,
1270 init: (cnf) => {
1271 if (!cnf.flowchart) {
1272 cnf.flowchart = {};
1273 }
1274 cnf.flowchart.arrowMarkerAbsolute = cnf.arrowMarkerAbsolute;
1275 flowRenderer.setConf(cnf.flowchart);
1276 flowDb.clear();
1277 flowDb.setGen("gen-1");
1278 }
1279};
1280export {
1281 diagram
1282};