@statewalker/fsm-charts 0.0.1

package/src/dagre/layout.js

@@ -0,0 +1,466 @@
+import { _ } from '../lodash-es/index.ts';
+import { Graph } from '../graphlib/index.js';
+import { addBorderSegments } from './add-border-segments.js';
+import * as coordinateSystem from './coordinate-system.js';
+import * as acyclic from './acyclic.js';
+import * as normalize from './normalize.js';
+import { rank } from './rank/index.js';
+import * as nestingGraph from './nesting-graph.js';
+import { order } from './order/index.js';
+import { parentDummyChains } from './parent-dummy-chains.js';
+import { position } from './position/index.js';
+import * as util from './util.js';
+
+export { layout };
+
+function layout(g, opts) {
+  var time = opts && opts.debugTiming ? util.time : util.notime;
+  time('layout', function () {
+    var layoutGraph = time('  buildLayoutGraph', function () {
+      return buildLayoutGraph(g);
+    });
+    time('  runLayout', function () {
+      runLayout(layoutGraph, time);
+    });
+    time('  updateInputGraph', function () {
+      updateInputGraph(g, layoutGraph);
+    });
+  });
+}
+
+function runLayout(g, time) {
+  time('    makeSpaceForEdgeLabels', function () {
+    makeSpaceForEdgeLabels(g);
+  });
+  time('    removeSelfEdges', function () {
+    removeSelfEdges(g);
+  });
+  time('    acyclic', function () {
+    acyclic.run(g);
+  });
+  time('    nestingGraph.run', function () {
+    nestingGraph.run(g);
+  });
+  time('    rank', function () {
+    rank(util.asNonCompoundGraph(g));
+  });
+  time('    injectEdgeLabelProxies', function () {
+    injectEdgeLabelProxies(g);
+  });
+  time('    removeEmptyRanks', function () {
+    util.removeEmptyRanks(g);
+  });
+  time('    nestingGraph.cleanup', function () {
+    nestingGraph.cleanup(g);
+  });
+  time('    normalizeRanks', function () {
+    util.normalizeRanks(g);
+  });
+  time('    assignRankMinMax', function () {
+    assignRankMinMax(g);
+  });
+  time('    removeEdgeLabelProxies', function () {
+    removeEdgeLabelProxies(g);
+  });
+  time('    normalize.run', function () {
+    normalize.run(g);
+  });
+  time('    parentDummyChains', function () {
+    parentDummyChains(g);
+  });
+  time('    addBorderSegments', function () {
+    addBorderSegments(g);
+  });
+  time('    order', function () {
+    order(g);
+  });
+  time('    insertSelfEdges', function () {
+    insertSelfEdges(g);
+  });
+  time('    adjustCoordinateSystem', function () {
+    coordinateSystem.adjust(g);
+  });
+  time('    position', function () {
+    position(g);
+  });
+  time('    positionSelfEdges', function () {
+    positionSelfEdges(g);
+  });
+  time('    removeBorderNodes', function () {
+    removeBorderNodes(g);
+  });
+  time('    normalize.undo', function () {
+    normalize.undo(g);
+  });
+  time('    fixupEdgeLabelCoords', function () {
+    fixupEdgeLabelCoords(g);
+  });
+  time('    undoCoordinateSystem', function () {
+    coordinateSystem.undo(g);
+  });
+  time('    translateGraph', function () {
+    translateGraph(g);
+  });
+  time('    assignNodeIntersects', function () {
+    assignNodeIntersects(g);
+  });
+  time('    reversePoints', function () {
+    reversePointsForReversedEdges(g);
+  });
+  time('    acyclic.undo', function () {
+    acyclic.undo(g);
+  });
+}
+
+/*
+ * Copies final layout information from the layout graph back to the input
+ * graph. This process only copies whitelisted attributes from the layout graph
+ * to the input graph, so it serves as a good place to determine what
+ * attributes can influence layout.
+ */
+function updateInputGraph(inputGraph, layoutGraph) {
+  _.forEach(inputGraph.nodes(), function (v) {
+    var inputLabel = inputGraph.node(v);
+    var layoutLabel = layoutGraph.node(v);
+
+    if (inputLabel) {
+      inputLabel.x = layoutLabel.x;
+      inputLabel.y = layoutLabel.y;
+
+      if (layoutGraph.children(v).length) {
+        inputLabel.width = layoutLabel.width;
+        inputLabel.height = layoutLabel.height;
+      }
+    }
+  });
+
+  _.forEach(inputGraph.edges(), function (e) {
+    var inputLabel = inputGraph.edge(e);
+    var layoutLabel = layoutGraph.edge(e);
+
+    inputLabel.points = layoutLabel.points;
+    if (_.has(layoutLabel, 'x')) {
+      inputLabel.x = layoutLabel.x;
+      inputLabel.y = layoutLabel.y;
+    }
+  });
+
+  inputGraph.graph().width = layoutGraph.graph().width;
+  inputGraph.graph().height = layoutGraph.graph().height;
+}
+
+var graphNumAttrs = ['nodesep', 'edgesep', 'ranksep', 'marginx', 'marginy'];
+var graphDefaults = { ranksep: 50, edgesep: 20, nodesep: 50, rankdir: 'tb' };
+var graphAttrs = ['acyclicer', 'ranker', 'rankdir', 'align'];
+var nodeNumAttrs = ['width', 'height'];
+var nodeDefaults = { width: 0, height: 0 };
+var edgeNumAttrs = ['minlen', 'weight', 'width', 'height', 'labeloffset'];
+var edgeDefaults = {
+  minlen: 1,
+  weight: 1,
+  width: 0,
+  height: 0,
+  labeloffset: 10,
+  labelpos: 'r',
+};
+var edgeAttrs = ['labelpos'];
+
+/*
+ * Constructs a new graph from the input graph, which can be used for layout.
+ * This process copies only whitelisted attributes from the input graph to the
+ * layout graph. Thus this function serves as a good place to determine what
+ * attributes can influence layout.
+ */
+function buildLayoutGraph(inputGraph) {
+  var g = new Graph({ multigraph: true, compound: true });
+  var graph = canonicalize(inputGraph.graph());
+
+  g.setGraph(
+    _.merge({}, graphDefaults, selectNumberAttrs(graph, graphNumAttrs), _.pick(graph, graphAttrs))
+  );
+
+  _.forEach(inputGraph.nodes(), function (v) {
+    var node = canonicalize(inputGraph.node(v));
+    g.setNode(v, _.defaults(selectNumberAttrs(node, nodeNumAttrs), nodeDefaults));
+    g.setParent(v, inputGraph.parent(v));
+  });
+
+  _.forEach(inputGraph.edges(), function (e) {
+    var edge = canonicalize(inputGraph.edge(e));
+    g.setEdge(
+      e,
+      _.merge({}, edgeDefaults, selectNumberAttrs(edge, edgeNumAttrs), _.pick(edge, edgeAttrs))
+    );
+  });
+
+  return g;
+}
+
+/*
+ * This idea comes from the Gansner paper: to account for edge labels in our
+ * layout we split each rank in half by doubling minlen and halving ranksep.
+ * Then we can place labels at these mid-points between nodes.
+ *
+ * We also add some minimal padding to the width to push the label for the edge
+ * away from the edge itself a bit.
+ */
+function makeSpaceForEdgeLabels(g) {
+  var graph = g.graph();
+  graph.ranksep /= 2;
+  _.forEach(g.edges(), function (e) {
+    var edge = g.edge(e);
+    edge.minlen *= 2;
+    if (edge.labelpos.toLowerCase() !== 'c') {
+      if (graph.rankdir === 'TB' || graph.rankdir === 'BT') {
+        edge.width += edge.labeloffset;
+      } else {
+        edge.height += edge.labeloffset;
+      }
+    }
+  });
+}
+
+/*
+ * Creates temporary dummy nodes that capture the rank in which each edge's
+ * label is going to, if it has one of non-zero width and height. We do this
+ * so that we can safely remove empty ranks while preserving balance for the
+ * label's position.
+ */
+function injectEdgeLabelProxies(g) {
+  _.forEach(g.edges(), function (e) {
+    var edge = g.edge(e);
+    if (edge.width && edge.height) {
+      var v = g.node(e.v);
+      var w = g.node(e.w);
+      var label = { rank: (w.rank - v.rank) / 2 + v.rank, e: e };
+      util.addDummyNode(g, 'edge-proxy', label, '_ep');
+    }
+  });
+}
+
+function assignRankMinMax(g) {
+  var maxRank = 0;
+  _.forEach(g.nodes(), function (v) {
+    var node = g.node(v);
+    if (node.borderTop) {
+      node.minRank = g.node(node.borderTop).rank;
+      node.maxRank = g.node(node.borderBottom).rank;
+      // @ts-expect-error
+      maxRank = _.max(maxRank, node.maxRank);
+    }
+  });
+  g.graph().maxRank = maxRank;
+}
+
+function removeEdgeLabelProxies(g) {
+  _.forEach(g.nodes(), function (v) {
+    var node = g.node(v);
+    if (node.dummy === 'edge-proxy') {
+      g.edge(node.e).labelRank = node.rank;
+      g.removeNode(v);
+    }
+  });
+}
+
+function translateGraph(g) {
+  var minX = Number.POSITIVE_INFINITY;
+  var maxX = 0;
+  var minY = Number.POSITIVE_INFINITY;
+  var maxY = 0;
+  var graphLabel = g.graph();
+  var marginX = graphLabel.marginx || 0;
+  var marginY = graphLabel.marginy || 0;
+
+  function getExtremes(attrs) {
+    var x = attrs.x;
+    var y = attrs.y;
+    var w = attrs.width;
+    var h = attrs.height;
+    minX = Math.min(minX, x - w / 2);
+    maxX = Math.max(maxX, x + w / 2);
+    minY = Math.min(minY, y - h / 2);
+    maxY = Math.max(maxY, y + h / 2);
+  }
+
+  _.forEach(g.nodes(), function (v) {
+    getExtremes(g.node(v));
+  });
+  _.forEach(g.edges(), function (e) {
+    var edge = g.edge(e);
+    if (_.has(edge, 'x')) {
+      getExtremes(edge);
+    }
+  });
+
+  minX -= marginX;
+  minY -= marginY;
+
+  _.forEach(g.nodes(), function (v) {
+    var node = g.node(v);
+    node.x -= minX;
+    node.y -= minY;
+  });
+
+  _.forEach(g.edges(), function (e) {
+    var edge = g.edge(e);
+    _.forEach(edge.points, function (p) {
+      p.x -= minX;
+      p.y -= minY;
+    });
+    if (_.has(edge, 'x')) {
+      edge.x -= minX;
+    }
+    if (_.has(edge, 'y')) {
+      edge.y -= minY;
+    }
+  });
+
+  graphLabel.width = maxX - minX + marginX;
+  graphLabel.height = maxY - minY + marginY;
+}
+
+function assignNodeIntersects(g) {
+  _.forEach(g.edges(), function (e) {
+    var edge = g.edge(e);
+    var nodeV = g.node(e.v);
+    var nodeW = g.node(e.w);
+    var p1, p2;
+    if (!edge.points) {
+      edge.points = [];
+      p1 = nodeW;
+      p2 = nodeV;
+    } else {
+      p1 = edge.points[0];
+      p2 = edge.points[edge.points.length - 1];
+    }
+    edge.points.unshift(util.intersectRect(nodeV, p1));
+    edge.points.push(util.intersectRect(nodeW, p2));
+  });
+}
+
+function fixupEdgeLabelCoords(g) {
+  _.forEach(g.edges(), function (e) {
+    var edge = g.edge(e);
+    if (_.has(edge, 'x')) {
+      if (edge.labelpos === 'l' || edge.labelpos === 'r') {
+        edge.width -= edge.labeloffset;
+      }
+      switch (edge.labelpos) {
+        case 'l':
+          edge.x -= edge.width / 2 + edge.labeloffset;
+          break;
+        case 'r':
+          edge.x += edge.width / 2 + edge.labeloffset;
+          break;
+      }
+    }
+  });
+}
+
+function reversePointsForReversedEdges(g) {
+  _.forEach(g.edges(), function (e) {
+    var edge = g.edge(e);
+    if (edge.reversed) {
+      edge.points.reverse();
+    }
+  });
+}
+
+function removeBorderNodes(g) {
+  _.forEach(g.nodes(), function (v) {
+    if (g.children(v).length) {
+      var node = g.node(v);
+      var t = g.node(node.borderTop);
+      var b = g.node(node.borderBottom);
+      var l = g.node(_.last(node.borderLeft));
+      var r = g.node(_.last(node.borderRight));
+
+      node.width = Math.abs(r.x - l.x);
+      node.height = Math.abs(b.y - t.y);
+      node.x = l.x + node.width / 2;
+      node.y = t.y + node.height / 2;
+    }
+  });
+
+  _.forEach(g.nodes(), function (v) {
+    if (g.node(v).dummy === 'border') {
+      g.removeNode(v);
+    }
+  });
+}
+
+function removeSelfEdges(g) {
+  _.forEach(g.edges(), function (e) {
+    if (e.v === e.w) {
+      var node = g.node(e.v);
+      if (!node.selfEdges) {
+        node.selfEdges = [];
+      }
+      node.selfEdges.push({ e: e, label: g.edge(e) });
+      g.removeEdge(e);
+    }
+  });
+}
+
+function insertSelfEdges(g) {
+  var layers = util.buildLayerMatrix(g);
+  _.forEach(layers, function (layer) {
+    var orderShift = 0;
+    _.forEach(layer, function (v, i) {
+      var node = g.node(v);
+      node.order = i + orderShift;
+      _.forEach(node.selfEdges, function (selfEdge) {
+        util.addDummyNode(
+          g,
+          'selfedge',
+          {
+            width: selfEdge.label.width,
+            height: selfEdge.label.height,
+            rank: node.rank,
+            order: i + ++orderShift,
+            e: selfEdge.e,
+            label: selfEdge.label,
+          },
+          '_se'
+        );
+      });
+      delete node.selfEdges;
+    });
+  });
+}
+
+function positionSelfEdges(g) {
+  _.forEach(g.nodes(), function (v) {
+    var node = g.node(v);
+    if (node.dummy === 'selfedge') {
+      var selfNode = g.node(node.e.v);
+      var x = selfNode.x + selfNode.width / 2;
+      var y = selfNode.y;
+      var dx = node.x - x;
+      var dy = selfNode.height / 2;
+      g.setEdge(node.e, node.label);
+      g.removeNode(v);
+      node.label.points = [
+        { x: x + (2 * dx) / 3, y: y - dy },
+        { x: x + (5 * dx) / 6, y: y - dy },
+        { x: x + dx, y: y },
+        { x: x + (5 * dx) / 6, y: y + dy },
+        { x: x + (2 * dx) / 3, y: y + dy },
+      ];
+      node.label.x = node.x;
+      node.label.y = node.y;
+    }
+  });
+}
+
+function selectNumberAttrs(obj, attrs) {
+  return _.mapValues(_.pick(obj, attrs), Number);
+}
+
+function canonicalize(attrs) {
+  var newAttrs = {};
+  _.forEach(attrs, function (v, k) {
+    newAttrs[k.toLowerCase()] = v;
+  });
+  return newAttrs;
+}

