@miragon/team-topologies-renderer 0.11.2 → 0.13.0

package/dist/index.js

@@ -7,55 +7,55 @@ import { append as x, attr as S, create as C } from "tiny-svg";
 import ie from "diagram-js/lib/features/selection";
 import ae from "diagram-js/lib/navigation/zoomscroll";
 import oe from "diagram-js/lib/navigation/movecanvas";
-import se from "diagram-js/lib/features/lasso-tool";
-import ce from "diagram-js/lib/features/modeling";
-import le from "diagram-js/lib/features/move";
-import ue from "diagram-js/lib/features/outline";
-import de from "diagram-js/lib/features/resize";
-import fe from "diagram-js/lib/layout/BaseLayouter";
-import pe from "diagram-js/lib/features/rules";
-import me from "diagram-js/lib/features/rules/RuleProvider";
-import he from "diagram-js/lib/command/CommandInterceptor";
-import ge from "diagram-js/lib/features/palette";
-import _e from "diagram-js/lib/features/create";
-import ve from "diagram-js/lib/features/connect";
-import ye from "diagram-js/lib/features/connection-preview";
-import be from "diagram-js/lib/features/context-pad";
-import xe from "diagram-js/lib/features/copy-paste";
-import Se from "diagram-js/lib/features/copy-paste/CopyPaste.js";
-import { MODELER_API_VERSION as Ce } from "@miragon/modeler-api";
+import w from "diagram-js/lib/features/lasso-tool";
+import se from "diagram-js/lib/features/modeling";
+import ce from "diagram-js/lib/features/move";
+import le from "diagram-js/lib/features/outline";
+import ue from "diagram-js/lib/features/resize";
+import de from "diagram-js/lib/layout/BaseLayouter";
+import fe from "diagram-js/lib/features/rules";
+import pe from "diagram-js/lib/features/rules/RuleProvider";
+import me from "diagram-js/lib/command/CommandInterceptor";
+import he from "diagram-js/lib/features/palette";
+import ge from "diagram-js/lib/features/create";
+import _e from "diagram-js/lib/features/connect";
+import ve from "diagram-js/lib/features/connection-preview";
+import ye from "diagram-js/lib/features/context-pad";
+import be from "diagram-js/lib/features/copy-paste";
+import xe from "diagram-js/lib/features/copy-paste/CopyPaste.js";
+import { MODELER_API_VERSION as Se } from "@miragon/modeler-api";
 //#region src/model/di-types.ts
