@statelyai/layout 0.0.3 → 0.0.5

package/README.md

@@ -9,12 +9,15 @@ return `VisualGraph`; positions remain node fields and routes remain
 
 ## Status
 
+<!-- layered compatibility coverage from test/oracle*.test.ts -->
+
 The native layered implementation covers the complete 152-option elkjs 0.11.1
 layered inventory with one simplified typed name per ELK option. Flat and
 compound graphs, cross-hierarchy edges, ports, labels, self-loops, wrapping,
 four directions, constraints, and replaceable phases are differential-tested
-against elkjs. Partial, incremental, and route-only layout remain explicit
-unimplemented capabilities.
+against elkjs, including a curated complex state-machine corpus in both primary
+layout orientations. Partial, incremental, and route-only layout remain
+explicit unimplemented capabilities.
 
 ## Install
 

package/dist/elkjs/index.mjs

@@ -1,8 +1,11 @@
-import { o as elkLayeredOptionDefinitions, t as getLayeredLayout } from "../layered-f_3mmGHr.mjs";
-import { a as getRandomLayout, f as getFixedLayout, n as getSporeOverlapRemovalLayout, s as getRectanglePackingLayout, t as getSporeCompactionLayout, u as getBoxLayout } from "../spore-BfTduMDc.mjs";
+import { o as elkLayeredOptionDefinitions, t as getLayeredLayout } from "../layered-BYhTymAk.mjs";
+import { a as getRandomLayout, f as getFixedLayout, n as getSporeOverlapRemovalLayout, s as getRectanglePackingLayout, t as getSporeCompactionLayout, u as getBoxLayout } from "../spore-B504wOFR.mjs";
 import { createGraph } from "@statelyai/graph";
 
 //#region src/elkjs/index.ts
