@adecore/diagram 0.39.0 → 0.40.0

package/dist/layout.js

@@ -135,11 +135,14 @@ export function layersOf(nodes, edges) {
     return layers;
 }
 /* The layout works in the frame of a diagram that runs to the right; one that runs down is that frame mirrored across the diagonal. */
-function flip(box) {
-    return { ...box, x: box.y, y: box.x, w: box.h, h: box.w };
+function flip(box, down) {
+    return down ? { ...box, x: box.y, y: box.x, w: box.h, h: box.w } : box;
 }
-function flipPoint(point) {
-    return { x: point.y, y: point.x };
+function flipSize(size, down) {
+    return down ? { w: size.h, h: size.w } : { w: size.w, h: size.h };
+}
+function flipPoint(point, down) {
+    return down ? { x: point.y, y: point.x } : point;
 }
 /* Rounded, because a diagram lays its boxes and its lines out on a whole-pixel grid. */
 function center(box) {
@@ -263,8 +266,7 @@ function unitsOf(nodes, layers, sizes, down) {
             layer: layers.get(node.id) ?? 0,
             node: index,
             band: -1,
-            w: down ? size.h : size.w,
-            h: down ? size.w : size.h,
+            ...flipSize(size, down),
             margin: NODE_MARGIN,
             line: -1,
             up: [],
@@ -472,13 +474,15 @@ function placeAlong(layering, edges, ports, labelSizes, layerCount, down) {
             const edge = labelHop.get(hop);
             const size = edge === undefined ? null : labelSizes[edge];
             if (edge !== undefined && size) {
-                channelLabels.push({ edge, hop, y: ports.hopStart[hop], along: down ? size.h : size.w, across: down ? size.w : size.h });
+                const frame = flipSize(size, down);
+                channelLabels.push({ edge, hop, y: ports.hopStart[hop], along: frame.w, across: frame.h });
             }
         }
         loops.forEach((loop, index) => {
             const size = labelSizes[loop.edge];
             if (size && units[loop.unit].layer === layer) {
-                channelLabels.push({ edge: loop.edge, hop: -1, y: ports.loopEnd[index], along: down ? size.h : size.w, across: down ? size.w : size.h });
+                const frame = flipSize(size, down);
+                channelLabels.push({ edge: loop.edge, hop: -1, y: ports.loopEnd[index], along: frame.w, across: frame.h });
             }
         });
         channelLabels.sort((left, right) => left.edge - right.edge);
@@ -562,13 +566,13 @@ export function layoutOf(document) {
         const box = frameBoxOf(unit);
         return box.x + insetOf(shapeOf(unit), box, y - middleOf(unit), down);
     };
-    const toReal = (point) => (down ? flipPoint(point) : point);
+    const toReal = (point) => flipPoint(point, down);
     const labelOf = (edge, frame) => {
         const size = labelSizes[edge];
         if (!size || !frame) {
             return null;
         }
-        return { ...(down ? flip(frame) : frame), lines: size.lines };
+        return { ...flip(frame, down), lines: size.lines };
     };
     const nodes = document.nodes.map((node, index) => {
         const size = sizes[index];
@@ -587,9 +591,7 @@ export function layoutOf(document) {
                 sub: size.sub
             };
         }
-        const frame = frameBoxOf(unit);
-        const box = down ? flip(frame) : frame;
-        return { id: node.id, ...box, layer: units[unit].layer, pinned: false, label: size.label, sub: size.sub };
+        return { id: node.id, ...flip(frameBoxOf(unit), down), layer: units[unit].layer, pinned: false, label: size.label, sub: size.sub };
     });
     const byId = new Map(nodes.map((box) => [box.id, box]));
     const routes = [];
@@ -633,15 +635,14 @@ export function layoutOf(document) {
         }
         const size = labelSizes[loop.edge];
         // In the last layer there is no channel to put a label in, so it sits beside the loop.
-        const frame = frameLabels.get(loop.edge) ??
-            (size
-                ? {
-                    x: reach + 6,
-                    y: Math.round((startY + endY) / 2) - Math.floor((down ? size.w : size.h) / 2),
-                    w: down ? size.h : size.w,
-                    h: down ? size.w : size.h
-                }
-                : undefined);
+        const beside = () => {
+            if (!size) {
+                return undefined;
+            }
+            const turned = flipSize(size, down);
+            return { x: reach + 6, y: Math.round((startY + endY) / 2) - Math.floor(turned.h / 2), ...turned };
+        };
+        const frame = frameLabels.get(loop.edge) ?? beside();
         const edge = document.edges[loop.edge];
         routes[loop.edge] = { index: loop.edge, from: edge.from, to: edge.to, points: points.map(toReal), label: labelOf(loop.edge, frame) };
     });
@@ -671,8 +672,7 @@ export function layoutOf(document) {
             const members = band.members.flat().filter((unit) => units[unit].node >= 0);
             const alongStart = Math.min(...band.members[0].map((unit) => unitX[unit])) - alongBefore;
             const alongEnd = Math.max(...members.map((unit) => unitX[unit] + units[unit].w)) + GROUP_PADDING;
-            const frame = { x: alongStart, y: band.top, w: alongEnd - alongStart, h: band.height };
-            rects.push(down ? flip(frame) : frame);
+            rects.push(flip({ x: alongStart, y: band.top, w: alongEnd - alongStart, h: band.height }, down));
         }
         for (const id of group.wraps) {
             const box = byId.get(id);

package/dist/order.js

@@ -187,9 +187,8 @@ export function orderLayers(layering) {
     });
     items.forEach((_, layer) => flatten(layer));
     // A band's first layer always holds a member, which is what made it the first.
-    const firstSeen = bands.map((band, index) => [band.first, position[band.members[0][0]], index]);
-    firstSeen
-        .slice()
+    bands
+        .map((band, index) => [band.first, position[band.members[0][0]], index])
         .sort((left, right) => left[0] - right[0] || left[1] - right[1] || left[2] - right[2])
         .forEach(([, , band], rank) => {
         bands[band].rank = rank;

package/dist/route.d.ts

@@ -1,6 +1,4 @@
-import type { Point, Rect } from './layout.ts';
-export declare const TRACK_GAP = 12;
-export declare const MIN_CHANNEL = 64;
+import type { Rect } from './layout.ts';
 export interface ChannelHop {
     hop: number;
     ya: number;
@@ -29,5 +27,4 @@ export interface ChannelResult {
     trackX: Map<number, number>;
     labels: Map<number, Rect>;
 }
-export declare function conflictsOf(left: readonly Point[], right: readonly Point[]): number;
 export declare function routeChannel(input: ChannelInput): ChannelResult;

package/dist/route.js

@@ -1,18 +1,16 @@
-export const TRACK_GAP = 12;
+import { intersects } from '@adecore/drawing';
+const TRACK_GAP = 12;
 /* Space between the lane of labels and the first track. */
 const LANE_GAP = 12;
 /* Space between two labels side by side in a lane. */
 const LABEL_GAP = 8;
 /* How far a label keeps from the line it belongs to. */
 const LABEL_OFFSET = 4;
-export const MIN_CHANNEL = 64;
+const MIN_CHANNEL = 64;
 /* Two horizontal lines closer than this read as one. */
 const COLLINEAR = 4;
 /* Two vertical ranges closer than this need tracks of their own. */
 const RANGE_CLEARANCE = 8;
-function overlaps(left, right) {
-    return left.x < right.x + right.w && right.x < left.x + left.w && left.y < right.y + right.h && right.y < left.y + left.h;
-}
 function inflate(rect, by) {
     return { x: rect.x - by, y: rect.y - by, w: rect.w + by * 2, h: rect.h + by * 2 };
 }
@@ -20,7 +18,7 @@ function inflate(rect, by) {
  * How badly two orthogonal polylines get in each other's way: a crossing counts once, a stretch where
  * they run on top of each other counts four times, since that is the one a reader cannot follow.
  */
-export function conflictsOf(left, right) {
+function conflictsOf(left, right) {
     let total = 0;
     for (let i = 1; i < left.length; i++) {
         const a0 = left[i - 1];
@@ -124,7 +122,7 @@ export function routeChannel(input) {
     let slotsBefore = input.labels.length > 0 ? 1 : 0;
     let slotsAfter = 0;
     const touches = (x0, x1, y0, y1, rect) => x1 >= rect.x - 3 && x0 <= rect.x + rect.w + 3 && y1 >= rect.y - 3 && y0 <= rect.y + rect.h + 3;
-    const blocked = (zone, rect) => placed.some((other) => other.zone === zone && overlaps(inflate(other.rect, 4), rect)) ||
+    const blocked = (zone, rect) => placed.some((other) => other.zone === zone && intersects(inflate(other.rect, 4), rect)) ||
         input.obstacles.some((obstacle) => obstacle.y < rect.y + rect.h && rect.y < obstacle.y + obstacle.h);
     const onLine = (zone, rect, label) => input.hops.some((hop) => {
         if (zone === 'before') {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adecore/diagram",
-  "version": "0.39.0",
+  "version": "0.40.0",
   "description": "Directed graph schemas, layered layout, SVG export and reading order.",
   "license": "FSL-1.1-MIT",
   "author": "Bas Milius",
@@ -40,12 +40,12 @@
     "test": "bun test --conditions=source"
   },
   "devDependencies": {
-    "@types/bun": "^1.4.2",
-    "@types/node": "^24.13.6",
+    "@types/bun": "^1.4.4",
+    "@types/node": "^24.19.2",
     "typescript": "^7.0.2"
   },
   "dependencies": {
-    "@adecore/drawing": "0.39.0",
-    "zod": "^4.6.5"
+    "@adecore/drawing": "0.40.0",
+    "zod": "^4.6.7"
   }
 }

package/src/across.ts

@@ -23,21 +23,29 @@ export function placeAcross(layering: Layering): number[] {
     const local = new Array<number>(unitCount).fill(0);
 
     const variableOf = (code: number): number => (code >= 0 ? code : unitCount + bandOfCode(code));
+
     const codeOf = (variable: number): number => (variable < unitCount ? variable : -(variable - unitCount + 1));
+
     const sizeOf = (code: number): number => (code >= 0 ? units[code]!.h : bands[bandOfCode(code)]!.height);
+
     const marginOf = (code: number): number => (code >= 0 ? units[code]!.margin : BAND_MARGIN);
+
     const topOf = (code: number): number => top[variableOf(code)]!;
+
     const absoluteTop = (unit: number): number => {
         const band = units[unit]!.band;
+
         return band >= 0 ? top[unitCount + band]! + local[unit]! : top[unit]!;
     };
 
     const successors: number[][] = Array.from({ length: variableCount }, () => []);
     const incoming = new Array<number>(variableCount).fill(0);
     const present = new Array<boolean>(variableCount).fill(false);
+
     for (const row of items) {
         row.forEach((code, index) => {
             present[variableOf(code)] = true;
+
             if (index > 0) {
                 successors[variableOf(row[index - 1]!)]!.push(code);
                 incoming[variableOf(code)]! += 1;
@@ -48,35 +56,44 @@ export function placeAcross(layering: Layering): number[] {
     // The band order is the same in every layer, so these constraints never form a cycle.
     const lowest = new Array<number>(variableCount).fill(0);
     const queue: number[] = [];
+
     for (let variable = 0; variable < variableCount; variable++) {
         if (present[variable] && incoming[variable] === 0) {
             queue.push(variable);
         }
     }
+
     for (let i = 0; i < queue.length; i++) {
         const variable = queue[i]!;
         const code = codeOf(variable);
+
         for (const next of successors[variable]!) {
             const target = variableOf(next);
             lowest[target] = Math.max(lowest[target]!, lowest[variable]! + sizeOf(code) + marginOf(code) + marginOf(next));
             incoming[target]! -= 1;
+
             if (incoming[target] === 0) {
                 queue.push(target);
             }
         }
     }
+
     const tail = new Array<number>(variableCount).fill(0);
     let total = 0;
+
     for (let i = queue.length - 1; i >= 0; i--) {
         const variable = queue[i]!;
         const code = codeOf(variable);
         let length = sizeOf(code);
+
         for (const next of successors[variable]!) {
             length = Math.max(length, sizeOf(code) + marginOf(code) + marginOf(next) + tail[variableOf(next)]!);
         }
+
         tail[variable] = length;
         total = Math.max(total, lowest[variable]! + length);
     }
+
     for (const variable of queue) {
         top[variable] = Math.floor((lowest[variable]! + total - tail[variable]!) / 2);
     }
@@ -85,19 +102,25 @@ export function placeAcross(layering: Layering): number[] {
         for (const slot of band.members) {
             const low: number[] = [];
             let at = band.before;
+
             slot.forEach((unit, index) => {
                 if (index > 0) {
                     const previous = units[slot[index - 1]!]!;
                     at += previous.h + previous.margin + units[unit]!.margin;
                 }
+
                 low.push(at);
             });
+
             let high = band.height - band.after;
+
             for (let index = slot.length - 1; index >= 0; index--) {
                 const unit = units[slot[index]!]!;
+
                 if (index < slot.length - 1) {
                     high -= unit.margin + units[slot[index + 1]!]!.margin;
                 }
+
                 high -= unit.h;
                 local[slot[index]!] = Math.floor((low[index]! + high) / 2);
             }
@@ -107,25 +130,34 @@ export function placeAcross(layering: Layering): number[] {
     const medianOf = (values: number[]): number => {
         values.sort((left, right) => left - right);
         const middle = values.length >> 1;
+
         return values.length % 2 === 1 ? values[middle]! : (values[middle - 1]! + values[middle]!) / 2;
     };
+
     const desiredTop = (unit: number): number | null => {
         const self = units[unit]!;
+
         if (self.line >= 0) {
             // The points of one long edge pull towards each other rather than their neighbors, so the edge runs straight
             // instead of stepping a little in every layer it passes.
             const line = lines[self.line]!;
             const ends = [units[line[0]!]!.up[0]!, units[line.at(-1)!]!.down[0]!].map((end) => absoluteTop(end) + units[end]!.h / 2);
+
             if (line.length === 1) {
                 const here = absoluteTop(unit);
+
                 return Math.round(Math.abs(ends[1]! - here) < Math.abs(ends[0]! - here) ? ends[1]! : ends[0]!);
             }
+
             return Math.round(medianOf([...line.filter((other) => other !== unit).map(absoluteTop), ...ends]));
         }
+
         const neighbors = [...self.up, ...self.down];
+
         if (neighbors.length === 0) {
             return null;
         }
+
         return Math.round(medianOf(neighbors.map((neighbor) => absoluteTop(neighbor) + units[neighbor]!.h / 2)) - self.h / 2);
     };
 
@@ -133,27 +165,35 @@ export function placeAcross(layering: Layering): number[] {
         for (let step = 0; step < items.length; step++) {
             const layer = round % 2 === 0 ? step : items.length - 1 - step;
             const row = items[layer]!;
+
             row.forEach((code, index) => {
                 if (code >= 0) {
                     const want = desiredTop(code);
+
                     if (want === null) {
                         return;
                     }
+
                     const previous = row[index - 1];
                     const next = row[index + 1];
                     const low = previous === undefined ? -Infinity : topOf(previous) + sizeOf(previous) + marginOf(previous) + marginOf(code);
                     const high = next === undefined ? Infinity : topOf(next) - marginOf(next) - marginOf(code) - sizeOf(code);
                     top[code] = clamp(want, low, high);
+
                     return;
                 }
+
                 const bandIndex = bandOfCode(code);
                 const band = bands[bandIndex]!;
                 const slot = band.members[layer - band.first]!;
+
                 slot.forEach((unit, position) => {
                     const want = desiredTop(unit);
+
                     if (want === null) {
                         return;
                     }
+
                     const self = units[unit]!;
                     const previous = slot[position - 1];
                     const next = slot[position + 1];
@@ -166,48 +206,60 @@ export function placeAcross(layering: Layering): number[] {
 
         bands.forEach((band, bandIndex) => {
             const shifts: number[] = [];
+
             for (const unit of band.members.flat()) {
                 const want = desiredTop(unit);
+
                 if (want !== null) {
                     shifts.push(want - absoluteTop(unit));
                 }
             }
+
             if (shifts.length === 0) {
                 return;
             }
+
             const code = bandCode(bandIndex);
             let low = -Infinity;
             let high = Infinity;
+
             for (let layer = band.first; layer <= band.last; layer++) {
                 const row = items[layer]!;
                 const index = row.indexOf(code);
                 const previous = row[index - 1];
                 const next = row[index + 1];
+
                 if (previous !== undefined) {
                     low = Math.max(low, topOf(previous) + sizeOf(previous) + marginOf(previous) + BAND_MARGIN);
                 }
+
                 if (next !== undefined) {
                     high = Math.min(high, topOf(next) - marginOf(next) - BAND_MARGIN - band.height);
                 }
             }
+
             const shift = Math.round(shifts.reduce((sum, value) => sum + value, 0) / shifts.length);
             top[unitCount + bandIndex] = clamp(top[unitCount + bandIndex]! + shift, low, high);
         });
     }
 
     let least = Infinity;
+
     for (const row of items) {
         for (const code of row) {
             least = Math.min(least, topOf(code));
         }
     }
+
     if (Number.isFinite(least)) {
         for (let variable = 0; variable < variableCount; variable++) {
             top[variable] = top[variable]! - least || 0;
         }
     }
+
     bands.forEach((band, index) => {
         band.top = top[unitCount + index]!;
     });
+
     return units.map((_, unit) => absoluteTop(unit));
 }