-var we = /* @__PURE__ */ new Set([
+var Ce = /* @__PURE__ */ new Set([
 	"team",
 	"interaction",
 	"flow",
 	"annotation"
 ]);
-function w(e) {
-	return typeof e == "object" && e ? e.ttKind : void 0;
-}
 function T(e) {
-	let t = w(e);
-	return t !== void 0 && we.has(t);
+	return typeof e == "object" && e ? e.ttKind : void 0;
 }
 function E(e) {
-	return w(e) === "team";
+	let t = T(e);
+	return t !== void 0 && Ce.has(t);
 }
 function D(e) {
-	return w(e) === "interaction";
+	return T(e) === "team";
 }
 function O(e) {
-	return w(e) === "flow";
+	return T(e) === "interaction";
 }
 function k(e) {
-	return w(e) === "annotation";
+	return T(e) === "flow";
 }
 function A(e) {
-	return w(e) === "association";
+	return T(e) === "annotation";
+}
+function j(e) {
+	return T(e) === "association";
 }
 //#endregion
 //#region src/theme/palette.ts
-var j = {
+var M = {
 	blau: "#335DE5",
 	blauLink: "#2B50D4",
 	blauHell: "#6B8AFF",
@@ -79,31 +79,31 @@ var j = {
 	dangerHell: "#FB6D73",
 	infoHell: "#6B8AFF",
 	gradientBrand: "linear-gradient(120deg, #335DE5 30%, #00E676)"
-}, Te = {
-	"--cd-blau": j.blau,
-	"--cd-gruen": j.gruen,
-	"--cd-grau": j.grau,
-	"--cd-schwarz": j.schwarz,
-	"--cd-weiss": j.weiss,
-	"--cd-blau-link": j.blauLink,
-	"--cd-blau-hell": j.blauHell,
-	"--cd-linie": j.linie,
-	"--cd-kontur": j.kontur,
-	"--cd-text-leise": j.textLeise,
-	"--cd-success": j.success,
-	"--cd-success-soft": j.successSoft,
-	"--cd-warning": j.warning,
-	"--cd-warning-soft": j.warningSoft,
-	"--cd-danger": j.danger,
-	"--cd-danger-soft": j.dangerSoft,
-	"--cd-info": j.info,
-	"--cd-info-soft": j.infoSoft,
-	"--cd-success-hell": j.successHell,
-	"--cd-warning-hell": j.warningHell,
-	"--cd-danger-hell": j.dangerHell,
-	"--cd-info-hell": j.infoHell,
-	"--cd-gradient-brand": j.gradientBrand
-}, M = 40, Ee = "http://www.w3.org/2000/svg", De = [
+}, we = {
+	"--cd-blau": M.blau,
+	"--cd-gruen": M.gruen,
+	"--cd-grau": M.grau,
+	"--cd-schwarz": M.schwarz,
+	"--cd-weiss": M.weiss,
+	"--cd-blau-link": M.blauLink,
+	"--cd-blau-hell": M.blauHell,
+	"--cd-linie": M.linie,
+	"--cd-kontur": M.kontur,
+	"--cd-text-leise": M.textLeise,
+	"--cd-success": M.success,
+	"--cd-success-soft": M.successSoft,
+	"--cd-warning": M.warning,
+	"--cd-warning-soft": M.warningSoft,
+	"--cd-danger": M.danger,
+	"--cd-danger-soft": M.dangerSoft,
+	"--cd-info": M.info,
+	"--cd-info-soft": M.infoSoft,
+	"--cd-success-hell": M.successHell,
+	"--cd-warning-hell": M.warningHell,
+	"--cd-danger-hell": M.dangerHell,
+	"--cd-info-hell": M.infoHell,
+	"--cd-gradient-brand": M.gradientBrand
+}, N = 40, P = "http://www.w3.org/2000/svg", Te = [
 	".djs-outline",
 	".djs-resizer",
 	".djs-selection-outline",
@@ -111,40 +111,40 @@ var j = {
 	".djs-dragger",
 	".djs-bendpoint",
 	".djs-segment-dragger"
-].join(", "), Oe = ["selected", "hover"], ke = [
+].join(", "), Ee = ["selected", "hover"], De = [
 	"class",
 	"tabindex",
 	"role",
 	"aria-roledescription",
 	"aria-label"
 ];
-function Ae(e, t) {
+function Oe(e, t) {
 	let n = e.getContainer().querySelector(":scope > svg");
 	if (!n) throw Error("No SVG found in the canvas container.");
 	let r = Infinity, i = Infinity, a = -Infinity, o = -Infinity;
 	for (let e of t.getAll()) {
-		if (!T(e)) continue;
+		if (!E(e)) continue;
 		let t = e;
 		r = Math.min(r, t.x), i = Math.min(i, t.y), a = Math.max(a, t.x + t.width), o = Math.max(o, t.y + t.height);
 	}
 	Number.isFinite(r) || (r = 0, i = 0, a = 100, o = 100);
-	let s = r - M, c = i - M, l = a - r + 80, u = o - i + 80, d = n.cloneNode(!0);
-	for (let e of ke) d.removeAttribute(e);
-	for (let e of d.querySelectorAll(De)) e.remove();
-	for (let e of d.querySelectorAll(Oe.map((e) => `.${e}`).join())) e.classList.remove(...Oe);
-	d.setAttribute("xmlns", Ee), d.setAttribute("viewBox", `${s} ${c} ${l} ${u}`), d.setAttribute("width", String(Math.round(l))), d.setAttribute("height", String(Math.round(u)));
+	let s = r - N, c = i - N, l = a - r + 80, u = o - i + 80, d = n.cloneNode(!0);
+	for (let e of De) d.removeAttribute(e);
+	for (let e of d.querySelectorAll(Te)) e.remove();
+	for (let e of d.querySelectorAll(Ee.map((e) => `.${e}`).join())) e.classList.remove(...Ee);
+	d.setAttribute("xmlns", P), d.setAttribute("viewBox", `${s} ${c} ${l} ${u}`), d.setAttribute("width", String(Math.round(l))), d.setAttribute("height", String(Math.round(u)));
 	let f = d.querySelector(".viewport");
 	f && f.removeAttribute("transform");
-	let p = d.ownerDocument.createElementNS(Ee, "rect");
-	return p.setAttribute("class", "tt-export-paper"), p.setAttribute("x", String(s)), p.setAttribute("y", String(c)), p.setAttribute("width", String(l)), p.setAttribute("height", String(u)), p.setAttribute("fill", j.weiss), d.insertBefore(p, d.firstChild), { svg: "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n" + new XMLSerializer().serializeToString(d) };
+	let p = d.ownerDocument.createElementNS(P, "rect");
+	return p.setAttribute("class", "tt-export-paper"), p.setAttribute("x", String(s)), p.setAttribute("y", String(c)), p.setAttribute("width", String(l)), p.setAttribute("height", String(u)), p.setAttribute("fill", M.weiss), d.insertBefore(p, d.firstChild), { svg: "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n" + new XMLSerializer().serializeToString(d) };
 }
 //#endregion
 //#region src/io/types.ts
-var N = a, P = "tt-canvas-keyboard-focus";
-function je(e) {
+var F = a, I = "tt-canvas-keyboard-focus";
+function ke(e) {
 	return typeof e == "number" ? `${e}px` : e;
 }
-var Me = class {
+var Ae = class {
 	_diagram;
 	_container;
 	_options;
@@ -153,7 +153,7 @@ var Me = class {
 	}
 	_createContainer(e) {
 		let t = e.container ?? document.createElement("div");
-		return t.classList.add("tt-djs-container"), t.style.width = je(e.width ?? "100%"), t.style.height = je(e.height ?? (e.container ? "100%" : "600px")), t;
+		return t.classList.add("tt-djs-container"), t.style.width = ke(e.width ?? "100%"), t.style.height = ke(e.height ?? (e.container ? "100%" : "600px")), t;
 	}
 	_ensureDiagram() {
 		if (!this._diagram) {
@@ -162,7 +162,10 @@ var Me = class {
 				canvas: { container: this._container },
 				modules: t,
 				ttKeyboard: { undoRedoKeys: this._options.undoRedoKeys ?? !0 },
-				ttPalette: { freeRectCenter: this._options.freeRectCenter }
+				ttPalette: {
+					freeArea: this._options.freeArea,
+					freeRectCenter: this._options.freeRectCenter
+				}
 			}), this._describeCanvas(this._diagram);
 		}
 		return this._diagram;
@@ -174,9 +177,9 @@ var Me = class {
 		let r = t.ownerDocument, i = !1, a = (e) => {
 			i = e.key === "Tab";
 		}, o = () => {
-			i = !1, n.classList.remove(P);
+			i = !1, n.classList.remove(I);
 		};
-		r.addEventListener("keydown", a, !0), r.addEventListener("pointerdown", o, !0), n.addEventListener("focusin", () => n.classList.toggle(P, i)), n.addEventListener("focusout", () => n.classList.remove(P)), e.get("eventBus").on("diagram.destroy", () => {
+		r.addEventListener("keydown", a, !0), r.addEventListener("pointerdown", o, !0), n.addEventListener("focusin", () => n.classList.toggle(I, i)), n.addEventListener("focusout", () => n.classList.remove(I)), e.get("eventBus").on("diagram.destroy", () => {
 			r.removeEventListener("keydown", a, !0), r.removeEventListener("pointerdown", o, !0);
 		});
 	}
@@ -204,6 +207,15 @@ var Me = class {
 		let e = this._ensureDiagram().get("ttViewport", !1);
 		e ? e.fit() : this.get("canvas").zoom("fit-viewport");
 	}
+	contentBounds() {
+		let e = this._diagram?.get("ttViewport", !1)?.contentBounds();
+		return e && {
+			x: e.minX,
+			y: e.minY,
+			width: e.maxX - e.minX,
+			height: e.maxY - e.minY
+		};
+	}
 	exportDocument() {
 		return this.get("ttExporter").export();
 	}
@@ -214,7 +226,7 @@ var Me = class {
 		} catch {
 			return;
 		}
-		if (!n || n.id !== N) return;
+		if (!n || n.id !== F) return;
 		let r = n.businessObject ?? { title: "Untitled team topology" };
 		n.businessObject = {
 			...r,
@@ -229,7 +241,7 @@ var Me = class {
 		}
 	}
 	saveSVG() {
-		return Ae(this.get("canvas"), this.get("elementRegistry"));
+		return Oe(this.get("canvas"), this.get("elementRegistry"));
 	}
 	attachTo(e) {
 		e.appendChild(this._container), this.get("canvas").resized();
@@ -246,7 +258,7 @@ var Me = class {
 	get container() {
 		return this._container;
 	}
-}, Ne = class {
+}, je = class {
 	elementFactory;
 	static $inject = ["elementFactory"];
 	constructor(e) {
@@ -365,18 +377,18 @@ var Me = class {
 			ttKind: "association"
 		});
 	}
-}, Pe = { ttElementFactory: ["type", Ne] }, Fe = 1500, F = j.schwarz, Ie = j.textLeise, Le = j.kontur, I = {
+}, Me = { ttElementFactory: ["type", je] }, Ne = 1500, L = M.schwarz, Pe = M.textLeise, Fe = M.kontur, R = {
 	family: "'Geist Variable', 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif",
 	label: 13.5,
 	small: 11,
 	annotation: 12
-}, Re = 10, L = {
+}, Ie = 10, z = {
 	left: 10,
 	right: 6,
 	top: 6,
 	bottom: 6
-}, R = 1.2, ze = 4.5;
-function z(e) {
+}, B = 1.2, Le = .58, Re = 4.5;
+function V(e) {
 	if (typeof e != "string") return;
 	let t = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(e.trim());
 	if (!t) return;
@@ -387,7 +399,7 @@ function z(e) {
 		r(4)
 	];
 }
-function Be(e, t, n) {
+function ze(e, t, n) {
 	let r = (r) => Math.round(e[r] * n + t[r] * (1 - n));
 	return [
 		r(0),
@@ -395,74 +407,74 @@ function Be(e, t, n) {
 		r(2)
 	];
 }
-function B([e, t, n]) {
+function Be([e, t, n]) {
 	let r = (e) => {
 		let t = e / 255;
 		return t <= .04045 ? t / 12.92 : ((t + .055) / 1.055) ** 2.4;
 	};
 	return .2126 * r(e) + .7152 * r(t) + .0722 * r(n);
 }
-function V(e, t) {
-	let [n, r] = [B(e), B(t)].sort((e, t) => t - e);
+function Ve(e, t) {
+	let [n, r] = [Be(e), Be(t)].sort((e, t) => t - e);
 	return (n + .05) / (r + .05);
 }
-function Ve(e, t = 1) {
-	let n = z(e), r = z(F), i = z(j.weiss);
-	if (!n || !r || !i) return F;
-	let a = Be(n, i, t), o = V(r, a);
-	return o >= ze ? F : V(i, a) > o ? j.weiss : F;
+function He(e, t = 1) {
+	let n = V(e), r = V(L), i = V(M.weiss);
+	if (!n || !r || !i) return L;
+	let a = ze(n, i, t), o = Ve(r, a);
+	return o >= Re ? L : Ve(i, a) > o ? M.weiss : L;
 }
-function He(e) {
-	if (D(e)) {
+function Ue(e) {
+	if (O(e)) {
 		let t = d[e.mode] ?? d.collaboration;
-		return Ve(e.fill ?? t.fill, t.opacity);
+		return He(e.fill ?? t.fill, t.opacity);
 	}
 	let t = p[e.teamType] ?? p["stream-aligned"];
-	return Ve(e.fill ?? t.fill);
+	return He(e.fill ?? t.fill);
 }
-function Ue(e, t) {
+function We(e, t) {
 	return Math.min(e * .16, t * 1.1);
 }
 function H(e) {
 	let t = Math.max(e.width, 1), n = Math.max(e.height, 1);
-	return k(e) ? {
+	return A(e) ? {
 		box: {
-			x: L.left,
-			y: L.top,
-			width: Math.max(t - L.left - L.right, 1),
-			height: Math.max(n - L.top - L.bottom, 1)
+			x: z.left,
+			y: z.top,
+			width: Math.max(t - z.left - z.right, 1),
+			height: Math.max(n - z.top - z.bottom, 1)
 		},
 		align: "left-top",
-		fontSize: I.annotation,
+		fontSize: R.annotation,
 		fontWeight: "400",
-		fill: F
-	} : O(e) ? {
+		fill: L
+	} : k(e) ? {
 		box: {
-			x: Re,
+			x: Ie,
 			y: 0,
-			width: t - Ue(t, n) - 20,
+			width: t - We(t, n) - 20,
 			height: n
 		},
 		align: "center",
-		fontSize: I.small,
+		fontSize: R.small,
 		fontWeight: "600",
 		letterSpacing: "0.06em",
-		fill: Ie
+		fill: Pe
 	} : {
 		box: {
-			x: Re,
+			x: Ie,
 			y: 0,
 			width: t - 20,
 			height: n
 		},
 		align: "center",
-		fontSize: D(e) ? I.small : I.label,
+		fontSize: O(e) ? R.small : R.label,
 		fontWeight: "600",
-		fill: He(e)
+		fill: Ue(e)
 	};
 }
-function We(e, t, n) {
-	let r = Math.max(4, Math.floor(t / (n * .58))), i = e.split(/\r?\n/), a = [];
+function Ge(e, t, n) {
+	let r = Math.max(4, Math.floor(t / (n * Le))), i = e.split(/\r?\n/), a = [];
 	for (let e of i) {
 		let t = e.split(/\s+/).filter(Boolean), n = "";
 		for (let e of t) {
@@ -475,33 +487,49 @@ function We(e, t, n) {
 	for (; a.length > 0 && a[0] === "";) a.shift();
 	return a;
 }
+function Ke(e) {
+	let t = H(e), { box: n, fontSize: r } = t, i = Ge(e.ttLabel ?? "", n.width, r);
+	if (i.length === 0) return;
+	let a = Math.max(...i.map((e) => e.length)) * r * Le, o = i.length * r * B;
+	return t.align === "left-top" ? {
+		x: n.x,
+		y: n.y,
+		width: a,
+		height: o
+	} : {
+		x: n.x + (n.width - a) / 2,
+		y: n.y + (n.height - o) / 2,
+		width: a,
+		height: o
+	};
+}
 //#endregion
 //#region src/draw/TeamTopologiesRenderer.ts
-var Ge = class extends re {
+var qe = class extends re {
 	static $inject = ["eventBus"];
 	constructor(e) {
-		super(e, Fe);
+		super(e, Ne);
 	}
 	canRender(e) {
-		return T(e) || A(e);
+		return E(e) || j(e);
 	}
 	drawShape(e, t) {
-		if (E(t)) return this.drawTeam(e, t);
-		if (D(t)) return this.drawInteraction(e, t);
-		if (O(t)) return this.drawFlow(e, t);
-		if (k(t)) return this.drawAnnotation(e, t);
+		if (D(t)) return this.drawTeam(e, t);
+		if (O(t)) return this.drawInteraction(e, t);
+		if (k(t)) return this.drawFlow(e, t);
+		if (A(t)) return this.drawAnnotation(e, t);
 		let n = S(C("rect"), {
 			width: t.width,
 			height: t.height,
-			fill: j.linie
+			fill: M.linie
 		});
 		return x(e, n), n;
 	}
 	drawConnection(e, t) {
 		let n = S(C("path"), {
-			d: qe(t.waypoints),
+			d: Ye(t.waypoints),
 			fill: "none",
-			stroke: Le,
+			stroke: Fe,
 			"stroke-width": 1.5,
 			"stroke-dasharray": "4 4",
 			"stroke-linecap": "round"
@@ -513,7 +541,7 @@ var Ge = class extends re {
 		return `M${t},${n}l${r},0l0,${i}l${-r},0z`;
 	}
 	getConnectionPath(e) {
-		return qe(e.waypoints);
+		return Ye(e.waypoints);
 	}
 	drawTeam(e, t) {
 		let n = p[t.teamType] ?? p["stream-aligned"], r = Math.max(t.width, 1), i = Math.max(t.height, 1), a = n.strokeWidth, o = h(n.strokeStyle, a), s = this.teamOutline(n.shape, r, i, a, {
@@ -530,7 +558,7 @@ var Ge = class extends re {
 		if (e === "octagon") {
 			let e = Math.min(o, s) * .29;
 			return S(C("polygon"), {
-				points: Ke(a, o, s, e),
+				points: Je(a, o, s, e),
 				...i
 			});
 		}
@@ -577,7 +605,7 @@ var Ge = class extends re {
 		return x(e, o), this.appendLabel(e, t.ttLabel ?? "", H(t)), o;
 	}
 	drawFlow(e, t) {
-		let n = Math.max(t.width, 1), r = Math.max(t.height, 1), i = l.strokeWidth, a = i / 2, o = Ue(n, r), s = r * .5, c = (r - s) / 2, u = c + s, d = [
+		let n = Math.max(t.width, 1), r = Math.max(t.height, 1), i = l.strokeWidth, a = i / 2, o = We(n, r), s = r * .5, c = (r - s) / 2, u = c + s, d = [
 			[a, c],
 			[n - o, c],
 			[n - o, a],
@@ -599,20 +627,20 @@ var Ge = class extends re {
 		let n = Math.max(t.width, 1), r = Math.max(t.height, 1), i = 1.5, a = i / 2, o = Math.min(14, n / 2), s = S(C("path"), {
 			d: `M${o},${a} L${a},${a} L${a},${r - a} L${o},${r - a}`,
 			fill: "none",
-			stroke: Le,
+			stroke: Fe,
 			"stroke-width": i,
 			"stroke-linejoin": "round"
 		});
 		return x(e, s), this.appendLabel(e, t.ttLabel ?? "", H(t)), s;
 	}
 	appendLabel(e, t, n) {
-		let { box: r, fontSize: i } = n, a = We(t, r.width, i), o = i * R, s = n.align === "center", c = s ? r.x + r.width / 2 : r.x, l = s ? r.y + r.height / 2 - (a.length - 1) * o / 2 : r.y + o / 2;
+		let { box: r, fontSize: i } = n, a = Ge(t, r.width, i), o = i * B, s = n.align === "center", c = s ? r.x + r.width / 2 : r.x, l = s ? r.y + r.height / 2 - (a.length - 1) * o / 2 : r.y + o / 2;
 		a.forEach((t, r) => {
 			if (!t) return;
 			let a = S(C("text"), {
 				x: c,
 				y: l + r * o,
-				"font-family": I.family,
+				"font-family": R.family,
 				"font-size": i,
 				fill: n.fill,
 				"text-anchor": s ? "middle" : "start",
@@ -624,7 +652,7 @@ var Ge = class extends re {
 		});
 	}
 };
-function Ke(e, t, n, r) {
+function Je(e, t, n, r) {
 	return [
 		[e + r, e],
 		[e + t - r, e],
@@ -636,16 +664,16 @@ function Ke(e, t, n, r) {
 		[e, e + r]
 	].map((e) => e.join(",")).join(" ");
 }
-function qe(e) {
+function Ye(e) {
 	return e.map((e, t) => `${t === 0 ? "M" : "L"}${e.x},${e.y}`).join(" ");
 }
 //#endregion
 //#region src/draw/index.ts
-var Je = {
+var Xe = {
 	__init__: ["ttRenderer"],
-	ttRenderer: ["type", Ge],
+	ttRenderer: ["type", qe],
 	connectionDocking: ["type", ne]
-}, Ye = class {
+}, Ze = class {
 	canvas;
 	elementFactory;
 	factory;
@@ -673,7 +701,7 @@ var Je = {
 			n = void 0;
 		}
 		let r;
-		n && n.id === N ? r = n : (r = this.elementFactory.createRoot({ id: N }), this.canvas.setRootElement(r));
+		n && n.id === F ? r = n : (r = this.elementFactory.createRoot({ id: F }), this.canvas.setRootElement(r));
 		let i = _(e, o);
 		r.businessObject = {
 			title: e.title,
@@ -686,7 +714,7 @@ var Je = {
 		for (let n of e.annotations) {
 			if (!n.attachedTo) continue;
 			let e = this.elementRegistry.get(n.id), i = this.elementRegistry.get(n.attachedTo);
-			if (!T(i) || k(i)) {
+			if (!E(i) || A(i)) {
 				t.push({
 					message: `Annotation "${n.id}" is attached to unknown element "${n.attachedTo}"; its connector was dropped.`,
 					elementId: n.id
@@ -705,7 +733,7 @@ var Je = {
 			this.canvas.removeShape(e.id);
 		} catch {}
 	}
-}, Xe = class {
+}, Qe = class {
 	elementRegistry;
 	canvas;
 	static $inject = ["elementRegistry", "canvas"];
@@ -721,7 +749,7 @@ var Je = {
 		}
 		let t = [], n = [], i = [], a = [];
 		for (let e of this.elementRegistry.getAll()) {
-			if (e.id === N) continue;
+			if (e.id === F) continue;
 			let o = e, s = {
 				x: o.x,
 				y: o.y
@@ -729,7 +757,7 @@ var Je = {
 				width: o.width,
 				height: o.height
 			};
-			if (E(e)) t.push(y({
+			if (D(e)) t.push(y({
 				id: e.id,
 				type: e.teamType,
 				label: e.ttLabel ?? "",
@@ -739,7 +767,7 @@ var Je = {
 				...e.fill ? { fill: e.fill } : {},
 				...e.stroke ? { stroke: e.stroke } : {}
 			}, e.ttForeign, f));
-			else if (D(e)) n.push(y({
+			else if (O(e)) n.push(y({
 				id: e.id,
 				mode: e.mode,
 				position: s,
@@ -748,14 +776,14 @@ var Je = {
 				...e.fill ? { fill: e.fill } : {},
 				...e.stroke ? { stroke: e.stroke } : {}
 			}, e.ttForeign, u));
-			else if (O(e)) i.push(y({
+			else if (k(e)) i.push(y({
 				id: e.id,
 				position: s,
 				size: l,
 				...e.ttLabel ? { label: e.ttLabel } : {}
 			}, e.ttForeign, c));
-			else if (k(e)) {
-				let t = Ze(e);
+			else if (A(e)) {
+				let t = $e(e);
 				a.push(y({
 					id: e.id,
 					text: e.ttLabel ?? "",
@@ -775,13 +803,13 @@ var Je = {
 		}, e?.foreign, o);
 	}
 };
-function Ze(e) {
-	let t = [...e.outgoing, ...e.incoming].find(A);
+function $e(e) {
+	let t = [...e.outgoing, ...e.incoming].find(j);
 	if (t) return (t.source === e ? t.target : t.source)?.id;
 }
 //#endregion
 //#region src/io/TtViewport.ts
-var Qe = 760, $e = 88, et = 120, U = 56, tt = 24, nt = 1, rt = class {
+var et = 760, tt = 88, nt = 120, U = 56, rt = 24, it = 1, at = class {
 	canvas;
 	elementRegistry;
 	static $inject = ["canvas", "elementRegistry"];
@@ -796,7 +824,7 @@ var Qe = 760, $e = 88, et = 120, U = 56, tt = 24, nt = 1, rt = class {
 			this.canvas.zoom("fit-viewport");
 			return;
 		}
-		let i = n <= Qe, a = i ? et : $e, o = i ? tt : U, s = Math.max(e.maxX - e.minX, 1), c = Math.max(e.maxY - e.minY, 1), l = Math.min((n - 2 * o) / s, (r - a - U) / c, nt);
+		let i = n <= et, a = i ? nt : tt, o = i ? rt : U, s = Math.max(e.maxX - e.minX, 1), c = Math.max(e.maxY - e.minY, 1), l = Math.min((n - 2 * o) / s, (r - a - U) / c, it);
 		l > 0 ? this.canvas.viewbox({
 			x: e.minX + s / 2 - n / 2 / l,
 			y: this.viewboxTop(e, c, l, r, a, i),
@@ -810,10 +838,15 @@ var Qe = 760, $e = 88, et = 120, U = 56, tt = 24, nt = 1, rt = class {
 		return e.minY - (i + s / 2) / n;
 	}
 	contentBounds() {
-		let e = Infinity, t = Infinity, n = -Infinity, r = -Infinity;
-		for (let i of this.elementRegistry.getAll()) {
-			let a = i;
-			typeof a.x == "number" && typeof a.y == "number" && typeof a.width == "number" && typeof a.height == "number" && (e = Math.min(e, a.x), t = Math.min(t, a.y), n = Math.max(n, a.x + a.width), r = Math.max(r, a.y + a.height));
+		let e = Infinity, t = Infinity, n = -Infinity, r = -Infinity, i = (i, a, o, s) => {
+			e = Math.min(e, i), t = Math.min(t, a), n = Math.max(n, i + o), r = Math.max(r, a + s);
+		};
+		for (let e of this.elementRegistry.getAll()) {
+			let t = e;
+			if (typeof t.x != "number" || typeof t.y != "number" || typeof t.width != "number" || typeof t.height != "number") continue;
+			i(t.x, t.y, t.width, t.height);
+			let n = E(e) ? Ke(e) : void 0;
+			n && i(t.x + n.x, t.y + n.y, n.width, n.height);
 		}
 		return Number.isFinite(e) ? {
 			minX: e,
@@ -826,10 +859,10 @@ var Qe = 760, $e = 88, et = 120, U = 56, tt = 24, nt = 1, rt = class {
 	latin: "U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD",
 	latinExt: "U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF"
 };
-function it(e) {
+function ot(e) {
 	return Object.keys(G).map((t) => `@font-face{font-family:'Geist Variable';font-style:normal;font-weight:100 900;font-display:block;src:url(${e[t].replace(/^data:[^;,]*/, "data:font/woff2")}) format('woff2');unicode-range:${G[t]};}`).join("");
 }
-function at(e, t) {
+function st(e, t) {
 	let n = new DOMParser().parseFromString(e, "image/svg+xml"), r = n.documentElement;
 	if (r.namespaceURI !== W || n.querySelector("parsererror")) return e;
 	let i = n.createElementNS(W, "defs"), a = n.createElementNS(W, "style");
@@ -837,19 +870,19 @@ function at(e, t) {
 }
 //#endregion
 //#region src/io/index.ts
-var ot = {
-	ttImporter: ["type", Ye],
-	ttExporter: ["type", Xe],
-	ttViewport: ["type", rt]
-}, st = class extends Me {
+var ct = {
+	ttImporter: ["type", Ze],
+	ttExporter: ["type", Qe],
+	ttViewport: ["type", at]
+}, lt = class extends Ae {
 	_getModules() {
 		return [
-			Pe,
-			Je,
-			ot
+			Me,
+			Xe,
+			ct
 		];
 	}
-}, K = class extends st {
+}, K = class extends lt {
 	_getModules() {
 		return [
 			...super._getModules(),
@@ -861,21 +894,21 @@ var ot = {
 };
 //#endregion
 //#region src/modeling/cmd/UpdatePropertiesHandler.ts
-function ct(e, t, n) {
+function ut(e, t, n) {
 	n === void 0 ? delete e[t] : e[t] = n;
 }
-var lt = class {
+var dt = class {
 	execute(e) {
 		let { element: t, properties: n } = e, r = t, i = {};
-		for (let e of Object.keys(n)) i[e] = r[e], ct(r, e, n[e]);
+		for (let e of Object.keys(n)) i[e] = r[e], ut(r, e, n[e]);
 		return e.oldProperties = i, [t];
 	}
 	revert(e) {
 		let { element: t, oldProperties: n } = e, r = t;
-		if (n) for (let e of Object.keys(n)) ct(r, e, n[e]);
+		if (n) for (let e of Object.keys(n)) ut(r, e, n[e]);
 		return [t];
 	}
-}, q = "Untitled team topology", ut = class {
+}, q = "Untitled team topology", ft = class {
 	canvas;
 	static $inject = ["canvas"];
 	constructor(e) {
@@ -895,7 +928,7 @@ var lt = class {
 			title: e.oldTitle ?? q
 		}, [t];
 	}
-}, dt = "element.updateProperties", ft = "tt.title.update", pt = 40, mt = class {
+}, pt = "element.updateProperties", mt = "tt.title.update", ht = 40, gt = class {
 	commandStack;
 	modeling;
 	factory;
@@ -907,13 +940,13 @@ var lt = class {
 		"canvas"
 	];
 	constructor(e, t, n, r) {
-		this.commandStack = e, this.modeling = t, this.factory = n, this.canvas = r, e.registerHandler(dt, lt), e.registerHandler(ft, ut);
+		this.commandStack = e, this.modeling = t, this.factory = n, this.canvas = r, e.registerHandler(pt, dt), e.registerHandler(mt, ft);
 	}
 	setTitle(e) {
-		this.commandStack.execute(ft, { title: e });
+		this.commandStack.execute(mt, { title: e });
 	}
 	updateProperties(e, t) {
-		this.commandStack.execute(dt, {
+		this.commandStack.execute(pt, {
 			element: e,
 			properties: t
 		});
@@ -938,8 +971,8 @@ var lt = class {
 	}
 	appendAnnotation(e) {
 		let t = this.factory.createNewAnnotation(), n = {
-			x: e.x + e.width + pt + t.width / 2,
-			y: e.y - pt / 4
+			x: e.x + e.width + ht + t.width / 2,
+			y: e.y - ht / 4
 		};
 		return this.modeling.appendShape(e, t, n, this.canvas.getRootElement(), {
 			connection: this.factory.createNewAssociation(),
@@ -947,45 +980,45 @@ var lt = class {
 		});
 	}
 	detachAnnotation(e) {
-		let t = [...e.incoming, ...e.outgoing].filter(A);
+		let t = [...e.incoming, ...e.outgoing].filter(j);
 		t.length > 0 && this.modeling.removeElements(t);
 	}
-}, ht = class extends fe {
+}, _t = class extends de {
 	layoutConnection(e, t = {}) {
 		let n = t.source ?? e.source, r = t.target ?? e.target;
 		return !n || !r ? super.layoutConnection(e, t) : [b(n), b(r)];
 	}
-}, gt = {
-	__depends__: [ce],
+}, vt = {
+	__depends__: [se],
 	__init__: ["ttModeling"],
-	ttModeling: ["type", mt],
-	layouter: ["type", ht]
+	ttModeling: ["type", gt],
+	layouter: ["type", _t]
 };
 //#endregion
 //#region src/rules/TtRules.ts
-function _t(e) {
-	return T(e) && !k(e);
+function yt(e) {
+	return E(e) && !A(e);
 }
-var vt = class extends me {
+var bt = class extends pe {
 	static $inject = ["eventBus"];
 	constructor(e) {
 		super(e);
 	}
 	init() {
-		this.addRule(["shape.move", "elements.move"], (e) => e.target && e.target.parent ? null : !0), this.addRule("shape.create", () => !0), this.addRule("shape.resize", () => !0), this.addRule("element.copy", () => !0), this.addRule("connection.create", ({ source: e, target: t }) => k(e) && _t(t) || k(t) && _t(e) ? { ttKind: "association" } : !1);
+		this.addRule(["shape.move", "elements.move"], (e) => e.target && e.target.parent ? null : !0), this.addRule("shape.create", () => !0), this.addRule("shape.resize", () => !0), this.addRule("element.copy", () => !0), this.addRule("connection.create", ({ source: e, target: t }) => A(e) && yt(t) || A(t) && yt(e) ? { ttKind: "association" } : !1);
 	}
-}, yt = {
-	__depends__: [pe],
+}, xt = {
+	__depends__: [fe],
 	__init__: ["ttRules"],
-	ttRules: ["type", vt]
-}, bt = class extends he {
+	ttRules: ["type", bt]
+}, St = class extends me {
 	static $inject = ["eventBus", "canvas"];
 	constructor(e, t) {
 		super(e), this.preExecute(["shape.create", "elements.create"], (e) => {
 			e.parent = t.getRootElement();
 		}, !0);
 	}
-}, xt = class extends he {
+}, Ct = class extends me {
 	static $inject = [
 		"eventBus",
 		"connectionDocking",
@@ -993,33 +1026,33 @@ var vt = class extends me {
 	];
 	constructor(e, t, n) {
 		super(e), this.executed(["connection.layout", "connection.create"], (e) => {
-			!e.cropped && A(e.connection) && (e.connection.waypoints = t.getCroppedWaypoints(e.connection), e.cropped = !0);
+			!e.cropped && j(e.connection) && (e.connection.waypoints = t.getCroppedWaypoints(e.connection), e.cropped = !0);
 		}, !0), this.reverted("connection.layout", (e) => {
 			delete e.cropped;
 		}, !0), this.postExecuted("connection.create", (e) => {
 			let t = e.connection;
-			if (!A(t)) return;
-			let r = k(t.source) ? t.source : t.target;
-			if (!k(r)) return;
-			let i = [...r.incoming, ...r.outgoing].filter((e) => e !== t && A(e));
+			if (!j(t)) return;
+			let r = A(t.source) ? t.source : t.target;
+			if (!A(r)) return;
+			let i = [...r.incoming, ...r.outgoing].filter((e) => e !== t && j(e));
 			i.length > 0 && n.removeElements(i);
 		}, !0);
 	}
-}, St = {
+}, wt = {
 	__init__: ["ttFlatModelBehavior", "ttAssociationBehavior"],
-	ttFlatModelBehavior: ["type", bt],
-	ttAssociationBehavior: ["type", xt]
-}, Ct = [["path", { d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }], ["path", { d: "m15 5 4 4" }]], wt = [
+	ttFlatModelBehavior: ["type", St],
+	ttAssociationBehavior: ["type", Ct]
+}, Tt = [["path", { d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }], ["path", { d: "m15 5 4 4" }]], Et = [
 	["path", { d: "M10 11v6" }],
 	["path", { d: "M14 11v6" }],
 	["path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }],
 	["path", { d: "M3 6h18" }],
 	["path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }]
-], Tt = [["path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }], ["path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" }]], Et = [
+], Dt = [["path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }], ["path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" }]], Ot = [
 	["path", { d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z" }],
 	["path", { d: "M12 8v6" }],
 	["path", { d: "M9 11h6" }]
-], Dt = [
+], kt = [
 	["path", { d: "M12.034 12.681a.498.498 0 0 1 .647-.647l9 3.5a.5.5 0 0 1-.033.943l-3.444 1.068a1 1 0 0 0-.66.66l-1.067 3.443a.5.5 0 0 1-.943.033z" }],
 	["path", { d: "M5 3a2 2 0 0 0-2 2" }],
 	["path", { d: "M19 3a2 2 0 0 1 2 2" }],
@@ -1030,20 +1063,20 @@ var vt = class extends me {
 	["path", { d: "M3 9v1" }],
 	["path", { d: "M21 9v2" }],
 	["path", { d: "M3 14v1" }]
-], Ot = [
+], At = [
 	["path", { d: "M4 5h16" }],
 	["path", { d: "M4 12h16" }],
 	["path", { d: "M4 19h16" }]
-], kt = [["path", { d: "M5 12h14" }]], At = [["path", { d: "M5 12h14" }], ["path", { d: "M12 5v14" }]], jt = [
+], jt = [["path", { d: "M5 12h14" }]], Mt = [["path", { d: "M5 12h14" }], ["path", { d: "M12 5v14" }]], Nt = [
 	["path", { d: "M8 3H5a2 2 0 0 0-2 2v3" }],
 	["path", { d: "M21 8V5a2 2 0 0 0-2-2h-3" }],
 	["path", { d: "M3 16v3a2 2 0 0 0 2 2h3" }],
 	["path", { d: "M16 21h3a2 2 0 0 0 2-2v-3" }]
-], Mt = [
+], Pt = [
 	["path", { d: "M12 15V3" }],
 	["path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }],
 	["path", { d: "m7 10 5 5 5-5" }]
-], Nt = [["path", { d: "M18 6 6 18" }], ["path", { d: "m6 6 12 12" }]], Pt = 2.5, Ft = 16, It = [
+], Ft = [["path", { d: "M18 6 6 18" }], ["path", { d: "m6 6 12 12" }]], It = 2.5, Lt = 16, Rt = [
 	"path",
 	"circle",
 	"ellipse",
@@ -1051,7 +1084,7 @@ var vt = class extends me {
 	"polyline",
 	"polygon",
 	"rect"
-], Lt = [
+], zt = [
 	"d",
 	"cx",
 	"cy",
@@ -1068,33 +1101,33 @@ var vt = class extends me {
 	"height",
 	"points"
 ];
-function Rt(e) {
+function Bt(e) {
 	return e.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/'/g, "&#39;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
-function zt(e, t) {
+function Vt(e, t) {
 	let n = Number(e);
 	return Number.isFinite(n) && n > 0 ? n : t;
 }
 function J(e, t = {}) {
-	let n = zt(t.size, Ft), r = zt(t.strokeWidth, Pt);
-	return `<svg${t.className ? ` class="${Rt(t.className)}"` : ""} xmlns="http://www.w3.org/2000/svg" width="${n}" height="${n}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="${r}" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">${e.map(([e, t]) => {
-		let n = It.find((t) => t === e);
+	let n = Vt(t.size, Lt), r = Vt(t.strokeWidth, It);
+	return `<svg${t.className ? ` class="${Bt(t.className)}"` : ""} xmlns="http://www.w3.org/2000/svg" width="${n}" height="${n}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="${r}" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">${e.map(([e, t]) => {
+		let n = Rt.find((t) => t === e);
 		return n ? `<${n} ${Object.entries(t).flatMap(([e, t]) => {
-			let n = Lt.find((t) => t === e);
-			return n ? [`${n}="${Rt(String(t))}"`] : [];
+			let n = zt.find((t) => t === e);
+			return n ? [`${n}="${Bt(String(t))}"`] : [];
 		}).join(" ")}/>` : "";
 	}).join("")}</svg>`;
 }
 //#endregion
 //#region src/draw/palette-icons.ts
-var Bt = {
+var Ht = {
 	size: 20,
 	strokeWidth: 2
 };
 function Y(e) {
 	return `<svg class="tt-palette-svg" width="24" height="24" viewBox="0 0 26 26" aria-hidden="true">${e}</svg>`;
 }
-function Vt(e) {
+function Ut(e) {
 	let t = p[e], n = h(t.strokeStyle, 1.5), r = `fill="${t.fill}" stroke="${t.stroke}" stroke-width="1.5"` + (n ? ` stroke-dasharray="${n}"` : "");
 	switch (t.shape) {
 		case "octagon": return Y(`<polygon points="8,3 18,3 23,8 23,18 18,23 8,23 3,18 3,8" ${r}/>`);
@@ -1103,20 +1136,20 @@ function Vt(e) {
 		default: return Y(`<rect x="3" y="8" width="20" height="10" rx="5" ${r}/>`);
 	}
 }
-function Ht() {
+function Wt() {
 	let e = h(l.strokeStyle, 1.5);
 	return Y(`<g fill="none" stroke="${l.stroke}" stroke-width="1.5" stroke-linejoin="round"` + (e ? ` stroke-dasharray="${e}"` : "") + "><polygon points=\"3,9 16,9 16,5 23,13 16,21 16,17 3,17\"/></g>");
 }
-function Ut() {
+function Gt() {
 	return Y("<g fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"><path d=\"M10 4H5v18h5\"/><path d=\"M13 9h9M13 13h9M13 17h6\"/></g>");
 }
-function Wt() {
-	return J(Dt, {
-		...Bt,
+function Kt() {
+	return J(kt, {
+		...Ht,
 		className: "tt-palette-svg"
 	});
 }
-function Gt(e) {
+function qt(e) {
 	let t = d[e], n = h(t.strokeStyle, 1.5), r = `fill="${t.fill}" fill-opacity="${t.opacity}" stroke="${t.stroke}" stroke-width="1.5"` + (n ? ` stroke-dasharray="${n}"` : "");
 	switch (t.shape) {
 		case "circle": return Y(`<circle cx="13" cy="13" r="9" ${r}/>`);
@@ -1126,20 +1159,27 @@ function Gt(e) {
 }
 //#endregion
 //#region src/palette/TtPaletteProvider.ts
-var Kt = "tools", qt = "tt-1-teams", Jt = "tt-2-modes", Yt = "tt-3-guides", Xt = 24;
-function Zt(e, t = !0) {
+var Jt = "tools", Yt = "tt-1-teams", Xt = "tt-2-modes", Zt = "tt-3-guides", Qt = 24;
+function $t(e, t = !0) {
 	return `<div class="entry tt-palette-entry" draggable="${t}">${e}</div>`;
 }
-function Qt(e) {
+function en(e) {
 	return e.type === "click" && e.detail === 0;
 }
-function $t(e) {
+function tn(e) {
 	return {
 		x: e.x + e.width / 2,
 		y: e.y + e.height / 2
 	};
 }
-var en = class {
+function nn(e, t) {
+	let { x: n, y: r, scale: i, outer: a } = e.viewbox(), o = a.width - t.left - t.right, s = a.height - t.top - t.bottom;
+	if (i > 0 && o > 0 && s > 0) return {
+		x: n + (t.left + o / 2) / i,
+		y: r + (t.top + s / 2) / i
+	};
+}
+var rn = class {
 	config;
 	create;
 	factory;
@@ -1168,23 +1208,23 @@ var en = class {
 	getPaletteEntries() {
 		let e = {};
 		e["lasso-tool"] = {
-			group: Kt,
+			group: Jt,
 			title: "Select several elements",
-			html: Zt(Wt(), !1),
+			html: $t(Kt(), !1),
 			action: { click: (e) => this.lassoTool.activateSelection(e) }
 		};
-		for (let t of n) e[`team.${t.type}`] = this.createEntry(qt, `${t.label} team`, Vt(t.type), () => this.factory.createNewTeam(t.type, t.label));
-		for (let n of t) e[`mode.${n.mode}`] = this.createEntry(Jt, `${n.label} interaction`, Gt(n.mode), () => this.factory.createNewInteraction(n.mode));
-		return e.flow = this.createEntry(Yt, l.label, Ht(), () => this.factory.createNewFlow()), e.annotation = this.createEntry(Yt, i.label, Ut(), () => this.factory.createNewAnnotation()), e;
+		for (let t of n) e[`team.${t.type}`] = this.createEntry(Yt, `${t.label} team`, Ut(t.type), () => this.factory.createNewTeam(t.type, t.label));
+		for (let n of t) e[`mode.${n.mode}`] = this.createEntry(Xt, `${n.label} interaction`, qt(n.mode), () => this.factory.createNewInteraction(n.mode));
+		return e.flow = this.createEntry(Zt, l.label, Wt(), () => this.factory.createNewFlow()), e.annotation = this.createEntry(Zt, i.label, Gt(), () => this.factory.createNewAnnotation()), e;
 	}
 	createEntry(e, t, n, r) {
 		let i = (e) => {
-			Qt(e) ? this.placeInFreeRect(r()) : this.create.start(e, r());
+			en(e) ? this.placeInFreeRect(r()) : this.create.start(e, r());
 		};
 		return {
 			group: e,
 			title: t,
-			html: Zt(n),
+			html: $t(n),
 			action: {
 				dragstart: i,
 				click: i
@@ -1192,33 +1232,37 @@ var en = class {
 		};
 	}
 	freePlace() {
-		let e = this.canvas.viewbox(), t = this.config?.freeRectCenter?.() ?? {
+		let e = this.canvas.viewbox(), t = this.freeAreaCentre() ?? {
 			x: e.x + e.width / 2,
 			y: e.y + e.height / 2
 		}, n = {
 			x: Math.round(t.x),
 			y: Math.round(t.y)
-		}, r = () => this.elementRegistry.filter(T).some((e) => {
-			let t = $t(e);
+		}, r = () => this.elementRegistry.filter(E).some((e) => {
+			let t = tn(e);
 			return Math.abs(t.x - n.x) < 1 && Math.abs(t.y - n.y) < 1;
 		});
-		for (; r();) n.x += Xt, n.y += Xt;
+		for (; r();) n.x += Qt, n.y += Qt;
 		return n;
 	}
+	freeAreaCentre() {
+		let e = this.config?.freeArea;
+		return e?.center ? e.center() : e?.insets ? nn(this.canvas, e.insets()) : this.config?.freeRectCenter?.();
+	}
 	placeInFreeRect(e) {
 		if (this.readOnly?.isReadOnly()) return;
 		let t = this.modeling.createShape(e, this.freePlace(), this.canvas.getRootElement());
-		this.selection.select(t), this.canvas.focus(), T(t) && this.labelEditing?.activate(t);
+		this.selection.select(t), this.canvas.focus(), E(t) && this.labelEditing?.activate(t);
 	}
-}, tn = {
+}, an = {
 	__depends__: [
+		he,
 		ge,
-		_e,
-		se
+		w
 	],
 	__init__: ["ttPaletteProvider"],
-	ttPaletteProvider: ["type", en]
-}, X = "tt.readOnly.changed", nn = 5e3, rn = [
+	ttPaletteProvider: ["type", rn]
+}, X = "tt.readOnly.changed", on = 5e3, sn = [
 	"elements.move",
 	"shape.move",
 	"shape.resize",
@@ -1230,7 +1274,7 @@ var en = class {
 	"connection.reconnect",
 	"connection.updateWaypoints",
 	"elements.delete"
-], an = class extends me {
+], cn = class extends pe {
 	bus;
 	static $inject = ["eventBus"];
 	readOnly = !1;
@@ -1238,7 +1282,7 @@ var en = class {
 		super(e), this.bus = e;
 	}
 	init() {
-		this.addRule(rn, nn, () => !this.readOnly && void 0);
+		this.addRule(sn, on, () => !this.readOnly && void 0);
 	}
 	isReadOnly() {
 		return this.readOnly;
@@ -1246,18 +1290,18 @@ var en = class {
 	setReadOnly(e) {
 		this.readOnly !== e && (this.readOnly = e, this.bus.fire(X, { readOnly: e }));
 	}
-}, on = {
-	__depends__: [pe],
+}, ln = {
+	__depends__: [fe],
 	__init__: ["ttReadOnly"],
-	ttReadOnly: ["type", an]
-}, sn = ".djs-context-pad .entry[data-action]";
+	ttReadOnly: ["type", cn]
+}, un = ".djs-context-pad .entry[data-action]";
 function Z(e, t, n = !0) {
 	return `<div class="entry tt-cp-entry" role="button" tabindex="${n ? 0 : -1}" aria-label="${t}">${J(e)}</div>`;
 }
-function cn(e) {
-	return k(e) ? "Edit text" : D(e) || O(e) ? "Edit label" : "Rename";
+function dn(e) {
+	return A(e) ? "Edit text" : O(e) || k(e) ? "Edit label" : "Rename";
 }
-var ln = class {
+var fn = class {
 	contextPad;
 	modeling;
 	ttModeling;
@@ -1284,16 +1328,16 @@ var ln = class {
 	}
 	getContextPadEntries(e) {
 		if (this.readOnly?.isReadOnly()) return {};
-		if (A(e)) return { delete: this.deleteEntry([e], "Delete connector") };
-		if (!T(e)) return {};
-		if (k(e)) {
+		if (j(e)) return { delete: this.deleteEntry([e], "Delete connector") };
+		if (!E(e)) return {};
+		if (A(e)) {
 			let t = (t) => this.connect.start(t, e);
 			return {
 				"edit-label": this.editEntry(e),
 				connect: {
 					group: "edit",
 					title: "Attach to element",
-					html: Z(Tt, "Attach to element", !1),
+					html: Z(Dt, "Attach to element", !1),
 					action: {
 						click: t,
 						dragstart: t
@@ -1311,7 +1355,7 @@ var ln = class {
 			"append-annotation": {
 				group: "edit",
 				title: "Add annotation",
-				html: Z(Et, "Add annotation"),
+				html: Z(Ot, "Add annotation"),
 				action: {
 					click: t,
 					keyboard: t
@@ -1325,15 +1369,15 @@ var ln = class {
 	}
 	onEntryKeyDown(e) {
 		if (e.key !== "Enter" && e.key !== " " || e.repeat) return;
-		let t = (e.target?.closest?.(sn))?.getAttribute("data-action");
+		let t = (e.target?.closest?.(un))?.getAttribute("data-action");
 		t && (e.preventDefault(), e.stopPropagation(), this.contextPad.triggerEntry(t, "keyboard", e));
 	}
 	editEntry(e) {
-		let t = cn(e), n = () => this.labelEditing.activate(e);
+		let t = dn(e), n = () => this.labelEditing.activate(e);
 		return {
 			group: "edit",
 			title: t,
-			html: Z(Ct, t),
+			html: Z(Tt, t),
 			action: {
 				click: n,
 				keyboard: n
@@ -1344,7 +1388,7 @@ var ln = class {
 		return {
 			group: "edit",
 			title: t,
-			html: Z(wt, t),
+			html: Z(Et, t),
 			action: {
 				click: () => this.modeling.removeElements([...e]),
 				keyboard: () => {
@@ -1353,19 +1397,19 @@ var ln = class {
 			}
 		};
 	}
-}, un = {
+}, pn = {
 	__depends__: [
-		be,
-		ve,
-		ye
+		ye,
+		_e,
+		ve
 	],
 	__init__: ["ttContextPadProvider"],
-	ttContextPadProvider: ["type", ln]
-}, dn = "tt-label-editing", fn = 96;
-function pn(e) {
-	return k(e) ? "Annotation text" : D(e) ? "Interaction label" : O(e) ? "Flow label" : "Team name";
+	ttContextPadProvider: ["type", fn]
+}, mn = "tt-label-editing", hn = 96;
+function gn(e) {
+	return A(e) ? "Annotation text" : O(e) ? "Interaction label" : k(e) ? "Flow label" : "Team name";
 }
-var mn = class {
+var _n = class {
 	canvas;
 	modeling;
 	elementRegistry;
@@ -1382,12 +1426,8 @@ var mn = class {
 	readOnly;
 	constructor(e, t, n, r, i) {
 		this.canvas = t, this.modeling = n, this.elementRegistry = r, this.readOnly = i.get("ttReadOnly", !1), e.on("element.dblclick", (e) => {
-			T(e.element) && this.activate(e.element);
-		}), e.on([
-			"element.mousedown",
-			"drag.init",
-			"canvas.viewbox.changing"
-		], () => this.active?.commit()), e.on("import.render.start", () => this.cancel()), e.on(X, (e) => {
+			E(e.element) && this.activate(e.element);
+		}), e.on(["element.mousedown", "drag.init"], () => this.active?.commit()), e.on("canvas.viewbox.changed", () => this.active?.place()), e.on("import.render.start", () => this.cancel()), e.on(X, (e) => {
 			e.readOnly && this.cancel();
 		}), e.on("diagram.destroy", () => {
 			clearTimeout(this.resumeTimer), this.suspended = null, this.cancel();
@@ -1401,7 +1441,7 @@ var mn = class {
 			let e = this.suspended;
 			if (this.suspended = null, !e || this.active) return;
 			let t = this.elementRegistry.get(e.elementId);
-			T(t) && this.activate(t, e);
+			E(t) && this.activate(t, e);
 		}, 0));
 	}
 	openEdit() {
@@ -1414,53 +1454,58 @@ var mn = class {
 	}
 	activate(e, t) {
 		if (this.active?.commit(), this.readOnly?.isReadOnly()) return;
-		let n = H(e), r = n.align === "center", i = this.canvas.zoom(), a = this.canvas.viewbox(), o = r ? Math.max(n.box.width, fn) : n.box.width, s = e.x + n.box.x + (n.box.width - o) / 2, c = (e.y + n.box.y - a.y) * i, l = n.box.height * i, u = document.createElement("textarea");
-		u.className = "tt-label-editor", u.value = t ? t.value : e.ttLabel ?? "", u.rows = 1, u.setAttribute("aria-label", pn(e)), Object.assign(u.style, {
-			left: `${(s - a.x) * i}px`,
-			width: `${o * i}px`,
-			fontFamily: I.family,
-			fontSize: `${n.fontSize * i}px`,
+		let n = H(e), r = n.align === "center", i = r ? Math.max(n.box.width, hn) : n.box.width, a = e.x + n.box.x + (n.box.width - i) / 2, o = document.createElement("textarea");
+		o.className = "tt-label-editor", o.value = t ? t.value : e.ttLabel ?? "", o.rows = 1, o.setAttribute("aria-label", gn(e)), Object.assign(o.style, {
+			fontFamily: R.family,
 			fontWeight: n.fontWeight,
 			letterSpacing: n.letterSpacing ?? "normal",
-			lineHeight: String(R),
+			lineHeight: String(B),
 			color: n.fill,
 			textAlign: r ? "center" : "left"
 		});
-		let d = () => {
-			u.style.height = "0px";
-			let e = u.scrollHeight;
-			u.style.height = `${r ? e : Math.max(e, l)}px`, u.style.top = `${r ? c + (l - e) / 2 : c}px`;
+		let s = 0, c = 0, l = () => {
+			o.style.height = "0px";
+			let e = o.scrollHeight;
+			o.style.height = `${r ? e : Math.max(e, c)}px`, o.style.top = `${r ? s + (c - e) / 2 : s}px`;
+		}, u = () => {
+			let t = this.canvas.zoom(), r = this.canvas.viewbox();
+			s = (e.y + n.box.y - r.y) * t, c = n.box.height * t, Object.assign(o.style, {
+				left: `${(a - r.x) * t}px`,
+				width: `${i * t}px`,
+				fontSize: `${n.fontSize * t}px`
+			}), l();
 		};
-		this.canvas.getContainer().appendChild(u), this.canvas.addMarker(e, dn), d(), u.focus(), t ? u.setSelectionRange(t.selectionStart, t.selectionEnd) : u.select();
-		let f = !1, p = () => {
-			f || (f = !0, u.removeEventListener("keydown", h), u.removeEventListener("input", d), u.removeEventListener("blur", g), u.remove(), this.elementRegistry.get(e.id) === e && this.canvas.removeMarker(e, dn), this.active = null, this.canvas.restoreFocus());
-		}, m = () => {
-			if (f) return;
-			let t = u.value.trim(), n = t !== (e.ttLabel ?? "");
-			p(), n && this.modeling.updateLabel(e, t);
-		}, h = (e) => {
-			e.key === "Enter" && !e.shiftKey && !e.isComposing ? (e.preventDefault(), m(), this.canvas.focus()) : e.key === "Escape" && (e.preventDefault(), p(), this.canvas.focus());
-		}, g = () => m();
-		u.addEventListener("keydown", h), u.addEventListener("input", d), u.addEventListener("blur", g);
-		let _ = () => ({
+		this.canvas.getContainer().appendChild(o), this.canvas.addMarker(e, mn), u(), o.focus(), t ? o.setSelectionRange(t.selectionStart, t.selectionEnd) : o.select();
+		let d = !1, f = () => {
+			d || (d = !0, o.removeEventListener("keydown", m), o.removeEventListener("input", l), o.removeEventListener("blur", h), o.remove(), this.elementRegistry.get(e.id) === e && this.canvas.removeMarker(e, mn), this.active = null, this.canvas.restoreFocus());
+		}, p = () => {
+			if (d) return;
+			let t = o.value.trim(), n = t !== (e.ttLabel ?? "");
+			f(), n && this.modeling.updateLabel(e, t);
+		}, m = (e) => {
+			e.key === "Enter" && !e.shiftKey && !e.isComposing ? (e.preventDefault(), p(), this.canvas.focus()) : e.key === "Escape" && (e.preventDefault(), f(), this.canvas.focus());
+		}, h = () => p();
+		o.addEventListener("keydown", m), o.addEventListener("input", l), o.addEventListener("blur", h);
+		let g = () => ({
 			elementId: e.id,
-			value: u.value,
-			selectionStart: u.selectionStart,
-			selectionEnd: u.selectionEnd
+			value: o.value,
+			selectionStart: o.selectionStart,
+			selectionEnd: o.selectionEnd
 		});
 		this.active = {
-			commit: m,
-			cleanup: p,
-			snapshot: _
+			commit: p,
+			cleanup: f,
+			place: u,
+			snapshot: g
 		};
 	}
 	cancel() {
 		this.active?.cleanup();
 	}
-}, hn = {
+}, vn = {
 	__init__: ["ttLabelEditing"],
-	ttLabelEditing: ["type", mn]
-}, gn = 1, _n = 10, vn = {
+	ttLabelEditing: ["type", _n]
+}, yn = 1, bn = 10, xn = {
 	ArrowLeft: {
 		x: -1,
 		y: 0
@@ -1477,24 +1522,24 @@ var mn = class {
 		x: 0,
 		y: 1
 	}
-}, yn = "[aria-modal=\"true\"], dialog[open]";
-function bn(e) {
+}, Sn = "[aria-modal=\"true\"], dialog[open]";
+function Cn(e) {
 	let t = e;
 	return t ? t.tagName === "INPUT" || t.tagName === "TEXTAREA" || t.tagName === "SELECT" || t.isContentEditable : !1;
 }
-function xn(e) {
+function wn(e) {
 	return typeof e?.nodeType == "number";
 }
-function Sn(e, t) {
+function Tn(e, t) {
 	if (t.closest("[inert]")) return !1;
-	if (!xn(e) || e.nodeType === Node.DOCUMENT_NODE) return !0;
+	if (!wn(e) || e.nodeType === Node.DOCUMENT_NODE) return !0;
 	let n = e.ownerDocument;
 	return e === n?.body || e === n?.documentElement || t.contains(e);
 }
-function Cn(e) {
+function En(e) {
 	return !("waypoints" in e);
 }
-var Q = class {
+var Dn = class {
 	static $inject = [
 		"config.ttKeyboard",
 		"eventBus",
@@ -1528,30 +1573,30 @@ var Q = class {
 				let t = a.get();
 				t.length && (e.preventDefault(), o.removeElements([...t]));
 			} else if (t && n === "v" && !e.shiftKey) e.preventDefault(), s.paste();
-			else if (!t && Object.hasOwn(vn, e.key)) {
-				let t = a.get().filter(Cn);
+			else if (!t && Object.hasOwn(xn, e.key)) {
+				let t = a.get().filter(En);
 				if (!t.length || !c.allowed("elements.move", { shapes: t })) return;
 				e.preventDefault();
-				let n = vn[e.key], r = e.shiftKey ? _n : gn;
+				let n = xn[e.key], r = e.shiftKey ? bn : yn;
 				o.moveElements(t, {
 					x: n.x * r,
 					y: n.y * r
 				});
 			}
 		}, _ = (e) => {
-			if (e.defaultPrevented || e.altKey || e.isComposing || bn(e.target) || !Sn(e.target, u) || d.querySelector(yn)) return;
+			if (e.defaultPrevented || e.altKey || e.isComposing || Cn(e.target) || !Tn(e.target, u) || d.querySelector(Sn)) return;
 			let t = e.ctrlKey || e.metaKey, n = e.key.toLowerCase();
 			h(e, t, n) || m?.isReadOnly() || g(e, t, n);
 		};
 		d.addEventListener("keydown", _), t.on("diagram.destroy", () => d.removeEventListener("keydown", _));
 	}
-}, wn = {
+}, Q = {
 	__init__: ["ttKeyboard"],
-	ttKeyboard: ["type", Q]
+	ttKeyboard: ["type", Dn]
 };
 //#endregion
 //#region src/copy-paste/TtCopyPaste.ts
-function Tn(e) {
+function On(e) {
 	switch (e) {
 		case "team": return "team";
 		case "interaction": return "int";
@@ -1561,7 +1606,7 @@ function Tn(e) {
 		default: return;
 	}
 }
-var En = class extends Se {
+var kn = class extends xe {
 	elementFactory;
 	static $inject = [
 		"canvas",
@@ -1577,20 +1622,20 @@ var En = class extends Se {
 		super(e, t, n, r, i, a, o, s), this.elementFactory = r;
 	}
 	createConnection(e) {
-		let t = Tn(e.ttKind);
+		let t = On(e.ttKind);
 		return t ? this.elementFactory.createConnection({
 			...e,
 			id: v(t)
 		}) : super.createConnection(e);
 	}
 	createShape(e) {
-		let t = Tn(e.ttKind);
+		let t = On(e.ttKind);
 		return t ? this.elementFactory.createShape({
 			...e,
 			id: v(t)
 		}) : super.createShape(e);
 	}
-}, Dn = [
+}, An = [
 	"ttKind",
 	"teamType",
 	"mode",
@@ -1599,31 +1644,31 @@ var En = class extends Se {
 	"fill",
 	"stroke",
 	"ttForeign"
-], On = {
-	__depends__: [xe],
+], jn = {
+	__depends__: [be],
 	__init__: ["ttCopyPasteProps"],
-	copyPaste: ["type", En],
+	copyPaste: ["type", kn],
 	ttCopyPasteProps: ["type", class {
 		static $inject = ["eventBus"];
 		constructor(e) {
 			e.on("copyPaste.copyElement", (e) => {
 				let { descriptor: t, element: n } = e;
-				if (!T(n) && !A(n)) return;
+				if (!E(n) && !j(n)) return;
 				let r = n;
-				for (let e of Dn) r[e] !== void 0 && (t[e] = structuredClone(r[e]));
+				for (let e of An) r[e] !== void 0 && (t[e] = structuredClone(r[e]));
 			});
 		}
 	}]
 };
 //#endregion
 //#region src/zorder/TtZOrder.ts
-function kn(e) {
-	return O(e) ? 0 : E(e) ? e.teamType === "enabling" ? 3 : e.teamType === "complicated-subsystem" ? 2 : 1 : D(e) ? 4 : k(e) ? 5 : A(e) ? 6 : 1;
+function Mn(e) {
+	return k(e) ? 0 : D(e) ? e.teamType === "enabling" ? 3 : e.teamType === "complicated-subsystem" ? 2 : 1 : O(e) ? 4 : A(e) ? 5 : j(e) ? 6 : 1;
 }
-function An(e) {
-	return T(e) || A(e);
+function Nn(e) {
+	return E(e) || j(e);
 }
-var jn = class {
+var Pn = class {
 	canvas;
 	elementRegistry;
 	static $inject = [
@@ -1642,34 +1687,34 @@ var jn = class {
 		});
 	}
 	reorder() {
-		let e = this.elementRegistry.getAll().filter(An).sort((e, t) => kn(e) - kn(t));
+		let e = this.elementRegistry.getAll().filter(Nn).sort((e, t) => Mn(e) - Mn(t));
 		for (let t of e) {
 			let e = this.canvas.getGraphics(t)?.parentNode, n = e?.parentNode;
 			e && n && n.appendChild(e);
 		}
 	}
-}, Mn = {
+}, Fn = {
 	__init__: ["ttZOrder"],
-	ttZOrder: ["type", jn]
-}, Nn = class extends K {
+	ttZOrder: ["type", Pn]
+}, In = class extends K {
 	_getModules() {
 		return [
 			...super._getModules(),
-			ce,
 			se,
+			w,
+			ce,
 			le,
 			ue,
-			de,
-			on,
-			gt,
-			yt,
-			St,
-			tn,
-			un,
-			hn,
-			wn,
-			On,
-			Mn
+			ln,
+			vt,
+			xt,
+			wt,
+			an,
+			pn,
+			vn,
+			Q,
+			jn,
+			Fn
 		];
 	}
 	undo() {
@@ -1684,33 +1729,34 @@ var jn = class {
 	canRedo() {
 		return this.get("commandStack").canRedo();
 	}
-}, Pn = "team-topologies";
-function Fn(e = {}) {
-	return zn(new Nn({
-		...Ln(e),
+}, Ln = "team-topologies";
+function Rn(e = {}) {
+	return Hn(new In({
+		...Bn(e),
 		undoRedoKeys: e.undoRedoKeys ?? !0,
+		freeArea: e.freeArea,
 		freeRectCenter: e.freeRectCenter
 	}), !0, e.fitOnImport ?? !0);
 }
-function In(e = {}) {
-	return zn(new K(Ln(e)), !1, e.fitOnImport ?? !0);
+function zn(e = {}) {
+	return Hn(new K(Bn(e)), !1, e.fitOnImport ?? !0);
 }
-function Ln(e) {
+function Bn(e) {
 	return {
 		width: "100%",
 		height: "100%",
 		additionalModules: e.additionalModules ?? []
 	};
 }
-function Rn(e) {
+function Vn(e) {
 	let t = ee(e.trim() === "" ? {} : JSON.parse(e));
 	if (!t.ok) throw Error(t.error);
 	return t.document;
 }
-function zn(e, t, n) {
+function Hn(e, t, n) {
 	let r = e.get("eventBus"), i = e.get("canvas"), a = e.get("elementRegistry"), o = e.get("selection"), s = /* @__PURE__ */ new Set(), c = 0, l = !1, u = "", d = {
-		notation: Pn,
-		apiVersion: Ce,
+		notation: Ln,
+		apiVersion: Se,
 		editable: t
 	};
 	t && r.on("commandStack.changed", () => {
@@ -1720,16 +1766,28 @@ function zn(e, t, n) {
 	return {
 		meta: d,
 		elements: {
-			list: () => l ? [] : a.getAll().filter(T).map(Vn),
+			list: () => l ? [] : a.getAll().filter(E).map(Wn),
 			reveal(e) {
 				if (l) return !1;
 				let t = a.get(e);
-				return T(t) ? (o.select(t), i.scrollToElement(t), !0) : !1;
+				return E(t) ? (o.select(t), i.scrollToElement(t), !0) : !1;
 			},
-			selection: () => l ? [] : Bn(o.get()),
+			selection: () => l ? [] : Un(o.get()),
 			onSelection(e) {
-				let t = (t) => e(Bn(t.newSelection ?? []));
+				let t = (t) => e(Un(t.newSelection ?? []));
 				return r.on("selection.changed", t), () => r.off("selection.changed", t);
+			},
+			bounds(e) {
+				if (l) return;
+				let t = a.get(e);
+				if (!E(t)) return;
+				let { x: n, y: r, width: i, height: o } = t;
+				return {
+					x: n,
+					y: r,
+					width: i,
+					height: o
+				};
 			}
 		},
 		diagram: e,
@@ -1738,7 +1796,7 @@ function zn(e, t, n) {
 		},
 		async importText(t) {
 			if (l) throw Error("The modeler was destroyed.");
-			let r = Rn(t);
+			let r = Vn(t);
 			c += 1;
 			try {
 				let { warnings: t } = e.importDocument(r, { fit: n });
@@ -1761,19 +1819,22 @@ function zn(e, t, n) {
 					width: n,
 					height: r
 				};
-				return Hn(a) ? a : void 0;
+				return Gn(a) ? a : void 0;
 			} catch {
 				return;
 			}
 		},
 		setViewState(e) {
-			!l && Hn(e) && i.viewbox({
+			!l && Gn(e) && i.viewbox({
 				x: e.x,
 				y: e.y,
 				width: e.width,
 				height: e.height
 			});
 		},
+		contentBounds() {
+			return e.contentBounds();
+		},
 		destroy() {
 			if (!l) {
 				try {
@@ -1786,17 +1847,17 @@ function zn(e, t, n) {
 		}
 	};
 }
-function Bn(e) {
-	return e.filter(T).map((e) => e.id);
+function Un(e) {
+	return e.filter(E).map((e) => e.id);
 }
-function Vn(e) {
+function Wn(e) {
 	let t = e.ttLabel;
 	return t ? {
 		id: e.id,
 		name: t
 	} : { id: e.id };
 }
-function Hn(e) {
+function Gn(e) {
 	if (typeof e != "object" || !e) return !1;
 	let { x: t, y: n, width: r, height: i } = e;
 	return $(t) && $(n) && $(r) && $(i) && r > 0 && i > 0;
@@ -1805,6 +1866,6 @@ function $(e) {
 	return typeof e == "number" && Number.isFinite(e);
 }
 //#endregion
-export { Te as CD_TOKENS, G as GEIST_UNICODE_RANGES, Mt as ICON_DOWNLOAD, Tt as ICON_LINK, jt as ICON_MAXIMIZE, Ot as ICON_MENU, Et as ICON_MESSAGE_SQUARE_PLUS, kt as ICON_MINUS, Ct as ICON_PENCIL, At as ICON_PLUS, Dt as ICON_SQUARE_DASHED_MOUSE_POINTER, wt as ICON_TRASH, Nt as ICON_X, j as MIRAGON, Nn as Modeler, K as NavigatedViewer, X as READ_ONLY_CHANGED_EVENT, N as ROOT_ID, Pn as TEAM_TOPOLOGIES_NOTATION, Ge as TeamTopologiesRenderer, xt as TtAssociationBehavior, Me as TtBaseViewer, ln as TtContextPadProvider, Ne as TtElementFactory, Xe as TtExporter, bt as TtFlatModelBehavior, Ye as TtImporter, Q as TtKeyboard, mn as TtLabelEditing, ht as TtLayouter, mt as TtModeling, en as TtPaletteProvider, an as TtReadOnly, vt as TtRules, rt as TtViewport, jn as TtZOrder, st as Viewer, Ut as annotationIconSvg, Fn as createCollaborativeModeler, In as createCollaborativeViewer, at as embedSvgStyles, Ht as flowIconSvg, it as geistFontFaceCss, J as iconMarkup, Gt as interactionIconSvg, ot as ioModule, k as isTtAnnotation, A as isTtAssociation, T as isTtElement, O as isTtFlow, D as isTtInteraction, E as isTtTeam, Rn as parseDocumentText, Ae as saveSVG, Vt as teamIconSvg, St as ttBehaviorsModule, un as ttContextPadModule, Je as ttDrawModule, wn as ttKeyboardModule, hn as ttLabelEditingModule, Pe as ttModelModule, gt as ttModelingModule, tn as ttPaletteModule, on as ttReadOnlyModule, yt as ttRulesModule, Mn as ttZOrderModule };
+export { we as CD_TOKENS, G as GEIST_UNICODE_RANGES, Pt as ICON_DOWNLOAD, Dt as ICON_LINK, Nt as ICON_MAXIMIZE, At as ICON_MENU, Ot as ICON_MESSAGE_SQUARE_PLUS, jt as ICON_MINUS, Tt as ICON_PENCIL, Mt as ICON_PLUS, kt as ICON_SQUARE_DASHED_MOUSE_POINTER, Et as ICON_TRASH, Ft as ICON_X, M as MIRAGON, In as Modeler, K as NavigatedViewer, X as READ_ONLY_CHANGED_EVENT, F as ROOT_ID, Ln as TEAM_TOPOLOGIES_NOTATION, qe as TeamTopologiesRenderer, Ct as TtAssociationBehavior, Ae as TtBaseViewer, fn as TtContextPadProvider, je as TtElementFactory, Qe as TtExporter, St as TtFlatModelBehavior, Ze as TtImporter, Dn as TtKeyboard, _n as TtLabelEditing, _t as TtLayouter, gt as TtModeling, rn as TtPaletteProvider, cn as TtReadOnly, bt as TtRules, at as TtViewport, Pn as TtZOrder, lt as Viewer, Gt as annotationIconSvg, Rn as createCollaborativeModeler, zn as createCollaborativeViewer, st as embedSvgStyles, Wt as flowIconSvg, ot as geistFontFaceCss, J as iconMarkup, qt as interactionIconSvg, ct as ioModule, A as isTtAnnotation, j as isTtAssociation, E as isTtElement, k as isTtFlow, O as isTtInteraction, D as isTtTeam, Vn as parseDocumentText, Oe as saveSVG, Ut as teamIconSvg, wt as ttBehaviorsModule, pn as ttContextPadModule, Xe as ttDrawModule, Q as ttKeyboardModule, vn as ttLabelEditingModule, Me as ttModelModule, vt as ttModelingModule, an as ttPaletteModule, ln as ttReadOnlyModule, xt as ttRulesModule, Fn as ttZOrderModule };
 
 //# sourceMappingURL=index.js.map