@likec4/diagram 1.59.4 → 1.61.0

package/dist/likec4diagram/xyflow-sequence/layouter.js

@@ -1,564 +0,0 @@
-import "../../_virtual/_rolldown/runtime.js";
-import { normalizeSpacing, rectFromSteps } from "./utils.js";
-import { filter, first, flatMap, hasAtLeast, last, map, only, pipe } from "remeda";
-import { invariant, nonNullable, nonexhaustive } from "@likec4/core/utils";
-import { flowGuards } from "@likec4/core/types";
-import * as kiwi from "@lume/kiwi";
-import defu from "defu";
-//#region src/likec4diagram/xyflow-sequence/layouter.ts
-var Strength = {
-	required: kiwi.Strength.required,
-	strong: kiwi.Strength.strong,
-	medium: kiwi.Strength.medium,
-	soft: kiwi.Strength.create(0, .8, 1),
-	weak: kiwi.Strength.weak
-};
-var SequenceViewLayouter = class {
-	#flow;
-	#solver = new kiwi.Solver();
-	#actors;
-	#compounds = [];
-	#viewportRight;
-	#viewportBottom;
-	#rowsTop;
-	/**
-	* Each row has inner and outer bounds
-	* For adjacent rows, outer-bottom equals outer-top of the next row
-	*
-	* Inner bounds (top and bottom) are updated during layouting (when wrapped with subflow)
-	*
-	* ------ outer-top -------
-	* [ subflow stack begins ]
-	* ------ inner-top -------
-	*      [ A ---> B ]
-	* ---- inner-bottom ------
-	* [ subflow stack ends ]
-	* ---- outer-bottom ------
-	*/
-	#rows = [];
-	#subflows = /* @__PURE__ */ new Map();
-	constructor({ actors, steps, compounds, flow, collapsedFlows }) {
-		this.#solver.maxIterations = 2e3;
-		this.#flow = flow;
-		const firstRowOffset = Math.max(...actors.map((actor) => actor.height)) + 30;
-		this.#rowsTop = this.newVar(firstRowOffset);
-		this.constraint(this.#rowsTop, "==", firstRowOffset, Strength.soft);
-		this.constraint(this.#rowsTop, ">=", firstRowOffset, Strength.weak);
-		this.#viewportRight = this.newVar(0);
-		this.#viewportBottom = this.newVar(0);
-		this.#actors = this.addActors(actors);
-		for (const compound of compounds) {
-			const result = this.addCompound(compound);
-			const toplevel = result[0];
-			this.constraint(toplevel.y1, "==", 0, Strength.strong);
-			this.put(this.#rowsTop, Strength.strong).after(toplevel.y2);
-			this.#compounds.push(...result);
-		}
-		const [firstActor, ...restActors] = this.#actors;
-		this.constraint(firstActor.offset.left, "==", 0, Strength.strong);
-		const lastActor = restActors.reduce((prev, actor) => {
-			this.put(actor.x).after(prev.right, 80);
-			this.put(prev.offset.right, Strength.strong).before(actor.offset.left, 50);
-			this.constraint(actor.centerY, "==", prev.centerY, Strength.strong);
-			return actor;
-		}, firstActor);
-		for (const step of steps) this.addStep(step);
-		this.createSubflowAreas(steps, new Set(collapsedFlows));
-		this.constraint(this.#viewportRight, "==", lastActor.offset.right);
-		const mostBottom = last(this.#rows)?.inner.bottom ?? this.#rowsTop;
-		this.put(this.#viewportBottom, Strength.strong).after(mostBottom, 16);
-		if (compounds.length > 0) for (const compound of this.#compounds) {
-			const from = compound.from.column;
-			const to = compound.to.column;
-			let maxRow = Math.max(compound.from.maxRow, compound.to.maxRow);
-			for (let i = from + 1; i < to; i++) {
-				const actorBox = this.actorBox(i);
-				maxRow = Math.max(maxRow, actorBox.maxRow);
-			}
-			const lastRow = nonNullable(this.#rows[maxRow], `row ${maxRow} not found`);
-			this.put(compound.bottom, Strength.strong).after(lastRow.inner.bottom, 10);
-		}
-		this.#solver.updateVariables();
-	}
-	getSubflowAreas() {
-		return [...this.#subflows.entries()].map(([id, { x1, y1, x2, y2 }]) => ({
-			id,
-			x: x1.value(),
-			y: y1.value(),
-			width: x2.value() - x1.value(),
-			height: y2.value() - y1.value()
-		}));
-	}
-	getActorBox(actor) {
-		const actorBox = this.actorBox(actor);
-		return {
-			x: actorBox.x.value(),
-			y: actorBox.y.value(),
-			width: actorBox.width,
-			height: actorBox.height
-		};
-	}
-	getCompoundBoxes() {
-		return this.#compounds.map(({ node, depth, x1, y1, x2, bottom }) => ({
-			node,
-			depth,
-			x: x1.value(),
-			y: y1.value(),
-			width: x2.value() - x1.value(),
-			height: bottom.value() - y1.value()
-		}));
-	}
-	getPortCenter(step, type) {
-		const { column, row } = type === "source" ? step.from : step.to;
-		const x = this.actorBox(column).centerX;
-		const { rowTop } = nonNullable(this.#rows[row]);
-		if (step.isSelfLoop && type === "target") return {
-			cx: x.value(),
-			cy: rowTop.value(),
-			height: 24
-		};
-		return {
-			cx: x.value(),
-			cy: rowTop.value() + 40 + step.offset,
-			height: type === "source" ? 40 : 24
-		};
-	}
-	isStepCollapsed(step) {
-		if (step.from.row === step.to.row) return this.#rows[step.from.row]?.collapsed ?? false;
-		const minRow = Math.min(step.from.row, step.to.row);
-		const maxRow = Math.min(step.from.row, step.to.row);
-		let collapsed = true;
-		for (let i = minRow; i <= maxRow; i++) {
-			collapsed = collapsed && (this.#rows[i]?.collapsed ?? false);
-			if (!collapsed) break;
-		}
-		return collapsed;
-	}
-	getViewBounds() {
-		return {
-			x: 0,
-			y: 0,
-			width: this.#viewportRight.value(),
-			height: this.#viewportBottom.value()
-		};
-	}
-	actorBox(actor) {
-		if (typeof actor !== "number") {
-			const id = typeof actor === "string" ? actor : actor.id;
-			actor = this.#actors.findIndex((a) => a.actor.id === id);
-			invariant(actor >= 0, `actor ${id} not found`);
-		}
-		return nonNullable(this.#actors[actor], `actor at index ${actor} not found`);
-	}
-	addActors(actors) {
-		let accX = 0;
-		return map(actors, (actor, column) => {
-			const x = this.newVar(accX);
-			accX += actor.width + 80;
-			const y = this.newVar(0);
-			const actorBox = {
-				column,
-				actor,
-				x,
-				y,
-				centerX: x.plus(Math.round(actor.width / 2)),
-				centerY: y.plus(Math.round(actor.height / 2)),
-				width: actor.width,
-				height: actor.height,
-				right: x.plus(actor.width),
-				bottom: y.plus(actor.height),
-				minRow: Infinity,
-				maxRow: -Infinity
-			};
-			const top = this.newVar(0);
-			const left = this.newVar(0);
-			const right = this.newVar(0);
-			const bottom = this.newVar(0);
-			this.put(y, Strength.strong).after(top);
-			this.put(x, Strength.strong).after(left);
-			this.put(actorBox.right, Strength.strong).before(right);
-			this.put(actorBox.bottom, Strength.strong).before(bottom);
-			return {
-				...actorBox,
-				offset: {
-					top,
-					left,
-					right,
-					bottom
-				}
-			};
-		});
-	}
-	addStep(step) {
-		const source = this.actorBox(step.source);
-		const target = this.actorBox(step.target);
-		source.minRow = Math.min(source.minRow, step.from.row);
-		source.maxRow = Math.max(source.maxRow, step.from.row);
-		target.minRow = Math.min(target.minRow, step.to.row);
-		target.maxRow = Math.max(target.maxRow, step.to.row);
-		const [left, right] = source.column <= target.column ? [source, target] : [target, source];
-		const width = (step.label?.width ?? 100) + 50;
-		if (Math.abs(target.column - source.column) <= 1) {
-			if (left !== right) this.constraint(left.centerX.plus(width), "<=", right.centerX);
-			else this.constraint(left.centerX.plus(width), "<=", left.offset.right);
-		}
-		let height = step.label?.height ? step.label.height + 50 + 24 : 100;
-		height = Math.max(height, 100) + step.offset;
-		this.ensureRow(step.from.row, height);
-		if (step.to.row !== step.from.row) this.ensureRow(step.to.row, 24);
-		return this;
-	}
-	/**
-	* Recursively adds a compound and its nested compounds to the layout.
-	* Also updates offsets of the actor boxes to accommodate the compound.
-	*/
-	addCompound(compound) {
-		const PADDING = 32;
-		const PADDING_TOP = 40;
-		const PADDING_TOP_FROM_ACTOR = 52;
-		const children = [];
-		const nested = compound.nested.flatMap((c) => {
-			const result = this.addCompound(c);
-			children.push(result[0]);
-			return result;
-		});
-		const depth = Math.max(...nested.map((c) => c.depth + 1), 0);
-		const from = this.actorBox(compound.from);
-		const to = this.actorBox(compound.to);
-		const x1 = from.offset.left.minus(PADDING);
-		from.offset.left = x1;
-		const x2 = to.offset.right.plus(PADDING);
-		to.offset.right = x2;
-		const bottom = this.newVar(0);
-		const onlyChild = only(children);
-		let y1;
-		let y2;
-		switch (true) {
-			case !!onlyChild:
-				y1 = onlyChild.y1.minus(PADDING_TOP);
-				y2 = onlyChild.y2.plus(PADDING);
-				this.put(onlyChild.bottom).before(bottom, PADDING);
-				break;
-			case to === from:
-				y1 = this.newVar(0);
-				y2 = this.newVar(0);
-				this.put(y1).before(from.offset.top, PADDING_TOP_FROM_ACTOR);
-				this.put(from.offset.bottom).before(y2, PADDING);
-				this.put(y2).before(bottom);
-				break;
-			case children.length > 0:
-				y1 = this.newVar(0);
-				y2 = this.newVar(0);
-				for (const child of children) {
-					this.put(y1).before(child.y1, PADDING);
-					this.put(child.y2).before(y2, PADDING);
-					this.put(child.bottom).before(bottom, PADDING);
-				}
-				break;
-			default:
-				y1 = this.newVar(0);
-				y2 = this.newVar(0);
-				for (var col = from.column; col <= to.column; col++) {
-					const offset = this.actorBox(col).offset;
-					this.put(y1).before(offset.top, PADDING_TOP_FROM_ACTOR);
-					this.put(offset.bottom).before(y2, PADDING);
-				}
-				this.put(y2).before(bottom);
-		}
-		for (var col = from.column; col <= to.column; col++) {
-			const offset = this.actorBox(col).offset;
-			offset.top = y1;
-			offset.bottom = y2;
-		}
-		return [{
-			node: compound.node,
-			depth,
-			from,
-			to,
-			x1,
-			y1,
-			x2,
-			y2,
-			bottom
-		}, ...nested];
-	}
-	ensureRow(row, rowHeight) {
-		while (row >= this.#rows.length) {
-			const outerTop = last(this.#rows)?.outer.bottom || this.#rowsTop;
-			const innerTop = this.newVar(outerTop.value());
-			this.put(innerTop).after(outerTop);
-			let heightValue = rowHeight;
-			if (row !== this.#rows.length) heightValue = 100;
-			const height = new kiwi.Variable();
-			height.setValue(heightValue);
-			this.#solver.addEditVariable(height, Strength.strong);
-			this.#solver.suggestValue(height, heightValue);
-			const innerBottom = this.newVar(innerTop.value() + heightValue);
-			this.require(innerBottom).after(innerTop);
-			this.constraint(innerBottom.minus(innerTop), "==", height, Strength.strong);
-			const outerBottom = this.newVar(innerBottom.value());
-			this.put(outerBottom).after(innerBottom);
-			this.#rows.push({
-				inner: {
-					top: innerTop,
-					bottom: innerBottom
-				},
-				rowTop: innerTop,
-				outer: {
-					top: outerTop,
-					bottom: outerBottom
-				},
-				height
-			});
-		}
-		const rowVar = nonNullable(this.#rows[row]);
-		if (rowHeight > rowVar.height.value()) {
-			rowVar.height.setValue(rowHeight);
-			this.#solver.suggestValue(rowVar.height, rowHeight);
-		}
-		return rowVar;
-	}
-	collapseRect({ min, max }) {
-		const h = 0;
-		for (let row = min.row; row <= max.row; row++) {
-			const r = nonNullable(this.#rows[row], `Row ${row} not found`);
-			r.collapsed = true;
-			r.height.setValue(h);
-			this.#solver.suggestValue(r.height, h);
-		}
-	}
-	getRectBounds({ min, max }) {
-		const firstRow = this.#rows[min.row];
-		const lastRow = this.#rows[max.row];
-		invariant(firstRow && lastRow, `Subflow box invalid minRow=${min.row} maxRow=${max.row}`);
-		return {
-			x1: this.actorBox(min.column).centerX,
-			x2: this.actorBox(max.column).centerX,
-			get top() {
-				return firstRow.inner.top;
-			},
-			set top(value) {
-				firstRow.inner.top = value;
-			},
-			get bottom() {
-				return lastRow.inner.bottom;
-			},
-			set bottom(value) {
-				lastRow.inner.bottom = value;
-			},
-			minY: firstRow.outer.top,
-			maxY: lastRow.outer.bottom
-		};
-	}
-	wrapAroundRect(rect, spacing) {
-		const p = normalizeSpacing(spacing ?? 16);
-		const bounds = this.getRectBounds(rect);
-		const x1 = this.newVar(0);
-		this.put(x1).before(bounds.x1, p.left);
-		const x2 = this.newVar(0);
-		this.put(x2).after(bounds.x2, p.right);
-		const y1 = this.newVar(bounds.minY.value());
-		this.require(y1).after(bounds.minY);
-		this.put(y1).before(bounds.top, p.top);
-		const y2 = this.newVar(bounds.maxY.value());
-		this.put(y2).after(bounds.bottom, p.bottom);
-		this.require(y2).before(bounds.maxY);
-		bounds.top = y1;
-		bounds.bottom = y2;
-		return {
-			x1,
-			y1,
-			x2,
-			y2
-		};
-	}
-	createSubflowAreas(steps, collapsed) {
-		const selectSteps = (id) => filter(steps, (s) => s.id.startsWith(id));
-		const spacing = {
-			top: 30,
-			right: 40,
-			bottom: 10,
-			left: 90
-		};
-		/**
-		* Expands the parent bounding box to fit all subflows and their nested steps.
-		*/
-		const fitSubflows = ({ area, visited, stretch = false, padding }) => {
-			const areas = pipe(visited, filter(flowGuards.isSubFlow), flatMap((b) => this.#subflows.get(b.id) ?? []));
-			if (!hasAtLeast(areas, 1)) return;
-			const p = defu(padding, spacing);
-			const firstArea = first(areas);
-			const lastArea = last(areas);
-			if (firstArea.min.row == area.min.row) this.require(area.y1).before(firstArea.y1, p.top);
-			if (lastArea.max.row == area.max.row) this.require(lastArea.y2).before(area.y2, p.bottom);
-			for (const subarea of areas) {
-				this.require(subarea.x1).after(area.x1, p.left);
-				this.require(subarea.x2).before(area.x2, p.right);
-				if (stretch) {
-					subarea.x1 = p.left > 0 ? area.x1.plus(p.left) : area.x1;
-					subarea.x2 = p.right > 0 ? area.x2.minus(p.right) : area.x2;
-				}
-			}
-		};
-		const createSubflowArea = (subflow) => {
-			const steps = selectSteps(subflow.id);
-			const rect = rectFromSteps(steps);
-			let space;
-			switch (true) {
-				case flowGuards.isAltOrTry(subflow):
-					space = 0;
-					break;
-				case collapsed.has(subflow.id) && flowGuards.isAltOrTryBranch(subflow):
-					space = {
-						...spacing,
-						top: 36,
-						bottom: 0
-					};
-					break;
-				case collapsed.has(subflow.id):
-					space = {
-						...spacing,
-						top: 24,
-						bottom: 0
-					};
-					break;
-				default: space = spacing;
-			}
-			const area = {
-				...this.wrapAroundRect(rect, space),
-				...rect
-			};
-			this.#subflows.set(subflow.id, area);
-			return area;
-		};
-		this.#flow.walk({ subflow: ({ subflow, previous, parent }) => ({
-			next: collapsed.has(subflow.id) ? [] : subflow.flow,
-			onLeave: ({ visited }) => {
-				const area = createSubflowArea(subflow);
-				const previousSubflow = flowGuards.isSubFlow(previous) && this.#subflows.get(previous.id);
-				if (!flowGuards.isAltOrTryBranch(subflow) && previousSubflow) this.put(previousSubflow.y2).before(area.y1, 32);
-				if (!parent && area.min.column > 0) this.require(this.actorBox(area.min.column - 1).centerX).before(area.x1, 100);
-				switch (true) {
-					case collapsed.has(subflow.id):
-						this.collapseRect(area);
-						return;
-					case flowGuards.isAltOrTry(subflow): return fitSubflows({
-						area,
-						visited,
-						padding: {
-							top: 30,
-							left: 0,
-							right: 0
-						},
-						stretch: true
-					});
-					case flowGuards.isAltOrTryBranch(subflow): return fitSubflows({
-						area,
-						visited,
-						padding: {
-							top: 50,
-							left: 32,
-							bottom: 32,
-							right: 32
-						}
-					});
-					default: return fitSubflows({
-						area,
-						visited,
-						padding: {
-							top: 40,
-							bottom: 12,
-							left: 32,
-							right: 16
-						}
-					});
-				}
-			}
-		}) });
-	}
-	newVar(initialValue) {
-		const v = new kiwi.Variable();
-		this.#solver.addEditVariable(v, Strength.weak);
-		if (typeof initialValue === "number") {
-			v.setValue(initialValue);
-			this.#solver.suggestValue(v, initialValue);
-		}
-		return v;
-	}
-	require(...args) {
-		if (args.length == 1) {
-			const [left] = args;
-			return {
-				before: (right, gap = 0) => {
-					let other = gap ? right.minus(gap) : right;
-					return this.constraint(left, "<=", other, Strength.required);
-				},
-				after: (right, gap = 0) => {
-					let other = gap ? right.plus(gap) : right;
-					return this.constraint(left, ">=", other, Strength.required);
-				}
-			};
-		}
-		const [left, op, right] = args;
-		const constraint = this.constraint(left, op, right, Strength.required);
-		switch (op) {
-			case "<=":
-			case ">=":
-				this.constraint(left, "==", right, Strength.weak);
-				break;
-			case "<= 0":
-			case ">= 0": this.constraint(left, "== 0", void 0, Strength.weak);
-		}
-		return constraint;
-	}
-	/**
-	* Adds a constraint with medium strength by default
-	*/
-	constraint(left, op, right = void 0, strength = Strength.medium) {
-		let operator;
-		switch (op) {
-			case "==":
-				operator = kiwi.Operator.Eq;
-				break;
-			case ">=":
-				operator = kiwi.Operator.Ge;
-				break;
-			case "<=":
-				operator = kiwi.Operator.Le;
-				break;
-			case "== 0":
-				operator = kiwi.Operator.Eq;
-				right = 0;
-				break;
-			case ">= 0":
-				operator = kiwi.Operator.Ge;
-				right = 0;
-				break;
-			case "<= 0":
-				operator = kiwi.Operator.Le;
-				right = 0;
-				break;
-			default: nonexhaustive(op);
-		}
-		const constraint = new kiwi.Constraint(left, operator, right ?? 0, strength);
-		this.#solver.addConstraint(constraint);
-		return constraint;
-	}
-	put(variable, strength = Strength.required) {
-		const eqStrength = strength === Strength.required ? Strength.soft : Strength.weak;
-		return {
-			before: (other, gap) => {
-				if (gap) other = other.minus(gap);
-				this.constraint(variable, "<=", other, strength);
-				this.constraint(variable, "==", other, eqStrength);
-			},
-			after: (other, gap) => {
-				if (gap) other = other.plus(gap);
-				this.constraint(variable, ">=", other, strength);
-				this.constraint(variable, "==", other, eqStrength);
-			}
-		};
-	}
-};
-//#endregion
-export { SequenceViewLayouter, Strength };

package/dist/likec4diagram/xyflow-sequence/sequence-view-to-xy.d.ts

@@ -1,17 +0,0 @@
-import { LayoutedDynamicView, ViewId } from '@likec4/core/types';
-import { DiagramContext } from '../state/types';
-import { Types } from '../types';
-/**
- * Converts a sequence layout to XY flow nodes and edges.
- * @param view The next dynamic view which contains the sequence layout.
- * @param currentViewId The ID of the current view (optional, used to exclude navigation to the current view)
- */
-export declare function sequenceLayoutToXY({ view, currentViewId, collapsedFlows }: {
-    view: LayoutedDynamicView;
-    currentViewId: ViewId | undefined;
-    collapsedFlows: DiagramContext['collapsedSequenceFlows'];
-}): {
-    xynodes: Array<Types.SequenceActorNode | Types.SequenceParallelArea | Types.SequenceSubflowArea | Types.ViewGroupNode>;
-    xyedges: Array<Types.SequenceStepEdge>;
-    layout: LayoutedDynamicView.Sequence.Layout;
-};