+function isLayoutEdgeLabel(label) {
+	return getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true && (Boolean(label.text) || label.width !== void 0 || label.height !== void 0);
+}
 var ELK = class {
 	#options;
 	#algorithmIds;
@@ -897,7 +900,7 @@ function toGraph(root, globalOptions = {}) {
 			if (isInsideSelfLoop(root, edge)) return [];
 			const source = endpoint(edge.sources?.[0] ?? edge.source, portOwnerById);
 			const target = endpoint(edge.targets?.[0] ?? edge.target, portOwnerById);
-			const labels = (edge.labels ?? []).filter((label) => Boolean(label.text) && getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true);
+			const labels = (edge.labels ?? []).filter(isLayoutEdgeLabel);
 			const labelLabelSpacing = getNumberOption(globalOptions, "spacing.labelLabel") ?? 0;
 			const labelWidth = Math.max(0, ...labels.map((label) => label.width ?? 0));
 			const labelHeight = labels.reduce((sum, label) => sum + (label.height ?? 0), 0) + Math.max(0, labels.length - 1) * labelLabelSpacing;
@@ -1000,7 +1003,7 @@ function applyLayout(root, graph, padding, layoutOptions) {
 				label.y ??= 0;
 				continue;
 			}
-			if (!label.text) {
+			if (!isLayoutEdgeLabel(label)) {
 				label.x ??= 0;
 				label.y ??= 0;
 				continue;
@@ -1026,7 +1029,7 @@ function normalizeElkGraphBounds(root, padding, layoutOptions = {}) {
 		minimumY = Math.min(minimumY, node.y ?? 0, ...(node.labels ?? []).map((label) => (node.y ?? 0) + (label.y ?? 0)), ...(node.ports ?? []).map((port) => (node.y ?? 0) + (port.y ?? 0)), ...(node.ports ?? []).flatMap((port) => (port.labels ?? []).map((label) => (node.y ?? 0) + (port.y ?? 0) + (label.y ?? 0))));
 	}
 	for (const edge of root.edges ?? []) {
-		const laidOutLabels = (edge.labels ?? []).filter((label) => Boolean(label.text) && getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true);
+		const laidOutLabels = (edge.labels ?? []).filter(isLayoutEdgeLabel);
 		minimumX = Math.min(minimumX, ...laidOutLabels.map((label) => label.x ?? 0));
 		minimumY = Math.min(minimumY, ...laidOutLabels.map((label) => label.y ?? 0));
 		if (getBooleanOption(edge.layoutOptions ?? {}, "noLayout") !== true) {
@@ -1055,7 +1058,7 @@ function normalizeElkGraphBounds(root, padding, layoutOptions = {}) {
 				point.x += shiftX;
 				point.y += shiftY;
 			}
-			for (const label of (edge.labels ?? []).filter((candidate) => Boolean(candidate.text))) {
+			for (const label of (edge.labels ?? []).filter(isLayoutEdgeLabel)) {
 				label.x = (label.x ?? 0) + shiftX;
 				label.y = (label.y ?? 0) + shiftY;
 			}
@@ -1091,7 +1094,7 @@ function normalizeElkGraphBounds(root, padding, layoutOptions = {}) {
 		...(node.labels ?? []).map((label) => (node.x ?? 0) + (label.x ?? 0) + (label.width ?? 0)),
 		...(node.ports ?? []).map((port) => (node.x ?? 0) + (port.x ?? 0) + (port.width ?? 0)),
 		...(node.ports ?? []).flatMap((port) => (port.labels ?? []).map((label) => (node.x ?? 0) + (port.x ?? 0) + (label.x ?? 0) + (label.width ?? 0)))
-	]), ...(root.edges ?? []).flatMap((edge) => (edge.labels ?? []).filter((label) => Boolean(label.text) && getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true).map((label) => (label.x ?? 0) + (label.width ?? 0))), ...(root.edges ?? []).flatMap((edge) => getBooleanOption(edge.layoutOptions ?? {}, "noLayout") === true ? [] : (edge.sections ?? []).flatMap((section) => [
+	]), ...(root.edges ?? []).flatMap((edge) => (edge.labels ?? []).filter(isLayoutEdgeLabel).map((label) => (label.x ?? 0) + (label.width ?? 0))), ...(root.edges ?? []).flatMap((edge) => getBooleanOption(edge.layoutOptions ?? {}, "noLayout") === true ? [] : (edge.sections ?? []).flatMap((section) => [
 		section.startPoint.x,
 		...(section.bendPoints ?? []).map((point) => point.x),
 		section.endPoint.x
@@ -1101,7 +1104,7 @@ function normalizeElkGraphBounds(root, padding, layoutOptions = {}) {
 		...(node.labels ?? []).map((label) => (node.y ?? 0) + (label.y ?? 0) + (label.height ?? 0)),
 		...(node.ports ?? []).map((port) => (node.y ?? 0) + (port.y ?? 0) + (port.height ?? 0)),
 		...(node.ports ?? []).flatMap((port) => (port.labels ?? []).map((label) => (node.y ?? 0) + (port.y ?? 0) + (label.y ?? 0) + (label.height ?? 0)))
-	]), ...(root.edges ?? []).flatMap((edge) => (edge.labels ?? []).filter((label) => Boolean(label.text) && getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true).map((label) => (label.y ?? 0) + (label.height ?? 0) + (String(getOption(label.layoutOptions ?? {}, "edgeLabels.placement") ?? "CENTER") === "CENTER" ? 1 : 0))), ...(root.edges ?? []).flatMap((edge) => getBooleanOption(edge.layoutOptions ?? {}, "noLayout") === true ? [] : (edge.sections ?? []).flatMap((section) => [
+	]), ...(root.edges ?? []).flatMap((edge) => (edge.labels ?? []).filter(isLayoutEdgeLabel).map((label) => (label.y ?? 0) + (label.height ?? 0) + (String(getOption(label.layoutOptions ?? {}, "edgeLabels.placement") ?? "CENTER") === "CENTER" ? 1 : 0))), ...(root.edges ?? []).flatMap((edge) => getBooleanOption(edge.layoutOptions ?? {}, "noLayout") === true ? [] : (edge.sections ?? []).flatMap((section) => [
 		section.startPoint.y,
 		...(section.bendPoints ?? []).map((point) => point.y),
 		section.endPoint.y

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import { A as minimizeCrossingsWithBarycenter, B as LayoutError, C as breakCyclesGreedilyByModelOrder, D as breakCyclesWithModelOrderDepthFirstSearch, E as breakCyclesWithModelOrderBreadthFirstSearch, I as routeEdgesOrthogonally, L as routeEdgesWithPolylines, M as minimizeCrossingsWithModelOrder, N as placeNodesInLayers, P as placeNodesInteractively, R as routeEdgesWithSplines, S as breakCyclesGreedily, T as breakCyclesWithDepthFirstSearch, V as UnsupportedLayoutError, _ as assignLayersInteractively, a as elkLayeredEnumValues, b as breakCyclesByStronglyConnectedConnectivity, d as assignLayersWithMinWidth, f as assignLayersWithNetworkSimplex, g as assignLayersByLongestPathToSink, h as assignLayersByLongestPath, i as toElkLayeredOptions, j as minimizeCrossingsWithMedian, k as minimizeCrossingsInteractively, m as assignLayersByDepthFirstModelOrder, n as layeredAlgorithm, o as elkLayeredOptionDefinitions, p as assignLayersByBreadthFirstModelOrder, r as fromElkLayeredOptionId, t as getLayeredLayout, u as assignLayersWithStretchWidth, v as assignLayersWithCoffmanGraham, w as breakCyclesInteractively, x as breakCyclesByStronglyConnectedNodeType, y as breakCyclesByModelOrder } from "./layered-f_3mmGHr.mjs";
-import { a as getRandomLayout, c as rectanglePackingAlgorithm, d as fixedAlgorithm, f as getFixedLayout, i as sporeOverlapRemovalAlgorithm, l as boxAlgorithm, n as getSporeOverlapRemovalLayout, o as randomAlgorithm, r as sporeCompactionAlgorithm, s as getRectanglePackingLayout, t as getSporeCompactionLayout, u as getBoxLayout } from "./spore-BfTduMDc.mjs";
+import { A as minimizeCrossingsWithBarycenter, B as LayoutError, C as breakCyclesGreedilyByModelOrder, D as breakCyclesWithModelOrderDepthFirstSearch, E as breakCyclesWithModelOrderBreadthFirstSearch, I as routeEdgesOrthogonally, L as routeEdgesWithPolylines, M as minimizeCrossingsWithModelOrder, N as placeNodesInLayers, P as placeNodesInteractively, R as routeEdgesWithSplines, S as breakCyclesGreedily, T as breakCyclesWithDepthFirstSearch, V as UnsupportedLayoutError, _ as assignLayersInteractively, a as elkLayeredEnumValues, b as breakCyclesByStronglyConnectedConnectivity, d as assignLayersWithMinWidth, f as assignLayersWithNetworkSimplex, g as assignLayersByLongestPathToSink, h as assignLayersByLongestPath, i as toElkLayeredOptions, j as minimizeCrossingsWithMedian, k as minimizeCrossingsInteractively, m as assignLayersByDepthFirstModelOrder, n as layeredAlgorithm, o as elkLayeredOptionDefinitions, p as assignLayersByBreadthFirstModelOrder, r as fromElkLayeredOptionId, t as getLayeredLayout, u as assignLayersWithStretchWidth, v as assignLayersWithCoffmanGraham, w as breakCyclesInteractively, x as breakCyclesByStronglyConnectedNodeType, y as breakCyclesByModelOrder } from "./layered-BYhTymAk.mjs";
+import { a as getRandomLayout, c as rectanglePackingAlgorithm, d as fixedAlgorithm, f as getFixedLayout, i as sporeOverlapRemovalAlgorithm, l as boxAlgorithm, n as getSporeOverlapRemovalLayout, o as randomAlgorithm, r as sporeCompactionAlgorithm, s as getRectanglePackingLayout, t as getSporeCompactionLayout, u as getBoxLayout } from "./spore-B504wOFR.mjs";
 import { getGraphIssues } from "@statelyai/graph";
 
 //#region src/layout.ts

package/dist/layered/index.mjs

@@ -1,3 +1,3 @@
-import { A as minimizeCrossingsWithBarycenter, C as breakCyclesGreedilyByModelOrder, D as breakCyclesWithModelOrderDepthFirstSearch, E as breakCyclesWithModelOrderBreadthFirstSearch, I as routeEdgesOrthogonally, L as routeEdgesWithPolylines, M as minimizeCrossingsWithModelOrder, N as placeNodesInLayers, P as placeNodesInteractively, R as routeEdgesWithSplines, S as breakCyclesGreedily, T as breakCyclesWithDepthFirstSearch, _ as assignLayersInteractively, a as elkLayeredEnumValues, b as breakCyclesByStronglyConnectedConnectivity, c as placeNodesWithLinearSegments, d as assignLayersWithMinWidth, f as assignLayersWithNetworkSimplex, g as assignLayersByLongestPathToSink, h as assignLayersByLongestPath, i as toElkLayeredOptions, j as minimizeCrossingsWithMedian, k as minimizeCrossingsInteractively, l as placeNodesWithBrandesKoepf, m as assignLayersByDepthFirstModelOrder, n as layeredAlgorithm, o as elkLayeredOptionDefinitions, p as assignLayersByBreadthFirstModelOrder, r as fromElkLayeredOptionId, s as placeNodesWithNetworkSimplex, t as getLayeredLayout, u as assignLayersWithStretchWidth, v as assignLayersWithCoffmanGraham, w as breakCyclesInteractively, x as breakCyclesByStronglyConnectedNodeType, y as breakCyclesByModelOrder } from "../layered-f_3mmGHr.mjs";
+import { A as minimizeCrossingsWithBarycenter, C as breakCyclesGreedilyByModelOrder, D as breakCyclesWithModelOrderDepthFirstSearch, E as breakCyclesWithModelOrderBreadthFirstSearch, I as routeEdgesOrthogonally, L as routeEdgesWithPolylines, M as minimizeCrossingsWithModelOrder, N as placeNodesInLayers, P as placeNodesInteractively, R as routeEdgesWithSplines, S as breakCyclesGreedily, T as breakCyclesWithDepthFirstSearch, _ as assignLayersInteractively, a as elkLayeredEnumValues, b as breakCyclesByStronglyConnectedConnectivity, c as placeNodesWithLinearSegments, d as assignLayersWithMinWidth, f as assignLayersWithNetworkSimplex, g as assignLayersByLongestPathToSink, h as assignLayersByLongestPath, i as toElkLayeredOptions, j as minimizeCrossingsWithMedian, k as minimizeCrossingsInteractively, l as placeNodesWithBrandesKoepf, m as assignLayersByDepthFirstModelOrder, n as layeredAlgorithm, o as elkLayeredOptionDefinitions, p as assignLayersByBreadthFirstModelOrder, r as fromElkLayeredOptionId, s as placeNodesWithNetworkSimplex, t as getLayeredLayout, u as assignLayersWithStretchWidth, v as assignLayersWithCoffmanGraham, w as breakCyclesInteractively, x as breakCyclesByStronglyConnectedNodeType, y as breakCyclesByModelOrder } from "../layered-BYhTymAk.mjs";
 
 export { assignLayersByBreadthFirstModelOrder, assignLayersByDepthFirstModelOrder, assignLayersByLongestPath, assignLayersByLongestPathToSink, assignLayersInteractively, assignLayersWithCoffmanGraham, assignLayersWithMinWidth, assignLayersWithNetworkSimplex, assignLayersWithStretchWidth, breakCyclesByModelOrder, breakCyclesByStronglyConnectedConnectivity, breakCyclesByStronglyConnectedNodeType, breakCyclesGreedily, breakCyclesGreedilyByModelOrder, breakCyclesInteractively, breakCyclesWithDepthFirstSearch, breakCyclesWithModelOrderBreadthFirstSearch, breakCyclesWithModelOrderDepthFirstSearch, elkLayeredEnumValues, elkLayeredOptionDefinitions, fromElkLayeredOptionId, getLayeredLayout, layeredAlgorithm, minimizeCrossingsInteractively, minimizeCrossingsWithBarycenter, minimizeCrossingsWithMedian, minimizeCrossingsWithModelOrder, placeNodesInLayers, placeNodesInteractively, placeNodesWithBrandesKoepf, placeNodesWithLinearSegments, placeNodesWithNetworkSimplex, routeEdgesOrthogonally, routeEdgesWithPolylines, routeEdgesWithSplines, toElkLayeredOptions };

package/dist/{layered-f_3mmGHr.mjs → layered-BYhTymAk.mjs}

@@ -3699,6 +3699,77 @@ function getPolylineMidpoint(points) {
 	};
 }
 
+//#endregion
+//#region src/layered/separate-exterior-labels.ts
+/** Separates movable inline labels and their exterior orthogonal route tracks. */
+function separateExteriorLabels({ edges, nodeRects, direction, spacing, settings }) {
+	const horizontalFlow = direction === "left" || direction === "right";
+	const nodeCrossStart = Math.min(...nodeRects.map((rect) => horizontalFlow ? rect.y : rect.x));
+	const nodeCrossEnd = Math.max(...nodeRects.map((rect) => horizontalFlow ? rect.y + rect.height : rect.x + rect.width));
+	const flowStart = (rect) => horizontalFlow ? rect.x : rect.y;
+	const flowEnd = (rect) => horizontalFlow ? rect.x + rect.width : rect.y + rect.height;
+	const crossStart = (rect) => horizontalFlow ? rect.y : rect.x;
+	const crossEnd = (rect) => horizontalFlow ? rect.y + rect.height : rect.x + rect.width;
+	const overlaps = (left, right) => flowStart(left) < flowEnd(right) && flowEnd(left) > flowStart(right) && crossStart(left) < crossEnd(right) && crossEnd(left) > crossStart(right);
+	const labelRectByEdgeId = new Map(edges.filter((edge) => edge.width > 0 && edge.height > 0).map((edge) => [String(edge.id), {
+		x: edge.x,
+		y: edge.y,
+		width: edge.width,
+		height: edge.height
+	}]));
+	const movableLabels = edges.flatMap((edge) => {
+		const labelRect = labelRectByEdgeId.get(String(edge.id));
+		const labelSettings = settings(edge);
+		if (!labelRect || !labelSettings.inline || labelSettings.placement !== "CENTER") return [];
+		const exteriorTrack = edge.points.flatMap((point, index) => {
+			const next = edge.points[index + 1];
+			if (!next) return [];
+			const isFlowSegment = horizontalFlow ? point.y === next.y && point.x !== next.x : point.x === next.x && point.y !== next.y;
+			const trackCross = horizontalFlow ? point.y : point.x;
+			return isFlowSegment && (trackCross < nodeCrossStart || trackCross > nodeCrossEnd) ? [{
+				cross: trackCross,
+				length: horizontalFlow ? Math.abs(next.x - point.x) : Math.abs(next.y - point.y)
+			}] : [];
+		}).sort((left, right) => right.length - left.length)[0];
+		if (!exteriorTrack) return [];
+		return [{
+			edge,
+			exteriorTrack,
+			labelRect,
+			lowSide: exteriorTrack.cross < (nodeCrossStart + nodeCrossEnd) / 2
+		}];
+	});
+	movableLabels.sort((left, right) => {
+		if (left.lowSide !== right.lowSide) return left.lowSide ? -1 : 1;
+		return (left.lowSide ? crossStart(left.labelRect) - crossStart(right.labelRect) : crossStart(right.labelRect) - crossStart(left.labelRect)) || flowStart(left.labelRect) - flowStart(right.labelRect) || (String(left.edge.id) < String(right.edge.id) ? -1 : String(left.edge.id) > String(right.edge.id) ? 1 : 0);
+	});
+	for (const { edge, exteriorTrack, labelRect, lowSide } of movableLabels) {
+		const obstacles = [...nodeRects, ...[...labelRectByEdgeId.entries()].flatMap(([edgeId, rect]) => edgeId === String(edge.id) ? [] : [rect])];
+		let totalDelta = 0;
+		while (true) {
+			const blockers = obstacles.filter((rect) => overlaps(labelRect, rect));
+			if (blockers.length === 0) break;
+			const delta = (lowSide ? Math.min(...blockers.map(crossStart)) - spacing - (horizontalFlow ? edge.height : edge.width) : Math.max(...blockers.map(crossEnd)) + spacing) - crossStart(labelRect);
+			totalDelta += delta;
+			if (horizontalFlow) labelRect.y += delta;
+			else labelRect.x += delta;
+		}
+		if (totalDelta === 0) continue;
+		if (horizontalFlow) edge.y += totalDelta;
+		else edge.x += totalDelta;
+		edge.points = edge.points.map((point) => {
+			if ((horizontalFlow ? point.y : point.x) !== exteriorTrack.cross) return point;
+			return horizontalFlow ? {
+				...point,
+				y: point.y + totalDelta
+			} : {
+				...point,
+				x: point.x + totalDelta
+			};
+		});
+	}
+}
+
 //#endregion
 //#region src/layered/network-simplex.ts
 function connectedEdges(node) {
@@ -8745,6 +8816,7 @@ function runLayeredPipeline(graph, options, context) {
 	let expandedRoutes = measure("edge-routing", () => edgeRouter(expanded.input, expanded.orientation, placement));
 	measure("post-compaction", () => applyPostCompaction(expanded.input, placement, expandedRoutes));
 	const antiparallelLabelPositions = /* @__PURE__ */ new Map();
+	const outerAntiparallelLabelIds = /* @__PURE__ */ new Set();
 	const parallelLabelPositions = /* @__PURE__ */ new Map();
 	const postCompactionNodeCrossDeltas = /* @__PURE__ */ new Map();
 	const horizontalAntiparallelFlow = direction === "left" || direction === "right";
@@ -8834,12 +8906,13 @@ function runLayeredPipeline(graph, options, context) {
 			const secondRect = placement.rectByNodeId.get(pair[0].targetId);
 			if (!firstNode || !secondNode || !firstRect || !secondRect) continue;
 			const nonSelfNeighbors = (nodeId) => new Set(graph.edges.flatMap((edge) => edge.sourceId === edge.targetId ? [] : edge.sourceId === nodeId ? [edge.targetId] : edge.targetId === nodeId ? [edge.sourceId] : []));
-			if (nonSelfNeighbors(firstNode.id).size !== 1 || nonSelfNeighbors(secondNode.id).size !== 1) continue;
+			const isolatedAntiparallelPair = nonSelfNeighbors(firstNode.id).size === 1 && nonSelfNeighbors(secondNode.id).size === 1;
 			const hasFlexiblePorts = (node) => {
 				const constraints = options.nodeSettings?.(node)?.portConstraints;
 				return constraints === void 0 || constraints === "UNDEFINED" || constraints === "FREE";
 			};
-			if (!hasFlexiblePorts(firstNode) || !hasFlexiblePorts(secondNode)) continue;
+			const hasFlexiblePairPorts = hasFlexiblePorts(firstNode) && hasFlexiblePorts(secondNode);
+			if (isolatedAntiparallelPair && !hasFlexiblePairPorts) continue;
 			const firstBeforeSecond = horizontal ? firstRect.x + firstRect.width / 2 < secondRect.x + secondRect.width / 2 : firstRect.y + firstRect.height / 2 < secondRect.y + secondRect.height / 2;
 			const beforeRect = firstBeforeSecond ? firstRect : secondRect;
 			const afterRect = firstBeforeSecond ? secondRect : firstRect;
@@ -8850,13 +8923,20 @@ function runLayeredPipeline(graph, options, context) {
 			for (const edge of pair) {
 				const width = edge.width ?? 0;
 				const height = edge.height ?? 0;
-				antiparallelLabelPositions.set(edge.id, horizontal ? {
+				antiparallelLabelPositions.set(edge.id, isolatedAntiparallelPair ? horizontal ? {
 					x: (beforeRect.x + beforeRect.width + afterRect.x - width) / 2,
 					y: cross
 				} : {
 					x: cross,
 					y: (beforeRect.y + beforeRect.height + afterRect.y - height) / 2
+				} : horizontal ? {
+					x: (beforeRect.x + beforeRect.width + afterRect.x - width) / 2,
+					y: edge === forward ? (firstRect.y + firstRect.height / 2 + secondRect.y + secondRect.height / 2) / 2 - height / 2 : Math.max(firstRect.y + firstRect.height, secondRect.y + secondRect.height) + edgeSpacing
+				} : {
+					x: edge === forward ? (firstRect.x + firstRect.width / 2 + secondRect.x + secondRect.width / 2) / 2 - width / 2 : Math.max(firstRect.x + firstRect.width, secondRect.x + secondRect.width) + edgeSpacing,
+					y: (beforeRect.y + beforeRect.height + afterRect.y - height) / 2
 				});
+				if (!isolatedAntiparallelPair && edge !== forward) outerAntiparallelLabelIds.add(edge.id);
 				cross += (horizontal ? height : width) + edgeSpacing;
 			}
 			const forwardLabel = antiparallelLabelPositions.get(forward.id);
@@ -8881,8 +8961,10 @@ function runLayeredPipeline(graph, options, context) {
 					x: nextCross
 				});
 			};
-			alignPort(nodesById.get(forward.sourceId), forward.sourcePort);
-			alignPort(nodesById.get(forward.targetId), forward.targetPort);
+			if (isolatedAntiparallelPair) {
+				alignPort(nodesById.get(forward.sourceId), forward.sourcePort);
+				alignPort(nodesById.get(forward.targetId), forward.targetPort);
+			}
 		}
 	}
 	if (postCompactionNodeCrossDeltas.size > 0) {
@@ -9239,7 +9321,33 @@ function runLayeredPipeline(graph, options, context) {
 		};
 		const flexibleFeedbackLabel = labelPlacement === "CENTER" && inlineLabel && expanded.orientation.reversedEdgeIds.has(edge.id) && hasFlexiblePorts(sourceNode) && hasFlexiblePorts(targetNode) && sourceRect !== void 0 && targetRect !== void 0;
 		const [beforeFlowRect, afterFlowRect] = sourceRect && targetRect ? horizontal ? sourceRect.x <= targetRect.x ? [sourceRect, targetRect] : [targetRect, sourceRect] : sourceRect.y <= targetRect.y ? [sourceRect, targetRect] : [targetRect, sourceRect] : [void 0, void 0];
-		const explicitLabelPosition = antiparallelLabelPositions.get(edge.id) ?? parallelLabelPositions.get(edge.id);
+		const antiparallelLabelPosition = antiparallelLabelPositions.get(edge.id);
+		const explicitLabelPosition = (() => {
+			if (!outerAntiparallelLabelIds.has(edge.id)) return void 0;
+			const edgeNodeSpacing$1 = Number(options.settings?.["spacing.edgeNode"] ?? 10);
+			if (horizontal) {
+				const x$1 = (beforeFlowRect.x + beforeFlowRect.width + afterFlowRect.x - width) / 2;
+				const blockers$1 = [
+					sourceRect,
+					targetRect,
+					...[...placement.rectByNodeId.values()].filter((rect) => rect.x < x$1 + width && rect.x + rect.width > x$1)
+				];
+				return {
+					x: x$1,
+					y: Math.max(...blockers$1.map((rect) => rect.y + rect.height)) + edgeNodeSpacing$1
+				};
+			}
+			const y$1 = (beforeFlowRect.y + beforeFlowRect.height + afterFlowRect.y - height) / 2;
+			const blockers = [
+				sourceRect,
+				targetRect,
+				...[...placement.rectByNodeId.values()].filter((rect) => rect.y < y$1 + height && rect.y + rect.height > y$1)
+			];
+			return {
+				x: Math.max(...blockers.map((rect) => rect.x + rect.width)) + edgeNodeSpacing$1,
+				y: y$1
+			};
+		})() ?? antiparallelLabelPosition ?? parallelLabelPositions.get(edge.id);
 		const x = explicitLabelPosition ? explicitLabelPosition.x : flexibleFeedbackLabel ? horizontal ? (beforeFlowRect.x + beforeFlowRect.width + afterFlowRect.x - width) / 2 : targetRect.x + (targetRect.width - width) / 2 : labelPlacement === "CENTER" && horizontal && labelDummyRect ? labelDummyRect.x : routeX;
 		const y = explicitLabelPosition ? explicitLabelPosition.y : flexibleFeedbackLabel ? horizontal ? targetRect.y + (targetRect.height - height) / 2 : (beforeFlowRect.y + beforeFlowRect.height + afterFlowRect.y - height) / 2 : labelPlacement === "CENTER" && !horizontal && labelDummyRect ? labelDummyRect.y : routeY;
 		return {
@@ -9252,6 +9360,19 @@ function runLayeredPipeline(graph, options, context) {
 			routing: edgeRouting === "POLYLINE" ? "polyline" : edgeRouting === "SPLINES" ? "splines" : "orthogonal"
 		};
 	});
+	if (edgeRouting === "ORTHOGONAL") separateExteriorLabels({
+		edges,
+		nodeRects: feedbackNodeRects,
+		direction,
+		spacing: Number(options.settings?.["spacing.edgeEdge"] ?? 10),
+		settings: (edge) => {
+			const edgeSettings = options.edgeSettings?.(edge);
+			return {
+				inline: edgeSettings?.["edgeLabels.inline"] === true,
+				placement: edgeSettings?.["edgeLabels.placement"] ?? "CENTER"
+			};
+		}
+	});
 	return {
 		...graph,
 		direction,

package/dist/{spore-BfTduMDc.mjs → spore-B504wOFR.mjs}

@@ -1,4 +1,4 @@
-import { F as placePorts, O as getPolylineMidpoint, z as JavaRandom } from "./layered-f_3mmGHr.mjs";
+import { F as placePorts, O as getPolylineMidpoint, z as JavaRandom } from "./layered-BYhTymAk.mjs";
 import { getNodeSize } from "@statelyai/graph/layout";
 
 //#region src/fixed.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@statelyai/layout",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "description": "Extensible, graph-native layout algorithms for @statelyai/graph",
   "license": "EPL-2.0 OR GPL-3.0-or-later",
   "repository": {
@@ -47,6 +47,7 @@
     "@changesets/cli": "3.0.1",
     "@codemirror/lang-javascript": "^6.2.5",
     "@codemirror/lint": "^6.9.7",
+    "@statelyai/layout-pre-exterior-label-separation": "npm:@statelyai/layout@0.0.4",
     "@types/node": "^25.0.3",
     "@types/react": "^19.2.18",
     "@types/react-dom": "^19.2.4",

package/src/elkjs/index.ts

@@ -14,6 +14,7 @@ import type {
   ElkConstructorArguments,
   ElkLayoutAlgorithmDescription,
   ElkEdge,
+  ElkLabel,
   ElkLayoutArguments,
   ElkLayoutCategoryDescription,
   ElkLayoutOptionDescription,
@@ -25,6 +26,13 @@ import type {
   LaidOutElkNode,
 } from "./types";
 
+function isLayoutEdgeLabel(label: ElkLabel): boolean {
+  return (
+    getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true &&
+    (Boolean(label.text) || label.width !== undefined || label.height !== undefined)
+  );
+}
+
 export type {
   ElkConstructorArguments,
   ElkCommonDescription,
@@ -1264,10 +1272,7 @@ function toGraph(root: ElkNode, globalOptions: Readonly<Record<string, unknown>>
       if (isInsideSelfLoop(root, edge)) return [];
       const source = endpoint(edge.sources?.[0] ?? edge.source, portOwnerById);
       const target = endpoint(edge.targets?.[0] ?? edge.target, portOwnerById);
-      const labels = (edge.labels ?? []).filter(
-        (label) =>
-          Boolean(label.text) && getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true,
-      );
+      const labels = (edge.labels ?? []).filter(isLayoutEdgeLabel);
       const labelLabelSpacing = getNumberOption(globalOptions, "spacing.labelLabel") ?? 0;
       const labelWidth = Math.max(0, ...labels.map((label) => label.width ?? 0));
       const labelHeight =
@@ -1387,7 +1392,7 @@ function applyLayout(
         label.y ??= 0;
         continue;
       }
-      if (!label.text) {
+      if (!isLayoutEdgeLabel(label)) {
         label.x ??= 0;
         label.y ??= 0;
         continue;
@@ -1443,10 +1448,7 @@ function normalizeElkGraphBounds(
     );
   }
   for (const edge of root.edges ?? []) {
-    const laidOutLabels = (edge.labels ?? []).filter(
-      (label) =>
-        Boolean(label.text) && getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true,
-    );
+    const laidOutLabels = (edge.labels ?? []).filter(isLayoutEdgeLabel);
     minimumX = Math.min(minimumX, ...laidOutLabels.map((label) => label.x ?? 0));
     minimumY = Math.min(minimumY, ...laidOutLabels.map((label) => label.y ?? 0));
     if (getBooleanOption(edge.layoutOptions ?? {}, "noLayout") !== true) {
@@ -1473,7 +1475,7 @@ function normalizeElkGraphBounds(
           point.y += shiftY;
         }
       }
-      for (const label of (edge.labels ?? []).filter((candidate) => Boolean(candidate.text))) {
+      for (const label of (edge.labels ?? []).filter(isLayoutEdgeLabel)) {
         label.x = (label.x ?? 0) + shiftX;
         label.y = (label.y ?? 0) + shiftY;
       }
@@ -1578,11 +1580,7 @@ function normalizeElkGraphBounds(
       ]),
       ...(root.edges ?? []).flatMap((edge) =>
         (edge.labels ?? [])
-          .filter(
-            (label) =>
-              Boolean(label.text) &&
-              getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true,
-          )
+          .filter(isLayoutEdgeLabel)
           .map((label) => (label.x ?? 0) + (label.width ?? 0)),
       ),
       ...(root.edges ?? []).flatMap((edge) =>
@@ -1617,11 +1615,7 @@ function normalizeElkGraphBounds(
       ]),
       ...(root.edges ?? []).flatMap((edge) =>
         (edge.labels ?? [])
-          .filter(
-            (label) =>
-              Boolean(label.text) &&
-              getBooleanOption(label.layoutOptions ?? {}, "noLayout") !== true,
-          )
+          .filter(isLayoutEdgeLabel)
           .map(
             (label) =>
               (label.y ?? 0) +

package/src/layered/index.ts

@@ -1,6 +1,7 @@
 import type { Graph, GraphEdge, GraphNode, Point, VisualGraph, VisualNode } from "@statelyai/graph";
 import { UnsupportedLayoutError } from "../errors";
 import type { LayoutAlgorithm, LayoutExecutionContext } from "../types";
+import { separateExteriorLabels } from "./separate-exterior-labels";
 import {
   assignLayersByLongestPath,
   assignLayersByLongestPathToSink,
@@ -1760,6 +1761,7 @@ function runLayeredPipeline<N, E, G, P>(
   );
   measure("post-compaction", () => applyPostCompaction(expanded.input, placement, expandedRoutes));
   const antiparallelLabelPositions = new Map<string, Point>();
+  const outerAntiparallelLabelIds = new Set<string>();
   const parallelLabelPositions = new Map<string, Point>();
   const postCompactionNodeCrossDeltas = new Map<string, number>();
   const horizontalAntiparallelFlow = direction === "left" || direction === "right";
@@ -1898,14 +1900,14 @@ function runLayeredPipeline<N, E, G, P>(
                   : [],
           ),
         );
-      if (nonSelfNeighbors(firstNode.id).size !== 1 || nonSelfNeighbors(secondNode.id).size !== 1) {
-        continue;
-      }
+      const isolatedAntiparallelPair =
+        nonSelfNeighbors(firstNode.id).size === 1 && nonSelfNeighbors(secondNode.id).size === 1;
       const hasFlexiblePorts = (node: GraphNode): boolean => {
         const constraints = options.nodeSettings?.(node)?.portConstraints;
         return constraints === undefined || constraints === "UNDEFINED" || constraints === "FREE";
       };
-      if (!hasFlexiblePorts(firstNode) || !hasFlexiblePorts(secondNode)) continue;
+      const hasFlexiblePairPorts = hasFlexiblePorts(firstNode) && hasFlexiblePorts(secondNode);
+      if (isolatedAntiparallelPair && !hasFlexiblePairPorts) continue;
 
       const firstBeforeSecond = horizontal
         ? firstRect.x + firstRect.width / 2 < secondRect.x + secondRect.width / 2
@@ -1929,16 +1931,44 @@ function runLayeredPipeline<N, E, G, P>(
         const height = edge.height ?? 0;
         antiparallelLabelPositions.set(
           edge.id,
-          horizontal
-            ? {
-                x: (beforeRect.x + beforeRect.width + afterRect.x - width) / 2,
-                y: cross,
-              }
-            : {
-                x: cross,
-                y: (beforeRect.y + beforeRect.height + afterRect.y - height) / 2,
-              },
+          isolatedAntiparallelPair
+            ? horizontal
+              ? {
+                  x: (beforeRect.x + beforeRect.width + afterRect.x - width) / 2,
+                  y: cross,
+                }
+              : {
+                  x: cross,
+                  y: (beforeRect.y + beforeRect.height + afterRect.y - height) / 2,
+                }
+            : horizontal
+              ? {
+                  x: (beforeRect.x + beforeRect.width + afterRect.x - width) / 2,
+                  y:
+                    edge === forward
+                      ? (firstRect.y +
+                          firstRect.height / 2 +
+                          secondRect.y +
+                          secondRect.height / 2) /
+                          2 -
+                        height / 2
+                      : Math.max(firstRect.y + firstRect.height, secondRect.y + secondRect.height) +
+                        edgeSpacing,
+                }
+              : {
+                  x:
+                    edge === forward
+                      ? (firstRect.x + firstRect.width / 2 + secondRect.x + secondRect.width / 2) /
+                          2 -
+                        width / 2
+                      : Math.max(firstRect.x + firstRect.width, secondRect.x + secondRect.width) +
+                        edgeSpacing,
+                  y: (beforeRect.y + beforeRect.height + afterRect.y - height) / 2,
+                },
         );
+        if (!isolatedAntiparallelPair && edge !== forward) {
+          outerAntiparallelLabelIds.add(edge.id);
+        }
         cross += (horizontal ? height : width) + edgeSpacing;
       }
 
@@ -1974,8 +2004,10 @@ function runLayeredPipeline<N, E, G, P>(
           horizontal ? { ...rect, y: nextCross } : { ...rect, x: nextCross },
         );
       };
-      alignPort(nodesById.get(forward.sourceId)!, forward.sourcePort);
-      alignPort(nodesById.get(forward.targetId)!, forward.targetPort);
+      if (isolatedAntiparallelPair) {
+        alignPort(nodesById.get(forward.sourceId)!, forward.sourcePort);
+        alignPort(nodesById.get(forward.targetId)!, forward.targetPort);
+      }
     }
   }
   if (postCompactionNodeCrossDeltas.size > 0) {
@@ -2482,8 +2514,41 @@ function runLayeredPipeline<N, E, G, P>(
             ? [sourceRect, targetRect]
             : [targetRect, sourceRect]
         : [undefined, undefined];
+    const antiparallelLabelPosition = antiparallelLabelPositions.get(edge.id);
+    const outerAntiparallelLabelPosition = (() => {
+      if (!outerAntiparallelLabelIds.has(edge.id)) return undefined;
+      const edgeNodeSpacing = Number(options.settings?.["spacing.edgeNode"] ?? 10);
+      if (horizontal) {
+        const x = (beforeFlowRect!.x + beforeFlowRect!.width + afterFlowRect!.x - width) / 2;
+        const blockers = [
+          sourceRect!,
+          targetRect!,
+          ...[...placement.rectByNodeId.values()].filter(
+            (rect) => rect.x < x + width && rect.x + rect.width > x,
+          ),
+        ];
+        return {
+          x,
+          y: Math.max(...blockers.map((rect) => rect.y + rect.height)) + edgeNodeSpacing,
+        };
+      }
+      const y = (beforeFlowRect!.y + beforeFlowRect!.height + afterFlowRect!.y - height) / 2;
+      const blockers = [
+        sourceRect!,
+        targetRect!,
+        ...[...placement.rectByNodeId.values()].filter(
+          (rect) => rect.y < y + height && rect.y + rect.height > y,
+        ),
+      ];
+      return {
+        x: Math.max(...blockers.map((rect) => rect.x + rect.width)) + edgeNodeSpacing,
+        y,
+      };
+    })();
     const explicitLabelPosition =
-      antiparallelLabelPositions.get(edge.id) ?? parallelLabelPositions.get(edge.id);
+      outerAntiparallelLabelPosition ??
+      antiparallelLabelPosition ??
+      parallelLabelPositions.get(edge.id);
     const x = explicitLabelPosition
       ? explicitLabelPosition.x
       : flexibleFeedbackLabel
@@ -2518,6 +2583,22 @@ function runLayeredPipeline<N, E, G, P>(
     };
   });
 
+  if (edgeRouting === "ORTHOGONAL") {
+    separateExteriorLabels({
+      edges,
+      nodeRects: feedbackNodeRects,
+      direction,
+      spacing: Number(options.settings?.["spacing.edgeEdge"] ?? 10),
+      settings: (edge) => {
+        const edgeSettings = options.edgeSettings?.(edge);
+        return {
+          inline: edgeSettings?.["edgeLabels.inline"] === true,
+          placement: edgeSettings?.["edgeLabels.placement"] ?? "CENTER",
+        };
+      },
+    });
+  }
+
   return {
     ...graph,
     direction,

package/src/layered/separate-exterior-labels.ts

@@ -0,0 +1,139 @@
+import type { EntityRect, Point } from "@statelyai/graph";
+
+export interface ExteriorLabelEdge {
+  id: string;
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+  points: Point[];
+}
+
+interface ExteriorLabelSettings {
+  inline: boolean;
+  placement: string;
+}
+
+interface SeparateExteriorLabelsInput<E extends ExteriorLabelEdge> {
+  edges: E[];
+  nodeRects: readonly EntityRect[];
+  direction: "up" | "down" | "left" | "right";
+  spacing: number;
+  settings: (edge: E) => ExteriorLabelSettings;
+}
+
+/** Separates movable inline labels and their exterior orthogonal route tracks. */
+export function separateExteriorLabels<E extends ExteriorLabelEdge>({
+  edges,
+  nodeRects,
+  direction,
+  spacing,
+  settings,
+}: SeparateExteriorLabelsInput<E>): void {
+  const horizontalFlow = direction === "left" || direction === "right";
+  const nodeCrossStart = Math.min(...nodeRects.map((rect) => (horizontalFlow ? rect.y : rect.x)));
+  const nodeCrossEnd = Math.max(
+    ...nodeRects.map((rect) => (horizontalFlow ? rect.y + rect.height : rect.x + rect.width)),
+  );
+  const flowStart = (rect: EntityRect): number => (horizontalFlow ? rect.x : rect.y);
+  const flowEnd = (rect: EntityRect): number =>
+    horizontalFlow ? rect.x + rect.width : rect.y + rect.height;
+  const crossStart = (rect: EntityRect): number => (horizontalFlow ? rect.y : rect.x);
+  const crossEnd = (rect: EntityRect): number =>
+    horizontalFlow ? rect.y + rect.height : rect.x + rect.width;
+  const overlaps = (left: EntityRect, right: EntityRect): boolean =>
+    flowStart(left) < flowEnd(right) &&
+    flowEnd(left) > flowStart(right) &&
+    crossStart(left) < crossEnd(right) &&
+    crossEnd(left) > crossStart(right);
+  type MutableRect = { x: number; y: number; width: number; height: number };
+  const labelRectByEdgeId = new Map<string, MutableRect>(
+    edges
+      .filter((edge) => edge.width > 0 && edge.height > 0)
+      .map((edge) => [
+        String(edge.id),
+        { x: edge.x, y: edge.y, width: edge.width, height: edge.height },
+      ]),
+  );
+  const movableLabels = edges.flatMap((edge) => {
+    const labelRect = labelRectByEdgeId.get(String(edge.id));
+    const labelSettings = settings(edge);
+    if (!labelRect || !labelSettings.inline || labelSettings.placement !== "CENTER") return [];
+    const exteriorTrack = edge.points
+      .flatMap((point, index) => {
+        const next = edge.points[index + 1];
+        if (!next) return [];
+        const isFlowSegment = horizontalFlow
+          ? point.y === next.y && point.x !== next.x
+          : point.x === next.x && point.y !== next.y;
+        const trackCross = horizontalFlow ? point.y : point.x;
+        return isFlowSegment && (trackCross < nodeCrossStart || trackCross > nodeCrossEnd)
+          ? [
+              {
+                cross: trackCross,
+                length: horizontalFlow ? Math.abs(next.x - point.x) : Math.abs(next.y - point.y),
+              },
+            ]
+          : [];
+      })
+      .sort((left, right) => right.length - left.length)[0];
+    if (!exteriorTrack) return [];
+    return [
+      {
+        edge,
+        exteriorTrack,
+        labelRect,
+        lowSide: exteriorTrack.cross < (nodeCrossStart + nodeCrossEnd) / 2,
+      },
+    ];
+  });
+
+  movableLabels.sort((left, right) => {
+    if (left.lowSide !== right.lowSide) return left.lowSide ? -1 : 1;
+    const crossDifference = left.lowSide
+      ? crossStart(left.labelRect) - crossStart(right.labelRect)
+      : crossStart(right.labelRect) - crossStart(left.labelRect);
+    return (
+      crossDifference ||
+      flowStart(left.labelRect) - flowStart(right.labelRect) ||
+      (String(left.edge.id) < String(right.edge.id)
+        ? -1
+        : String(left.edge.id) > String(right.edge.id)
+          ? 1
+          : 0)
+    );
+  });
+
+  for (const { edge, exteriorTrack, labelRect, lowSide } of movableLabels) {
+    const obstacles = [
+      ...nodeRects,
+      ...[...labelRectByEdgeId.entries()].flatMap(([edgeId, rect]) =>
+        edgeId === String(edge.id) ? [] : [rect],
+      ),
+    ];
+    let totalDelta = 0;
+    while (true) {
+      const blockers = obstacles.filter((rect) => overlaps(labelRect, rect));
+      if (blockers.length === 0) break;
+      const desiredCross = lowSide
+        ? Math.min(...blockers.map(crossStart)) -
+          spacing -
+          (horizontalFlow ? edge.height : edge.width)
+        : Math.max(...blockers.map(crossEnd)) + spacing;
+      const delta = desiredCross - crossStart(labelRect);
+      totalDelta += delta;
+      if (horizontalFlow) labelRect.y += delta;
+      else labelRect.x += delta;
+    }
+    if (totalDelta === 0) continue;
+    if (horizontalFlow) edge.y += totalDelta;
+    else edge.x += totalDelta;
+    edge.points = edge.points.map((point) => {
+      const pointCross = horizontalFlow ? point.y : point.x;
+      if (pointCross !== exteriorTrack.cross) return point;
+      return horizontalFlow
+        ? { ...point, y: point.y + totalDelta }
+        : { ...point, x: point.x + totalDelta };
+    });
+  }
+}