@miragon/event-storming-renderer 0.3.0 → 0.4.1

package/dist/index.js

@@ -1,67 +1,67 @@
 import e from "diagram-js/lib/Diagram";
-import { parseDSLWithDiagnostics as t, serializeDSL as n } from "@miragon/event-storming-dsl";
-import { ATTACHABLE_STICKY_KINDS as r, CURRENT_SCHEMA_VERSION as i, DEFAULT_BOARD_LEVEL as a, DEFAULT_BOARD_SIZE as o, HOST_STICKY_KINDS as s, LEVEL_STICKY_KINDS as c, validateBoard as l } from "@miragon/event-storming-schema-model";
-import u from "diagram-js/lib/features/change-support";
-import d from "diagram-js/lib/draw/BaseRenderer";
-import { append as f, attr as p, create as m, remove as h } from "tiny-svg";
-import g from "diagram-js/lib/features/selection";
-import _ from "diagram-js/lib/navigation/zoomscroll";
-import v from "diagram-js/lib/navigation/movecanvas";
-import ee from "diagram-js/lib/features/keyboard";
-import te from "diagram-js/lib/features/modeling";
-import y from "diagram-js/lib/features/move";
-import b from "diagram-js/lib/features/create";
-import ne from "diagram-js/lib/features/connect";
-import re from "diagram-js/lib/features/context-pad";
-import ie from "diagram-js/lib/features/palette";
-import ae from "diagram-js/lib/features/rules";
-import oe from "diagram-js/lib/features/outline";
-import se from "diagram-js/lib/features/popup-menu";
-import ce from "diagram-js/lib/features/attach-support";
-import le from "diagram-js/lib/command/CommandInterceptor";
-import ue from "diagram-js/lib/features/mouse";
-import de from "diagram-js/lib/features/lasso-tool";
-import fe from "diagram-js/lib/features/rules/RuleProvider";
-import pe from "diagram-js/lib/features/palette/PaletteTooltipComponent";
-import { html as me } from "diagram-js/lib/ui";
-import he from "diagram-js/lib/features/connection-preview";
-import ge from "diagram-js/lib/features/ordering/OrderingProvider";
-import _e from "diagram-js/lib/features/resize";
-import { MODELER_API_VERSION as ve } from "@miragon/modeler-api";
+import { ATTACHABLE_STICKY_KINDS as t, CURRENT_SCHEMA_VERSION as n, DEFAULT_BOARD_LEVEL as r, DEFAULT_BOARD_SIZE as i, HOST_STICKY_KINDS as a, LEVEL_STICKY_KINDS as o, assertDrawable as s, validateBoard as c } from "@miragon/event-storming-schema-model";
+import { parseDSLWithDiagnostics as l, serializeDSL as u } from "@miragon/event-storming-dsl";
+import d from "diagram-js/lib/features/change-support";
+import f from "diagram-js/lib/draw/BaseRenderer";
+import { append as p, attr as m, create as h, remove as g } from "tiny-svg";
+import _ from "diagram-js/lib/features/selection";
+import ee from "diagram-js/lib/navigation/zoomscroll";
+import te from "diagram-js/lib/navigation/movecanvas";
+import ne from "diagram-js/lib/features/keyboard";
+import re from "diagram-js/lib/features/modeling";
+import ie from "diagram-js/lib/features/move";
+import ae from "diagram-js/lib/features/create";
+import oe from "diagram-js/lib/features/connect";
+import se from "diagram-js/lib/features/context-pad";
+import ce from "diagram-js/lib/features/palette";
+import le from "diagram-js/lib/features/rules";
+import ue from "diagram-js/lib/features/outline";
+import de from "diagram-js/lib/features/popup-menu";
+import fe from "diagram-js/lib/features/attach-support";
+import pe from "diagram-js/lib/command/CommandInterceptor";
+import me from "diagram-js/lib/features/mouse";
+import he from "diagram-js/lib/features/lasso-tool";
+import ge from "diagram-js/lib/features/rules/RuleProvider";
+import _e from "diagram-js/lib/features/palette/PaletteTooltipComponent";
+import { html as ve } from "diagram-js/lib/ui";
+import ye from "diagram-js/lib/features/connection-preview";
+import be from "diagram-js/lib/features/ordering/OrderingProvider";
+import xe from "diagram-js/lib/features/resize";
+import { MODELER_API_VERSION as Se } from "@miragon/modeler-api";
 //#region src/io/saveSvg.ts