package/src/dagre/nesting-graph.d.ts

@@ -0,0 +1,2 @@
+export function run(g: any): void;
+export function cleanup(g: any): void;

package/src/dagre/nesting-graph.js

@@ -0,0 +1,137 @@
+import { _ } from '../lodash-es/index.ts';
+import * as util from './util.js';
+
+export { run, cleanup };
+
+/*
+ * A nesting graph creates dummy nodes for the tops and bottoms of subgraphs,
+ * adds appropriate edges to ensure that all cluster nodes are placed between
+ * these boundries, and ensures that the graph is connected.
+ *
+ * In addition we ensure, through the use of the minlen property, that nodes
+ * and subgraph border nodes to not end up on the same rank.
+ *
+ * Preconditions:
+ *
+ *    1. Input graph is a DAG
+ *    2. Nodes in the input graph has a minlen attribute
+ *
+ * Postconditions:
+ *
+ *    1. Input graph is connected.
+ *    2. Dummy nodes are added for the tops and bottoms of subgraphs.
+ *    3. The minlen attribute for nodes is adjusted to ensure nodes do not
+ *       get placed on the same rank as subgraph border nodes.
+ *
+ * The nesting graph idea comes from Sander, "Layout of Compound Directed
+ * Graphs."
+ */
+function run(g) {
+  var root = util.addDummyNode(g, 'root', {}, '_root');
+  var depths = treeDepths(g);
+  var height = _.max(_.values(depths)) - 1; // Note: depths is an Object not an array
+  var nodeSep = 2 * height + 1;
+
+  g.graph().nestingRoot = root;
+
+  // Multiply minlen by nodeSep to align nodes on non-border ranks.
+  _.forEach(g.edges(), function (e) {
+    g.edge(e).minlen *= nodeSep;
+  });
+
+  // Calculate a weight that is sufficient to keep subgraphs vertically compact
+  var weight = sumWeights(g) + 1;
+
+  // Create border nodes and link them up
+  _.forEach(g.children(), function (child) {
+    dfs(g, root, nodeSep, weight, height, depths, child);
+  });
+
+  // Save the multiplier for node layers for later removal of empty border
+  // layers.
+  g.graph().nodeRankFactor = nodeSep;
+}
+
+function dfs(g, root, nodeSep, weight, height, depths, v) {
+  var children = g.children(v);
+  if (!children.length) {
+    if (v !== root) {
+      g.setEdge(root, v, { weight: 0, minlen: nodeSep });
+    }
+    return;
+  }
+
+  var top = util.addBorderNode(g, '_bt');
+  var bottom = util.addBorderNode(g, '_bb');
+  var label = g.node(v);
+
+  g.setParent(top, v);
+  label.borderTop = top;
+  g.setParent(bottom, v);
+  label.borderBottom = bottom;
+
+  _.forEach(children, function (child) {
+    dfs(g, root, nodeSep, weight, height, depths, child);
+
+    var childNode = g.node(child);
+    var childTop = childNode.borderTop ? childNode.borderTop : child;
+    var childBottom = childNode.borderBottom ? childNode.borderBottom : child;
+    var thisWeight = childNode.borderTop ? weight : 2 * weight;
+    var minlen = childTop !== childBottom ? 1 : height - depths[v] + 1;
+
+    g.setEdge(top, childTop, {
+      weight: thisWeight,
+      minlen: minlen,
+      nestingEdge: true,
+    });
+
+    g.setEdge(childBottom, bottom, {
+      weight: thisWeight,
+      minlen: minlen,
+      nestingEdge: true,
+    });
+  });
+
+  if (!g.parent(v)) {
+    g.setEdge(root, top, { weight: 0, minlen: height + depths[v] });
+  }
+}
+
+function treeDepths(g) {
+  var depths = {};
+  function dfs(v, depth) {
+    var children = g.children(v);
+    if (children && children.length) {
+      _.forEach(children, function (child) {
+        dfs(child, depth + 1);
+      });
+    }
+    depths[v] = depth;
+  }
+  _.forEach(g.children(), function (v) {
+    dfs(v, 1);
+  });
+  return depths;
+}
+
+function sumWeights(g) {
+  return _.reduce(
+    g.edges(),
+    function (acc, e) {
+      return acc + g.edge(e).weight;
+    },
+    0
+  );
+}
+
+function cleanup(g) {
+  var graphLabel = g.graph();
+  g.removeNode(graphLabel.nestingRoot);
+  delete graphLabel.nestingRoot;
+  _.forEach(g.edges(), function (e) {
+    var edge = g.edge(e);
+    if (edge.nestingEdge) {
+      g.removeEdge(e);
+    }
+  });
+}