-var ye = [
+var Ce = [
 	"tabindex",
 	"role",
 	"aria-label",
 	"aria-labelledby"
 ];
-function be(e, t) {
+function we(e, t) {
 	let n = e.getContainer().querySelector(":scope > svg");
 	if (!n) throw Error("No SVG found in the canvas container.");
 	let r = n.cloneNode(!0);
-	for (let e of ye) r.removeAttribute(e);
-	let i = t ?? {
+	for (let e of Ce) r.removeAttribute(e);
+	let a = t ?? {
 		x: 0,
 		y: 0,
-		...o
+		...i
 	};
-	r.setAttribute("xmlns", "http://www.w3.org/2000/svg"), r.setAttribute("viewBox", `${i.x} ${i.y} ${i.width} ${i.height}`), r.setAttribute("width", String(i.width)), r.setAttribute("height", String(i.height));
-	let a = r.querySelector(".viewport");
-	return a && a.removeAttribute("transform"), { svg: "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n" + new XMLSerializer().serializeToString(r) };
+	r.setAttribute("xmlns", "http://www.w3.org/2000/svg"), r.setAttribute("viewBox", `${a.x} ${a.y} ${a.width} ${a.height}`), r.setAttribute("width", String(a.width)), r.setAttribute("height", String(a.height));
+	let o = r.querySelector(".viewport");
+	return o && o.removeAttribute("transform"), { svg: "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n" + new XMLSerializer().serializeToString(r) };
 }
 //#endregion
 //#region src/model/di-types.ts
-var x = "event-storming-root";
-function xe(e) {
+var v = "event-storming-root";
+function Te(e) {
 	return typeof e == "object" && !!e;
 }
-function S(e) {
-	return xe(e) && typeof e.eventStormingType == "string" && !("waypoints" in e);
+function y(e) {
+	return Te(e) && typeof e.eventStormingType == "string" && !("waypoints" in e);
 }
-function C(e) {
-	return xe(e) && typeof e.eventStormingType == "string" && "waypoints" in e;
+function b(e) {
+	return Te(e) && typeof e.eventStormingType == "string" && "waypoints" in e;
 }
-var w = [
+var x = [
 	"event",
 	"command",
 	"actor",
@@ -71,118 +71,33 @@ var w = [
 	"external",
 	"hotspot"
 ];
-function T(e) {
-	return w.includes(e);
+function S(e) {
+	return x.includes(e);
 }
-function E(e) {
-	return S(e) && T(e.eventStormingType);
+function C(e) {
+	return y(e) && S(e.eventStormingType);
 }
-function D(e) {
-	return r.includes(e);
+function w(e) {
+	return t.includes(e);
 }
-function O(e) {
-	return s.includes(e);
+function T(e) {
+	return a.includes(e);
 }
-function Se(e) {
-	return S(e) && D(e.eventStormingType);
+function Ee(e) {
+	return y(e) && w(e.eventStormingType);
 }
-function Ce(e) {
-	return S(e) && O(e.eventStormingType);
+function E(e) {
+	return y(e) && T(e.eventStormingType);
 }
-function k(e) {
-	return S(e) && e.eventStormingType === "drawing";
+function D(e) {
+	return y(e) && e.eventStormingType === "drawing";
 }
-function we(e) {
-	return S(e) && e.eventStormingType === "note";
+function De(e) {
+	return y(e) && e.eventStormingType === "note";
 }
 //#endregion
-//#region src/EventStormingBaseViewer.ts
-function Te(e) {
-	for (let { id: t } of [...e.elements, ...e.edges]) if (t === "event-storming-root" || t.startsWith("__implicitroot")) throw Error(`Element id "${t}" is reserved for the board itself.`);
-}
-function Ee(e) {
-	return typeof e == "number" ? `${e}px` : e;
-}
-var De = class {
-	_diagram;
-	_container;
-	_options;
-	constructor(e = {}) {
-		this._options = e, this._container = this._createContainer(e);
-	}
-	_createContainer(e) {
-		let t = e.container ?? document.createElement("div");
-		return t.classList.add("event-storming-container"), t.style.width = Ee(e.width ?? "100%"), t.style.height = Ee(e.height ?? (e.container ? "100%" : "600px")), t;
-	}
-	_ensureDiagram() {
-		if (!this._diagram) {
-			let t = [...this._getModules(), ...this._options.additionalModules ?? []];
-			this._diagram = new e({
-				canvas: { container: this._container },
-				modules: t,
-				eventStormingKeyboard: { undoRedoKeys: this._options.undoRedoKeys ?? !0 },
-				eventStormingPalette: { freeRectInsets: this._options.freeRectInsets }
-			});
-		}
-		return this._diagram;
-	}
-	get(e) {
-		return this._ensureDiagram().get(e);
-	}
-	on(e, t, n = 1e3) {
-		this.get("eventBus").on(e, n, t);
-	}
-	off(e, t) {
-		this.get("eventBus").off(e, t);
-	}
-	async importMap(e) {
-		let t = this._ensureDiagram(), n = t.get("eventBus"), r = t.get("eventStormingImporter");
-		Te(e);
-		let i = t.get("eventStormingLabelEditing", !1);
-		i?.suspend(), t.get("popupMenu", !1)?.close(), r.clear();
-		let a = r.import(e);
-		return t.get("commandStack", !1)?.clear(!1), n.fire("import.done", { warnings: a }), i?.resumeAfterImport(), { warnings: a };
-	}
-	async importDSL(e) {
-		let n = this._ensureDiagram().get("eventBus");
-		n.fire("import.parse.start", { text: e });
-		let { board: r, diagnostics: i } = t(e);
-		n.fire("import.parse.done", {
-			board: r,
-			diagnostics: i
-		});
-		let { warnings: a } = await this.importMap(r);
-		return { warnings: [...i.map((e) => ({
-			message: `Line ${e.line}: ${e.message}`,
-			line: e.line,
-			source: e.text
-		})), ...a] };
-	}
-	exportMap() {
-		return this.get("eventStormingExporter").export();
-	}
-	exportDSL() {
-		return n(this.exportMap());
-	}
-	async saveSVG() {
-		return be(this.get("canvas"), this.get("boardBounds").contentBounds());
-	}
-	attachTo(e) {
-		e.appendChild(this._container), this.get("canvas").resized();
-	}
-	detach() {
-		this._container.remove();
-	}
-	clear() {
-		this._ensureDiagram().clear();
-	}
-	destroy() {
-		this._diagram &&= (this._diagram.destroy(), void 0), this._container.remove();
-	}
-	get container() {
-		return this._container;
-	}
-}, A = {
+//#region src/theme/palette.ts
+var O = {
 	blau: "#335DE5",
 	blauLink: "#2B50D4",
 	blauHell: "#6B8AFF",
@@ -214,7 +129,7 @@ var De = class {
 		italic: !0
 	}
 ];
-function j(e) {
+function k(e) {
 	return e.split("\n").map((e) => {
 		let t = e.startsWith("- ");
 		return {
@@ -233,7 +148,7 @@ function ke(e) {
 	}).join("\n");
 }
 function Ae(e) {
-	return j(e).map((e) => (e.bullet ? "• " : "") + e.runs.map((e) => e.text).join("")).join("\n");
+	return k(e).map((e) => (e.bullet ? "• " : "") + e.runs.map((e) => e.text).join("")).join("\n");
 }
 function je(e) {
 	let t = [], n = "", r = () => {
@@ -280,7 +195,7 @@ function Ne(e) {
 }
 //#endregion
 //#region src/draw/styles.ts
-var M = {
+var A = {
 	event: {
 		label: "Domain Event",
 		width: 130,
@@ -337,43 +252,321 @@ var M = {
 		fill: "#E85D75",
 		stroke: "#C43B55"
 	}
-}, N = {
+}, j = {
 	label: "Note",
 	fill: "#ECECEC",
 	stroke: "#C4C4C4"
 }, Pe = {
 	width: 60,
 	height: 40
-}, P = 7.5, Fe = {
-	width: M.aggregate.width,
-	height: M.aggregate.height
+}, M = 7.5, Fe = {
+	width: A.aggregate.width,
+	height: A.aggregate.height
 };
-function F(e) {
+function N(e) {
 	let t = Ae(e), n = (t && t.length ? t : "note").split("\n"), r = Math.max(1, ...n.map((e) => e.length));
 	return {
 		lines: n,
-		width: Math.max(Fe.width, Math.round(r * P) + 16),
+		width: Math.max(Fe.width, Math.round(r * M) + 16),
 		height: Math.max(Fe.height, n.length * 17 + 16)
 	};
 }
-function I(e, t) {
-	let n = F(e);
+function P(e, t) {
+	let n = N(e);
 	return t.width !== n.width || t.height !== n.height;
 }
-var L = {
-	paper: A.grau,
-	ink: A.schwarz,
+var F = {
+	paper: O.grau,
+	ink: O.schwarz,
 	inkSoft: "#5B5B5B",
-	surface: A.weiss,
-	stroke: A.schwarz,
+	surface: O.weiss,
+	stroke: O.schwarz,
 	arrow: "#9E9E9E",
-	accent: A.blau,
+	accent: O.blau,
 	accentSoft: "rgba(51,93,229,0.12)",
-	stickyText: A.schwarz
-}, R = A.schwarz, z = {
+	stickyText: O.schwarz
+}, I = O.schwarz, L = {
 	family: "'Geist Variable', 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif",
 	label: 13
-}, Ie = {
+}, Ie = (e) => `<svg width="24" height="24" viewBox="0 0 24 24" class="event-storming-palette-svg">${e}</svg>`, Le = (e, t, n = 0) => Ie(`<rect x="4" y="5" width="16" height="14" fill="${e}" stroke="${t}" stroke-width="1.5"${n ? ` transform="rotate(${n} 12 12)"` : ""}/>`), Re = (e) => `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false" class="event-storming-palette-svg">${e}</svg>`, R = {
+	draw: Re("<circle cx=\"19\" cy=\"5\" r=\"2\"/><circle cx=\"5\" cy=\"19\" r=\"2\"/><path d=\"M6.5 17.5 17.5 6.5\"/>"),
+	lasso: Re("<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\"/><path d=\"M5 21a2 2 0 0 1-2-2\"/><path d=\"M9 3h1\"/><path d=\"M9 21h2\"/><path d=\"M14 3h1\"/><path d=\"M3 9v1\"/><path d=\"M21 9v2\"/><path d=\"M3 14v1\"/>"),
+	note: Le(j.fill, j.stroke)
+};
+for (let e of x) {
+	let t = A[e];
+	R[e] = Le(t.fill, t.stroke, e === "hotspot" ? -6 : 0);
+}
+function ze(e, t) {
+	return `<svg width="14" height="14" viewBox="0 0 14 14" class="event-storming-palette-svg"><rect x="1" y="1" width="12" height="12" fill="${e}" stroke="${t}" stroke-width="1"/></svg>`;
+}
+//#endregion
+//#region src/palette/EventStormingPaletteProvider.ts
+function z(e) {
+	if (e.freeArea) return e.freeArea;
+	let t = e.freeRectInsets;
+	return t ? { insets: t } : void 0;
+}
+var Be = 24, B = "stickies-1", V = "stickies-2", Ve = "stickies-3", He = [
+	{
+		key: "event",
+		type: "event",
+		label: A.event.label,
+		title: "Domain event",
+		shortcut: "E",
+		group: B
+	},
+	{
+		key: "command",
+		type: "command",
+		label: A.command.label,
+		title: "Command",
+		shortcut: "C",
+		group: B
+	},
+	{
+		key: "actor",
+		type: "actor",
+		label: A.actor.label,
+		title: "Actor",
+		group: B
+	},
+	{
+		key: "aggregate",
+		type: "aggregate",
+		label: A.aggregate.label,
+		title: "Aggregate",
+		group: B
+	},
+	{
+		key: "policy",
+		type: "policy",
+		label: A.policy.label,
+		title: "Policy",
+		group: V
+	},
+	{
+		key: "readmodel",
+		type: "readmodel",
+		label: A.readmodel.label,
+		title: "Read model",
+		group: V
+	},
+	{
+		key: "external",
+		type: "external",
+		label: A.external.label,
+		title: "External system",
+		group: V
+	},
+	{
+		key: "hotspot",
+		type: "hotspot",
+		label: A.hotspot.label,
+		title: "Hotspot",
+		group: Ve
+	},
+	{
+		key: "note",
+		type: "note",
+		label: j.label,
+		title: "Note",
+		group: Ve
+	}
+], Ue = class {
+	create;
+	factory;
+	lassoTool;
+	drawTool;
+	eventStormingModeling;
+	canvas;
+	modeling;
+	selection;
+	elementRegistry;
+	labelEditing;
+	config;
+	static $inject = [
+		"palette",
+		"create",
+		"eventStormingElementFactory",
+		"lassoTool",
+		"eventStormingDrawTool",
+		"eventStormingModeling",
+		"eventBus",
+		"canvas",
+		"modeling",
+		"selection",
+		"elementRegistry",
+		"eventStormingLabelEditing",
+		"config.eventStormingPalette"
+	];
+	constructor(e, t, n, r, i, a, o, s, c, l, u, d, f) {
+		this.create = t, this.factory = n, this.lassoTool = r, this.drawTool = i, this.eventStormingModeling = a, this.canvas = s, this.modeling = c, this.selection = l, this.elementRegistry = u, this.labelEditing = d, this.config = f, e.registerProvider(this);
+		let p = () => e._rebuild();
+		o.on("import.done", p), o.on(["commandStack.element.updateProperties.postExecuted", "commandStack.element.updateProperties.reverted"], (e) => {
+			e.context.element.id === "event-storming-root" && p();
+		});
+	}
+	getPaletteEntries() {
+		let e = {};
+		e["lasso-tool"] = {
+			group: "tools",
+			title: "Lasso",
+			shortcut: "L",
+			html: `<div class="entry event-storming-palette-entry">${R.lasso}</div>`,
+			action: { click: (e) => this.lassoTool.activateSelection(e) }
+		}, e["draw-tool"] = {
+			group: "tools",
+			title: "Draw",
+			html: `<div class="entry event-storming-palette-entry">${R.draw}</div>`,
+			action: { click: () => this.drawTool.toggle() }
+		};
+		let t = o[this.eventStormingModeling.getLevel()];
+		for (let n of He) {
+			if (n.type !== "note" && !t.includes(n.type)) continue;
+			let r = (e) => {
+				let t = this.factory.createNew(n.type, n.label);
+				We(e) && this.placeInFreeRect(t) || this.create.start(e, t);
+			};
+			e[`create.${n.key}`] = {
+				group: n.group,
+				title: n.title,
+				...n.shortcut ? { shortcut: n.shortcut } : {},
+				html: `<div class="entry event-storming-palette-entry" draggable="true">${R[n.key]}</div>`,
+				action: {
+					dragstart: r,
+					click: r
+				}
+			};
+		}
+		return e;
+	}
+	placeInFreeRect(e) {
+		let { canvas: t, modeling: n, selection: r, elementRegistry: i } = this;
+		if (!t || !n || !r || !i) return !1;
+		let a = this.freeAreaCentre(t), o = (e) => i.filter(y).some((t) => Math.abs(t.x + t.width / 2 - e.x) < 1 && Math.abs(t.y + t.height / 2 - e.y) < 1);
+		for (; o(a);) a.x += Be, a.y += Be;
+		let s = n.createShape(e, a, t.getRootElement());
+		return r.select(s), t.focus(), this.labelEditing?.activate(s), !0;
+	}
+	freeAreaCentre(e) {
+		let t = this.config && z(this.config), n = t?.center?.();
+		if (n) return {
+			x: n.x,
+			y: n.y
+		};
+		let r = e.viewbox(), i = t?.insets?.() ?? {
+			top: 0,
+			right: 0,
+			bottom: 0,
+			left: 0
+		}, a = Math.max(0, r.outer.width - i.left - i.right), o = Math.max(0, r.outer.height - i.top - i.bottom);
+		return {
+			x: r.x + (i.left + a / 2) / r.scale,
+			y: r.y + (i.top + o / 2) / r.scale
+		};
+	}
+};
+function We(e) {
+	return e.type === "click" && e.detail === 0;
+}
+//#endregion
+//#region src/EventStormingBaseViewer.ts
+function Ge(e) {
+	for (let { id: t } of [...e.elements, ...e.edges]) if (t === "event-storming-root" || t.startsWith("__implicitroot")) throw Error(`Element id "${t}" is reserved for the board itself.`);
+}
+function Ke(e) {
+	return typeof e == "number" ? `${e}px` : e;
+}
+var qe = class {
+	_diagram;
+	_container;
+	_options;
+	constructor(e = {}) {
+		this._options = e, this._container = this._createContainer(e);
+	}
+	_createContainer(e) {
+		let t = e.container ?? document.createElement("div");
+		return t.classList.add("event-storming-container"), t.style.width = Ke(e.width ?? "100%"), t.style.height = Ke(e.height ?? (e.container ? "100%" : "600px")), t;
+	}
+	_ensureDiagram() {
+		if (!this._diagram) {
+			let t = [...this._getModules(), ...this._options.additionalModules ?? []];
+			this._diagram = new e({
+				canvas: { container: this._container },
+				modules: t,
+				eventStormingKeyboard: { undoRedoKeys: this._options.undoRedoKeys ?? !0 },
+				eventStormingPalette: { freeArea: z(this._options) },
+				eventStormingImporter: { fitOnImport: this._options.fitOnImport ?? !0 }
+			});
+		}
+		return this._diagram;
+	}
+	get(e) {
+		return this._ensureDiagram().get(e);
+	}
+	on(e, t, n = 1e3) {
+		this.get("eventBus").on(e, n, t);
+	}
+	off(e, t) {
+		this.get("eventBus").off(e, t);
+	}
+	async importMap(e) {
+		let t = this._ensureDiagram(), n = t.get("eventBus"), r = t.get("eventStormingImporter");
+		Ge(e), s(e);
+		let i = t.get("eventStormingLabelEditing", !1);
+		i?.suspend(), t.get("popupMenu", !1)?.close(), r.clear();
+		let a = r.import(e);
+		return t.get("commandStack", !1)?.clear(!1), n.fire("import.done", { warnings: a }), i?.resumeAfterImport(), { warnings: a };
+	}
+	async importDSL(e) {
+		let t = this._ensureDiagram().get("eventBus");
+		t.fire("import.parse.start", { text: e });
+		let { board: n, diagnostics: r } = l(e);
+		t.fire("import.parse.done", {
+			board: n,
+			diagnostics: r
+		});
+		let { warnings: i } = await this.importMap(n);
+		return { warnings: [...r.map((e) => ({
+			message: `Line ${e.line}: ${e.message}`,
+			line: e.line,
+			source: e.text
+		})), ...i] };
+	}
+	exportMap() {
+		return this.get("eventStormingExporter").export();
+	}
+	exportDSL() {
+		return u(this.exportMap());
+	}
+	async saveSVG() {
+		return we(this.get("canvas"), this.get("boardBounds").contentBounds());
+	}
+	attachTo(e) {
+		e.appendChild(this._container), this.get("canvas").resized();
+	}
+	detach() {
+		this._container.remove();
+	}
+	clear() {
+		this._ensureDiagram().clear();
+	}
+	destroy() {
+		this._diagram &&= (this._diagram.destroy(), void 0), this._container.remove();
+	}
+	get container() {
+		return this._container;
+	}
+}, Je = "0123456789abcdefghijklmnopqrstuvwxyz", Ye = 252;
+function Xe() {
+	let e = "";
+	for (; e.length < 8;) for (let t of globalThis.crypto.getRandomValues(/* @__PURE__ */ new Uint8Array(8))) t >= Ye || e.length === 8 || (e += Je[t % 36]);
+	return e;
+}
+//#endregion
+//#region src/model/EventStormingElementFactory.ts
+var Ze = {
 	event: "event",
 	command: "cmd",
 	actor: "actor",
@@ -384,7 +577,7 @@ var L = {
 	hotspot: "hot",
 	note: "note",
 	drawing: "draw"
-}, Le = class {
+}, Qe = class {
 	elementFactory;
 	elementRegistry;
 	static $inject = ["elementFactory", "elementRegistry"];
@@ -403,15 +596,15 @@ var L = {
 		return `${e} ${n}`;
 	}
 	allocateId(e, t) {
-		let n = Ie[e];
-		for (let e = 1;; e++) {
-			let r = `${n}_${e}`;
-			if (!this.elementRegistry.get(r) && !t?.has(r)) return r;
+		let n = Ze[e];
+		for (;;) {
+			let e = `${n}_${Xe()}`;
+			if (!this.elementRegistry.get(e) && !t?.has(e)) return e;
 		}
 	}
 	createSticky(e) {
-		if (!T(e.elementType)) throw Error(`not a sticky kind: ${e.elementType}`);
-		let { width: t, height: n } = M[e.elementType];
+		if (!S(e.elementType)) throw Error(`not a sticky kind: ${e.elementType}`);
+		let { width: t, height: n } = A[e.elementType];
 		return this.elementFactory.createShape({
 			id: e.id,
 			x: e.position.x - t / 2,
@@ -425,7 +618,7 @@ var L = {
 		});
 	}
 	createNote(e) {
-		let { width: t, height: n } = e.size ?? F(e.label), r = e.align?.horizontal, i = e.align?.vertical;
+		let { width: t, height: n } = e.size ?? N(e.label), r = e.align?.horizontal, i = e.align?.vertical;
 		return this.elementFactory.createShape({
 			id: e.id,
 			x: e.position.x - t / 2,
@@ -470,7 +663,7 @@ var L = {
 		});
 	}
 	createNew(e, t) {
-		let n = this.uniqueLabel(t), { width: r, height: i } = T(e) ? M[e] : F(n);
+		let n = this.uniqueLabel(t), { width: r, height: i } = S(e) ? A[e] : N(n);
 		return this.elementFactory.createShape({
 			id: this.allocateId(e),
 			width: r,
@@ -480,7 +673,7 @@ var L = {
 		});
 	}
 	createProvisional() {
-		let { width: e, height: t } = M.event;
+		let { width: e, height: t } = A.event;
 		return this.elementFactory.createShape({
 			id: this.allocateId("event"),
 			width: e,
@@ -495,14 +688,14 @@ var L = {
 			id: e.id,
 			source: t,
 			target: n,
-			waypoints: [Re(t), Re(n)],
+			waypoints: [$e(t), $e(n)],
 			eventStormingType: "arrow",
 			...e.label ? { linkLabel: e.label } : {},
 			businessObject: e
 		});
 	}
 };
-function Re(e) {
+function $e(e) {
 	return {
 		x: e.x + e.width / 2,
 		y: e.y + e.height / 2
@@ -510,13 +703,13 @@ function Re(e) {
 }
 //#endregion
 //#region src/model/index.ts
-var ze = { eventStormingElementFactory: ["type", Le] };
+var et = { eventStormingElementFactory: ["type", Qe] };
 //#endregion
 //#region src/board-bounds/BoardBounds.ts
-function Be(e) {
+function tt(e) {
 	return e.id !== "event-storming-root" && !e.waypoints && typeof e.x == "number" && typeof e.y == "number" && typeof e.width == "number" && typeof e.height == "number";
 }
-var Ve = class {
+var nt = class {
 	elementRegistry;
 	static $inject = ["elementRegistry"];
 	constructor(e) {
@@ -527,23 +720,23 @@ var Ve = class {
 		if (!t.length) return {
 			x: 0,
 			y: 0,
-			...o
+			...i
 		};
-		let n = Math.min(...t.map((e) => e.x)), r = Math.min(...t.map((e) => e.y)), i = Math.max(...t.map((e) => e.x + e.width)), a = Math.max(...t.map((e) => e.y + e.height));
+		let n = Math.min(...t.map((e) => e.x)), r = Math.min(...t.map((e) => e.y)), a = Math.max(...t.map((e) => e.x + e.width)), o = Math.max(...t.map((e) => e.y + e.height));
 		return {
 			x: n - e,
 			y: r - e,
-			width: i - n + 2 * e,
-			height: a - r + 2 * e
+			width: a - n + 2 * e,
+			height: o - r + 2 * e
 		};
 	}
 	isEmpty() {
 		return this.positionedShapes().length === 0;
 	}
 	positionedShapes() {
-		return this.elementRegistry.getAll().filter(Be);
+		return this.elementRegistry.getAll().filter(tt);
 	}
-}, He = { boardBounds: ["type", Ve] }, Ue = "eventStorming.viewOptions.changed", We = class {
+}, rt = { boardBounds: ["type", nt] }, it = "eventStorming.viewOptions.changed", at = class {
 	eventBus;
 	elementRegistry;
 	static $inject = ["eventBus", "elementRegistry"];
@@ -556,103 +749,103 @@ var Ve = class {
 	}
 	setTypeCaptionsVisible(e) {
 		if (e === this._typeCaptionsVisible) return;
-		this._typeCaptionsVisible = e, this.eventBus.fire(Ue, { typeCaptionsVisible: e });
-		let t = this.elementRegistry.filter(E);
+		this._typeCaptionsVisible = e, this.eventBus.fire(it, { typeCaptionsVisible: e });
+		let t = this.elementRegistry.filter(C);
 		t.length && this.eventBus.fire("elements.changed", { elements: t });
 	}
-}, Ge = {
-	__depends__: [u],
-	eventStormingViewOptions: ["type", We]
-}, Ke = 1500, qe = -3, Je = "event-storming-kind-caption", Ye = 9, Xe = 300, Ze = L.stickyText, Qe = 7, $e = "#FBFBFB", et = "#B9B9B9", tt = "6 4", nt = "event-storming-sticky-shadow";
-function rt(e) {
+}, H = {
+	__depends__: [d],
+	eventStormingViewOptions: ["type", at]
+}, ot = 1500, st = -3, ct = "event-storming-kind-caption", lt = 9, ut = 300, dt = F.stickyText, ft = 7, pt = "#FBFBFB", mt = "#B9B9B9", ht = "6 4", gt = "event-storming-sticky-shadow";
+function _t(e) {
 	let t = e.closest("svg");
 	if (!t) return !1;
 	if (t.querySelector("#event-storming-sticky-shadow")) return !0;
-	let n = p(m("feDropShadow"), {
+	let n = m(h("feDropShadow"), {
 		dx: 0,
 		dy: 5,
 		stdDeviation: 5,
 		"flood-color": "#000000",
 		"flood-opacity": .2
-	}), r = p(m("filter"), {
-		id: nt,
+	}), r = m(h("filter"), {
+		id: gt,
 		x: "-40%",
 		y: "-40%",
 		width: "180%",
 		height: "180%"
 	});
-	f(r, n);
-	let i = m("defs");
-	return f(i, r), t.insertBefore(i, t.firstChild), !0;
+	p(r, n);
+	let i = h("defs");
+	return p(i, r), t.insertBefore(i, t.firstChild), !0;
 }
-var it = class extends d {
+var vt = class extends f {
 	viewOptions;
 	static $inject = ["eventBus", "eventStormingViewOptions"];
 	constructor(e, t) {
-		super(e, Ke), this.viewOptions = t;
+		super(e, ot), this.viewOptions = t;
 	}
 	canRender(e) {
-		return S(e) || C(e);
+		return y(e) || b(e);
 	}
 	drawShape(e, t) {
 		let n = t;
 		return n.eventStormingType === "drawing" ? this.drawDrawing(e, n) : this.drawSticky(e, n);
 	}
 	drawDrawing(e, t) {
-		let n = t.drawingPoints ?? [], r = t.strokeStyle === "dashed" ? "8 5" : t.strokeStyle === "dotted" ? "2 4" : void 0, i = p(m(t.closed ? "polygon" : "polyline"), {
+		let n = t.drawingPoints ?? [], r = t.strokeStyle === "dashed" ? "8 5" : t.strokeStyle === "dotted" ? "2 4" : void 0, i = m(h(t.closed ? "polygon" : "polyline"), {
 			points: n.map((e) => `${e.x},${e.y}`).join(" "),
 			fill: "none",
-			stroke: t.color ?? R,
+			stroke: t.color ?? I,
 			"stroke-width": 2,
 			"stroke-linecap": "round",
 			"stroke-linejoin": "round",
 			...r ? { "stroke-dasharray": r } : {}
 		});
-		return f(e, i), i;
+		return p(e, i), i;
 	}
 	drawSticky(e, t) {
-		let n = t.eventStormingType, r = T(n) ? M[n] : N, i = t.provisional === !0, a = e;
+		let n = t.eventStormingType, r = S(n) ? A[n] : j, i = t.provisional === !0, a = e;
 		if (n === "hotspot") {
-			let n = p(m("g"), { transform: `rotate(${qe} ${t.width / 2} ${t.height / 2})` });
-			f(e, n), a = n;
+			let n = m(h("g"), { transform: `rotate(${st} ${t.width / 2} ${t.height / 2})` });
+			p(e, n), a = n;
 		}
-		let o = p(m("rect"), {
+		let o = m(h("rect"), {
 			x: 0,
 			y: 0,
 			width: Math.max(t.width, 1),
 			height: Math.max(t.height, 1),
 			rx: 0,
-			fill: i ? $e : t.color ?? r.fill,
-			stroke: i ? et : r.stroke,
+			fill: i ? pt : t.color ?? r.fill,
+			stroke: i ? mt : r.stroke,
 			"stroke-width": 1.5,
-			...i ? { "stroke-dasharray": tt } : {}
+			...i ? { "stroke-dasharray": ht } : {}
 		});
-		if (rt(e) && o.setAttribute("filter", `url(#${nt})`), f(a, o), i) return o;
-		if (n === "note" ? lt(a, t) : ot(a, t), T(n) && this.viewOptions.typeCaptionsVisible()) {
-			let e = mt(M[n].label, t.width / 2, t.height - Qe, {
+		if (_t(e) && o.setAttribute("filter", `url(#${gt})`), p(a, o), i) return o;
+		if (n === "note" ? Ct(a, t) : bt(a, t), S(n) && this.viewOptions.typeCaptionsVisible()) {
+			let e = U(A[n].label, t.width / 2, t.height - ft, {
 				"text-anchor": "middle",
-				"font-size": Ye,
-				fill: Ze
+				"font-size": lt,
+				fill: dt
 			});
-			e.setAttribute("class", Je), e.setAttribute("font-weight", String(Xe)), f(a, e);
+			e.setAttribute("class", ct), e.setAttribute("font-weight", String(ut)), p(a, e);
 		}
 		return o;
 	}
 	drawConnection(e, t) {
-		let n = t, [r, i] = vt(n), a = p(m("polyline"), {
+		let n = t, [r, i] = At(n), a = m(h("polyline"), {
 			points: `${r.x},${r.y} ${i.x},${i.y}`,
 			fill: "none",
-			stroke: L.arrow,
+			stroke: F.arrow,
 			"stroke-width": 1.5,
 			"stroke-linecap": "round"
 		});
-		if (f(e, a), f(e, ht(r, i, L.arrow, 11, 5)), n.linkLabel) {
+		if (p(e, a), p(e, Ot(r, i, F.arrow, 11, 5)), n.linkLabel) {
 			let t = (r.x + i.x) / 2, a = (r.y + i.y) / 2;
-			f(e, mt(n.linkLabel, t, a - 5, {
+			p(e, U(n.linkLabel, t, a - 5, {
 				"text-anchor": "middle",
 				"font-size": 11,
 				"font-style": "italic",
-				fill: L.inkSoft
+				fill: F.inkSoft
 			}));
 		}
 		return a;
@@ -666,7 +859,7 @@ var it = class extends d {
 		return t ? `M${t.x},${t.y}` + n.map((e) => `L${e.x},${e.y}`).join("") : "";
 	}
 };
-function at(e, t) {
+function yt(e, t) {
 	let n = e.split(/\s+/).filter((e) => e.length);
 	if (!n.length) return [""];
 	let r = [], i = "";
@@ -683,25 +876,25 @@ function at(e, t) {
 	}
 	return r.push(i), r;
 }
-function ot(e, t) {
-	let n = t.width - 16, r = Math.max(1, Math.floor(n / P)), i = Math.max(1, Math.floor((t.height - 16) / 17)), a = (t.eventStormingLabel ?? "").split("\n").flatMap((e) => at(e, r)).slice(0, i), o = t.width / 2, s = t.height / 2 - (a.length - 1) * 17 / 2 + 4;
+function bt(e, t) {
+	let n = t.width - 16, r = Math.max(1, Math.floor(n / M)), i = Math.max(1, Math.floor((t.height - 16) / 17)), a = (t.eventStormingLabel ?? "").split("\n").flatMap((e) => yt(e, r)).slice(0, i), o = t.width / 2, s = t.height / 2 - (a.length - 1) * 17 / 2 + 4;
 	a.forEach((t, n) => {
-		f(e, mt(t, o, s + n * 17, {
+		p(e, U(t, o, s + n * 17, {
 			"text-anchor": "middle",
-			fill: L.stickyText
+			fill: F.stickyText
 		}));
 	});
 }
-var st = 2, ct = 12.5;
-function lt(e, t) {
-	let n = t.width - 16, r = Math.max(1, Math.floor(n / P)), i = Math.max(1, Math.floor((t.height - 16) / 17)), a = j(t.eventStormingLabel ?? "").flatMap((e) => ut(e, r)).slice(0, i), o = t.alignHorizontal ?? "left", s = t.alignVertical ?? "top", c = o === "left" ? "start" : o === "center" ? "middle" : "end", l = a.length * 17, u = s === "top" ? 8 : s === "middle" ? (t.height - l) / 2 : t.height - 8 - l;
+var xt = 2, St = 12.5;
+function Ct(e, t) {
+	let n = t.width - 16, r = Math.max(1, Math.floor(n / M)), i = Math.max(1, Math.floor((t.height - 16) / 17)), a = k(t.eventStormingLabel ?? "").flatMap((e) => wt(e, r)).slice(0, i), o = t.alignHorizontal ?? "left", s = t.alignVertical ?? "top", c = o === "left" ? "start" : o === "center" ? "middle" : "end", l = a.length * 17, u = s === "top" ? 8 : s === "middle" ? (t.height - l) / 2 : t.height - 8 - l;
 	a.forEach((n, r) => {
-		let i = o === "left" ? 8 + (n.indent ? 12 : 0) : o === "center" ? t.width / 2 : t.width - 8, a = p(m("text"), {
+		let i = o === "left" ? 8 + (n.indent ? 12 : 0) : o === "center" ? t.width / 2 : t.width - 8, a = m(h("text"), {
 			x: i,
-			y: u + r * 17 + ct,
-			"font-family": z.family,
-			"font-size": z.label,
-			fill: L.stickyText,
+			y: u + r * 17 + St,
+			"font-family": L.family,
+			"font-size": L.label,
+			fill: F.stickyText,
 			"text-anchor": c
 		}), s = n.marker ? [{
 			text: "• ",
@@ -709,25 +902,25 @@ function lt(e, t) {
 			italic: !1
 		}, ...n.runs] : n.runs;
 		for (let e of s) {
-			let t = m("tspan");
-			t.textContent = e.text, e.bold && t.setAttribute("font-weight", "600"), e.italic && t.setAttribute("font-style", "italic"), f(a, t);
+			let t = h("tspan");
+			t.textContent = e.text, e.bold && t.setAttribute("font-weight", "600"), e.italic && t.setAttribute("font-style", "italic"), p(a, t);
 		}
-		f(e, a);
+		p(e, a);
 	});
 }
-function ut(e, t) {
-	let n = Math.max(1, t - (e.bullet ? st : 0));
-	return dt(e.runs, n).map((t, n) => ({
+function wt(e, t) {
+	let n = Math.max(1, t - (e.bullet ? xt : 0));
+	return Tt(e.runs, n).map((t, n) => ({
 		runs: t,
 		marker: e.bullet && n === 0,
 		indent: e.bullet && n > 0
 	}));
 }
-function dt(e, t) {
+function Tt(e, t) {
 	let n = e.map((e) => e.text).join("");
-	return n.length <= t ? [e] : ft(n, t).map(([t, n]) => pt(e, t, n));
+	return n.length <= t ? [e] : Et(n, t).map(([t, n]) => Dt(e, t, n));
 }
-function ft(e, t) {
+function Et(e, t) {
 	let n = [...e.matchAll(/\S+/g)];
 	if (!n.length) return [[0, 0]];
 	let r = [], i = -1, a = -1, o = () => {
@@ -742,7 +935,7 @@ function ft(e, t) {
 	}
 	return o(), r;
 }
-function pt(e, t, n) {
+function Dt(e, t, n) {
 	let r = [], i = 0;
 	for (let a of e) {
 		let e = i;
@@ -756,32 +949,32 @@ function pt(e, t, n) {
 	}
 	return r;
 }
-function mt(e, t, n, r = {}) {
-	let i = p(m("text"), {
+function U(e, t, n, r = {}) {
+	let i = m(h("text"), {
 		x: t,
 		y: n,
-		"font-family": z.family,
-		"font-size": z.label,
-		fill: L.ink,
+		"font-family": L.family,
+		"font-size": L.label,
+		fill: F.ink,
 		...r
 	});
 	return i.textContent = e, i;
 }
-function ht(e, t, n, r = 10, i = 5) {
+function Ot(e, t, n, r = 10, i = 5) {
 	let a = Math.atan2(t.y - e.y, t.x - e.x), o = t.x - r * Math.cos(a), s = t.y - r * Math.sin(a), c = `${t.x},${t.y} ${o - i * Math.sin(a)},${s + i * Math.cos(a)} ${o + i * Math.sin(a)},${s - i * Math.cos(a)}`;
-	return p(m("polygon"), {
+	return m(h("polygon"), {
 		points: c,
 		fill: n
 	});
 }
-function gt(e) {
+function W(e) {
 	return {
 		x: e.x + e.width / 2,
 		y: e.y + e.height / 2
 	};
 }
-function _t(e, t) {
-	let n = gt(e), r = t.x - n.x, i = t.y - n.y;
+function kt(e, t) {
+	let n = W(e), r = t.x - n.x, i = t.y - n.y;
 	if (r === 0 && i === 0) return n;
 	let a = e.width / 2 + 2, o = e.height / 2 + 2, s = Math.min(r === 0 ? Infinity : a / Math.abs(r), i === 0 ? Infinity : o / Math.abs(i));
 	return {
@@ -789,7 +982,7 @@ function _t(e, t) {
 		y: n.y + i * s
 	};
 }
-function vt(e) {
+function At(e) {
 	let t = e.source, n = e.target, r = e.waypoints;
 	if (!t || !n) {
 		let e = r[0] ?? {
@@ -798,32 +991,34 @@ function vt(e) {
 		};
 		return [e, r[r.length - 1] ?? e];
 	}
-	let i = gt(t), a = gt(n), o = _t(t, a), s = _t(n, i);
+	let i = W(t), a = W(n), o = kt(t, a), s = kt(n, i);
 	return (a.x - i.x) * (s.x - o.x) + (a.y - i.y) * (s.y - o.y) <= 0 ? [i, a] : [o, s];
 }
 //#endregion
 //#region src/draw/index.ts
-var yt = {
-	__depends__: [Ge],
+var jt = {
+	__depends__: [H],
 	__init__: ["eventStormingRenderer"],
-	eventStormingRenderer: ["type", it]
-}, bt = { drawing: 0 }, xt = .001, St = class {
+	eventStormingRenderer: ["type", vt]
+}, Mt = { drawing: 0 }, Nt = .001, Pt = class {
 	canvas;
 	elementFactory;
 	factory;
 	boardBounds;
 	eventBus;
 	elementRegistry;
+	config;
 	static $inject = [
 		"canvas",
 		"elementFactory",
 		"eventStormingElementFactory",
 		"boardBounds",
 		"eventBus",
-		"elementRegistry"
+		"elementRegistry",
+		"config.eventStormingImporter"
 	];
-	constructor(e, t, n, r, i, a) {
-		this.canvas = e, this.elementFactory = t, this.factory = n, this.boardBounds = r, this.eventBus = i, this.elementRegistry = a;
+	constructor(e, t, n, r, i, a, o) {
+		this.canvas = e, this.elementFactory = t, this.factory = n, this.boardBounds = r, this.eventBus = i, this.elementRegistry = a, this.config = o;
 	}
 	import(e) {
 		let t = [];
@@ -833,7 +1028,7 @@ var yt = {
 			...e.rawPassthrough ? { rawPassthrough: e.rawPassthrough } : {}
 		}, r = this.boardRoot();
 		r.businessObject = n;
-		let i = /* @__PURE__ */ new Map(), a = [...e.elements].sort((e, t) => (bt[e.elementType] ?? 9) - (bt[t.elementType] ?? 9)), o = a.filter((e) => e.elementType === "drawing"), s = a.filter((e) => e.elementType !== "drawing");
+		let i = /* @__PURE__ */ new Map(), a = [...e.elements].sort((e, t) => (Mt[e.elementType] ?? 9) - (Mt[t.elementType] ?? 9)), o = a.filter((e) => e.elementType === "drawing"), s = a.filter((e) => e.elementType !== "drawing");
 		for (let e of o) {
 			let t = this.createShape(e);
 			this.canvas.addShape(t, r), i.set(e.id, t);
@@ -846,7 +1041,7 @@ var yt = {
 			let n = "attachedTo" in e ? e.attachedTo : void 0;
 			if (!n) continue;
 			let r = i.get(n);
-			!r || !Ce(r) ? t.push({
+			!r || !E(r) ? t.push({
 				message: `“${e.id}” is pinned to “${n}”, which isn't on the board or can't hold a pin. It stays unpinned.`,
 				elementId: e.id
 			}) : i.get(e.id).host = r;
@@ -863,11 +1058,11 @@ var yt = {
 			let s = this.factory.createArrow(n, e, a);
 			this.canvas.addConnection(s, r, o.length);
 		}
-		return this.fitToContent(), this.eventBus.fire("import.render.done", { warnings: t }), t;
+		return this.config?.fitOnImport !== !1 && this.fitToContent(), this.eventBus.fire("import.render.done", { warnings: t }), t;
 	}
 	boardRoot() {
-		let e = this.elementRegistry.get(x);
-		e || (e = this.elementFactory.createRoot({ id: x }), this.canvas.setRootElement(e));
+		let e = this.elementRegistry.get(v);
+		e || (e = this.elementFactory.createRoot({ id: v }), this.canvas.setRootElement(e));
 		for (let t of this.canvas.getRootElements()) t !== e && this.canvas.removeRootElement(t);
 		return e;
 	}
@@ -877,7 +1072,7 @@ var yt = {
 			this.canvas.viewbox(e);
 			return;
 		}
-		let r = this.boardBounds.isEmpty() ? 1 : Math.max(Math.min(t / e.width, n / e.height, 1), xt);
+		let r = this.boardBounds.isEmpty() ? 1 : Math.max(Math.min(t / e.width, n / e.height, 1), Nt);
 		this.canvas.viewbox({
 			x: e.x + e.width / 2 - t / 2 / r,
 			y: e.y + e.height / 2 - n / 2 / r,
@@ -902,35 +1097,35 @@ var yt = {
 			} catch {}
 		}
 	}
-}, Ct = class {
+}, Ft = class {
 	elementRegistry;
 	static $inject = ["elementRegistry"];
 	constructor(e) {
 		this.elementRegistry = e;
 	}
 	export() {
-		let e = this.elementRegistry.get(x)?.businessObject, t = e?.config ?? { title: "Untitled Board" }, n = [], r = [];
+		let e = this.elementRegistry.get(v)?.businessObject, t = e?.config ?? { title: "Untitled Board" }, r = [], i = [];
 		for (let e of this.elementRegistry.getAll()) if (e.id !== "event-storming-root") {
-			if (C(e)) r.push({
+			if (b(e)) i.push({
 				id: e.id,
 				edgeType: "arrow",
 				from: e.source?.id ?? "",
 				to: e.target?.id ?? "",
 				...e.linkLabel ? { label: e.linkLabel } : {}
 			});
-			else if (S(e)) {
+			else if (y(e)) {
 				let t = this.buildElement(e);
-				t && n.push(t);
+				t && r.push(t);
 			}
 		}
 		let a = {
-			schemaVersion: i,
+			schemaVersion: n,
 			config: t,
-			elements: n,
-			edges: r,
+			elements: r,
+			edges: i,
 			...e?.rawPassthrough ? { rawPassthrough: e.rawPassthrough } : {}
 		};
-		return l(a);
+		return c(a);
 	}
 	buildElement(e) {
 		if (e.eventStormingType === "drawing") {
@@ -949,10 +1144,10 @@ var yt = {
 				...e.color ? { color: e.color } : {}
 			};
 		}
-		let t = e.eventStormingType === "note" && I(e.eventStormingLabel, e) ? {
+		let t = e.eventStormingType === "note" && P(e.eventStormingLabel, e) ? {
 			width: e.width,
 			height: e.height
-		} : void 0, n = e.eventStormingType === "note" ? wt(e) : void 0;
+		} : void 0, n = e.eventStormingType === "note" ? It(e) : void 0;
 		return {
 			id: e.id,
 			elementType: e.eventStormingType,
@@ -968,7 +1163,7 @@ var yt = {
 		};
 	}
 };
-function wt(e) {
+function It(e) {
 	let t = e.alignHorizontal && e.alignHorizontal !== "left" ? e.alignHorizontal : void 0, n = e.alignVertical && e.alignVertical !== "top" ? e.alignVertical : void 0;
 	if (t || n) return {
 		...t ? { horizontal: t } : {},
@@ -977,62 +1172,62 @@ function wt(e) {
 }
 //#endregion
 //#region src/io/warnings.ts
-function Tt(e) {
+function Lt(e) {
 	return e.source === void 0 ? e.message : `${e.message} (“${e.source}”)`;
 }
 //#endregion
 //#region src/io/index.ts
-var Et = {
-	eventStormingImporter: ["type", St],
-	eventStormingExporter: ["type", Ct]
-}, Dt = class extends De {
+var Rt = {
+	eventStormingImporter: ["type", Pt],
+	eventStormingExporter: ["type", Ft]
+}, zt = class extends qe {
 	_getModules() {
 		return [
-			ze,
-			He,
-			Ge,
-			yt,
-			Et
+			et,
+			rt,
+			H,
+			jt,
+			Rt
 		];
 	}
-}, B = class extends Dt {
+}, Bt = class extends zt {
 	_getModules() {
 		return [
 			...super._getModules(),
-			g,
 			_,
-			v,
-			ee
+			ee,
+			te,
+			ne
 		];
 	}
-}, Ot = class extends le {
+}, Vt = class extends pe {
 	static $inject = ["eventBus", "modeling"];
 	constructor(e, t) {
 		super(e), this.preExecute("element.updateProperties", (e) => {
 			let { element: n, properties: r } = e.context, i = r.eventStormingType;
 			if (typeof i != "string") return;
 			let a = n;
-			if (a.host && !D(i) && t.updateAttachment(a, void 0), a.attachers?.length && !O(i)) for (let e of [...a.attachers]) t.updateAttachment(e, void 0);
+			if (a.host && !w(i) && t.updateAttachment(a, void 0), a.attachers?.length && !T(i)) for (let e of [...a.attachers]) t.updateAttachment(e, void 0);
 		});
 	}
-}, kt = {
-	__depends__: [ce],
+}, Ht = {
+	__depends__: [fe],
 	__init__: ["eventStormingAttachBehavior"],
-	eventStormingAttachBehavior: ["type", Ot]
+	eventStormingAttachBehavior: ["type", Vt]
 };
 //#endregion
 //#region src/modeling/cmd/UpdatePropertiesHandler.ts
-function At(e, t, n) {
+function Ut(e, t, n) {
 	n === void 0 ? delete e[t] : e[t] = n;
 }
-var jt = [
+var Wt = [
 	"x",
 	"y",
 	"width",
 	"height"
 ];
-function Mt(e, t) {
-	if (!t.some((e) => jt.includes(e))) return [e];
+function Gt(e, t) {
+	if (!t.some((e) => Wt.includes(e))) return [e];
 	let n = e;
 	return [
 		e,
@@ -1040,18 +1235,18 @@ function Mt(e, t) {
 		...n.outgoing ?? []
 	];
 }
-var Nt = class {
+var Kt = class {
 	execute(e) {
 		let { element: t, properties: n } = e, r = t, i = {};
-		for (let e of Object.keys(n)) i[e] = r[e], At(r, e, n[e]);
-		return e.oldProperties = i, Mt(t, Object.keys(n));
+		for (let e of Object.keys(n)) i[e] = r[e], Ut(r, e, n[e]);
+		return e.oldProperties = i, Gt(t, Object.keys(n));
 	}
 	revert(e) {
 		let { element: t, oldProperties: n } = e, r = t;
-		if (n) for (let e of Object.keys(n)) At(r, e, n[e]);
-		return Mt(t, Object.keys(n ?? {}));
+		if (n) for (let e of Object.keys(n)) Ut(r, e, n[e]);
+		return Gt(t, Object.keys(n ?? {}));
 	}
-}, V = "element.updateProperties", Pt = class {
+}, qt = "element.updateProperties", Jt = class {
 	commandStack;
 	canvas;
 	elementRegistry;
@@ -1061,17 +1256,17 @@ var Nt = class {
 		"elementRegistry"
 	];
 	constructor(e, t, n) {
-		this.commandStack = e, this.canvas = t, this.elementRegistry = n, e.registerHandler(V, Nt);
+		this.commandStack = e, this.canvas = t, this.elementRegistry = n, e.registerHandler(qt, Kt);
 	}
 	updateProperties(e, t) {
-		this.commandStack.execute(V, {
+		this.commandStack.execute(qt, {
 			element: e,
 			properties: t
 		});
 	}
 	updateLabel(e, t) {
-		if (e.eventStormingType === "note" && !I(e.eventStormingLabel, e)) {
-			let { width: n, height: r } = F(t), i = e.x + e.width / 2, a = e.y + e.height / 2;
+		if (e.eventStormingType === "note" && !P(e.eventStormingLabel, e)) {
+			let { width: n, height: r } = N(t), i = e.x + e.width / 2, a = e.y + e.height / 2;
 			this.updateProperties(e, {
 				eventStormingLabel: t,
 				width: n,
@@ -1082,9 +1277,9 @@ var Nt = class {
 		} else this.updateProperties(e, { eventStormingLabel: t });
 	}
 	setStickyKind(e, t) {
-		if (!T(e.eventStormingType) || !T(t)) throw Error("setStickyKind: only sticky kinds can be retyped");
+		if (!S(e.eventStormingType) || !S(t)) throw Error("setStickyKind: only sticky kinds can be retyped");
 		if (e.eventStormingType === t && !e.provisional) return;
-		let { width: n, height: r } = M[t], i = e.x + e.width / 2, a = e.y + e.height / 2;
+		let { width: n, height: r } = A[t], i = e.x + e.width / 2, a = e.y + e.height / 2;
 		this.updateProperties(e, {
 			eventStormingType: t,
 			...e.provisional ? { provisional: void 0 } : {},
@@ -1101,12 +1296,12 @@ var Nt = class {
 		this.updateProperties(e, { strokeStyle: t });
 	}
 	getLevel() {
-		return this.elementRegistry.get("event-storming-root")?.businessObject?.config.level ?? a;
+		return this.elementRegistry.get("event-storming-root")?.businessObject?.config.level ?? r;
 	}
 	setLevel(e) {
 		if (this.getLevel() === e) return;
 		let t = this.root(), n = t.businessObject ?? { config: { title: "Untitled Board" } };
-		this.commandStack.execute(V, {
+		this.commandStack.execute(qt, {
 			element: t,
 			properties: { businessObject: {
 				...n,
@@ -1120,7 +1315,7 @@ var Nt = class {
 	root() {
 		return this.elementRegistry.get("event-storming-root") ?? this.canvas.getRootElement();
 	}
-}, Ft = 24, It = [
+}, Yt = 24, Xt = [
 	"eventStormingType",
 	"color",
 	"drawingPoints",
@@ -1128,8 +1323,8 @@ var Nt = class {
 	"strokeStyle",
 	"alignHorizontal",
 	"alignVertical"
-], Lt = ["eventStormingType", "linkLabel"];
-function Rt(e, t) {
+], Zt = ["eventStormingType", "linkLabel"];
+function Qt(e, t) {
 	let n = {};
 	for (let r of t) {
 		let t = e[r];
@@ -1137,7 +1332,7 @@ function Rt(e, t) {
 	}
 	return n;
 }
-var zt = class {
+var $t = class {
 	selection;
 	modeling;
 	elementFactory;
@@ -1160,23 +1355,23 @@ var zt = class {
 		this.selection = e, this.modeling = t, this.elementFactory = n, this.esFactory = r, this.canvas = i, this.create = a, this.mouse = o;
 	}
 	copy() {
-		let e = this.selection.get().filter((e) => S(e));
+		let e = this.selection.get().filter((e) => y(e));
 		if (!e.length) return !1;
 		let t = new Map(e.map((e, t) => [e, t])), n = [], r = /* @__PURE__ */ new Set();
 		for (let i of e) for (let e of [...i.incoming ?? [], ...i.outgoing ?? []]) {
-			if (!C(e) || r.has(e)) continue;
+			if (!b(e) || r.has(e)) continue;
 			let i = t.get(e.source), a = t.get(e.target);
 			i !== void 0 && a !== void 0 && (r.add(e), n.push({
 				sourceIdx: i,
 				targetIdx: a,
-				props: Rt(e, Lt)
+				props: Qt(e, Zt)
 			}));
 		}
 		return this.clipboard = {
 			shapes: e.map((e) => {
 				let n = e.host ? t.get(e.host) : void 0;
 				return {
-					props: Rt(e, It),
+					props: Qt(e, Xt),
 					x: e.x,
 					y: e.y,
 					width: e.width,
@@ -1217,26 +1412,26 @@ var zt = class {
 				...structuredClone(e.props),
 				source: n[e.sourceIdx],
 				target: n[e.targetIdx],
-				waypoints: [Bt(n[e.sourceIdx]), Bt(n[e.targetIdx])]
+				waypoints: [en(n[e.sourceIdx]), en(n[e.targetIdx])]
 			}))
 		};
 	}
 	insertWithOffset(e) {
 		this.pasteCount++;
-		let t = Ft * this.pasteCount, n = Vt(e.shapes), r = this.modeling.createElements([...e.shapes, ...e.connections], {
+		let t = Yt * this.pasteCount, n = tn(e.shapes), r = this.modeling.createElements([...e.shapes, ...e.connections], {
 			x: n.cx + t,
 			y: n.cy + t
 		}, this.canvas.getRootElement());
 		return this.selection.select(r), !0;
 	}
 };
-function Bt(e) {
+function en(e) {
 	return {
 		x: e.x + e.width / 2,
 		y: e.y + e.height / 2
 	};
 }
-function Vt(e) {
+function tn(e) {
 	let t = Math.min(...e.map((e) => e.x)), n = Math.min(...e.map((e) => e.y)), r = Math.max(...e.map((e) => e.x + e.width)), i = Math.max(...e.map((e) => e.y + e.height));
 	return {
 		cx: (t + r) / 2,
@@ -1245,13 +1440,13 @@ function Vt(e) {
 }
 //#endregion
 //#region src/modeling/index.ts
-var Ht = {
-	__depends__: [ue, b],
+var nn = {
+	__depends__: [me, ae],
 	__init__: ["eventStormingModeling"],
-	eventStormingModeling: ["type", Pt],
-	eventStormingCopyPaste: ["type", zt]
-}, Ut = {
-	__depends__: [de],
+	eventStormingModeling: ["type", Jt],
+	eventStormingCopyPaste: ["type", $t]
+}, rn = {
+	__depends__: [he],
 	__init__: ["eventStormingLassoBehavior"],
 	eventStormingLassoBehavior: ["type", class {
 		static $inject = [
@@ -1276,43 +1471,43 @@ var Ht = {
 };
 //#endregion
 //#region src/rules/EventStormingRules.ts
-function Wt(e, t) {
+function an(e, t) {
 	return (e.outgoing ?? []).some((e) => e.target === t);
 }
-function Gt(e, t) {
-	return e.length !== 1 || !Se(e[0]) || !Ce(t) ? !1 : "attach";
+function on(e, t) {
+	return e.length !== 1 || !Ee(e[0]) || !E(t) ? !1 : "attach";
 }
-var Kt = class extends fe {
+var sn = class extends ge {
 	static $inject = ["eventBus"];
 	constructor(e) {
 		super(e);
 	}
 	init() {
-		this.addRule("connection.start", (e) => E(e.source)), this.addRule("connection.create", (e) => {
+		this.addRule("connection.start", (e) => C(e.source)), this.addRule("connection.create", (e) => {
 			let { source: t, target: n } = e;
-			return !E(t) || !E(n) || t === n || Wt(t, n) ? !1 : { eventStormingType: "arrow" };
-		}), this.addRule(["shape.move", "elements.move"], (e) => Gt(e.shapes ?? (e.shape ? [e.shape] : []), e.target) || !0), this.addRule("shape.create", () => !0), this.addRule("elements.create", () => !0), this.addRule("shape.resize", (e) => {
-			if (!we(e.shape)) return !1;
+			return !C(t) || !C(n) || t === n || an(t, n) ? !1 : { eventStormingType: "arrow" };
+		}), this.addRule(["shape.move", "elements.move"], (e) => on(e.shapes ?? (e.shape ? [e.shape] : []), e.target) || !0), this.addRule("shape.create", () => !0), this.addRule("elements.create", () => !0), this.addRule("shape.resize", (e) => {
+			if (!De(e.shape)) return !1;
 			let { newBounds: t } = e;
 			return !t || t.width >= Pe.width && t.height >= Pe.height;
 		});
 	}
-}, qt = {
+}, cn = {
 	__init__: ["eventStormingRules"],
-	eventStormingRules: ["type", Kt]
-}, Jt = 8, Yt = {
+	eventStormingRules: ["type", sn]
+}, ln = 8, un = {
 	__init__: ["elementSnapping"],
 	elementSnapping: ["type", class {
 		static $inject = ["eventBus", "elementRegistry"];
 		constructor(e, t) {
-			let n = (e) => t.getAll().filter((t) => S(t) && t.eventStormingType !== "drawing" && !e.has(t.id)).map((e) => ({
+			let n = (e) => t.getAll().filter((t) => y(t) && t.eventStormingType !== "drawing" && !e.has(t.id)).map((e) => ({
 				x: e.x + e.width / 2,
 				y: e.y + e.height / 2
 			})), r = (e, t) => {
 				let n, r = 9;
 				for (let i of t) {
 					let t = Math.abs(i - e);
-					t <= Jt && t < r && (n = i, r = t);
+					t <= ln && t < r && (n = i, r = t);
 				}
 				return n;
 			};
@@ -1344,177 +1539,7 @@ var Kt = class extends fe {
 			});
 		}
 	}]
-}, Xt = (e) => `<svg width="24" height="24" viewBox="0 0 24 24" class="event-storming-palette-svg">${e}</svg>`, Zt = (e, t, n = 0) => Xt(`<rect x="4" y="5" width="16" height="14" fill="${e}" stroke="${t}" stroke-width="1.5"${n ? ` transform="rotate(${n} 12 12)"` : ""}/>`), Qt = (e) => `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false" class="event-storming-palette-svg">${e}</svg>`, H = {
-	draw: Qt("<circle cx=\"19\" cy=\"5\" r=\"2\"/><circle cx=\"5\" cy=\"19\" r=\"2\"/><path d=\"M6.5 17.5 17.5 6.5\"/>"),
-	lasso: Qt("<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\"/><path d=\"M5 21a2 2 0 0 1-2-2\"/><path d=\"M9 3h1\"/><path d=\"M9 21h2\"/><path d=\"M14 3h1\"/><path d=\"M3 9v1\"/><path d=\"M21 9v2\"/><path d=\"M3 14v1\"/>"),
-	note: Zt(N.fill, N.stroke)
-};
-for (let e of w) {
-	let t = M[e];
-	H[e] = Zt(t.fill, t.stroke, e === "hotspot" ? -6 : 0);
-}
-function $t(e, t) {
-	return `<svg width="14" height="14" viewBox="0 0 14 14" class="event-storming-palette-svg"><rect x="1" y="1" width="12" height="12" fill="${e}" stroke="${t}" stroke-width="1"/></svg>`;
-}
-//#endregion
-//#region src/palette/EventStormingPaletteProvider.ts
-var en = 24, U = "stickies-1", W = "stickies-2", tn = "stickies-3", nn = [
-	{
-		key: "event",
-		type: "event",
-		label: M.event.label,
-		title: "Domain event",
-		shortcut: "E",
-		group: U
-	},
-	{
-		key: "command",
-		type: "command",
-		label: M.command.label,
-		title: "Command",
-		shortcut: "C",
-		group: U
-	},
-	{
-		key: "actor",
-		type: "actor",
-		label: M.actor.label,
-		title: "Actor",
-		group: U
-	},
-	{
-		key: "aggregate",
-		type: "aggregate",
-		label: M.aggregate.label,
-		title: "Aggregate",
-		group: U
-	},
-	{
-		key: "policy",
-		type: "policy",
-		label: M.policy.label,
-		title: "Policy",
-		group: W
-	},
-	{
-		key: "readmodel",
-		type: "readmodel",
-		label: M.readmodel.label,
-		title: "Read model",
-		group: W
-	},
-	{
-		key: "external",
-		type: "external",
-		label: M.external.label,
-		title: "External system",
-		group: W
-	},
-	{
-		key: "hotspot",
-		type: "hotspot",
-		label: M.hotspot.label,
-		title: "Hotspot",
-		group: tn
-	},
-	{
-		key: "note",
-		type: "note",
-		label: N.label,
-		title: "Note",
-		group: tn
-	}
-], rn = class {
-	create;
-	factory;
-	lassoTool;
-	drawTool;
-	eventStormingModeling;
-	canvas;
-	modeling;
-	selection;
-	elementRegistry;
-	labelEditing;
-	config;
-	static $inject = [
-		"palette",
-		"create",
-		"eventStormingElementFactory",
-		"lassoTool",
-		"eventStormingDrawTool",
-		"eventStormingModeling",
-		"eventBus",
-		"canvas",
-		"modeling",
-		"selection",
-		"elementRegistry",
-		"eventStormingLabelEditing",
-		"config.eventStormingPalette"
-	];
-	constructor(e, t, n, r, i, a, o, s, c, l, u, d, f) {
-		this.create = t, this.factory = n, this.lassoTool = r, this.drawTool = i, this.eventStormingModeling = a, this.canvas = s, this.modeling = c, this.selection = l, this.elementRegistry = u, this.labelEditing = d, this.config = f, e.registerProvider(this);
-		let p = () => e._rebuild();
-		o.on("import.done", p), o.on(["commandStack.element.updateProperties.postExecuted", "commandStack.element.updateProperties.reverted"], (e) => {
-			e.context.element.id === "event-storming-root" && p();
-		});
-	}
-	getPaletteEntries() {
-		let e = {};
-		e["lasso-tool"] = {
-			group: "tools",
-			title: "Lasso",
-			shortcut: "L",
-			html: `<div class="entry event-storming-palette-entry">${H.lasso}</div>`,
-			action: { click: (e) => this.lassoTool.activateSelection(e) }
-		}, e["draw-tool"] = {
-			group: "tools",
-			title: "Draw",
-			html: `<div class="entry event-storming-palette-entry">${H.draw}</div>`,
-			action: { click: () => this.drawTool.toggle() }
-		};
-		let t = c[this.eventStormingModeling.getLevel()];
-		for (let n of nn) {
-			if (n.type !== "note" && !t.includes(n.type)) continue;
-			let r = (e) => {
-				let t = this.factory.createNew(n.type, n.label);
-				an(e) && this.placeInFreeRect(t) || this.create.start(e, t);
-			};
-			e[`create.${n.key}`] = {
-				group: n.group,
-				title: n.title,
-				...n.shortcut ? { shortcut: n.shortcut } : {},
-				html: `<div class="entry event-storming-palette-entry" draggable="true">${H[n.key]}</div>`,
-				action: {
-					dragstart: r,
-					click: r
-				}
-			};
-		}
-		return e;
-	}
-	placeInFreeRect(e) {
-		let { canvas: t, modeling: n, selection: r, elementRegistry: i } = this;
-		if (!t || !n || !r || !i) return !1;
-		let a = t.viewbox(), o = this.config?.freeRectInsets?.() ?? {
-			top: 0,
-			right: 0,
-			bottom: 0,
-			left: 0
-		}, s = Math.max(0, a.outer.width - o.left - o.right), c = Math.max(0, a.outer.height - o.top - o.bottom), l = {
-			x: a.x + (o.left + s / 2) / a.scale,
-			y: a.y + (o.top + c / 2) / a.scale
-		}, u = (e) => i.filter(S).some((t) => Math.abs(t.x + t.width / 2 - e.x) < 1 && Math.abs(t.y + t.height / 2 - e.y) < 1);
-		for (; u(l);) l.x += en, l.y += en;
-		let d = n.createShape(e, l, t.getRootElement());
-		return r.select(d), t.focus(), this.labelEditing?.activate(d), !0;
-	}
-};
-function an(e) {
-	return e.type === "click" && e.detail === 0;
-}
-//#endregion
-//#region src/palette/EventStormingPaletteTooltip.ts
-var on = ".djs-palette-entries .entry", sn = "bottom", cn = class {
+}, dn = ".djs-palette-entries .entry", fn = "bottom", pn = class {
 	palette;
 	hoverTooltip;
 	static $inject = [
@@ -1529,9 +1554,9 @@ var on = ".djs-palette-entries .entry", sn = "bottom", cn = class {
 	attachTo(e) {
 		this.refreshEntries(), this.hoverTooltip.add({
 			container: e,
-			selector: on,
+			selector: dn,
 			getContent: (e) => this.contentFor(e),
-			getPosition: (e) => ln(e)
+			getPosition: (e) => mn(e)
 		});
 	}
 	refreshEntries() {
@@ -1539,31 +1564,31 @@ var on = ".djs-palette-entries .entry", sn = "bottom", cn = class {
 	}
 	contentFor(e) {
 		let t = this.entries[e.getAttribute("data-action") ?? ""];
-		return t?.title ? me`<${pe} title=${t.title} shortcut=${t.shortcut} />` : null;
+		return t?.title ? ve`<${_e} title=${t.title} shortcut=${t.shortcut} />` : null;
 	}
 };
-function ln(e) {
+function mn(e) {
 	let t = e.getBoundingClientRect();
 	return {
 		x: t.left + t.width / 2,
 		y: t.bottom + 8,
-		placement: sn
+		placement: fn
 	};
 }
 //#endregion
 //#region src/palette/index.ts
-var un = {
+var hn = {
 	__init__: ["eventStormingPaletteProvider", "paletteTooltip"],
-	eventStormingPaletteProvider: ["type", rn],
-	paletteTooltip: ["type", cn]
-}, G = "event-storming-element-settings", dn = {
+	eventStormingPaletteProvider: ["type", Ue],
+	paletteTooltip: ["type", pn]
+}, G = "event-storming-element-settings", gn = {
 	id: "kind",
 	name: "Change type"
 };
-function fn(e, t) {
+function _n(e, t) {
 	return e ? `✓ ${t}` : t;
 }
-var pn = class {
+var vn = class {
 	modeling;
 	static $inject = ["popupMenu", "eventStormingModeling"];
 	constructor(e, t) {
@@ -1571,26 +1596,26 @@ var pn = class {
 	}
 	getPopupMenuEntries(e) {
 		let t = Array.isArray(e) ? e[0] : e;
-		return E(t) ? this.kindEntries(t) : {};
+		return C(t) ? this.kindEntries(t) : {};
 	}
 	kindEntries(e) {
-		let t = {}, n = e.provisional === !0, r = c[this.modeling.getLevel()];
-		for (let i of w) {
+		let t = {}, n = e.provisional === !0, r = o[this.modeling.getLevel()];
+		for (let i of x) {
 			if (!r.includes(i) && (n || i !== e.eventStormingType)) continue;
-			let a = M[i];
+			let a = A[i];
 			t[`kind-${i}`] = {
-				label: n ? a.label : fn(e.eventStormingType === i, a.label),
-				imageHtml: $t(a.fill, a.stroke),
-				group: dn,
+				label: n ? a.label : _n(e.eventStormingType === i, a.label),
+				imageHtml: ze(a.fill, a.stroke),
+				group: gn,
 				action: () => this.modeling.setStickyKind(e, i)
 			};
 		}
 		return t;
 	}
-}, mn = {
+}, yn = {
 	__init__: ["eventStormingElementSettings"],
-	eventStormingElementSettings: ["type", pn]
-}, K = "eventStorming.readOnly.changed", hn = 5e3, gn = [
+	eventStormingElementSettings: ["type", vn]
+}, K = "eventStorming.readOnly.changed", bn = 5e3, xn = [
 	"elements.move",
 	"shape.move",
 	"shape.resize",
@@ -1603,7 +1628,7 @@ var pn = class {
 	"connection.reconnect",
 	"connection.updateWaypoints",
 	"elements.delete"
-], _n = class extends fe {
+], Sn = class extends ge {
 	bus;
 	static $inject = ["eventBus"];
 	readOnly = !1;
@@ -1611,7 +1636,7 @@ var pn = class {
 		super(e), this.bus = e;
 	}
 	init() {
-		this.addRule(gn, hn, () => !this.readOnly && void 0);
+		this.addRule(xn, bn, () => !this.readOnly && void 0);
 	}
 	isReadOnly() {
 		return this.readOnly;
@@ -1619,11 +1644,11 @@ var pn = class {
 	setReadOnly(e) {
 		this.readOnly !== e && (this.readOnly = e, this.bus.fire(K, { readOnly: e }));
 	}
-}, vn = {
-	__depends__: [ae],
+}, Cn = {
+	__depends__: [le],
 	__init__: ["eventStormingReadOnly"],
-	eventStormingReadOnly: ["type", _n]
-}, yn = {
+	eventStormingReadOnly: ["type", Sn]
+}, wn = {
 	plus: "<path d=\"M5 12h14\"/><path d=\"M12 5v14\"/>",
 	"arrow-right": "<path d=\"M5 12h14\"/><path d=\"m12 5 7 7-7 7\"/>",
 	pencil: "<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\"/>",
@@ -1643,17 +1668,17 @@ var pn = class {
 	x: "<path d=\"M18 6 6 18\"/><path d=\"m6 6 12 12\"/>"
 };
 function q(e) {
-	return `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">${yn[e]}</svg>`;
+	return `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">${wn[e]}</svg>`;
 }
 //#endregion
 //#region src/context-pad/EventStormingContextPadProvider.ts
-var bn = "Append sticky (auto-connect, choose the type after placing)";
+var Tn = "Append sticky (auto-connect, choose the type after placing)";
 function J(e, t, n = !1) {
 	return `<div class="entry event-storming-cp-entry"${n ? " draggable=\"true\"" : ""} title="${t}">${q(e)}</div>`;
 }
 //#endregion
 //#region src/context-pad/index.ts
-var xn = {
+var En = {
 	__init__: ["eventStormingContextPadProvider"],
 	eventStormingContextPadProvider: ["type", class {
 		modeling;
@@ -1685,7 +1710,7 @@ var xn = {
 		}
 		getContextPadEntries(e) {
 			if (this.readOnly?.isReadOnly()) return {};
-			if (C(e)) {
+			if (b(e)) {
 				let t = e;
 				return {
 					"edit-label": {
@@ -1702,17 +1727,17 @@ var xn = {
 					}
 				};
 			}
-			if (!S(e)) return {};
+			if (!y(e)) return {};
 			let t = e, n = {}, r = t.eventStormingType;
-			if (T(r)) {
+			if (S(r)) {
 				let e = (e) => {
 					let n = this.factory.createProvisional();
 					this.create.start(e, n, { source: t });
 				};
 				n.append = {
 					group: "append",
-					title: bn,
-					html: J("plus", bn, !0),
+					title: Tn,
+					html: J("plus", Tn, !0),
 					action: {
 						click: e,
 						dragstart: e
@@ -1772,36 +1797,36 @@ var xn = {
 			}, n;
 		}
 	}]
-}, Sn = "bullet", Cn = [
+}, Dn = "bullet", On = [
 	"left",
 	"center",
 	"right"
-], wn = [
+], kn = [
 	"top",
 	"middle",
 	"bottom"
 ];
-function Tn(e, t) {
+function An(e, t) {
 	return e[(e.indexOf(t) + 1) % e.length];
 }
-function En(e, t) {
+function jn(e, t) {
 	let n = e.ownerDocument;
 	e.textContent = "";
-	for (let r of j(t)) {
+	for (let r of k(t)) {
 		let t = n.createElement("div");
-		r.bullet && (t.className = Sn);
+		r.bullet && (t.className = Dn);
 		for (let e of r.runs) {
 			let r = n.createTextNode(e.text);
-			e.italic && (r = Dn(n, "i", r)), e.bold && (r = Dn(n, "b", r)), t.appendChild(r);
+			e.italic && (r = Mn(n, "i", r)), e.bold && (r = Mn(n, "b", r)), t.appendChild(r);
 		}
 		r.runs.length === 0 && t.appendChild(n.createElement("br")), e.appendChild(t);
 	}
 }
-function Dn(e, t, n) {
+function Mn(e, t, n) {
 	let r = e.createElement(t);
 	return r.appendChild(n), r;
 }
-function On(e) {
+function Nn(e) {
 	let t = [], n = null, r = (e) => (n = {
 		bullet: e,
 		runs: []
@@ -1822,11 +1847,11 @@ function On(e) {
 			s.nextSibling && r(!1);
 			return;
 		}
-		if (kn(s.tagName)) {
+		if (Pn(s.tagName)) {
 			a(s);
 			return;
 		}
-		let c = An(s, t, o);
+		let c = Fn(s, t, o);
 		for (let e of s.childNodes) i(e, c.bold, c.italic);
 	}, a = (e) => {
 		r(e.classList.contains("bullet") || e.tagName === "LI");
@@ -1836,10 +1861,10 @@ function On(e) {
 	for (let t of e.childNodes) i(t, !1, !1);
 	return ke(t);
 }
-function kn(e) {
+function Pn(e) {
 	return e === "DIV" || e === "P" || e === "LI";
 }
-function An(e, t, n) {
+function Fn(e, t, n) {
 	let r = e.tagName;
 	(r === "B" || r === "STRONG") && (t = !0), (r === "I" || r === "EM") && (n = !0);
 	let i = e.style.fontWeight;
@@ -1850,13 +1875,13 @@ function An(e, t, n) {
 		italic: n
 	};
 }
-function jn(e) {
+function In(e) {
 	let t = e.ownerDocument, n = t.getSelection();
 	if (!n) return;
 	let r = t.createRange();
 	r.selectNodeContents(e), n.removeAllRanges(), n.addRange(r);
 }
-function Mn(e, t) {
+function Ln(e, t) {
 	let n = e.ownerDocument;
 	if (typeof n.execCommand == "function" && n.execCommand("insertText", !1, t)) return;
 	let r = n.getSelection();
@@ -1867,24 +1892,24 @@ function Mn(e, t) {
 	let a = n.createTextNode(t);
 	i.insertNode(a), i.setStartAfter(a), i.collapse(!0), r.removeAllRanges(), r.addRange(i);
 }
-function Nn(e) {
+function Rn(e) {
 	let t = e.ownerDocument.getSelection();
 	if (!t || t.rangeCount === 0) return [];
 	let n = t.getRangeAt(0);
 	return e.contains(n.commonAncestorContainer) ? Array.from(e.children).filter((e) => n.intersectsNode(e)) : [];
 }
-function Pn(e) {
-	Fn(e);
-	let t = Nn(e);
+function zn(e) {
+	Bn(e);
+	let t = Rn(e);
 	if (t.length === 0) return;
-	let n = t.every((e) => e.classList.contains(Sn));
-	for (let e of t) e.classList.toggle(Sn, !n);
+	let n = t.every((e) => e.classList.contains(Dn));
+	for (let e of t) e.classList.toggle(Dn, !n);
 }
-function Fn(e) {
+function Bn(e) {
 	let t = e.ownerDocument, n = null;
-	for (let r of Array.from(e.childNodes)) r.nodeType === Node.ELEMENT_NODE && kn(r.tagName) ? n = null : (n || (n = t.createElement("div"), e.insertBefore(n, r)), n.appendChild(r));
+	for (let r of Array.from(e.childNodes)) r.nodeType === Node.ELEMENT_NODE && Pn(r.tagName) ? n = null : (n || (n = t.createElement("div"), e.insertBefore(n, r)), n.appendChild(r));
 }
-var In = {
+var Vn = {
 	horizontal: {
 		left: "text-align-start",
 		center: "text-align-center",
@@ -1896,7 +1921,7 @@ var In = {
 		bottom: "align-vertical-justify-end"
 	}
 };
-function Ln(e, t) {
+function Hn(e, t) {
 	let n = e.createElement("div");
 	n.className = "event-storming-note-toolbar";
 	let r = (r, i, a) => {
@@ -1907,19 +1932,19 @@ function Ln(e, t) {
 	let i = e.createElement("span");
 	return i.className = "event-storming-note-toolbar-separator", n.appendChild(i), r("note-align-horizontal", "Horizontal alignment (click to cycle)", ""), r("note-align-vertical", "Vertical alignment (click to cycle)", ""), n;
 }
-function Rn(e, t, n) {
-	let r = In[t][n];
+function Un(e, t, n) {
+	let r = Vn[t][n];
 	e.innerHTML = r ? q(r) : "", e.title = t === "horizontal" ? `Horizontal alignment: ${n} (click to cycle)` : `Vertical alignment: ${n} (click to cycle)`;
 }
-function zn(e, t) {
+function Wn(e, t) {
 	e.style.textAlign = t.horizontal, e.style.justifyContent = t.vertical === "top" ? "flex-start" : t.vertical === "middle" ? "center" : "flex-end";
 }
 //#endregion
 //#region src/label-editing/EventStormingLabelEditing.ts
-function Bn(e) {
+function Gn(e) {
 	return e.replace(/(?<!:)\/\//g, "∕∕").replace(/\/\*/g, "∕*").replace(/->/g, "→").replace(/;/g, ",").replace(/\[/g, "(").replace(/\]/g, ")").trim();
 }
-var Vn = class {
+var Kn = class {
 	canvas;
 	modeling;
 	elementRegistry;
@@ -1940,12 +1965,8 @@ var Vn = class {
 		}), e.on("diagram.destroy", () => {
 			clearTimeout(this.resumeTimer), this.suspended = null, this.cancel();
 		}), e.on("element.dblclick", (e) => {
-			S(e.element) ? this.activate(e.element) : C(e.element) && this.activateConnection(e.element);
-		}), e.on([
-			"element.mousedown",
-			"drag.init",
-			"canvas.viewbox.changing"
-		], () => this.active?.commit());
+			y(e.element) ? this.activate(e.element) : b(e.element) && this.activateConnection(e.element);
+		}), e.on(["element.mousedown", "drag.init"], () => this.active?.commit()), e.on("canvas.viewbox.changed", () => this.active?.place());
 	}
 	suspend() {
 		clearTimeout(this.resumeTimer), this.active && (this.suspended = this.active.snapshot(), this.active.cleanup());
@@ -1959,14 +1980,14 @@ var Vn = class {
 	resume(e) {
 		let t = this.elementRegistry?.get(e.elementId);
 		if (e.connection) {
-			if (!C(t)) return;
+			if (!b(t)) return;
 			this.activateConnection(t);
 		} else {
-			if (!S(t)) return;
+			if (!y(t)) return;
 			this.activate(t);
 		}
 		let n = this.active?.field;
-		n && (n instanceof HTMLTextAreaElement || n instanceof HTMLInputElement ? (n.value = e.value, n instanceof HTMLTextAreaElement && (n.rows = Math.max(2, e.value.split("\n").length)), n.setSelectionRange(e.selectionStart ?? e.value.length, e.selectionEnd ?? e.value.length)) : (En(n, e.value), e.align && this.restoreNoteAlign?.(e.align), Un(n)));
+		n && (n instanceof HTMLTextAreaElement || n instanceof HTMLInputElement ? (n.value = e.value, n instanceof HTMLTextAreaElement && (n.rows = Math.max(2, e.value.split("\n").length)), n.setSelectionRange(e.selectionStart ?? e.value.length, e.selectionEnd ?? e.value.length)) : (jn(n, e.value), e.align && this.restoreNoteAlign?.(e.align), Jn(n)));
 	}
 	restoreNoteAlign;
 	activate(e) {
@@ -1975,134 +1996,152 @@ var Vn = class {
 			this.activateNote(e);
 			return;
 		}
-		let t = this.canvas.getContainer(), n = this.canvas.zoom(), r = this.canvas.viewbox(), i = (e.x + e.width / 2 - r.x) * n, a = (e.y + e.height / 2 - r.y) * n, o = document.createElement("textarea");
-		o.className = "event-storming-label-input event-storming-label-textarea", o.value = e.eventStormingLabel ?? "", o.rows = Math.max(2, o.value.split("\n").length), o.wrap = "off", o.style.position = "absolute", o.style.left = `${i}px`, o.style.top = `${a}px`, o.style.transform = "translate(-50%, -50%)", o.style.width = `${e.width * n}px`, t.appendChild(o), o.focus(), o.select();
-		let s = !1, c = () => {
-			s || (s = !0, o.removeEventListener("keydown", u), o.removeEventListener("blur", d), o.remove(), this.active = null, this.canvas.restoreFocus?.());
-		}, l = () => {
-			if (s) return;
-			let t = Bn(o.value), n = t && t !== e.eventStormingLabel;
-			c(), n && this.modeling.updateLabel(e, t);
-		}, u = (e) => {
-			if (e.key === "Escape") e.preventDefault(), c();
+		let t = this.canvas.getContainer(), n = document.createElement("textarea");
+		n.className = "event-storming-label-input event-storming-label-textarea", n.value = e.eventStormingLabel ?? "", n.rows = Math.max(2, n.value.split("\n").length), n.wrap = "off", n.style.position = "absolute", n.style.transform = "translate(-50%, -50%)";
+		let r = () => {
+			let t = this.canvas.zoom(), r = this.canvas.viewbox();
+			n.style.left = `${(e.x + e.width / 2 - r.x) * t}px`, n.style.top = `${(e.y + e.height / 2 - r.y) * t}px`, n.style.width = `${e.width * t}px`;
+		};
+		r(), t.appendChild(n), n.focus(), n.select();
+		let i = !1, a = () => {
+			i || (i = !0, n.removeEventListener("keydown", s), n.removeEventListener("blur", c), n.remove(), this.active = null, this.canvas.restoreFocus?.());
+		}, o = () => {
+			if (i) return;
+			let t = Gn(n.value), r = t && t !== e.eventStormingLabel;
+			a(), r && this.modeling.updateLabel(e, t);
+		}, s = (e) => {
+			if (e.key === "Escape") e.preventDefault(), a();
 			else if (e.key === "Enter") {
 				if (!(e.metaKey || e.ctrlKey)) return;
-				e.preventDefault(), l();
+				e.preventDefault(), o();
 			}
-		}, d = () => l();
-		o.addEventListener("keydown", u), o.addEventListener("blur", d);
-		let f = () => ({
+		}, c = () => o();
+		n.addEventListener("keydown", s), n.addEventListener("blur", c);
+		let l = () => ({
 			elementId: e.id,
 			connection: !1,
-			value: o.value,
-			selectionStart: o.selectionStart ?? void 0,
-			selectionEnd: o.selectionEnd ?? void 0
+			value: n.value,
+			selectionStart: n.selectionStart ?? void 0,
+			selectionEnd: n.selectionEnd ?? void 0
 		});
 		this.active = {
-			field: o,
-			commit: l,
-			cleanup: c,
-			snapshot: f
+			field: n,
+			place: r,
+			commit: o,
+			cleanup: a,
+			snapshot: l
 		};
 	}
 	activateNote(e) {
-		let t = this.canvas.getContainer(), n = this.canvas.zoom(), r = this.canvas.viewbox(), i = (e.x + e.width / 2 - r.x) * n, a = (e.y + e.height / 2 - r.y) * n, o = document.createElement("div");
-		o.className = "event-storming-label-input event-storming-note-editor", o.contentEditable = "true", o.style.position = "absolute", o.style.left = `${i}px`, o.style.top = `${a}px`, o.style.transform = "translate(-50%, -50%)", o.style.minWidth = `${e.width * n}px`, o.style.minHeight = `${e.height * n}px`, En(o, e.eventStormingLabel ?? "");
-		let s = {
+		let t = this.canvas.getContainer(), n = document.createElement("div");
+		n.className = "event-storming-label-input event-storming-note-editor", n.contentEditable = "true", n.style.position = "absolute", n.style.transform = "translate(-50%, -50%)", jn(n, e.eventStormingLabel ?? "");
+		let r = {
 			horizontal: e.alignHorizontal ?? "left",
 			vertical: e.alignVertical ?? "top"
 		};
-		zn(o, s);
-		let c = Ln(document, (e) => m(e));
-		c.style.left = `${i}px`, c.style.top = `${(e.y - r.y) * n - 8}px`, c.style.transform = "translate(-50%, -100%)", t.appendChild(o), t.appendChild(c), o.focus(), jn(o);
-		let l = (e) => c.querySelector(`[data-action="${e}"]`), u = (e, t) => {
-			let n = l(e);
+		Wn(n, r);
+		let i = Hn(document, (e) => d(e));
+		i.style.transform = "translate(-50%, -100%)";
+		let a = () => {
+			let t = this.canvas.zoom(), r = this.canvas.viewbox(), a = (e.x + e.width / 2 - r.x) * t;
+			n.style.left = `${a}px`, n.style.top = `${(e.y + e.height / 2 - r.y) * t}px`, n.style.minWidth = `${e.width * t}px`, n.style.minHeight = `${e.height * t}px`, i.style.left = `${a}px`, i.style.top = `${(e.y - r.y) * t - 8}px`;
+		};
+		a(), t.appendChild(n), t.appendChild(i), n.focus(), In(n);
+		let o = (e) => i.querySelector(`[data-action="${e}"]`), s = (e, t) => {
+			let n = o(e);
 			n?.classList.toggle("active", t), n?.setAttribute("aria-pressed", String(t));
-		}, d = () => {
-			u("note-bold", Wn("bold")), u("note-italic", Wn("italic"));
-			let e = Nn(o);
-			u("note-bullet", e.length > 0 && e.every((e) => e.classList.contains("bullet")));
-			let t = l("note-align-horizontal");
-			t && Rn(t, "horizontal", s.horizontal);
-			let n = l("note-align-vertical");
-			n && Rn(n, "vertical", s.vertical);
-		}, f = (e) => {
-			typeof document.execCommand == "function" && document.execCommand(e, !1), d();
-		}, p = (e) => {
-			e === "horizontal" ? s.horizontal = Tn(Cn, s.horizontal) : s.vertical = Tn(wn, s.vertical), zn(o, s), d();
-		}, m = (e) => {
-			e === "note-bold" ? f("bold") : e === "note-italic" ? f("italic") : e === "note-bullet" ? (Pn(o), d()) : p(e === "note-align-horizontal" ? "horizontal" : "vertical");
-		}, h = () => d();
-		document.addEventListener("selectionchange", h);
-		let g = !1, _ = () => {
-			g || (g = !0, document.removeEventListener("selectionchange", h), o.removeEventListener("keydown", ee), o.removeEventListener("blur", te), o.removeEventListener("paste", y), o.remove(), c.remove(), this.active = null, this.restoreNoteAlign = void 0, this.canvas.restoreFocus?.());
-		}, v = () => {
-			if (g) return;
-			let t = Hn(e, Bn(On(o)), s);
-			_(), t && this.modeling.updateProperties(e, t);
-		}, ee = (e) => {
+		}, c = () => {
+			s("note-bold", Yn("bold")), s("note-italic", Yn("italic"));
+			let e = Rn(n);
+			s("note-bullet", e.length > 0 && e.every((e) => e.classList.contains("bullet")));
+			let t = o("note-align-horizontal");
+			t && Un(t, "horizontal", r.horizontal);
+			let i = o("note-align-vertical");
+			i && Un(i, "vertical", r.vertical);
+		}, l = (e) => {
+			typeof document.execCommand == "function" && document.execCommand(e, !1), c();
+		}, u = (e) => {
+			e === "horizontal" ? r.horizontal = An(On, r.horizontal) : r.vertical = An(kn, r.vertical), Wn(n, r), c();
+		}, d = (e) => {
+			e === "note-bold" ? l("bold") : e === "note-italic" ? l("italic") : e === "note-bullet" ? (zn(n), c()) : u(e === "note-align-horizontal" ? "horizontal" : "vertical");
+		}, f = () => c();
+		document.addEventListener("selectionchange", f);
+		let p = !1, m = () => {
+			p || (p = !0, document.removeEventListener("selectionchange", f), n.removeEventListener("keydown", g), n.removeEventListener("blur", _), n.removeEventListener("paste", ee), n.remove(), i.remove(), this.active = null, this.restoreNoteAlign = void 0, this.canvas.restoreFocus?.());
+		}, h = () => {
+			if (p) return;
+			let t = qn(e, Gn(Nn(n)), r);
+			m(), t && this.modeling.updateProperties(e, t);
+		}, g = (e) => {
 			if (e.key === "Escape") {
-				e.preventDefault(), _();
+				e.preventDefault(), m();
 				return;
 			}
 			if (e.key === "Enter") {
 				if (!(e.metaKey || e.ctrlKey)) return;
-				e.preventDefault(), v();
+				e.preventDefault(), h();
 				return;
 			}
 			let t = e.key.toLowerCase();
-			(e.metaKey || e.ctrlKey) && (t === "b" || t === "i") && (e.preventDefault(), f(t === "b" ? "bold" : "italic"));
-		}, te = (e) => {
-			e.relatedTarget instanceof Node && c.contains(e.relatedTarget) || v();
-		}, y = (e) => {
+			(e.metaKey || e.ctrlKey) && (t === "b" || t === "i") && (e.preventDefault(), l(t === "b" ? "bold" : "italic"));
+		}, _ = (e) => {
+			e.relatedTarget instanceof Node && i.contains(e.relatedTarget) || h();
+		}, ee = (e) => {
 			e.preventDefault();
 			let t = e.clipboardData?.getData("text/plain") ?? "";
-			t && Mn(o, t);
+			t && Ln(n, t);
 		};
-		o.addEventListener("keydown", ee), o.addEventListener("blur", te), o.addEventListener("paste", y), d(), this.restoreNoteAlign = (e) => {
-			s.horizontal = e.horizontal, s.vertical = e.vertical, zn(o, s), d();
+		n.addEventListener("keydown", g), n.addEventListener("blur", _), n.addEventListener("paste", ee), c(), this.restoreNoteAlign = (e) => {
+			r.horizontal = e.horizontal, r.vertical = e.vertical, Wn(n, r), c();
 		};
-		let b = () => ({
+		let te = () => ({
 			elementId: e.id,
 			connection: !1,
-			value: On(o),
-			align: { ...s }
+			value: Nn(n),
+			align: { ...r }
 		});
 		this.active = {
-			field: o,
-			commit: v,
-			cleanup: _,
-			snapshot: b
+			field: n,
+			place: a,
+			commit: h,
+			cleanup: m,
+			snapshot: te
 		};
 	}
 	activateConnection(e) {
 		if (this.active?.commit(), this.readOnly?.isReadOnly()) return;
-		let t = this.canvas.getContainer(), n = this.canvas.zoom(), r = this.canvas.viewbox(), i = e.waypoints[0], a = e.waypoints[e.waypoints.length - 1];
-		if (!i || !a) return;
-		let o = document.createElement("input");
-		o.type = "text", o.className = "event-storming-label-input", o.placeholder = "arrow label", o.value = e.linkLabel ?? "", o.style.position = "absolute", o.style.left = `${((i.x + a.x) / 2 - 60 - r.x) * n}px`, o.style.top = `${((i.y + a.y) / 2 - 26 - r.y) * n}px`, t.appendChild(o), o.focus(), o.select();
-		let s = !1, c = () => {
-			s || (s = !0, o.removeEventListener("keydown", u), o.removeEventListener("blur", d), o.remove(), this.active = null, this.canvas.restoreFocus?.());
-		}, l = () => {
-			if (s) return;
-			let t = Bn(o.value), n = e.linkLabel ?? "";
-			c(), t !== n && this.modeling.updateProperties(e, { linkLabel: t || void 0 });
-		}, u = (e) => {
-			e.key === "Escape" ? (e.preventDefault(), c()) : e.key === "Enter" && (e.preventDefault(), l());
-		}, d = () => l();
-		o.addEventListener("keydown", u), o.addEventListener("blur", d);
-		let f = () => ({
+		let t = this.canvas.getContainer(), n = e.waypoints[0], r = e.waypoints[e.waypoints.length - 1];
+		if (!n || !r) return;
+		let i = document.createElement("input");
+		i.type = "text", i.className = "event-storming-label-input", i.placeholder = "arrow label", i.value = e.linkLabel ?? "", i.style.position = "absolute";
+		let a = () => {
+			let e = this.canvas.zoom(), t = this.canvas.viewbox();
+			i.style.left = `${((n.x + r.x) / 2 - 60 - t.x) * e}px`, i.style.top = `${((n.y + r.y) / 2 - 26 - t.y) * e}px`;
+		};
+		a(), t.appendChild(i), i.focus(), i.select();
+		let o = !1, s = () => {
+			o || (o = !0, i.removeEventListener("keydown", l), i.removeEventListener("blur", u), i.remove(), this.active = null, this.canvas.restoreFocus?.());
+		}, c = () => {
+			if (o) return;
+			let t = Gn(i.value), n = e.linkLabel ?? "";
+			s(), t !== n && this.modeling.updateProperties(e, { linkLabel: t || void 0 });
+		}, l = (e) => {
+			e.key === "Escape" ? (e.preventDefault(), s()) : e.key === "Enter" && (e.preventDefault(), c());
+		}, u = () => c();
+		i.addEventListener("keydown", l), i.addEventListener("blur", u);
+		let d = () => ({
 			elementId: e.id,
 			connection: !0,
-			value: o.value,
-			selectionStart: o.selectionStart ?? void 0,
-			selectionEnd: o.selectionEnd ?? void 0
+			value: i.value,
+			selectionStart: i.selectionStart ?? void 0,
+			selectionEnd: i.selectionEnd ?? void 0
 		});
 		this.active = {
-			field: o,
-			commit: l,
-			cleanup: c,
-			snapshot: f
+			field: i,
+			place: a,
+			commit: c,
+			cleanup: s,
+			snapshot: d
 		};
 	}
 	cancel() {
@@ -2117,23 +2156,23 @@ var Vn = class {
 		};
 	}
 };
-function Hn(e, t, n) {
+function qn(e, t, n) {
 	let r = !!t && t !== e.eventStormingLabel, i = n.horizontal !== (e.alignHorizontal ?? "left") || n.vertical !== (e.alignVertical ?? "top");
 	if (!r && !i) return null;
 	let a = {};
-	if (r && (a.eventStormingLabel = t, !I(e.eventStormingLabel, e))) {
-		let { width: n, height: r } = F(t);
+	if (r && (a.eventStormingLabel = t, !P(e.eventStormingLabel, e))) {
+		let { width: n, height: r } = N(t);
 		a.width = n, a.height = r, a.x = e.x + e.width / 2 - n / 2, a.y = e.y + e.height / 2 - r / 2;
 	}
 	return i && (a.alignHorizontal = n.horizontal === "left" ? void 0 : n.horizontal, a.alignVertical = n.vertical === "top" ? void 0 : n.vertical), a;
 }
-function Un(e) {
+function Jn(e) {
 	let t = document.createRange();
 	t.selectNodeContents(e), t.collapse(!1);
 	let n = window.getSelection();
 	n?.removeAllRanges(), n?.addRange(t);
 }
-function Wn(e) {
+function Yn(e) {
 	if (typeof document.queryCommandState != "function") return !1;
 	try {
 		return document.queryCommandState(e);
@@ -2143,10 +2182,10 @@ function Wn(e) {
 }
 //#endregion
 //#region src/label-editing/index.ts
-var Gn = {
+var Xn = {
 	__init__: ["eventStormingLabelEditing"],
-	eventStormingLabelEditing: ["type", Vn]
-}, Kn = 2, qn = 10, Jn = {
+	eventStormingLabelEditing: ["type", Kn]
+}, Zn = 2, Qn = 10, $n = {
 	arrowleft: {
 		x: -1,
 		y: 0
@@ -2163,7 +2202,7 @@ var Gn = {
 		x: 0,
 		y: 1
 	}
-}, Yn = class {
+}, er = class {
 	static $inject = [
 		"config.eventStormingKeyboard",
 		"canvas",
@@ -2181,12 +2220,12 @@ var Gn = {
 	];
 	constructor(e, t, n, r, i, a, o, s, c, l, u, d, f) {
 		let p = t.getContainer(), m = e?.undoRedoKeys ?? !0, h = (e) => {
-			e.defaultPrevented || Xn(e.target, p) && (Zn(e.target) || g(e) || f?.isReadOnly() || _(e));
+			e.defaultPrevented || tr(e.target, p) && (nr(e.target) || g(e) || f?.isReadOnly() || _(e));
 		}, g = (e) => {
 			let t = e.ctrlKey || e.metaKey, n = e.key.toLowerCase();
 			if (t && n === "a" && !e.shiftKey && !e.altKey) {
 				e.preventDefault();
-				let t = (d?.getAll() ?? []).filter((e) => S(e) || C(e));
+				let t = (d?.getAll() ?? []).filter((e) => y(e) || b(e));
 				r.select(t);
 			} else if (t && n === "c") a.copy() && e.preventDefault();
 			else if (!t && !e.altKey && n === "l") {
@@ -2209,14 +2248,14 @@ var Gn = {
 				let t = c.getLastMoveEvent();
 				if (t) {
 					e.preventDefault();
-					let n = l === "e" ? o.createNew("event", M.event.label) : o.createNew("command", M.command.label);
+					let n = l === "e" ? o.createNew("event", A.event.label) : o.createNew("command", A.command.label);
 					s.start(t, n);
 				}
-			} else if (l in Jn && !t) {
+			} else if (l in $n && !t) {
 				let t = r.get();
 				if (t.length) {
 					e.preventDefault();
-					let n = e.shiftKey ? qn : Kn, r = Jn[l];
+					let n = e.shiftKey ? Qn : Zn, r = $n[l];
 					i.moveElements(t, {
 						x: r.x * n,
 						y: r.y * n
@@ -2227,20 +2266,20 @@ var Gn = {
 		document.addEventListener("keydown", h), u.on("diagram.destroy", () => document.removeEventListener("keydown", h));
 	}
 };
-function Xn(e, t) {
+function tr(e, t) {
 	return e instanceof Node ? t.contains(e) || e === document.body || e === document.documentElement : !1;
 }
-function Zn(e) {
+function nr(e) {
 	if (!(e instanceof HTMLElement)) return !1;
 	let t = e.tagName;
 	return t === "INPUT" || t === "TEXTAREA" || e.isContentEditable;
 }
 //#endregion
 //#region src/keyboard/index.ts
-var Qn = {
+var rr = {
 	__init__: ["eventStormingKeyboard"],
-	eventStormingKeyboard: ["type", Yn]
-}, $n = 500, er = 6, tr = class {
+	eventStormingKeyboard: ["type", er]
+}, ir = 500, ar = 6, or = class {
 	static $inject = ["injector", "eventBus"];
 	constructor(e, t) {
 		let n = e.get("connectionPreview", !1), r = e.get("eventStormingLabelEditing", !1), i = e.get("popupMenu", !1), a = e.get("modeling", !1), o = e.get("canvas", !1), s = !1;
@@ -2273,14 +2312,14 @@ var Qn = {
 			let n = o.getAbsoluteBBox(e), c = o.getContainer().getBoundingClientRect();
 			i.open(e, G, {
 				x: c.left + n.x,
-				y: c.top + n.y + n.height + er
+				y: c.top + n.y + n.height + ar
 			}), i.isOpen() ? t.once("popupMenu.close", () => {
 				setTimeout(() => {
 					s || (e.provisional ? e.parent && a.removeElements([e]) : r?.activate(e));
 				}, 0);
 			}) : a.removeElements([e]);
 		};
-		t.on("create.end", $n, (e) => {
+		t.on("create.end", ir, (e) => {
 			let { context: t } = e;
 			if (!t.source || !t.canExecute || !t.shape) return;
 			let n = t.shape;
@@ -2297,14 +2336,14 @@ var Qn = {
 			} else r && setTimeout(() => r.activate(n), 0);
 		});
 	}
-}, nr = {
-	__depends__: [he],
+}, sr = {
+	__depends__: [ye],
 	__init__: ["eventStormingAppendBehavior"],
-	eventStormingAppendBehavior: ["type", tr]
-}, rr = w.map((e) => ({
-	value: M[e].fill,
-	title: M[e].label
-})), ir = class {
+	eventStormingAppendBehavior: ["type", or]
+}, cr = x.map((e) => ({
+	value: A[e].fill,
+	title: A[e].label
+})), lr = class {
 	canvas;
 	modeling;
 	static $inject = [
@@ -2334,7 +2373,7 @@ var Qn = {
 			value: void 0,
 			title: "No color",
 			cls: "event-storming-cp-none"
-		}, ...rr.map((e) => ({
+		}, ...cr.map((e) => ({
 			value: e.value,
 			title: e.title,
 			cls: ""
@@ -2354,12 +2393,12 @@ var Qn = {
 	close() {
 		this.popover && (this.popover.remove(), this.popover = void 0, document.removeEventListener("click", this.onDocPointer, !0), document.removeEventListener("keydown", this.onKey, !0));
 	}
-}, ar = {
+}, ur = {
 	__init__: ["eventStormingColorPicker"],
-	eventStormingColorPicker: ["type", ir]
-}, or = {
+	eventStormingColorPicker: ["type", lr]
+}, dr = {
 	__init__: ["eventStormingOrderingProvider"],
-	eventStormingOrderingProvider: ["type", class extends ge {
+	eventStormingOrderingProvider: ["type", class extends be {
 		static $inject = ["eventBus"];
 		constructor(e) {
 			super(e);
@@ -2367,15 +2406,15 @@ var Qn = {
 		getOrdering(e, t) {
 			for (; t.parent;) t = t.parent;
 			let n = t.children ?? [];
-			if (C(e)) {
-				let r = n.filter((t) => t !== e && (k(t) || C(t))).length;
+			if (b(e)) {
+				let r = n.filter((t) => t !== e && (D(t) || b(t))).length;
 				return {
 					parent: t,
 					index: r
 				};
 			}
-			if (k(e)) {
-				let r = n.filter((t) => t !== e && k(t)).length;
+			if (D(e)) {
+				let r = n.filter((t) => t !== e && D(t)).length;
 				return {
 					parent: t,
 					index: r
@@ -2384,7 +2423,7 @@ var Qn = {
 			return { parent: t };
 		}
 	}]
-}, sr = 12, cr = class {
+}, fr = 12, pr = class {
 	canvas;
 	eventBus;
 	modeling;
@@ -2463,12 +2502,12 @@ var Qn = {
 		if (e.button !== 0 || this.isChromeTarget(e)) return;
 		e.preventDefault(), e.stopPropagation();
 		let t = this.toCanvasPoint(e), n = this.points[0];
-		if (n && this.points.length >= 3 && lr(t, n) <= sr) {
+		if (n && this.points.length >= 3 && mr(t, n) <= fr) {
 			this.finishClosed();
 			return;
 		}
 		let r = this.points[this.points.length - 1];
-		r && lr(t, r) <= sr ? this.points.length >= 2 && this.finish() : (this.points.push(t), this.renderPreview());
+		r && mr(t, r) <= fr ? this.points.length >= 2 && this.finish() : (this.points.push(t), this.renderPreview());
 	};
 	onDblClick = (e) => {
 		this.isChromeTarget(e) || (e.preventDefault(), e.stopPropagation(), this.finish());
@@ -2481,47 +2520,47 @@ var Qn = {
 	};
 	renderPreview() {
 		if (this.clearPreview(), !this.points.length) return;
-		let e = this.canvas.getLayer("event-storming-draw-preview", 1e3), t = m("g"), n = this.cursor ? [...this.points, this.cursor] : this.points;
-		f(t, p(m("polyline"), {
+		let e = this.canvas.getLayer("event-storming-draw-preview", 1e3), t = h("g"), n = this.cursor ? [...this.points, this.cursor] : this.points;
+		p(t, m(h("polyline"), {
 			points: n.map((e) => `${e.x},${e.y}`).join(" "),
 			fill: "none",
-			stroke: R,
+			stroke: I,
 			"stroke-width": 2,
 			"stroke-linecap": "round",
 			"stroke-linejoin": "round",
 			"stroke-dasharray": "5 4"
 		}));
 		let r = this.points[0];
-		if (f(t, p(m("circle"), {
+		if (p(t, m(h("circle"), {
 			cx: r.x,
 			cy: r.y,
 			r: this.points.length >= 3 ? 5 : 3,
-			fill: L.paper,
-			stroke: R,
+			fill: F.paper,
+			stroke: I,
 			"stroke-width": 1.5
 		})), this.points.length >= 2) {
 			let e = this.points[this.points.length - 1];
-			f(t, p(m("circle"), {
+			p(t, m(h("circle"), {
 				cx: e.x,
 				cy: e.y,
 				r: 5,
-				fill: L.paper,
-				stroke: R,
+				fill: F.paper,
+				stroke: I,
 				"stroke-width": 1.5
 			}));
 		}
-		f(e, t), this.layer = t;
+		p(e, t), this.layer = t;
 	}
 	clearPreview() {
-		this.layer &&= (h(this.layer), null);
+		this.layer &&= (g(this.layer), null);
 	}
 };
-function lr(e, t) {
+function mr(e, t) {
 	return Math.hypot(e.x - t.x, e.y - t.y);
 }
 //#endregion
 //#region src/draw-tool/EventStormingDrawingHandles.ts
-var ur = class {
+var hr = class {
 	eventBus;
 	canvas;
 	modeling;
@@ -2538,7 +2577,7 @@ var ur = class {
 	constructor(e, t, n, r) {
 		this.eventBus = e, this.canvas = t, this.modeling = n, this.readOnly = r, e.on(K, () => this.render()), e.on("selection.changed", (e) => {
 			let t = e.newSelection ?? [], n = t.length === 1 ? t[0] : null;
-			this.attach(k(n) ? n : null);
+			this.attach(D(n) ? n : null);
 		}), e.on("element.changed", (e) => {
 			this.shape && e.element === this.shape && this.render();
 		}), e.on(["diagram.clear", "diagram.destroy"], () => this.attach(null));
@@ -2555,19 +2594,19 @@ var ur = class {
 	}
 	render() {
 		if (this.clear(), !this.shape || this.readOnly?.isReadOnly()) return;
-		let e = this.canvas.getLayer("event-storming-drawing-handles", 1100), t = m("g");
+		let e = this.canvas.getLayer("event-storming-drawing-handles", 1100), t = h("g");
 		this.absolutePoints().forEach((e, n) => {
-			let r = p(m("circle"), {
+			let r = m(h("circle"), {
 				cx: e.x,
 				cy: e.y,
 				r: 5,
-				fill: L.paper,
-				stroke: L.ink,
+				fill: F.paper,
+				stroke: F.ink,
 				"stroke-width": 1.5,
 				class: "event-storming-drawing-handle"
 			});
-			r.addEventListener("mousedown", (e) => this.startDrag(e, n)), f(t, r);
-		}), f(e, t), this.group = t;
+			r.addEventListener("mousedown", (e) => this.startDrag(e, n)), p(t, r);
+		}), p(e, t), this.group = t;
 	}
 	startDrag(e, t) {
 		if (e.button !== 0 || !this.shape) return;
@@ -2594,21 +2633,21 @@ var ur = class {
 	}
 	renderDragPreview(e, t) {
 		this.clearDragPreview();
-		let n = this.canvas.getLayer("event-storming-drawing-handles", 1100), r = p(m(t ? "polygon" : "polyline"), {
+		let n = this.canvas.getLayer("event-storming-drawing-handles", 1100), r = m(h(t ? "polygon" : "polyline"), {
 			points: e.map((e) => `${e.x},${e.y}`).join(" "),
 			fill: "none",
-			stroke: L.ink,
+			stroke: F.ink,
 			"stroke-width": 1.5,
 			"stroke-dasharray": "5 4",
 			"pointer-events": "none"
 		});
-		f(n, r), this.dragPreview = r;
+		p(n, r), this.dragPreview = r;
 	}
 	clearDragPreview() {
-		this.dragPreview &&= (h(this.dragPreview), null);
+		this.dragPreview &&= (g(this.dragPreview), null);
 	}
 	clear() {
-		this.clearDragPreview(), this.group &&= (h(this.group), null);
+		this.clearDragPreview(), this.group &&= (g(this.group), null);
 	}
 	toCanvasPoint(e) {
 		let t = this.canvas.getContainer().getBoundingClientRect(), n = this.canvas.viewbox(), r = this.canvas.zoom();
@@ -2617,79 +2656,79 @@ var ur = class {
 			y: (e.clientY - t.top) / r + n.y
 		};
 	}
-}, dr = class {
+}, gr = class {
 	static $inject = ["eventBus", "interactionEvents"];
 	constructor(e, t) {
 		e.on("interactionEvents.createHit", (e) => {
-			if (k(e.element) && e.gfx) return fr(e.element, e.gfx), !1;
+			if (D(e.element) && e.gfx) return _r(e.element, e.gfx), !1;
 		}), e.on("interactionEvents.updateHit", (e) => {
-			if (k(e.element) && e.gfx) return t.removeHits(e.gfx), fr(e.element, e.gfx), !1;
+			if (D(e.element) && e.gfx) return t.removeHits(e.gfx), _r(e.element, e.gfx), !1;
 		});
 	}
 };
-function fr(e, t) {
-	let n = e.drawingPoints ?? [], r = m(e.closed ? "polygon" : "polyline");
-	p(r, {
+function _r(e, t) {
+	let n = e.drawingPoints ?? [], r = h(e.closed ? "polygon" : "polyline");
+	m(r, {
 		points: n.map((e) => `${e.x},${e.y}`).join(" "),
 		class: "djs-hit djs-hit-stroke",
 		fill: "none",
 		stroke: "white",
 		"stroke-width": 15,
 		"stroke-opacity": 0
-	}), f(t, r);
+	}), p(t, r);
 }
 //#endregion
 //#region src/draw-tool/index.ts
-var pr = {
+var vr = {
 	__init__: [
 		"eventStormingDrawTool",
 		"eventStormingDrawingHandles",
 		"eventStormingDrawingHitProvider"
 	],
-	eventStormingDrawTool: ["type", cr],
-	eventStormingDrawingHandles: ["type", ur],
-	eventStormingDrawingHitProvider: ["type", dr]
-}, mr = class {
+	eventStormingDrawTool: ["type", pr],
+	eventStormingDrawingHandles: ["type", hr],
+	eventStormingDrawingHitProvider: ["type", gr]
+}, yr = class {
 	static $inject = ["eventBus"];
 	constructor(e) {
 		e.on("resize.start", 1500, (e) => {
 			let t = e.context;
-			we(t.shape) && (t.minDimensions = Pe);
+			De(t.shape) && (t.minDimensions = Pe);
 		});
 	}
-}, hr = {
-	__depends__: [_e],
+}, br = {
+	__depends__: [xe],
 	__init__: ["eventStormingResizeBehavior"],
-	eventStormingResizeBehavior: ["type", mr]
-}, gr = class extends B {
+	eventStormingResizeBehavior: ["type", yr]
+}, xr = class extends Bt {
 	_getModules() {
 		return [
 			...super._getModules(),
-			te,
-			ae,
-			y,
-			b,
-			ne,
 			re,
+			le,
 			ie,
+			ae,
 			oe,
 			se,
-			vn,
+			ce,
+			ue,
+			de,
+			Cn,
+			nn,
 			Ht,
-			kt,
-			qt,
-			Yt,
+			cn,
 			un,
-			xn,
-			Gn,
-			Qn,
-			mn,
-			nr,
-			ar,
-			Ut,
-			or,
-			pr,
-			hr
+			hn,
+			En,
+			Xn,
+			rr,
+			yn,
+			sr,
+			ur,
+			rn,
+			dr,
+			vr,
+			br
 		];
 	}
 	undo() {
@@ -2704,28 +2743,29 @@ var pr = {
 	canRedo() {
 		return this.get("commandStack").canRedo();
 	}
-}, _r = "event-storming";
-function vr(e = {}) {
-	return xr(new gr({
-		...br(e),
+}, Sr = "event-storming";
+function Cr(e = {}) {
+	return Er(new xr({
+		...Tr(e),
 		undoRedoKeys: e.undoRedoKeys ?? !0,
-		freeRectInsets: e.freeRectInsets
+		freeArea: z(e)
 	}), !0);
 }
-function yr(e = {}) {
-	return xr(new B(br(e)), !1);
+function wr(e = {}) {
+	return Er(new Bt(Tr(e)), !1);
 }
-function br(e) {
+function Tr(e) {
 	return {
 		width: "100%",
 		height: "100%",
-		additionalModules: e.additionalModules ?? []
+		additionalModules: e.additionalModules ?? [],
+		fitOnImport: e.fitOnImport ?? !0
 	};
 }
-function xr(e, t) {
+function Er(e, t) {
 	let n = e.get("eventBus"), r = e.get("canvas"), i = e.get("elementRegistry"), a = e.get("selection"), o = /* @__PURE__ */ new Set(), s = 0, c = !1, l = "", u = {
-		notation: _r,
-		apiVersion: ve,
+		notation: Sr,
+		apiVersion: Se,
 		editable: t
 	};
 	return t && n.on("commandStack.changed", () => {
@@ -2733,16 +2773,21 @@ function xr(e, t) {
 	}), {
 		meta: u,
 		elements: {
-			list: () => c ? [] : i.getAll().filter(Sr).map((e) => wr(e)),
+			list: () => c ? [] : i.getAll().filter(Y).map((e) => kr(e)),
 			reveal(e) {
 				if (c) return !1;
 				let t = i.get(e);
-				return Sr(t) ? (a.select(t), r.scrollToElement(t), !0) : !1;
+				return Y(t) ? (a.select(t), r.scrollToElement(t), !0) : !1;
 			},
-			selection: () => c ? [] : Cr(a.get()),
+			selection: () => c ? [] : Dr(a.get()),
 			onSelection(e) {
-				let t = (t) => e(Cr(t.newSelection ?? []));
+				let t = (t) => e(Dr(t.newSelection ?? []));
 				return n.on("selection.changed", t), () => n.off("selection.changed", t);
+			},
+			bounds(e) {
+				if (c) return;
+				let t = i.get(e);
+				return Y(t) ? Or(t) : void 0;
 			}
 		},
 		diagram: e,
@@ -2754,7 +2799,7 @@ function xr(e, t) {
 			s += 1;
 			try {
 				let { warnings: n } = await e.importDSL(t);
-				return { warnings: n.map(Tt) };
+				return { warnings: n.map(Lt) };
 			} finally {
 				--s;
 			}
@@ -2773,13 +2818,13 @@ function xr(e, t) {
 					width: n,
 					height: i
 				};
-				return Tr(a) ? a : void 0;
+				return Ar(a) ? a : void 0;
 			} catch {
 				return;
 			}
 		},
 		setViewState(e) {
-			!c && Tr(e) && r.viewbox({
+			!c && Ar(e) && r.viewbox({
 				x: e.x,
 				y: e.y,
 				width: e.width,
@@ -2798,30 +2843,38 @@ function xr(e, t) {
 		}
 	};
 }
-function Sr(e) {
-	return E(e);
+function Y(e) {
+	return C(e);
 }
-function Cr(e) {
-	return e.filter(Sr).map((e) => e.id);
+function Dr(e) {
+	return e.filter(Y).map((e) => e.id);
 }
-function wr(e) {
+function Or(e) {
+	return {
+		x: e.x,
+		y: e.y,
+		width: e.width,
+		height: e.height
+	};
+}
+function kr(e) {
 	let t = e.eventStormingLabel;
 	return t ? {
 		id: e.id,
 		name: t
 	} : { id: e.id };
 }
-function Tr(e) {
+function Ar(e) {
 	if (typeof e != "object" || !e) return !1;
 	let { x: t, y: n, width: r, height: i } = e;
-	return Y(t) && Y(n) && Y(r) && Y(i) && r > 0 && i > 0;
+	return X(t) && X(n) && X(r) && X(i) && r > 0 && i > 0;
 }
-function Y(e) {
+function X(e) {
 	return typeof e == "number" && Number.isFinite(e);
 }
 //#endregion
 //#region src/board-menu/menu.ts
-var Er = "Export as .storm", Dr = [
+var jr = "Export as .storm", Mr = [
 	{
 		value: "big-picture",
 		label: "Big picture"
@@ -2835,10 +2888,10 @@ var Er = "Export as .storm", Dr = [
 		label: "Software design"
 	}
 ];
-function Or(e) {
-	return Dr.some((t) => t.value === e);
+function Nr(e) {
+	return Mr.some((t) => t.value === e);
 }
-function X(e, t, n, r) {
+function Z(e, t, n, r) {
 	return {
 		kind: "action",
 		id: e,
@@ -2848,20 +2901,20 @@ function X(e, t, n, r) {
 		onSelect: () => n.onSelect()
 	};
 }
-function kr(e) {
-	let t = [X("export-png", "Export as PNG", e.png, "file-image"), X("export-svg", "Export as SVG", e.svg, "file-code-corner")];
-	return e.transparentPng && t.push(X("export-png-transparent", "Export as PNG (4×, transparent)", e.transparentPng)), e.json && t.push(X("export-json", "Export as JSON", e.json)), e.storm && t.push(X("export-storm", Er, e.storm)), t;
+function Pr(e) {
+	let t = [Z("export-png", "Export as PNG", e.png, "file-image"), Z("export-svg", "Export as SVG", e.svg, "file-code-corner")];
+	return e.transparentPng && t.push(Z("export-png-transparent", "Export as PNG (4×, transparent)", e.transparentPng)), e.json && t.push(Z("export-json", "Export as JSON", e.json)), e.storm && t.push(Z("export-storm", jr, e.storm)), t;
 }
-function Ar(e) {
+function Fr(e) {
 	return {
 		model: [{
 			kind: "radio",
 			id: "level",
 			label: "Level",
-			options: Dr,
+			options: Mr,
 			value: () => e.levels.getLevel(),
 			onSelect: (t) => {
-				Or(t) && e.levels.setLevel(t);
+				Nr(t) && e.levels.setLevel(t);
 			}
 		}, {
 			kind: "checkbox",
@@ -2873,7 +2926,7 @@ function Ar(e) {
 				e.typeCaptions.setTypeCaptionsVisible(t), e.onTypeCaptionsToggled?.(t);
 			}
 		}],
-		export: kr(e.exports),
+		export: Pr(e.exports),
 		help: [{
 			kind: "dialog",
 			id: "keyboard-shortcuts",
@@ -2885,23 +2938,23 @@ function Ar(e) {
 }
 //#endregion
 //#region src/board-menu/shortcuts.ts
-var Z = [
+var Ir = [
 	"←",
 	"↑",
 	"→",
 	"↓"
 ];
-function jr(e, t, n) {
+function Lr(e, t, n) {
 	return t === "mac" ? `⌘${e}` : `${n.ctrl}+${e}`;
 }
-function Mr(e) {
+function Rr(e) {
 	try {
 		return new Intl.NumberFormat(e, { style: "percent" }).format(1);
 	} catch {
 		return new Intl.NumberFormat("en", { style: "percent" }).format(1);
 	}
 }
-function Nr(e, t) {
+function zr(e, t) {
 	if (e === "mac") return {
 		zoomIn: "⌘+",
 		zoomOut: "⌘−",
@@ -2916,7 +2969,7 @@ function Nr(e, t) {
 		fit: `${r}+1`
 	};
 }
-function Pr(e, t) {
+function Br(e, t) {
 	if (e === "mac") return {
 		undo: ["⌘Z"],
 		redo: ["⌘⇧Z"],
@@ -2925,7 +2978,7 @@ function Pr(e, t) {
 		paste: ["⌘V"],
 		duplicate: ["⌘D"],
 		remove: ["⌫"],
-		coarseMove: Z.map((e) => `⇧${e}`),
+		coarseMove: Ir.map((e) => `⇧${e}`),
 		lassoDrag: ["⇧ Drag"]
 	};
 	let { ctrl: n, shift: r } = t;
@@ -2937,27 +2990,27 @@ function Pr(e, t) {
 		paste: [`${n}+V`],
 		duplicate: [`${n}+D`],
 		remove: ["Del", "Backspace"],
-		coarseMove: Z.map((e) => `${r}+${e}`),
+		coarseMove: Ir.map((e) => `${r}+${e}`),
 		lassoDrag: [`${r}+Drag`]
 	};
 }
-function Fr(e) {
+function Vr(e) {
 	let { platform: t, messages: n } = e;
 	return {
 		title: "File",
 		rows: [{
 			action: n.openFile ?? "Open…",
-			keys: [jr("O", t, n.keyNames)]
+			keys: [Lr("O", t, n.keyNames)]
 		}, {
-			action: Er,
-			keys: [jr("S", t, n.keyNames)]
+			action: jr,
+			keys: [Lr("S", t, n.keyNames)]
 		}]
 	};
 }
-function Ir(e, t = {}) {
-	let { platform: n, messages: r } = e, i = Nr(n, r.keyNames), a = Pr(n, r.keyNames);
+function Hr(e, t = {}) {
+	let { platform: n, messages: r } = e, i = zr(n, r.keyNames), a = Br(n, r.keyNames);
 	return [
-		...t.fileKeys ? [Fr(e)] : [],
+		...t.fileKeys ? [Vr(e)] : [],
 		{
 			title: "View",
 			rows: [
@@ -2970,7 +3023,7 @@ function Ir(e, t = {}) {
 					keys: [i.zoomOut]
 				},
 				{
-					action: r.zoomToActual(Mr(e.lang)),
+					action: r.zoomToActual(Rr(e.lang)),
 					keys: [i.zoomToActual]
 				},
 				{
@@ -3012,7 +3065,7 @@ function Ir(e, t = {}) {
 				},
 				{
 					action: "Move selection",
-					keys: Z
+					keys: Ir
 				},
 				{
 					action: "Move selection in large steps",
@@ -3053,13 +3106,13 @@ function Ir(e, t = {}) {
 }
 //#endregion
 //#region src/board-menu/ShortcutsDialog.ts
-var Q = "event-storming-shortcuts", Lr = "event-storming-shortcuts-title";
+var Q = "event-storming-shortcuts", Ur = "event-storming-shortcuts-title";
 function $(e, t, n) {
 	let r = document.createElement(e);
 	return r.className = t, n !== void 0 && (r.textContent = n), r;
 }
-function Rr(e, t) {
-	let n = $("section", `${Q}-group`), r = `${Lr}-group-${t}`, i = $("h4", `${Q}-group-title`, e.title);
+function Wr(e, t) {
+	let n = $("section", `${Q}-group`), r = `${Ur}-group-${t}`, i = $("h4", `${Q}-group-title`, e.title);
 	i.id = r;
 	let a = $("table", `${Q}-table`);
 	a.setAttribute("aria-labelledby", r);
@@ -3073,19 +3126,19 @@ function Rr(e, t) {
 	}
 	return n.append(i, a), n;
 }
-function zr(e, t, n) {
+function Gr(e, t, n) {
 	let r = $("div", `${Q}-panel`), i = $("header", `${Q}-header`), a = $("h3", `${Q}-title`, "Keyboard shortcuts");
-	a.id = Lr;
+	a.id = Ur;
 	let o = $("button", `${Q}-close`);
 	o.type = "button", o.setAttribute("aria-label", e.messages.close), o.innerHTML = q("x"), o.addEventListener("click", n), i.append(a, o);
 	let s = $("div", `${Q}-body`);
-	return s.append(...Ir(e, t).map(Rr)), r.append(i, s), r;
+	return s.append(...Hr(e, t).map(Wr)), r.append(i, s), r;
 }
-function Br(e, t = {}) {
+function Kr(e, t = {}) {
 	let n;
 	function r() {
 		let n = $("dialog", Q);
-		return n.setAttribute("aria-labelledby", Lr), n.append(zr(e, t, () => n.close())), n.addEventListener("click", (e) => {
+		return n.setAttribute("aria-labelledby", Ur), n.append(Gr(e, t, () => n.close())), n.addEventListener("click", (e) => {
 			e.target === n && n.close();
 		}), n.addEventListener("close", () => {
 			e.menu.trigger.hidden || e.menu.trigger.focus({ preventScroll: !0 });
@@ -3106,11 +3159,11 @@ function Br(e, t = {}) {
 }
 //#endregion
 //#region src/draw/icons.ts
-var Vr = "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z", Hr = "M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z", Ur = "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z", Wr = "M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z", Gr = "M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22L3.9 16c1.05-3.19 4.05-5.5 7.6-5.5 1.95 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z", Kr = "M4 7v2c0 .55-.45 1-1 1H2v2h1c.55 0 1 .45 1 1v2c0 1.65 1.35 3 3 3h1v-2H7c-.55 0-1-.45-1-1v-2c0-.84-.35-1.61-.92-2.18L4.85 12l.23-.82C5.65 10.61 6 9.84 6 9V7c0-.55.45-1 1-1h1V4H7C5.35 4 4 5.35 4 7zm16 3c-.55 0-1-.45-1-1V7c0-1.65-1.35-3-3-3h-1v2h1c.55 0 1 .45 1 1v2c0 .84.35 1.61.92 2.18l.23.82-.23.82c-.57.57-.92 1.34-.92 2.18v2c0 .55-.45 1-1 1h-1v2h1c1.65 0 3-1.35 3-3v-2c0-.55.45-1 1-1h1v-2h-1z", qr = "M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z", Jr = "M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z", Yr = "M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92s2.92-1.31 2.92-2.92-1.31-2.92-2.92-2.92z", Xr = "M20 6h-8l-2-2H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V8h16v10z", Zr = "M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z", Qr = "M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm2 14h-3v3h-2v-3H8v-2h3v-3h2v3h3v2zm-3-7V3.5L18.5 9H13z", $r = "M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z", ei = "M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z", ti = "M19 12h-2v3h-3v2h5v-5zM7 9h3V7H5v5h2V9zm14-6H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16.01H3V4.99h18v14.02z", ni = "M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z";
-function ri(e, t = 18) {
+var qr = "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z", Jr = "M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z", Yr = "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z", Xr = "M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z", Zr = "M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22L3.9 16c1.05-3.19 4.05-5.5 7.6-5.5 1.95 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z", Qr = "M4 7v2c0 .55-.45 1-1 1H2v2h1c.55 0 1 .45 1 1v2c0 1.65 1.35 3 3 3h1v-2H7c-.55 0-1-.45-1-1v-2c0-.84-.35-1.61-.92-2.18L4.85 12l.23-.82C5.65 10.61 6 9.84 6 9V7c0-.55.45-1 1-1h1V4H7C5.35 4 4 5.35 4 7zm16 3c-.55 0-1-.45-1-1V7c0-1.65-1.35-3-3-3h-1v2h1c.55 0 1 .45 1 1v2c0 .84.35 1.61.92 2.18l.23.82-.23.82c-.57.57-.92 1.34-.92 2.18v2c0 .55-.45 1-1 1h-1v2h1c1.65 0 3-1.35 3-3v-2c0-.55.45-1 1-1h1v-2h-1z", $r = "M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z", ei = "M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z", ti = "M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92s2.92-1.31 2.92-2.92-1.31-2.92-2.92-2.92z", ni = "M20 6h-8l-2-2H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V8h16v10z", ri = "M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z", ii = "M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm2 14h-3v3h-2v-3H8v-2h3v-3h2v3h3v2zm-3-7V3.5L18.5 9H13z", ai = "M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z", oi = "M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z", si = "M19 12h-2v3h-3v2h5v-5zM7 9h3V7H5v5h2V9zm14-6H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16.01H3V4.99h18v14.02z", ci = "M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z";
+function li(e, t = 18) {
 	return `<svg viewBox="0 0 24 24" width="${t}" height="${t}" fill="currentColor" aria-hidden="true"><path d="${e}"/></svg>`;
 }
 //#endregion
-export { Dr as BOARD_LEVELS, Ve as BoardBounds, L as COLORS, _r as EVENT_STORMING_NOTATION, tr as EventStormingAppendBehavior, Ot as EventStormingAttachBehavior, De as EventStormingBaseViewer, ir as EventStormingColorPicker, Le as EventStormingElementFactory, pn as EventStormingElementSettingsProvider, Ct as EventStormingExporter, St as EventStormingImporter, Vn as EventStormingLabelEditing, Pt as EventStormingModeling, _n as EventStormingReadOnly, it as EventStormingRenderer, mr as EventStormingResizeBehavior, Kt as EventStormingRules, We as EventStormingViewOptions, ei as ICON_ADD, qr as ICON_CODE, Kr as ICON_DATA_OBJECT, Ur as ICON_DELETE, Jr as ICON_DOWNLOAD, Hr as ICON_EDIT, ni as ICON_EYE, ti as ICON_FIT, Xr as ICON_FOLDER_OPEN, Zr as ICON_IMAGE, $r as ICON_MENU, Qr as ICON_NEW, Vr as ICON_PERSON, Gr as ICON_REDO, Yr as ICON_SHARE, Wr as ICON_UNDO, A as MIRAGON, gr as Modeler, N as NOTE_STYLE, B as NavigatedViewer, G as POPUP_PROVIDER_ID, K as READ_ONLY_CHANGED_EVENT, x as ROOT_ID, w as STICKY_KINDS, M as STICKY_STYLES, Er as STORM_EXPORT_LABEL, Ue as VIEW_OPTIONS_CHANGED_EVENT, Dt as Viewer, He as boardBoundsModule, Ar as boardMenu, Ir as boardShortcuts, jr as commandKeyLabel, vr as createCollaborativeModeler, yr as createCollaborativeViewer, Br as createShortcutsDialog, Yt as elementSnappingModule, nr as eventStormingAppendModule, kt as eventStormingAttachModule, ar as eventStormingColorPickerModule, xn as eventStormingContextPadModule, yt as eventStormingDrawModule, Qn as eventStormingKeyboardModule, ze as eventStormingModelModule, Ht as eventStormingModelingModule, un as eventStormingPaletteModule, mn as eventStormingPopupModule, vn as eventStormingReadOnlyModule, hr as eventStormingResizeModule, qt as eventStormingRulesModule, Ge as eventStormingViewOptionsModule, ri as iconMarkup, Tt as importWarningText, Et as ioModule, D as isAttachableKind, Se as isAttachableSticky, C as isEventStormingConnection, S as isEventStormingShape, O as isHostKind, Ce as isHostSticky, E as isSticky, T as isStickyKind, Gn as labelEditingModule, j as parseNoteMarkdown, Ae as plainNoteText, be as saveSVG, ke as serializeNoteMarkdown };
+export { Mr as BOARD_LEVELS, nt as BoardBounds, F as COLORS, Sr as EVENT_STORMING_NOTATION, or as EventStormingAppendBehavior, Vt as EventStormingAttachBehavior, qe as EventStormingBaseViewer, lr as EventStormingColorPicker, Qe as EventStormingElementFactory, vn as EventStormingElementSettingsProvider, Ft as EventStormingExporter, Pt as EventStormingImporter, Kn as EventStormingLabelEditing, Jt as EventStormingModeling, Sn as EventStormingReadOnly, vt as EventStormingRenderer, yr as EventStormingResizeBehavior, sn as EventStormingRules, at as EventStormingViewOptions, oi as ICON_ADD, $r as ICON_CODE, Qr as ICON_DATA_OBJECT, Yr as ICON_DELETE, ei as ICON_DOWNLOAD, Jr as ICON_EDIT, ci as ICON_EYE, si as ICON_FIT, ni as ICON_FOLDER_OPEN, ri as ICON_IMAGE, ai as ICON_MENU, ii as ICON_NEW, qr as ICON_PERSON, Zr as ICON_REDO, ti as ICON_SHARE, Xr as ICON_UNDO, O as MIRAGON, xr as Modeler, j as NOTE_STYLE, Bt as NavigatedViewer, G as POPUP_PROVIDER_ID, K as READ_ONLY_CHANGED_EVENT, v as ROOT_ID, x as STICKY_KINDS, A as STICKY_STYLES, jr as STORM_EXPORT_LABEL, it as VIEW_OPTIONS_CHANGED_EVENT, zt as Viewer, rt as boardBoundsModule, Fr as boardMenu, Hr as boardShortcuts, Lr as commandKeyLabel, Cr as createCollaborativeModeler, wr as createCollaborativeViewer, Kr as createShortcutsDialog, un as elementSnappingModule, sr as eventStormingAppendModule, Ht as eventStormingAttachModule, ur as eventStormingColorPickerModule, En as eventStormingContextPadModule, jt as eventStormingDrawModule, rr as eventStormingKeyboardModule, et as eventStormingModelModule, nn as eventStormingModelingModule, hn as eventStormingPaletteModule, yn as eventStormingPopupModule, Cn as eventStormingReadOnlyModule, br as eventStormingResizeModule, cn as eventStormingRulesModule, H as eventStormingViewOptionsModule, li as iconMarkup, Lt as importWarningText, Rt as ioModule, w as isAttachableKind, Ee as isAttachableSticky, b as isEventStormingConnection, y as isEventStormingShape, T as isHostKind, E as isHostSticky, C as isSticky, S as isStickyKind, Xn as labelEditingModule, k as parseNoteMarkdown, Ae as plainNoteText, we as saveSVG, ke as serializeNoteMarkdown };
 
 //# sourceMappingURL=index.js.map