package/src/dagre/normalize.d.ts

@@ -0,0 +1,2 @@
+export function run(g: any): void;
+export function undo(g: any): void;

package/src/dagre/normalize.js

@@ -0,0 +1,91 @@
+import { _ } from '../lodash-es/index.ts';
+import * as util from './util.js';
+
+export { run, undo };
+
+/*
+ * Breaks any long edges in the graph into short segments that span 1 layer
+ * each. This operation is undoable with the denormalize function.
+ *
+ * Pre-conditions:
+ *
+ *    1. The input graph is a DAG.
+ *    2. Each node in the graph has a "rank" property.
+ *
+ * Post-condition:
+ *
+ *    1. All edges in the graph have a length of 1.
+ *    2. Dummy nodes are added where edges have been split into segments.
+ *    3. The graph is augmented with a "dummyChains" attribute which contains
+ *       the first dummy in each chain of dummy nodes produced.
+ */
+function run(g) {
+  g.graph().dummyChains = [];
+  _.forEach(g.edges(), function (edge) {
+    normalizeEdge(g, edge);
+  });
+}
+
+function normalizeEdge(g, e) {
+  var v = e.v;
+  var vRank = g.node(v).rank;
+  var w = e.w;
+  var wRank = g.node(w).rank;
+  var name = e.name;
+  var edgeLabel = g.edge(e);
+  var labelRank = edgeLabel.labelRank;
+
+  if (wRank === vRank + 1) return;
+
+  g.removeEdge(e);
+
+  var dummy, attrs, i;
+  for (i = 0, ++vRank; vRank < wRank; ++i, ++vRank) {
+    edgeLabel.points = [];
+    attrs = {
+      width: 0,
+      height: 0,
+      edgeLabel: edgeLabel,
+      edgeObj: e,
+      rank: vRank,
+    };
+    dummy = util.addDummyNode(g, 'edge', attrs, '_d');
+    if (vRank === labelRank) {
+      attrs.width = edgeLabel.width;
+      attrs.height = edgeLabel.height;
+      // @ts-expect-error
+      attrs.dummy = 'edge-label';
+      // @ts-expect-error
+      attrs.labelpos = edgeLabel.labelpos;
+    }
+    g.setEdge(v, dummy, { weight: edgeLabel.weight }, name);
+    if (i === 0) {
+      g.graph().dummyChains.push(dummy);
+    }
+    v = dummy;
+  }
+
+  g.setEdge(v, w, { weight: edgeLabel.weight }, name);
+}
+
+function undo(g) {
+  _.forEach(g.graph().dummyChains, function (v) {
+    var node = g.node(v);
+    var origLabel = node.edgeLabel;
+    var w;
+    g.setEdge(node.edgeObj, origLabel);
+    while (node.dummy) {
+      w = g.successors(v)[0];
+      g.removeNode(v);
+      origLabel.points.push({ x: node.x, y: node.y });
+      if (node.dummy === 'edge-label') {
+        origLabel.x = node.x;
+        origLabel.y = node.y;
+        origLabel.width = node.width;
+        origLabel.height = node.height;
+      }
+      v = w;
+      node = g.node(v);
+    }
+  });
+}

package/src/dagre/order/add-subgraph-constraints.d.ts

@@ -0,0 +1 @@
+export function addSubgraphConstraints(g: any, cg: any, vs: any): void;