likec4 1.58.0 → 1.59.1

package/__app__/src/chunks/LikeC4Styles.mjs

@@ -1,165 +1,340 @@
-import { i as e } from "./rolldown-runtime.mjs";
-import { C as t, H as n, K as r, M as i, N as a, V as o, W as s, h as c, v as l, y as u } from "./libs/remeda.mjs";
-import { Dt as d, Mt as f, Nt as p, Ot as m, Zt as h, bt as g, h as _, jt as v, m as y, mt as b } from "./libs/@mantine.mjs";
-import { E as x, M as S, N as C, c as w, d as T, f as E, g as D, h as O, l as k, u as A } from "./styled-system.mjs";
-import { _ as j, c as M, d as N, i as P, l as F, m as I, p as L, v as R } from "./libs/@tabler/icons-react.mjs";
-import { n as z, o as B, r as ee, t as te } from "./Markdown.mjs";
-import { d as ne, f as re, h as V, i as H, m as ie, n as U, p as W, r as ae, t as oe, v as G } from "./libs/@xyflow/react.mjs";
-import { n as se, t as K } from "./libs/fast-equals.mjs";
-import { t as ce } from "./libs/bezier-js.mjs";
-import { c as le, f as ue, n as de, r as fe, u as pe } from "./libs/framer.mjs";
-import { createContext as q, forwardRef as J, memo as Y, useContext as me, useEffect as he, useMemo as ge, useRef as _e, useState as ve } from "react";
-import { c as X } from "react/compiler-runtime";
-import { Fragment as Z, jsx as Q, jsxs as $ } from "react/jsx-runtime";
-import { extractStep as ye, invariant as be, isStepEdgeId as xe, nonexhaustive as Se } from "@likec4/core";
-import { BBox as Ce, vector as we, vector as Te } from "@likec4/core/geometry";
-import { invariant as Ee } from "@likec4/core/utils";
-import { LikeC4Styles as De } from "@likec4/core/styles";
-import { RichText as Oe, ensureSizes as ke } from "@likec4/core/types";
-//#region ../diagram/src/context/IconRenderer.tsx
-var Ae = q(null);
-function IconRendererProvider(e) {
-	let t = X(5), { value: n, children: r } = e;
-	if (me(Ae)) {
-		let e;
-		return t[0] === r ? e = t[1] : (e = /* @__PURE__ */ Q(Z, { children: r }), t[0] = r, t[1] = e), e;
+import { i as r } from "./rolldown-runtime.mjs";
+import { A as i, F as a, R as o, S as s, _ as c, c as l, j as u, y as d } from "./hooks.mjs";
+import { Mt as f, Nt as p, Ot as m, Pt as h, Qt as g, g as _, h as v, ht as y, kt as b, xt as x } from "./libs/@mantine.mjs";
+import { D as S, E as C, M as w, N as T, c as E, d as D, f as O, g as k, h as A, k as j, l as M, t as N, u as P } from "./styled-system.mjs";
+import { _ as F, a as I, b as L, f as R, g as z, h as B, i as ee, m as V, n as H, t as U } from "./libs/@xyflow/react.mjs";
+import { n as te, t as W } from "./libs/fast-equals.mjs";
+import { t as ne } from "./libs/bezier-js.mjs";
+import { d as re, f as ie, l as ae, n as oe, r as G, u as se } from "./libs/framer.mjs";
+import { createContext as ce, forwardRef as K, memo as le, useContext as q, useEffect as ue, useMemo as de, useRef as fe, useState as pe } from "react";
+import { c as J } from "react/compiler-runtime";
+import { Fragment as Y, jsx as X, jsxs as Z } from "react/jsx-runtime";
+import { RichText as me, invariant as he, nonexhaustive as ge } from "@likec4/core";
+import { BBox as Q, vector as $, vector as _e } from "@likec4/core/geometry";
+import { invariant as ve } from "@likec4/core/utils";
+import { LikeC4Styles as ye } from "@likec4/core/styles";
+import { RichText as be, ensureSizes as xe } from "@likec4/core/types";
+//#region ../../node_modules/.pnpm/remeda@2.37.0/node_modules/remeda/dist/clamp.js
+function t$4(...r) {
+	return o(Se, r);
+}
+r(t$4, "t");
+var Se = /* @__PURE__ */ r((r, { min: i, max: a }) => i !== void 0 && r < i ? i : a !== void 0 && r > a ? a : r, "n");
+//#endregion
+//#region ../../node_modules/.pnpm/remeda@2.37.0/node_modules/remeda/dist/hasAtLeast.js
+function t$3(...r) {
+	return o(Ce, r);
+}
+r(t$3, "t");
+var Ce = /* @__PURE__ */ r((r, i) => r.length >= i, "n");
+//#endregion
+//#region ../../node_modules/.pnpm/remeda@2.37.0/node_modules/remeda/dist/entries.js
+function t$2(...r) {
+	return o(Object.entries, r);
+}
+r(t$2, "t");
+//#endregion
+//#region ../../node_modules/.pnpm/remeda@2.37.0/node_modules/remeda/dist/isArray.js
+function e$2(r) {
+	return Array.isArray(r);
+}
+r(e$2, "e");
+//#endregion
+//#region ../../node_modules/.pnpm/remeda@2.37.0/node_modules/remeda/dist/isNumber.js
+function e$1(r) {
+	return typeof r == "number" && !Number.isNaN(r);
+}
+r(e$1, "e");
+//#endregion
+//#region ../../node_modules/.pnpm/remeda@2.37.0/node_modules/remeda/dist/isTruthy.js
+function e(r) {
+	return !!r;
+}
+//#endregion
+//#region ../../node_modules/.pnpm/remeda@2.37.0/node_modules/remeda/dist/join.js
+function t$1(...r) {
+	return o(we, r);
+}
+r(t$1, "t");
+var we = /* @__PURE__ */ r((r, i) => r.join(i), "n");
+//#endregion
+//#region ../../node_modules/.pnpm/remeda@2.37.0/node_modules/remeda/dist/pickBy.js
+function t(...r) {
+	return o(n, r);
+}
+function n(r, i) {
+	let a = {};
+	for (let [o, s] of Object.entries(r)) i(s, o, r) && (a[o] = s);
+	return a;
+}
+var Te = i("outline", "bolt", "Bolt", [["path", {
+	d: "M13 3l0 7l6 0l-8 11l0 -7l-6 0l8 -11",
+	key: "svg-0"
+}]]), Ee = i("outline", "browser", "Browser", [
+	["path", {
+		d: "M4 8h16",
+		key: "svg-0"
+	}],
+	["path", {
+		d: "M4 6a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2l0 -12",
+		key: "svg-1"
+	}],
+	["path", {
+		d: "M8 4v4",
+		key: "svg-2"
+	}]
+]), De = i("outline", "cylinder", "Cylinder", [["path", {
+	d: "M5 6a7 3 0 1 0 14 0a7 3 0 1 0 -14 0",
+	key: "svg-0"
+}], ["path", {
+	d: "M5 6v12c0 1.657 3.134 3 7 3s7 -1.343 7 -3v-12",
+	key: "svg-1"
+}]]), Oe = i("outline", "device-mobile", "DeviceMobile", [
+	["path", {
+		d: "M6 5a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2v-14",
+		key: "svg-0"
+	}],
+	["path", {
+		d: "M11 4h2",
+		key: "svg-1"
+	}],
+	["path", {
+		d: "M12 17v.01",
+		key: "svg-2"
+	}]
+]), ke = i("outline", "file-text", "FileText", [
+	["path", {
+		d: "M14 3v4a1 1 0 0 0 1 1h4",
+		key: "svg-0"
+	}],
+	["path", {
+		d: "M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2",
+		key: "svg-1"
+	}],
+	["path", {
+		d: "M9 9l1 0",
+		key: "svg-2"
+	}],
+	["path", {
+		d: "M9 13l6 0",
+		key: "svg-3"
+	}],
+	["path", {
+		d: "M9 17l6 0",
+		key: "svg-4"
+	}]
+]), Ae = i("outline", "rectangular-prism", "RectangularPrism", [
+	["path", {
+		d: "M21 14.008v-5.018a1.98 1.98 0 0 0 -1 -1.717l-4 -2.008a2.016 2.016 0 0 0 -2 0l-10 5.008c-.619 .355 -1 1.01 -1 1.718v5.018c0 .709 .381 1.363 1 1.717l4 2.008a2.016 2.016 0 0 0 2 0l10 -5.008c.619 -.355 1 -1.01 1 -1.718",
+		key: "svg-0"
+	}],
+	["path", {
+		d: "M9 21v-7.5",
+		key: "svg-1"
+	}],
+	["path", {
+		d: "M9 13.5l11.5 -5.5",
+		key: "svg-2"
+	}],
+	["path", {
+		d: "M3.5 11l5.5 2.5",
+		key: "svg-3"
+	}]
+]), je = i("outline", "reorder", "Reorder", [
+	["path", {
+		d: "M3 16a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1l0 -2",
+		key: "svg-0"
+	}],
+	["path", {
+		d: "M10 16a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1l0 -2",
+		key: "svg-1"
+	}],
+	["path", {
+		d: "M17 16a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v2a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1l0 -2",
+		key: "svg-2"
+	}],
+	["path", {
+		d: "M5 11v-3a3 3 0 0 1 3 -3h8a3 3 0 0 1 3 3v3",
+		key: "svg-3"
+	}],
+	["path", {
+		d: "M16.5 8.5l2.5 2.5l2.5 -2.5",
+		key: "svg-4"
+	}]
+]), Me = i("outline", "user", "User", [["path", {
+	d: "M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0",
+	key: "svg-0"
+}], ["path", {
+	d: "M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2",
+	key: "svg-1"
+}]]), Ne = i("outline", "zoom-scan", "ZoomScan", [
+	["path", {
+		d: "M8 11a3 3 0 1 0 6 0a3 3 0 0 0 -6 0",
+		key: "svg-0"
+	}],
+	["path", {
+		d: "M16 16l-2.5 -2.5",
+		key: "svg-1"
+	}],
+	["path", {
+		d: "M3 7v-2a2 2 0 0 1 2 -2h2",
+		key: "svg-2"
+	}],
+	["path", {
+		d: "M3 17v2a2 2 0 0 0 2 2h2",
+		key: "svg-3"
+	}],
+	["path", {
+		d: "M17 3h2a2 2 0 0 1 2 2v2",
+		key: "svg-4"
+	}],
+	["path", {
+		d: "M17 21h2a2 2 0 0 0 2 -2v-2",
+		key: "svg-5"
+	}]
+]), Pe = ce(null);
+function IconRendererProvider(r) {
+	let i = J(5), { value: a, children: o } = r;
+	if (q(Pe)) {
+		let r;
+		return i[0] === o ? r = i[1] : (r = /* @__PURE__ */ X(Y, { children: o }), i[0] = o, i[1] = r), r;
 	}
-	let i;
-	return t[2] !== r || t[3] !== n ? (i = /* @__PURE__ */ Q(Ae.Provider, {
-		value: n,
-		children: r
-	}), t[2] = r, t[3] = n, t[4] = i) : i = t[4], i;
-}
-function decodeSvgDataUrl(e) {
-	if (!e.startsWith("data:image/svg+xml")) return null;
+	let s;
+	return i[2] !== o || i[3] !== a ? (s = /* @__PURE__ */ X(Pe.Provider, {
+		value: a,
+		children: o
+	}), i[2] = o, i[3] = a, i[4] = s) : s = i[4], s;
+}
+function decodeSvgDataUrl(r) {
+	if (!r.startsWith("data:image/svg+xml")) return null;
 	try {
-		if (e.includes(";base64,")) {
-			let t = e.split(";base64,")[1];
-			if (t) return atob(t);
+		if (r.includes(";base64,")) {
+			let i = r.split(";base64,")[1];
+			if (i) return atob(i);
 		} else {
-			let t = e.split(",")[1];
-			if (t) return decodeURIComponent(t);
+			let i = r.split(",")[1];
+			if (i) return decodeURIComponent(i);
 		}
 	} catch {}
 	return null;
 }
-function IconRenderer({ element: e, className: t, style: n }) {
-	let r = me(Ae);
-	if (!e || !e.icon || e.icon === "none") return null;
-	let i;
+function IconRenderer({ element: r, className: i, style: a }) {
+	let o = q(Pe);
+	if (!r || !r.icon || r.icon === "none") return null;
+	let s;
 	switch (!0) {
-		case e.icon.startsWith("data:image/svg+xml"):
-			i = /* @__PURE__ */ Q(SvgDataUrlIcon, {
-				dataUrl: e.icon,
-				alt: e.title
+		case r.icon.startsWith("data:image/svg+xml"):
+			s = /* @__PURE__ */ X(SvgDataUrlIcon, {
+				dataUrl: r.icon,
+				alt: r.title
 			});
 			break;
-		case e.icon.startsWith("http://"):
-		case e.icon.startsWith("https://"):
-		case e.icon.startsWith("data:image"):
-			i = /* @__PURE__ */ Q("img", {
-				src: e.icon,
-				alt: e.title
+		case r.icon.startsWith("http://"):
+		case r.icon.startsWith("https://"):
+		case r.icon.startsWith("data:image"):
+			s = /* @__PURE__ */ X("img", {
+				src: r.icon,
+				alt: r.title
 			});
 			break;
-		case !!r:
-			i = /* @__PURE__ */ Q(r, { node: e });
+		case !!o:
+			s = /* @__PURE__ */ X(o, { node: r });
 			break;
 		default:
-			i = null;
+			s = null;
 			break;
 	}
-	return i ? /* @__PURE__ */ Q("div", {
-		className: S(t, "likec4-element-icon"),
-		"data-likec4-icon": e.icon,
-		style: n,
-		children: i
+	return s ? /* @__PURE__ */ X("div", {
+		className: w(i, "likec4-element-icon"),
+		"data-likec4-icon": r.icon,
+		style: a,
+		children: s
 	}) : null;
 }
-var je = {
-	browser: j,
-	cylinder: I,
-	mobile: L,
-	person: P,
-	queue: M,
-	rectangle: F,
-	storage: I,
-	bucket: I,
-	document: N,
-	component: F
+var Fe = {
+	browser: Ee,
+	cylinder: De,
+	mobile: Oe,
+	person: Me,
+	queue: je,
+	rectangle: Ae,
+	storage: De,
+	bucket: De,
+	document: ke,
+	component: Ae
 };
-function IconOrShapeRenderer(e) {
-	let t = X(12), { element: n, className: r, style: i } = e;
-	if (!n.icon || n.icon === "none") {
-		let e = je[n.shape], a;
-		t[0] === r ? a = t[1] : (a = S(r, "likec4-shape-icon"), t[0] = r, t[1] = a);
-		let o;
-		t[2] === e ? o = t[3] : (o = /* @__PURE__ */ Q(e, {}), t[2] = e, t[3] = o);
-		let s;
-		return t[4] !== i || t[5] !== a || t[6] !== o ? (s = /* @__PURE__ */ Q("div", {
-			className: a,
-			style: i,
-			children: o
-		}), t[4] = i, t[5] = a, t[6] = o, t[7] = s) : s = t[7], s;
+function IconOrShapeRenderer(r) {
+	let i = J(12), { element: a, className: o, style: s } = r;
+	if (!a.icon || a.icon === "none") {
+		let r = Fe[a.shape], c;
+		i[0] === o ? c = i[1] : (c = w(o, "likec4-shape-icon"), i[0] = o, i[1] = c);
+		let l;
+		i[2] === r ? l = i[3] : (l = /* @__PURE__ */ X(r, {}), i[2] = r, i[3] = l);
+		let u;
+		return i[4] !== s || i[5] !== c || i[6] !== l ? (u = /* @__PURE__ */ X("div", {
+			className: c,
+			style: s,
+			children: l
+		}), i[4] = s, i[5] = c, i[6] = l, i[7] = u) : u = i[7], u;
 	}
-	let a;
-	return t[8] !== r || t[9] !== n || t[10] !== i ? (a = /* @__PURE__ */ Q(IconRenderer, {
-		element: n,
-		className: r,
-		style: i
-	}), t[8] = r, t[9] = n, t[10] = i, t[11] = a) : a = t[11], a;
-}
-function SvgDataUrlIcon(e) {
-	let t = X(11), n, r;
-	t[0] === e ? (n = t[1], r = t[2]) : ({dataUrl: n, ...r} = e, t[0] = e, t[1] = n, t[2] = r);
-	let i;
-	t[3] === n ? i = t[4] : (i = decodeSvgDataUrl(n), t[3] = n, t[4] = i);
-	let a = i;
-	if (!a) return null;
-	let o;
-	t[5] === Symbol.for("react.memo_cache_sentinel") ? (o = { display: "contents" }, t[5] = o) : o = t[5];
-	let s;
-	t[6] === a ? s = t[7] : (s = { __html: a }, t[6] = a, t[7] = s);
 	let c;
-	return t[8] !== r || t[9] !== s ? (c = /* @__PURE__ */ Q("span", {
-		...r,
-		style: o,
-		dangerouslySetInnerHTML: s
-	}), t[8] = r, t[9] = s, t[10] = c) : c = t[10], c;
+	return i[8] !== o || i[9] !== a || i[10] !== s ? (c = /* @__PURE__ */ X(IconRenderer, {
+		element: a,
+		className: o,
+		style: s
+	}), i[8] = o, i[9] = a, i[10] = s, i[11] = c) : c = i[11], c;
+}
+function SvgDataUrlIcon(r) {
+	let i = J(11), a, o;
+	i[0] === r ? (a = i[1], o = i[2]) : ({dataUrl: a, ...o} = r, i[0] = r, i[1] = a, i[2] = o);
+	let s;
+	i[3] === a ? s = i[4] : (s = decodeSvgDataUrl(a), i[3] = a, i[4] = s);
+	let c = s;
+	if (!c) return null;
+	let l;
+	i[5] === Symbol.for("react.memo_cache_sentinel") ? (l = { display: "contents" }, i[5] = l) : l = i[5];
+	let u;
+	i[6] === c ? u = i[7] : (u = { __html: c }, i[6] = c, i[7] = u);
+	let d;
+	return i[8] !== o || i[9] !== u ? (d = /* @__PURE__ */ X("span", {
+		...o,
+		style: l,
+		dangerouslySetInnerHTML: u
+	}), i[8] = o, i[9] = u, i[10] = d) : d = i[10], d;
 }
 //#endregion
 //#region ../diagram/src/base/Background.tsx
-function literalToEnum(e) {
-	switch (e) {
-		case "dots": return U.Dots;
-		case "lines": return U.Lines;
-		case "cross": return U.Cross;
-		default: Se(e);
+function literalToEnum(r) {
+	switch (r) {
+		case "dots": return H.Dots;
+		case "lines": return H.Lines;
+		case "cross": return H.Cross;
+		default: ge(r);
 	}
 }
-var compareProps = (e, t) => typeof e.background == "string" && typeof t.background == "string" ? e.background === t.background : K(e.background, t.background), Me = Y((e) => {
-	let t = X(6), { background: n } = e;
-	if (typeof n == "string") {
-		let e;
-		t[0] === n ? e = t[1] : (e = literalToEnum(n), t[0] = n, t[1] = e);
+var compareProps = (r, i) => typeof r.background == "string" && typeof i.background == "string" ? r.background === i.background : W(r.background, i.background), Ie = le((r) => {
+	let i = J(6), { background: a } = r;
+	if (typeof a == "string") {
 		let r;
-		return t[2] === e ? r = t[3] : (r = /* @__PURE__ */ Q(oe, {
-			variant: e,
+		i[0] === a ? r = i[1] : (r = literalToEnum(a), i[0] = a, i[1] = r);
+		let o;
+		return i[2] === r ? o = i[3] : (o = /* @__PURE__ */ X(U, {
+			variant: r,
 			size: 2,
 			gap: 20
-		}), t[2] = e, t[3] = r), r;
+		}), i[2] = r, i[3] = o), o;
 	}
-	let r;
-	return t[4] === n ? r = t[5] : (r = /* @__PURE__ */ Q(oe, { ...n }), t[4] = n, t[5] = r), r;
+	let o;
+	return i[4] === a ? o = i[5] : (o = /* @__PURE__ */ X(U, { ...a }), i[4] = a, i[5] = o), o;
 }, compareProps);
-Me.displayName = "Background";
+Ie.displayName = "Background";
 //#endregion
 //#region ../diagram/src/hooks/useCallbackRef.ts
-function useCallbackRef(e) {
-	let t = _e(e);
-	return t.current = e, ge(() => {
-		function callbackRef(...e) {
-			return t.current?.(...e);
+function useCallbackRef(r) {
+	let i = fe(r);
+	return i.current = r, de(() => {
+		function callbackRef(...r) {
+			return i.current?.(...r);
 		}
 		return callbackRef;
 	}, []);
@@ -167,124 +342,127 @@ function useCallbackRef(e) {
 //#endregion
 //#region ../diagram/src/hooks/useXYFlow.ts
 function useXYFlow() {
-	return re();
+	return V();
 }
-function useXYStore(e, t) {
-	return W(useCallbackRef(e), t ?? se);
+function useXYStore(r, i) {
+	return B(r, i ?? te);
+}
+function selectXYStore(r) {
+	return r;
 }
 function useXYStoreApi() {
-	return ie();
+	return z();
 }
-function useCurrentZoomAtLeast(e) {
-	let t = X(2), t0;
-	return t[0] === e ? t0 = t[1] : (t0 = (t) => t.transform[2] >= e, t[0] = e, t[1] = t0), W(t0);
+function useCurrentZoomAtLeast(r) {
+	let i = J(2), t0;
+	return i[0] === r ? t0 = i[1] : (t0 = (i) => i.transform[2] >= r, i[0] = r, i[1] = t0), B(t0);
 }
-var selectZoom = (e) => e.transform[2] < .2;
+var selectZoom = (r) => r.transform[2] < .2;
 function useIsZoomTooSmall() {
-	return W(selectZoom);
+	return B(selectZoom);
 }
 //#endregion
 //#region ../diagram/src/utils/roundDpr.ts
 function getDevicePixelRatio() {
-	let e = typeof window < "u" && typeof window.devicePixelRatio == "number" ? window.devicePixelRatio : 1;
-	return r(Math.floor(e), {
+	let r = typeof window < "u" && typeof window.devicePixelRatio == "number" ? window.devicePixelRatio : 1;
+	return t$4(Math.floor(r), {
 		min: 1,
 		max: 4
 	});
 }
-var Ne;
-function roundDpr(e) {
-	return Ne ??= getDevicePixelRatio(), Ne < 2 ? Math.round(e) : Math.round(e * Ne) / Ne;
+var Le;
+function roundDpr(r) {
+	return Le ??= getDevicePixelRatio(), Le < 2 ? Math.round(r) : Math.round(r * Le) / Le;
 }
 //#endregion
 //#region ../diagram/src/utils/xyflow.ts
-function nodeToRect(e) {
+function nodeToRect(r) {
 	return {
-		x: Math.trunc(e.internals.positionAbsolute.x),
-		y: Math.trunc(e.internals.positionAbsolute.y),
-		width: Math.round(e.measured?.width ?? e.width ?? e.initialWidth ?? 0),
-		height: Math.round(e.measured?.height ?? e.height ?? e.initialHeight ?? 0)
+		x: Math.trunc(r.internals.positionAbsolute.x),
+		y: Math.trunc(r.internals.positionAbsolute.y),
+		width: Math.round(r.measured?.width ?? r.width ?? r.initialWidth ?? 0),
+		height: Math.round(r.measured?.height ?? r.height ?? r.initialHeight ?? 0)
 	};
 }
-function getNodeCenter(e) {
-	let { width: t, height: n } = G(e), { x: r, y: i } = e.internals.positionAbsolute;
+function getNodeCenter(r) {
+	let { width: i, height: a } = L(r), { x: o, y: s } = r.internals.positionAbsolute;
 	return {
-		x: Math.round(r + t / 2),
-		y: Math.round(i + n / 2)
+		x: Math.round(o + i / 2),
+		y: Math.round(s + a / 2)
 	};
 }
-function getNodeIntersectionFromCenterToPoint(e, t, n = 0) {
-	let { width: r, height: i } = e, a = Ce.center(e), o = we(t.x, t.y).subtract(a), s = (n + r / 2) / o.x, c = (n + i / 2) / o.y, l = Math.min(Math.abs(s), Math.abs(c));
-	return we(o).multiply(l).add(a).trunc().toObject();
-}
-function bezierControlPoints(e) {
-	let [t, ...r] = e;
-	Ee(t, "start should be defined");
-	let i = [];
-	for (; n(r, 3);) {
-		let [e, n, a, ...o] = r, s = new ce(t[0], t[1], e[0], e[1], n[0], n[1], a[0], a[1]), c = s.inflections();
-		c.length === 0 && c.push(.5), c.forEach((e) => {
-			let { x: t, y: n } = s.get(e);
-			i.push({
-				x: Math.trunc(t),
-				y: Math.trunc(n)
+function getNodeIntersectionFromCenterToPoint(r, i, a = 0) {
+	let { width: o, height: s } = r, c = Q.center(r), l = $(i.x, i.y).subtract(c), u = (a + o / 2) / l.x, d = (a + s / 2) / l.y, f = Math.min(Math.abs(u), Math.abs(d));
+	return $(l).multiply(f).add(c).trunc().toObject();
+}
+function bezierControlPoints(r) {
+	let [i, ...a] = r;
+	ve(i, "start should be defined");
+	let o = [];
+	for (; t$3(a, 3);) {
+		let [r, s, c, ...l] = a, u = new ne(i[0], i[1], r[0], r[1], s[0], s[1], c[0], c[1]), d = u.inflections();
+		d.length === 0 && d.push(.5), d.forEach((r) => {
+			let { x: i, y: a } = u.get(r);
+			o.push({
+				x: Math.trunc(i),
+				y: Math.trunc(a)
 			});
-		}), r = o, t = a;
+		}), a = l, i = c;
 	}
-	return Ee(r.length === 0, "all points should be consumed"), Ee(n(i, 1), "at least one control point should be generated"), i;
-}
-function isSamePoint(e, t) {
-	if (e === t) return !0;
-	let [n, r] = i(e) ? e : [e.x, e.y], [a, o] = i(t) ? t : [t.x, t.y];
-	return Math.hypot(a - n, o - r) < 2.1;
-}
-function stopPropagation(e) {
-	e.nativeEvent.stopImmediatePropagation(), e.stopPropagation();
-}
-var printPoint = (e) => `${Math.trunc(e[0])},${Math.trunc(e[1])}`;
-function bezierPath(e) {
-	let [t, ...r] = e;
-	Ee(t, "start should be defined");
-	let i = `M ${printPoint(t)}`;
-	for (; n(r, 3);) {
-		let [e, t, n, ...a] = r;
-		i += ` C ${printPoint(e)} ${printPoint(t)} ${printPoint(n)}`, r = a;
+	return ve(a.length === 0, "all points should be consumed"), ve(t$3(o, 1), "at least one control point should be generated"), o;
+}
+function isSamePoint(r, i) {
+	if (r === i) return !0;
+	let [a, o] = e$2(r) ? r : [r.x, r.y], [s, c] = e$2(i) ? i : [i.x, i.y];
+	return Math.hypot(s - a, c - o) < 2.1;
+}
+function stopPropagation(r) {
+	r.nativeEvent.stopImmediatePropagation(), r.stopPropagation();
+}
+var printPoint = (r) => `${Math.trunc(r[0])},${Math.trunc(r[1])}`;
+function bezierPath(r) {
+	let [i, ...a] = r;
+	ve(i, "start should be defined");
+	let o = `M ${printPoint(i)}`;
+	for (; t$3(a, 3);) {
+		let [r, i, s, ...c] = a;
+		o += ` C ${printPoint(r)} ${printPoint(i)} ${printPoint(s)}`, a = c;
 	}
-	return Ee(r.length === 0, "all points should be consumed"), i;
+	return ve(a.length === 0, "all points should be consumed"), o;
 }
-function parsePadding(e, t) {
-	if (typeof e == "number") return Math.floor((t - t / (1 + e)) * .5);
-	if (typeof e == "string" && e.endsWith("px")) {
-		let t = parseFloat(e);
-		if (!Number.isNaN(t)) return Math.floor(t);
+function parsePadding(r, i) {
+	if (typeof r == "number") return Math.floor((i - i / (1 + r)) * .5);
+	if (typeof r == "string" && r.endsWith("px")) {
+		let i = parseFloat(r);
+		if (!Number.isNaN(i)) return Math.floor(i);
 	}
-	if (typeof e == "string" && e.endsWith("%")) {
-		let n = parseFloat(e);
-		if (!Number.isNaN(n)) return Math.floor(t * n * .01);
+	if (typeof r == "string" && r.endsWith("%")) {
+		let a = parseFloat(r);
+		if (!Number.isNaN(a)) return Math.floor(i * a * .01);
 	}
-	return console.error(`[React Flow] The padding value "${e}" is invalid. Please provide a number or a string with a valid unit (px or %).`), 0;
+	return console.error(`[React Flow] The padding value "${r}" is invalid. Please provide a number or a string with a valid unit (px or %).`), 0;
 }
-function parsePaddings(e, t, n) {
-	if (typeof e == "string" || typeof e == "number") {
-		let r = parsePadding(e, n), i = parsePadding(e, t);
+function parsePaddings(r, i, a) {
+	if (typeof r == "string" || typeof r == "number") {
+		let o = parsePadding(r, a), s = parsePadding(r, i);
 		return {
-			top: r,
-			right: i,
-			bottom: r,
-			left: i,
-			x: i * 2,
-			y: r * 2
+			top: o,
+			right: s,
+			bottom: o,
+			left: s,
+			x: s * 2,
+			y: o * 2
 		};
 	}
-	if (typeof e == "object") {
-		let r = parsePadding(e.top ?? e.y ?? 0, n), i = parsePadding(e.bottom ?? e.y ?? 0, n), a = parsePadding(e.left ?? e.x ?? 0, t), o = parsePadding(e.right ?? e.x ?? 0, t);
+	if (typeof r == "object") {
+		let o = parsePadding(r.top ?? r.y ?? 0, a), s = parsePadding(r.bottom ?? r.y ?? 0, a), c = parsePadding(r.left ?? r.x ?? 0, i), l = parsePadding(r.right ?? r.x ?? 0, i);
 		return {
-			top: r,
-			right: o,
-			bottom: i,
-			left: a,
-			x: a + o,
-			y: r + i
+			top: o,
+			right: l,
+			bottom: s,
+			left: c,
+			x: c + l,
+			y: o + s
 		};
 	}
 	return {
@@ -298,49 +476,34 @@ function parsePaddings(e, t, n) {
 }
 //#endregion
 //#region ../diagram/src/base/Base.ts
-var _setDimmed = (e, t) => (e.data.dimmed ?? !1) === t ? e : {
-	...e,
-	data: {
-		...e.data,
-		dimmed: t
-	}
-};
-function setDimmed(e, t) {
-	return t === void 0 ? (t) => _setDimmed(t, e) : _setDimmed(e, t);
-}
-var _setHovered = (e, t) => (e.data.hovered ?? !1) === t ? e : {
-	...e,
-	data: {
-		...e.data,
-		hovered: t
-	}
-};
-function setHovered(e, t) {
-	return t === void 0 ? (t) => _setHovered(t, e) : _setHovered(e, t);
-}
-function _setData(e, t) {
-	return a(e.data, t) ? e : {
-		...e,
-		data: {
-			...e.data,
-			...t
-		}
-	};
+var mergeData = (r, i) => Object.assign({}, r, { data: Object.assign({}, r.data, i) }), _setDimmed = (r, i) => (r.data.dimmed ?? !1) === i ? r : mergeData(r, { dimmed: i });
+function setDimmed(r, i) {
+	return i === void 0 ? (i) => _setDimmed(i, r) : _setDimmed(r, i);
+}
+var _setHovered = (r, i) => (r.data.hovered ?? !1) === i ? r : mergeData(r, { hovered: i });
+function setHovered(r, i) {
+	return i === void 0 ? (i) => _setHovered(i, r) : _setHovered(r, i);
 }
-function setData(e, t) {
-	return t === void 0 ? (t) => _setData(t, e) : _setData(e, t);
+function hasSubObject(r, i) {
+	return r === i || t$2(i).every(([i, a]) => W(r[i] ?? void 0, a));
 }
-var Pe = {
+function _setData(r, i) {
+	return hasSubObject(r.data, i) ? r : mergeData(r, i);
+}
+function setData(r, i) {
+	return i === void 0 ? (i) => _setData(i, r) : _setData(r, i);
+}
+var Re = {
 	setDimmed,
 	setHovered,
 	setData
-}, Fe = {
+}, ze = {
 	Compound: 1,
 	Edge: 20,
 	EdgeLabel: 25,
 	Element: 20,
 	Max: 30
-}, Ie = .05, Le = {
+}, Be = .05, Ve = {
 	default: "16px",
 	withControls: {
 		top: "58px",
@@ -350,155 +513,228 @@ var Pe = {
 	}
 };
 //#endregion
+//#region ../diagram/src/base/keyboardZoom.ts
+function isEditableKeyboardTarget(r) {
+	if (!(r instanceof HTMLElement)) return !1;
+	let i = r.tagName.toLowerCase();
+	return i === "input" || i === "textarea" || i === "select" || r.isContentEditable;
+}
+function getKeyboardZoomAction(r) {
+	if (!r.ctrlKey && !r.metaKey || isEditableKeyboardTarget(r.target)) return null;
+	switch (r.key) {
+		case "+":
+		case "=": return "zoom-in";
+		case "-":
+		case "_": return "zoom-out";
+		case "0": return "reset";
+		default: return null;
+	}
+}
+//#endregion
 //#region ../diagram/src/base/BaseXYFlow.tsx
-function BaseXYFlow(e) {
-	let t = X(85), n, r, i, a, o, s, c, l, u, d, f, p, m, h, g, _, y, b, x, C, w, T;
-	t[0] === e ? (n = t[1], r = t[2], i = t[3], a = t[4], o = t[5], s = t[6], c = t[7], l = t[8], u = t[9], d = t[10], f = t[11], p = t[12], m = t[13], h = t[14], g = t[15], _ = t[16], y = t[17], b = t[18], x = t[19], C = t[20], w = t[21], T = t[22]) : ({nodes: o, edges: a, onEdgesChange: l, onNodesChange: p, className: r, pannable: g, zoomable: _, nodesSelectable: y, nodesDraggable: b, background: x, children: n, colorMode: i, fitViewPadding: C, fitView: w, zoomOnDoubleClick: T, onViewportResize: m, onMoveEnd: u, onNodeMouseEnter: d, onNodeMouseLeave: f, onEdgeMouseEnter: s, onEdgeMouseLeave: c, ...h} = e, t[0] = e, t[1] = n, t[2] = r, t[3] = i, t[4] = a, t[5] = o, t[6] = s, t[7] = c, t[8] = l, t[9] = u, t[10] = d, t[11] = f, t[12] = p, t[13] = m, t[14] = h, t[15] = g, t[16] = _, t[17] = y, t[18] = b, t[19] = x, t[20] = C, t[21] = w, t[22] = T);
-	let E = g === void 0 ? !0 : g, D = _ === void 0 ? !0 : _, O = y === void 0 ? !0 : y, k = b === void 0 ? !1 : b, A = x === void 0 ? "dots" : x, j = C === void 0 ? 0 : C, M = w === void 0 ? !0 : w, N = T === void 0 ? !1 : T, P;
-	t[23] === j ? P = t[24] : (P = {
-		minZoom: Ie,
+var He = {
+	"node.a11yDescription.default": "Press Enter or Space to select this node and reveal its actions.",
+	"node.a11yDescription.keyboardDisabled": "Keyboard activation is disabled.",
+	"edge.a11yDescription.default": "Press Enter or Space to select this relationship and reveal its actions."
+};
+function activateFocusedElement(r) {
+	if (r.repeat || r.key !== "Enter" && r.key !== " ") return;
+	let i = r.target;
+	if (!(i instanceof Element)) return;
+	let a = i.closest("a,button,input,textarea,select,[role=\"button\"],[role=\"link\"],[contenteditable=\"true\"]");
+	if (a && !a.classList.contains("react-flow__node") && !a.classList.contains("react-flow__edge")) return;
+	let o = i.closest(".react-flow__node[data-id], .react-flow__edge[data-id]"), s = o?.ownerDocument.defaultView;
+	if (!o || !s) return;
+	r.preventDefault();
+	let c = o.getBoundingClientRect();
+	o.dispatchEvent(new s.MouseEvent("click", {
+		bubbles: !0,
+		cancelable: !0,
+		button: 0,
+		clientX: c.left + c.width / 2,
+		clientY: c.top + c.height / 2,
+		detail: 1,
+		view: s
+	}));
+}
+function BaseXYFlow(r) {
+	let i = J(105), a, o, s, c, l, u, d, p, m, h, g, _, v, y, b, x, S, C, T, E, D, O, k, A, j, M, N;
+	i[0] === r ? (a = i[1], o = i[2], s = i[3], c = i[4], l = i[5], u = i[6], d = i[7], p = i[8], m = i[9], h = i[10], g = i[11], _ = i[12], v = i[13], y = i[14], b = i[15], x = i[16], S = i[17], C = i[18], T = i[19], E = i[20], D = i[21], O = i[22], k = i[23], A = i[24], j = i[25], M = i[26], N = i[27]) : ({nodes: u, edges: l, onEdgesChange: m, onNodesChange: y, className: s, pannable: S, zoomable: E, nodesSelectable: D, nodesDraggable: O, background: k, children: o, colorMode: c, fitViewPadding: A, fitView: j, zoomOnDoubleClick: M, onViewportResize: b, onMoveEnd: g, onNodeMouseEnter: _, onNodeMouseLeave: v, onEdgeMouseEnter: d, onEdgeMouseLeave: p, onKeyDownCapture: h, ariaLabelConfig: a, nodesFocusable: N, edgesFocusable: C, showControls: T, ...x} = r, i[0] = r, i[1] = a, i[2] = o, i[3] = s, i[4] = c, i[5] = l, i[6] = u, i[7] = d, i[8] = p, i[9] = m, i[10] = h, i[11] = g, i[12] = _, i[13] = v, i[14] = y, i[15] = b, i[16] = x, i[17] = S, i[18] = C, i[19] = T, i[20] = E, i[21] = D, i[22] = O, i[23] = k, i[24] = A, i[25] = j, i[26] = M, i[27] = N);
+	let P = S === void 0 ? !0 : S, F = E === void 0 ? !0 : E, I = D === void 0 ? !0 : D, L = O === void 0 ? !1 : O, z = k === void 0 ? "dots" : k, B = A === void 0 ? 0 : A, ee = j === void 0 ? !0 : j, V = M === void 0 ? !1 : M, H = N === void 0 ? L || I : N, U = C === void 0 ? !1 : C, te;
+	i[28] === B ? te = i[29] : (te = {
+		minZoom: Be,
 		maxZoom: 1,
-		padding: j,
+		padding: B,
 		includeHiddenNodes: !1
-	}, t[23] = j, t[24] = P);
-	let F = P, I = A !== "transparent" && A !== "solid", L = useIsZoomTooSmall(), R = useXYStoreApi(), { colorScheme: z } = v();
-	i ||= z === "auto" ? "system" : z;
-	let B = i, ee = o, te = a, re = A === "transparent" && "bg-transparent", V;
-	t[25] !== r || t[26] !== re ? (V = S(re, r), t[25] = r, t[26] = re, t[27] = V) : V = t[27];
-	let H;
-	t[28] === L ? H = t[29] : (H = L && { "data-likec4-zoom-small": !0 }, t[28] = L, t[29] = H);
-	let ie = !E && D, U;
-	t[30] === D ? U = t[31] : (U = !D && { zoomActivationKeyCode: null }, t[30] = D, t[31] = U);
-	let W = D ? 3 : 1, ae = D ? Ie : 1, oe = D || E, G;
-	t[32] === E ? G = t[33] : (G = !E && {
+	}, i[28] = B, i[29] = te);
+	let W = te, ne = z !== "transparent" && z !== "solid", re = useIsZoomTooSmall(), ie = useXYFlow(), ae = useXYStoreApi(), { colorScheme: oe } = f();
+	c ||= oe === "auto" ? "system" : oe;
+	let G = x.tabIndex ?? (F ? 0 : void 0), se = x["aria-label"] !== void 0 || x["aria-labelledby"] !== void 0 || G === void 0 ? x["aria-label"] : "Interactive diagram", t13;
+	i[30] !== W || i[31] !== x || i[32] !== ie || i[33] !== F ? (t13 = (r) => {
+		if (x.onKeyDown?.(r), r.defaultPrevented || !F) return;
+		let i = getKeyboardZoomAction(r.nativeEvent);
+		if (i) switch (r.preventDefault(), i) {
+			case "zoom-in":
+				ie.zoomIn();
+				return;
+			case "zoom-out":
+				ie.zoomOut();
+				return;
+			case "reset":
+				ie.fitView(W);
+				return;
+		}
+	}, i[30] = W, i[31] = x, i[32] = ie, i[33] = F, i[34] = t13) : t13 = i[34];
+	let ce = useCallbackRef(t13), K = c, le = u, q = l, ue = z === "transparent" && "bg-transparent", de;
+	i[35] !== s || i[36] !== ue ? (de = w(ue, s), i[35] = s, i[36] = ue, i[37] = de) : de = i[37];
+	let fe;
+	i[38] === re ? fe = i[39] : (fe = re && { "data-likec4-zoom-small": !0 }, i[38] = re, i[39] = fe);
+	let pe = !P && F, Y;
+	i[40] === F ? Y = i[41] : (Y = !F && { zoomActivationKeyCode: null }, i[40] = F, i[41] = Y);
+	let me = F ? 3 : 1, he = F ? Be : 1, ge = F || P, Q;
+	i[42] === P ? Q = i[43] : (Q = !P && {
 		panActivationKeyCode: null,
 		selectionKeyCode: null
-	}, t[32] = E, t[33] = G);
-	let se = k || O, K = p, ce = l, t25;
-	t[34] !== u || t[35] !== R ? (t25 = (e, t) => {
-		let { x: n, y: r, zoom: i } = t, a = roundDpr(n), o = roundDpr(r);
-		(n !== a || r !== o) && R.setState({ transform: [
-			a,
-			o,
-			i
-		] }), u?.(e, {
-			x: a,
-			y: o,
-			zoom: i
+	}, i[42] = P, i[43] = Q);
+	let $;
+	i[44] === a ? $ = i[45] : ($ = {
+		...He,
+		...a
+	}, i[44] = a, i[45] = $);
+	let _e = y, ve = m, t29;
+	i[46] !== g || i[47] !== ae ? (t29 = (r, i) => {
+		let { x: a, y: o, zoom: s } = i, c = roundDpr(a), l = roundDpr(o);
+		(a !== c || o !== l) && ae.setState({ transform: [
+			c,
+			l,
+			s
+		] }), g?.(r, {
+			x: c,
+			y: l,
+			zoom: s
 		});
-	}, t[34] = u, t[35] = R, t[36] = t25) : t25 = t[36];
-	let le = useCallbackRef(t25), t27;
-	t[37] !== d || t[38] !== p ? (t27 = (e, t) => {
-		if (d) {
-			d(e, t);
+	}, i[46] = g, i[47] = ae, i[48] = t29) : t29 = i[48];
+	let ye = useCallbackRef(t29), t31;
+	i[49] !== _ || i[50] !== y ? (t31 = (r, i) => {
+		if (_) {
+			_(r, i);
 			return;
 		}
-		p([{
-			id: t.id,
+		y([{
+			id: i.id,
 			type: "replace",
-			item: Pe.setHovered(t, !0)
+			item: Re.setHovered(i, !0)
 		}]);
-	}, t[37] = d, t[38] = p, t[39] = t27) : t27 = t[39];
-	let ue = useCallbackRef(t27), t29;
-	t[40] !== f || t[41] !== p ? (t29 = (e, t) => {
-		if (f) {
-			f(e, t);
+	}, i[49] = _, i[50] = y, i[51] = t31) : t31 = i[51];
+	let be = useCallbackRef(t31), t33;
+	i[52] !== v || i[53] !== y ? (t33 = (r, i) => {
+		if (v) {
+			v(r, i);
 			return;
 		}
-		p([{
-			id: t.id,
+		y([{
+			id: i.id,
 			type: "replace",
-			item: Pe.setHovered(t, !1)
+			item: Re.setHovered(i, !1)
 		}]);
-	}, t[40] = f, t[41] = p, t[42] = t29) : t29 = t[42];
-	let de = useCallbackRef(t29), t31;
-	t[43] !== s || t[44] !== l ? (t31 = (e, t) => {
-		if (s) {
-			s(e, t);
+	}, i[52] = v, i[53] = y, i[54] = t33) : t33 = i[54];
+	let xe = useCallbackRef(t33), t35;
+	i[55] !== d || i[56] !== m ? (t35 = (r, i) => {
+		if (d) {
+			d(r, i);
 			return;
 		}
-		l([{
-			id: t.id,
+		m([{
+			id: i.id,
 			type: "replace",
-			item: Pe.setHovered(t, !0)
+			item: Re.setHovered(i, !0)
 		}]);
-	}, t[43] = s, t[44] = l, t[45] = t31) : t31 = t[45];
-	let fe = useCallbackRef(t31), t33;
-	t[46] !== c || t[47] !== l ? (t33 = (e, t) => {
-		if (c) {
-			c(e, t);
+	}, i[55] = d, i[56] = m, i[57] = t35) : t35 = i[57];
+	let Se = useCallbackRef(t35), t37;
+	i[58] !== p || i[59] !== m ? (t37 = (r, i) => {
+		if (p) {
+			p(r, i);
 			return;
 		}
-		l([{
-			id: t.id,
+		m([{
+			id: i.id,
 			type: "replace",
-			item: Pe.setHovered(t, !1)
+			item: Re.setHovered(i, !1)
 		}]);
-	}, t[46] = c, t[47] = l, t[48] = t33) : t33 = t[48];
-	let pe = useCallbackRef(t33), q;
-	t[49] !== A || t[50] !== I ? (q = I && /* @__PURE__ */ Q(Me, { background: A }), t[49] = A, t[50] = I, t[51] = q) : q = t[51];
-	let J;
-	t[52] === m ? J = t[53] : (J = m && /* @__PURE__ */ Q(ViewportResizeHanlder, { onViewportResize: m }), t[52] = m, t[53] = J);
-	let Y;
-	return t[54] !== n || t[55] !== i || t[56] !== a || t[57] !== M || t[58] !== F || t[59] !== o || t[60] !== k || t[61] !== O || t[62] !== l || t[63] !== p || t[64] !== E || t[65] !== h || t[66] !== V || t[67] !== H || t[68] !== ie || t[69] !== U || t[70] !== W || t[71] !== ae || t[72] !== oe || t[73] !== G || t[74] !== se || t[75] !== le || t[76] !== ue || t[77] !== de || t[78] !== fe || t[79] !== pe || t[80] !== q || t[81] !== J || t[82] !== N || t[83] !== D ? (Y = /* @__PURE__ */ $(ne, {
-		colorMode: B,
-		nodes: ee,
-		edges: te,
-		className: V,
-		...H,
-		zoomOnPinch: D,
-		zoomOnScroll: ie,
-		...U,
-		zoomOnDoubleClick: N,
-		maxZoom: W,
-		minZoom: ae,
-		fitView: M,
-		fitViewOptions: F,
-		preventScrolling: oe,
+	}, i[58] = p, i[59] = m, i[60] = t37) : t37 = i[60];
+	let Ce = useCallbackRef(t37), t39;
+	i[61] === h ? t39 = i[62] : (t39 = (r) => {
+		h?.(r), r.defaultPrevented || activateFocusedElement(r);
+	}, i[61] = h, i[62] = t39);
+	let we = useCallbackRef(t39), Te;
+	i[63] !== z || i[64] !== ne ? (Te = ne && /* @__PURE__ */ X(Ie, { background: z }), i[63] = z, i[64] = ne, i[65] = Te) : Te = i[65];
+	let Ee;
+	i[66] === b ? Ee = i[67] : (Ee = b && /* @__PURE__ */ X(ViewportResizeHanlder, { onViewportResize: b }), i[66] = b, i[67] = Ee);
+	let De;
+	return i[68] !== se || i[69] !== o || i[70] !== c || i[71] !== l || i[72] !== U || i[73] !== ee || i[74] !== W || i[75] !== u || i[76] !== L || i[77] !== H || i[78] !== I || i[79] !== m || i[80] !== ce || i[81] !== y || i[82] !== P || i[83] !== x || i[84] !== de || i[85] !== fe || i[86] !== pe || i[87] !== Y || i[88] !== me || i[89] !== he || i[90] !== ge || i[91] !== Q || i[92] !== $ || i[93] !== ye || i[94] !== be || i[95] !== xe || i[96] !== Se || i[97] !== Ce || i[98] !== we || i[99] !== Te || i[100] !== Ee || i[101] !== G || i[102] !== V || i[103] !== F ? (De = /* @__PURE__ */ Z(R, {
+		colorMode: K,
+		nodes: le,
+		edges: q,
+		className: de,
+		...fe,
+		zoomOnPinch: F,
+		zoomOnScroll: pe,
+		...Y,
+		zoomOnDoubleClick: V,
+		maxZoom: me,
+		minZoom: he,
+		fitView: ee,
+		fitViewOptions: W,
+		preventScrolling: ge,
 		defaultMarkerColor: "var(--xy-edge-stroke)",
 		noDragClassName: "nodrag",
 		noPanClassName: "nopan",
 		noWheelClassName: "nowheel",
-		panOnScroll: E,
-		panOnDrag: E,
-		...G,
-		elementsSelectable: O,
-		nodesFocusable: se,
-		edgesFocusable: !1,
-		nodesDraggable: k,
+		panOnScroll: P,
+		panOnDrag: P,
+		...Q,
+		elementsSelectable: I,
+		nodesFocusable: H,
+		edgesFocusable: U,
+		nodesDraggable: L,
+		ariaLabelConfig: $,
 		nodeDragThreshold: 4,
 		nodeClickDistance: 3,
 		paneClickDistance: 3,
 		elevateNodesOnSelect: !1,
 		selectNodesOnDrag: !1,
-		onNodesChange: K,
-		onEdgesChange: ce,
-		onMoveEnd: le,
-		onNodeMouseEnter: ue,
-		onNodeMouseLeave: de,
-		onEdgeMouseEnter: fe,
-		onEdgeMouseLeave: pe,
+		onNodesChange: _e,
+		onEdgesChange: ve,
+		onMoveEnd: ye,
+		onNodeMouseEnter: be,
+		onNodeMouseLeave: xe,
+		onEdgeMouseEnter: Se,
+		onEdgeMouseLeave: Ce,
 		onNodeDoubleClick: stopPropagation,
 		onEdgeDoubleClick: stopPropagation,
-		...h,
+		onKeyDownCapture: we,
+		...x,
+		"aria-label": se,
+		tabIndex: G,
+		onKeyDown: ce,
 		children: [
-			q,
-			J,
-			n
+			Te,
+			Ee,
+			o
 		]
-	}), t[54] = n, t[55] = i, t[56] = a, t[57] = M, t[58] = F, t[59] = o, t[60] = k, t[61] = O, t[62] = l, t[63] = p, t[64] = E, t[65] = h, t[66] = V, t[67] = H, t[68] = ie, t[69] = U, t[70] = W, t[71] = ae, t[72] = oe, t[73] = G, t[74] = se, t[75] = le, t[76] = ue, t[77] = de, t[78] = fe, t[79] = pe, t[80] = q, t[81] = J, t[82] = N, t[83] = D, t[84] = Y) : Y = t[84], Y;
+	}), i[68] = se, i[69] = o, i[70] = c, i[71] = l, i[72] = U, i[73] = ee, i[74] = W, i[75] = u, i[76] = L, i[77] = H, i[78] = I, i[79] = m, i[80] = ce, i[81] = y, i[82] = P, i[83] = x, i[84] = de, i[85] = fe, i[86] = pe, i[87] = Y, i[88] = me, i[89] = he, i[90] = ge, i[91] = Q, i[92] = $, i[93] = ye, i[94] = be, i[95] = xe, i[96] = Se, i[97] = Ce, i[98] = we, i[99] = Te, i[100] = Ee, i[101] = G, i[102] = V, i[103] = F, i[104] = De) : De = i[104], De;
 }
-var selectDimensions = ({ width: e, height: t }) => (e || 1) * (t || 1), ViewportResizeHanlder = (e) => {
-	let t = X(2), { onViewportResize: n } = e, r = W(selectDimensions), i;
-	return t[0] === r ? i = t[1] : (i = [r], t[0] = r, t[1] = i), B(n, i), null;
-}, Re = q(null), ze = Re.Provider;
+var selectDimensions = ({ width: r, height: i }) => (r || 1) * (i || 1), ViewportResizeHanlder = (r) => {
+	let i = J(2), { onViewportResize: a } = r, o = B(selectDimensions), c;
+	return i[0] === o ? c = i[1] : (c = [o], i[0] = o, i[1] = c), s(a, c), null;
+}, Ue = ce(null), We = Ue.Provider;
 function useRootContainerContext() {
-	return me(Re);
+	return q(Ue);
 }
 function useRootContainer() {
-	let e = useRootContainerContext();
-	if (!e) throw Error("useRootContainer must be used within a RootContainer");
-	return e;
+	let r = useRootContainerContext();
+	if (!r) throw Error("useRootContainer must be used within a RootContainer");
+	return r;
 }
 function useRootContainerRef() {
 	return useRootContainer().ref;
@@ -508,40 +744,41 @@ function useRootContainerElement() {
 }
 //#endregion
 //#region ../diagram/src/components/RootContainer.tsx
-function RootContainer(e) {
-	let t = X(18), { id: n, className: r, reduceGraphics: i, children: a } = e, o = i === void 0 ? !1 : i, s = _e(null), [c] = ve(_temp), l = z(c), u = `#${n}`, d;
-	t[0] !== c || t[1] !== n || t[2] !== o || t[3] !== u ? (d = {
-		id: n,
-		ref: s,
-		selector: u,
-		reducedGraphics: o,
-		$panning: c
-	}, t[0] = c, t[1] = n, t[2] = o, t[3] = u, t[4] = d) : d = t[4];
-	let f = d, p;
-	t[5] === r ? p = t[6] : (p = S("likec4-root", r), t[5] = r, t[6] = p);
-	let m;
-	t[7] === o ? m = t[8] : (m = o && { "data-likec4-reduced-graphics": !0 }, t[7] = o, t[8] = m);
-	let h;
-	t[9] !== a || t[10] !== f ? (h = /* @__PURE__ */ Q(ze, {
-		value: f,
-		children: a
-	}), t[9] = a, t[10] = f, t[11] = h) : h = t[11];
-	let g;
-	return t[12] !== n || t[13] !== l || t[14] !== p || t[15] !== m || t[16] !== h ? (g = /* @__PURE__ */ Q("div", {
-		id: n,
-		className: p,
-		ref: s,
-		"data-likec4-diagram-panning": l,
-		...m,
-		children: h
-	}), t[12] = n, t[13] = l, t[14] = p, t[15] = m, t[16] = h, t[17] = g) : g = t[17], g;
-}
-function _temp() {
-	return /* @__PURE__ */ ee(!1);
-}
+function RootContainer(r) {
+	let i = J(18), { id: a, className: o, reduceGraphics: s, children: l } = r, u = s === void 0 ? !1 : s, d = fe(null), [f] = pe(_temp$1), p = c(f), m = `#${a}`, h;
+	i[0] !== f || i[1] !== a || i[2] !== u || i[3] !== m ? (h = {
+		id: a,
+		ref: d,
+		selector: m,
+		reducedGraphics: u,
+		$panning: f
+	}, i[0] = f, i[1] = a, i[2] = u, i[3] = m, i[4] = h) : h = i[4];
+	let g = h, _;
+	i[5] === o ? _ = i[6] : (_ = w("likec4-root", o), i[5] = o, i[6] = _);
+	let v;
+	i[7] === u ? v = i[8] : (v = u && { "data-likec4-reduced-graphics": !0 }, i[7] = u, i[8] = v);
+	let y;
+	i[9] !== l || i[10] !== g ? (y = /* @__PURE__ */ X(We, {
+		value: g,
+		children: l
+	}), i[9] = l, i[10] = g, i[11] = y) : y = i[11];
+	let b;
+	return i[12] !== a || i[13] !== p || i[14] !== _ || i[15] !== v || i[16] !== y ? (b = /* @__PURE__ */ X("div", {
+		id: a,
+		className: _,
+		ref: d,
+		"data-likec4-diagram-panning": p,
+		...v,
+		children: y
+	}), i[12] = a, i[13] = p, i[14] = _, i[15] = v, i[16] = y, i[17] = b) : b = i[17], b;
+}
+function _temp$1() {
+	return /* @__PURE__ */ d(!1);
+}
+r(_temp$1, "_temp");
 //#endregion
 //#region ../diagram/src/context/DefaultMantineProvider.tsx
-var Be = d({
+var Ge = m({
 	autoContrast: !0,
 	primaryColor: "indigo",
 	cursorType: "pointer",
@@ -570,255 +807,292 @@ var Be = d({
 		xl: "var(--spacing-xl)"
 	},
 	components: {
-		SegmentedControl: y.extend({ vars: (e, t) => ({ root: { "--sc-font-size": e.fontSizes[t.fz ?? t.size] } }) }),
-		Portal: g.extend({ defaultProps: { reuseTargetNode: !0 } }),
+		SegmentedControl: v.extend({ vars: (r, i) => ({ root: { "--sc-font-size": r.fontSizes[i.fz ?? i.size] } }) }),
+		Portal: x.extend({ defaultProps: { reuseTargetNode: !0 } }),
 		Tooltip: _.extend({ defaultProps: { color: "dark" } })
 	}
 });
-function DefaultMantineProvider(e) {
-	let t = X(8), n, r, i;
-	t[0] === e ? (n = t[1], r = t[2], i = t[3]) : ({children: n, theme: i, ...r} = e, t[0] = e, t[1] = n, t[2] = r, t[3] = i);
-	let a = i ?? Be, o;
-	return t[4] !== n || t[5] !== r || t[6] !== a ? (o = /* @__PURE__ */ Q(m, {
+function DefaultMantineProvider(r) {
+	let i = J(8), a, o, s;
+	i[0] === r ? (a = i[1], o = i[2], s = i[3]) : ({children: a, theme: s, ...o} = r, i[0] = r, i[1] = a, i[2] = o, i[3] = s);
+	let c = s ?? Ge, l;
+	return i[4] !== a || i[5] !== o || i[6] !== c ? (l = /* @__PURE__ */ X(b, {
 		defaultColorScheme: "auto",
-		theme: a,
-		...r,
-		children: n
-	}), t[4] = n, t[5] = r, t[6] = a, t[7] = o) : o = t[7], o;
+		theme: c,
+		...o,
+		children: a
+	}), i[4] = a, i[5] = o, i[6] = c, i[7] = l) : l = i[7], l;
 }
 //#endregion
 //#region ../diagram/src/context/EnsureMantine.tsx
-function EnsureMantine(e) {
-	let t = X(7), { children: n } = e, r = me(f), t1;
-	t[0] === r ? t1 = t[1] : (t1 = () => {
-		r || console.warn("LikeC4Diagram must be a child of MantineProvider");
-	}, t[0] = r, t[1] = t1);
-	let i;
-	if (t[2] === Symbol.for("react.memo_cache_sentinel") ? (i = [], t[2] = i) : i = t[2], he(t1, i), !r) {
-		let e;
-		return t[3] === n ? e = t[4] : (e = /* @__PURE__ */ Q(DefaultMantineProvider, { children: n }), t[3] = n, t[4] = e), e;
+function EnsureMantine(r) {
+	let i = J(7), { children: a } = r, o = q(p), t1;
+	i[0] === o ? t1 = i[1] : (t1 = () => {
+		o || console.warn("LikeC4Diagram must be a child of MantineProvider");
+	}, i[0] = o, i[1] = t1);
+	let s;
+	if (i[2] === Symbol.for("react.memo_cache_sentinel") ? (s = [], i[2] = s) : s = i[2], ue(t1, s), !o) {
+		let r;
+		return i[3] === a ? r = i[4] : (r = /* @__PURE__ */ X(DefaultMantineProvider, { children: a }), i[3] = a, i[4] = r), r;
 	}
-	let a;
-	return t[5] === n ? a = t[6] : (a = /* @__PURE__ */ Q(Z, { children: n }), t[5] = n, t[6] = a), a;
+	let c;
+	return i[5] === a ? c = i[6] : (c = /* @__PURE__ */ X(Y, { children: a }), i[5] = a, i[6] = c), c;
 }
 //#endregion
 //#region ../diagram/src/context/FramerMotionConfig.tsx
-function FramerMotionConfig(e) {
-	let t = X(6), { reducedMotion: n, children: r } = e, i = n === void 0 ? "user" : n, a = p()?.(), o;
-	t[0] === a ? o = t[1] : (o = a && { nonce: a }, t[0] = a, t[1] = o);
-	let s;
-	return t[2] !== r || t[3] !== i || t[4] !== o ? (s = /* @__PURE__ */ Q(ue, {
-		features: le,
+function FramerMotionConfig(r) {
+	let i = J(6), { reducedMotion: a, children: o } = r, s = a === void 0 ? "user" : a, c = h()?.(), l;
+	i[0] === c ? l = i[1] : (l = c && { nonce: c }, i[0] = c, i[1] = l);
+	let u;
+	return i[2] !== o || i[3] !== s || i[4] !== l ? (u = /* @__PURE__ */ X(ie, {
+		features: ae,
 		strict: !0,
-		children: /* @__PURE__ */ Q(pe, {
-			reducedMotion: i,
-			...o,
-			children: r
+		children: /* @__PURE__ */ X(se, {
+			reducedMotion: s,
+			...l,
+			children: o
 		})
-	}), t[2] = r, t[3] = i, t[4] = o, t[5] = s) : s = t[5], s;
+	}), i[2] = o, i[3] = s, i[4] = l, i[5] = u) : u = i[5], u;
 }
 //#endregion
 //#region ../diagram/src/context/LikeC4ModelContext.tsx
-var Ve = q(null), He = Ve.Provider, Ue = q(null), We = Ue.Provider;
+var Ke = ce(null), qe = Ke.Provider, Je = ce(null), Ye = Je.Provider;
 function useOptionalLikeC4Model() {
-	return me(Ve);
+	return q(Ke);
 }
 function useOptionalCurrentViewModel() {
-	return me(Ue);
+	return q(Je);
 }
 //#endregion
 //#region ../diagram/src/hooks/useId.ts
 function useId$1() {
-	let e = X(2), t = h(), n;
-	return e[0] === t ? n = e[1] : (n = t.replace("mantine-", "likec4-"), e[0] = t, e[1] = n), n;
+	let r = J(2), i = g(), a;
+	return r[0] === i ? a = r[1] : (a = i.replace("mantine-", "likec4-"), r[0] = i, r[1] = a), a;
+}
+r(useId$1, "useId");
+//#endregion
+//#region ../diagram/src/context/LikeC4ProjectsContext.ts
+var Xe = ce(null), Ze = Xe.Provider;
+function useOptionalProjectsContext() {
+	return q(Xe);
+}
+//#endregion
+//#region ../diagram/src/hooks/useLikeC4Project.ts
+var Qe = [];
+function onProjectChange(r) {
+	console.warn(`Triggered callback to change project to ${r}, but no <LikeC4ProjectsProvider/> found`);
+}
+var $e = {
+	projects: Qe,
+	onProjectChange
+};
+function useLikeC4ProjectsContext() {
+	return useOptionalProjectsContext() ?? $e;
+}
+function useLikeC4Projects() {
+	return useLikeC4ProjectsContext().projects;
+}
+function useChangeLikeC4Project() {
+	return useLikeC4ProjectsContext().onProjectChange;
+}
+function useLikeC4ProjectId() {
+	let r = useOptionalLikeC4Model();
+	if (!r) throw Error("No LikeC4ModelProvider found");
+	return r.projectId;
 }
-e(useId$1, "useId");
 //#endregion
 //#region ../diagram/src/hooks/useLikeC4Styles.ts
 function useLikeC4Styles() {
-	return useOptionalLikeC4Model()?.$styles ?? De.DEFAULT;
+	return useOptionalLikeC4Model()?.$styles ?? ye.DEFAULT;
 }
 //#endregion
 //#region ../diagram/src/utils/view-bounds.ts
-function pickViewBounds(e, t) {
-	if (e._type === "dynamic") try {
-		if ((t ?? e.variant) === "sequence") return be(e.sequenceLayout, "Sequence layout is not available"), be(e.sequenceLayout.bounds, "Sequence layout bounds are not available"), e.sequenceLayout.bounds;
-	} catch (e) {
-		console.error(e);
+function pickViewBounds(r, i) {
+	if (r._type === "dynamic") try {
+		if ((i ?? r.variant) === "sequence") return he(r.sequenceLayout, "Sequence layout is not available"), he(r.sequenceLayout.bounds, "Sequence layout bounds are not available"), r.sequenceLayout.bounds;
+	} catch (r) {
+		console.error(r);
 	}
-	return e.bounds;
-}
-function calcEdgeBounds({ points: e, controlPoints: t, labelBBox: n }) {
-	let r = Infinity, i = Infinity, a = -Infinity, o = -Infinity;
-	if (t) for (let e of t) r = Math.min(r, e.x), i = Math.min(i, e.y), a = Math.max(a, e.x), o = Math.max(o, e.y);
-	else for (let [t, n] of e) r = Math.min(r, t), i = Math.min(i, n), a = Math.max(a, t), o = Math.max(o, n);
-	return n && (r = Math.min(r, n.x), i = Math.min(i, n.y), a = Math.max(a, n.x + n.width), o = Math.max(o, n.y + n.height)), {
-		x: r,
-		y: i,
-		width: a - r,
-		height: o - i
+	return r.bounds;
+}
+function calcEdgeBounds({ points: r, controlPoints: i, labelBBox: a }) {
+	let o = Infinity, s = Infinity, c = -Infinity, l = -Infinity;
+	if (i) for (let r of i) o = Math.min(o, r.x), s = Math.min(s, r.y), c = Math.max(c, r.x), l = Math.max(l, r.y);
+	else for (let [i, a] of r) o = Math.min(o, i), s = Math.min(s, a), c = Math.max(c, i), l = Math.max(l, a);
+	return a && (o = Math.min(o, a.x), s = Math.min(s, a.y), c = Math.max(c, a.x + a.width), l = Math.max(l, a.y + a.height)), {
+		x: o,
+		y: s,
+		width: c - o,
+		height: l - s
 	};
 }
-function calcViewBounds({ nodes: e, edges: t }) {
-	return Ce.expand(Ce.merge(...e, ...t.map(calcEdgeBounds).filter((e) => isFinite(e.x) && isFinite(e.y))), 20);
+function calcViewBounds({ nodes: r, edges: i }) {
+	return Q.expand(Q.merge(...r, ...i.map(calcEdgeBounds).filter((r) => isFinite(r.x) && isFinite(r.y))), 20);
+}
+//#endregion
+//#region ../diagram/src/utils/readableText.ts
+var et = /\s+/g;
+function readableText(r) {
+	return me.from(r).text?.replace(et, " ").trim() || null;
 }
 //#endregion
 //#region ../diagram/src/base-primitives/edge/EdgeContainer.tsx
-function EdgeContainer(e) {
-	let t = X(33), { className: n, component: r, selectable: i, selected: a, data: o, animated: s, children: c, style: l } = e, u = r === void 0 ? "g" : r, d = i === void 0 ? !1 : i, f = a === void 0 ? !1 : a, p, m, h, g, _;
-	t[0] === o ? (p = t[1], m = t[2], h = t[3], g = t[4], _ = t[5]) : ({color: m, hovered: h, active: g, dimmed: _, ...p} = o, t[0] = o, t[1] = p, t[2] = m, t[3] = h, t[4] = g, t[5] = _);
-	let v = m === void 0 ? "gray" : m, y = h === void 0 ? !1 : h, b = g === void 0 ? !1 : g, x = _ === void 0 ? !1 : _, C = s === void 0 ? !1 : s;
-	C ||= b;
-	let w = f && "selected", T = d && "selectable", E;
-	t[6] !== n || t[7] !== w || t[8] !== T ? (E = S(n, "likec4-edge-container", w, T), t[6] = n, t[7] = w, t[8] = T, t[9] = E) : E = t[9];
-	let D = p.dir ?? "forward", O;
-	t[10] === C ? O = t[11] : (O = C && { "data-likec4-animated": C }, t[10] = C, t[11] = O);
-	let k;
-	t[12] === f ? k = t[13] : (k = f && { "data-likec4-selected": f }, t[12] = f, t[13] = k);
-	let A;
-	t[14] === x ? A = t[15] : (A = x !== !1 && { "data-likec4-dimmed": x }, t[14] = x, t[15] = A);
-	let j;
-	t[16] !== v || t[17] !== b || t[18] !== y || t[19] !== E || t[20] !== D || t[21] !== O || t[22] !== k || t[23] !== A ? (j = {
-		className: E,
-		"data-likec4-color": v,
-		"data-edge-dir": D,
-		"data-edge-active": b,
-		"data-likec4-hovered": y,
-		...O,
-		...k,
-		...A
-	}, t[16] = v, t[17] = b, t[18] = y, t[19] = E, t[20] = D, t[21] = O, t[22] = k, t[23] = A, t[24] = j) : j = t[24];
-	let M = j;
-	if (u === "svg") {
-		let e;
-		return t[25] !== c || t[26] !== M || t[27] !== l ? (e = /* @__PURE__ */ Q("svg", {
-			style: l,
-			...M,
-			children: c
-		}), t[25] = c, t[26] = M, t[27] = l, t[28] = e) : e = t[28], e;
+function EdgeContainer(r) {
+	let i = J(47), a, o, s, c, l, u, d, f, p, m, h, g;
+	if (i[0] !== r) {
+		let { className: _, component: v, selectable: y, selected: b, data: x, animated: S, children: C, style: T, ...E } = r;
+		a = C, s = T, o = v === void 0 ? "g" : v;
+		let D = y === void 0 ? !1 : y, O = b === void 0 ? !1 : b, k, A, j, M, N;
+		i[13] === x ? (k = i[14], A = i[15], j = i[16], M = i[17], N = i[18]) : ({color: A, hovered: j, active: M, dimmed: N, ...k} = x, i[13] = x, i[14] = k, i[15] = A, i[16] = j, i[17] = M, i[18] = N);
+		let P = A === void 0 ? "gray" : A, F = j === void 0 ? !1 : j, I = M === void 0 ? !1 : M, L = N === void 0 ? !1 : N, R = S === void 0 ? !1 : S;
+		R ||= I;
+		let z = O && "selected", B = D && "selectable";
+		i[19] !== _ || i[20] !== z || i[21] !== B ? (c = w(_, "likec4-edge-container", z, B), i[19] = _, i[20] = z, i[21] = B, i[22] = c) : c = i[22], l = P, u = k.dir ?? "forward", d = I, f = F, i[23] === R ? p = i[24] : (p = R && { "data-likec4-animated": R }, i[23] = R, i[24] = p), i[25] === O ? m = i[26] : (m = O && { "data-likec4-selected": O }, i[25] = O, i[26] = m), i[27] === L ? h = i[28] : (h = L !== !1 && { "data-likec4-dimmed": L }, i[27] = L, i[28] = h), g = t(E, _temp), i[0] = r, i[1] = a, i[2] = o, i[3] = s, i[4] = c, i[5] = l, i[6] = u, i[7] = d, i[8] = f, i[9] = p, i[10] = m, i[11] = h, i[12] = g;
+	} else a = i[1], o = i[2], s = i[3], c = i[4], l = i[5], u = i[6], d = i[7], f = i[8], p = i[9], m = i[10], h = i[11], g = i[12];
+	let _;
+	i[29] !== c || i[30] !== l || i[31] !== u || i[32] !== d || i[33] !== f || i[34] !== p || i[35] !== m || i[36] !== h || i[37] !== g ? (_ = {
+		className: c,
+		"data-likec4-color": l,
+		"data-edge-dir": u,
+		"data-edge-active": d,
+		"data-likec4-hovered": f,
+		...p,
+		...m,
+		...h,
+		...g
+	}, i[29] = c, i[30] = l, i[31] = u, i[32] = d, i[33] = f, i[34] = p, i[35] = m, i[36] = h, i[37] = g, i[38] = _) : _ = i[38];
+	let v = _;
+	if (o === "svg") {
+		let r;
+		return i[39] !== a || i[40] !== v || i[41] !== s ? (r = /* @__PURE__ */ X("svg", {
+			style: s,
+			...v,
+			children: a
+		}), i[39] = a, i[40] = v, i[41] = s, i[42] = r) : r = i[42], r;
 	}
-	be(u === "g", "EdgeContainer: component must be \"g\" or \"svg\"");
-	let N;
-	return t[29] !== c || t[30] !== M || t[31] !== l ? (N = /* @__PURE__ */ Q("g", {
-		style: l,
-		...M,
-		children: c
-	}), t[29] = c, t[30] = M, t[31] = l, t[32] = N) : N = t[32], N;
+	he(o === "g", "EdgeContainer: component must be \"g\" or \"svg\"");
+	let y;
+	return i[43] !== a || i[44] !== v || i[45] !== s ? (y = /* @__PURE__ */ X("g", {
+		style: s,
+		...v,
+		children: a
+	}), i[43] = a, i[44] = v, i[45] = s, i[46] = y) : y = i[46], y;
+}
+function _temp(r, i) {
+	return r !== void 0 && i.startsWith("data-");
 }
 //#endregion
 //#region ../diagram/src/base-primitives/edge/EdgeLabel.tsx
-var Ge = J((e, t) => {
-	let n = X(33), r, i, a, o, s;
-	n[0] === e ? (r = n[1], i = n[2], a = n[3], o = n[4], s = n[5]) : ({edgeProps: o, pointerEvents: s, className: i, children: r, ...a} = e, n[0] = e, n[1] = r, n[2] = i, n[3] = a, n[4] = o, n[5] = s);
-	let { id: c, data: l, selected: d, selectable: f } = o, { label: p, technology: m, hovered: h } = l, g = h === void 0 ? !1 : h, _ = d === void 0 ? !1 : d, v = f === void 0 ? !1 : f, y = s === void 0 ? "all" : s, b;
-	n[6] === c ? b = n[7] : (b = xe(c) ? ye(c) : null, n[6] = c, n[7] = b);
-	let C = b, w = C !== null, T;
-	n[8] !== p || n[9] !== m ? (T = u(p) || u(m), n[8] = p, n[9] = m, n[10] = T) : T = n[10];
-	let D = T, O;
-	n[11] !== i || n[12] !== w || n[13] !== y || n[14] !== v ? (O = S("likec4-edge-label", E({
-		pointerEvents: y,
-		isStepEdge: w,
-		cursor: v || w ? "pointer" : "default"
-	}), i), n[11] = i, n[12] = w, n[13] = y, n[14] = v, n[15] = O) : O = n[15];
-	let k = g && !_ ? 1.06 : 1, A;
-	n[16] === k ? A = n[17] : (A = { scale: k }, n[16] = k, n[17] = A);
-	let j;
-	n[18] === C ? j = n[19] : (j = C !== null && /* @__PURE__ */ Q(x, {
+var tt = K((r, i) => {
+	let a = J(34), o, s, c, l, u, d, f;
+	a[0] === r ? (o = a[1], s = a[2], c = a[3], l = a[4], u = a[5], d = a[6], f = a[7]) : ({edgeProps: u, isSequenceStep: d, stepNum: l, pointerEvents: f, className: s, children: o, ...c} = r, a[0] = r, a[1] = o, a[2] = s, a[3] = c, a[4] = l, a[5] = u, a[6] = d, a[7] = f);
+	let { id: p, data: m, selected: h, selectable: g } = u, { label: _, technology: v, hovered: y } = m, b = y === void 0 ? !1 : y, x = h === void 0 ? !1 : h, S = g === void 0 ? !1 : g, T = d === void 0 ? !1 : d, E = f === void 0 ? "all" : f, D;
+	a[8] !== _ || a[9] !== v ? (D = e(_) || e(v), a[8] = _, a[9] = v, a[10] = D) : D = a[10];
+	let k = D, A;
+	a[11] !== s || a[12] !== T || a[13] !== E || a[14] !== S ? (A = w("likec4-edge-label", O({
+		pointerEvents: E,
+		isStepEdge: T,
+		cursor: S || T ? "pointer" : "default"
+	}), s), a[11] = s, a[12] = T, a[13] = E, a[14] = S, a[15] = A) : A = a[15];
+	let j = b && !x ? 1.06 : 1, M;
+	a[16] === j ? M = a[17] : (M = { scale: j }, a[16] = j, a[17] = M);
+	let N;
+	a[18] !== T || a[19] !== l ? (N = T && l && /* @__PURE__ */ X(C, {
 		className: "likec4-edge-label__step-number",
-		children: C
-	}), n[18] = C, n[19] = j);
-	let M;
-	n[20] !== r || n[21] !== D || n[22] !== p || n[23] !== m ? (M = D && /* @__PURE__ */ $(x, {
+		children: l
+	}), a[18] = T, a[19] = l, a[20] = N) : N = a[20];
+	let P;
+	a[21] !== o || a[22] !== k || a[23] !== _ || a[24] !== v ? (P = k && /* @__PURE__ */ Z(C, {
 		className: "likec4-edge-label__contents",
 		children: [
-			u(p) && /* @__PURE__ */ Q(x, {
+			e(_) && /* @__PURE__ */ X(C, {
 				lineClamp: 5,
 				className: "likec4-edge-label__text",
-				children: p
+				children: _
 			}),
-			u(m) && /* @__PURE__ */ Q(x, {
+			e(v) && /* @__PURE__ */ X(C, {
 				className: "likec4-edge-label__technology",
-				children: "[ " + m + " ]"
+				children: "[ " + v + " ]"
 			}),
-			r
+			o
 		]
-	}), n[20] = r, n[21] = D, n[22] = p, n[23] = m, n[24] = M) : M = n[24];
-	let N;
-	return n[25] !== c || n[26] !== t || n[27] !== a || n[28] !== A || n[29] !== j || n[30] !== M || n[31] !== O ? (N = /* @__PURE__ */ $(fe, {
-		ref: t,
-		className: O,
-		"data-edge-id": c,
-		animate: A,
-		...a,
-		children: [j, M]
-	}), n[25] = c, n[26] = t, n[27] = a, n[28] = A, n[29] = j, n[30] = M, n[31] = O, n[32] = N) : N = n[32], N;
+	}), a[21] = o, a[22] = k, a[23] = _, a[24] = v, a[25] = P) : P = a[25];
+	let F;
+	return a[26] !== p || a[27] !== i || a[28] !== c || a[29] !== M || a[30] !== N || a[31] !== P || a[32] !== A ? (F = /* @__PURE__ */ Z(G, {
+		ref: i,
+		className: A,
+		"data-edge-id": p,
+		animate: M,
+		...c,
+		children: [N, P]
+	}), a[26] = p, a[27] = i, a[28] = c, a[29] = M, a[30] = N, a[31] = P, a[32] = A, a[33] = F) : F = a[33], F;
 });
-Ge.displayName = "EdgeLabel";
+tt.displayName = "EdgeLabel";
 //#endregion
 //#region ../diagram/src/base-primitives/edge/EdgeLabelContainer.tsx
-var toCssVarValue = (e) => e === void 0 ? "" : t(e) ? `${Math.trunc(e)}px` : e;
-function EdgeLabelContainer(e) {
-	let t = X(42), n, r, i, a, o, s;
-	t[0] === e ? (n = t[1], r = t[2], i = t[3], a = t[4], o = t[5], s = t[6]) : ({edgeProps: s, labelPosition: a, className: r, style: i, children: n, ...o} = e, t[0] = e, t[1] = n, t[2] = r, t[3] = i, t[4] = a, t[5] = o, t[6] = s);
-	let { id: c, selected: l, data: u, animated: d } = s, f = l === void 0 ? !1 : l, { hovered: p, active: m, dimmed: h, labelBBox: g, color: _ } = u, v = p === void 0 ? !1 : p, y = m === void 0 ? !1 : m, b = h === void 0 ? !1 : h, x = _ === void 0 ? "gray" : _, C = a?.x ?? g?.x, w = a?.y ?? g?.y;
-	if (C === void 0 || w === void 0) return null;
-	let T = a?.translate ?? "";
-	d ||= y;
-	let E = c, D;
-	t[7] === r ? D = t[8] : (D = S("nodrag nopan", "likec4-edge-label-container", r), t[7] = r, t[8] = D);
-	let O = d || y, k;
-	t[9] === d ? k = t[10] : (k = d && { "data-likec4-animated": d }, t[9] = d, t[10] = k);
-	let A;
-	t[11] === f ? A = t[12] : (A = f !== !1 && { "data-likec4-selected": f }, t[11] = f, t[12] = A);
-	let j;
-	t[13] === b ? j = t[14] : (j = b !== !1 && { "data-likec4-dimmed": b }, t[13] = b, t[14] = j);
-	let M;
-	t[15] === C ? M = t[16] : (M = toCssVarValue(C), t[15] = C, t[16] = M);
+var toCssVarValue = (r) => r === void 0 ? "" : e$1(r) ? `${Math.trunc(r)}px` : r;
+function EdgeLabelContainer(r) {
+	let i = J(42), a, o, s, c, l, u;
+	i[0] === r ? (a = i[1], o = i[2], s = i[3], c = i[4], l = i[5], u = i[6]) : ({edgeProps: u, labelPosition: c, className: o, style: s, children: a, ...l} = r, i[0] = r, i[1] = a, i[2] = o, i[3] = s, i[4] = c, i[5] = l, i[6] = u);
+	let { id: d, selected: f, data: p, animated: m } = u, h = f === void 0 ? !1 : f, { hovered: g, active: _, dimmed: v, labelBBox: y, color: b } = p, x = g === void 0 ? !1 : g, S = _ === void 0 ? !1 : _, C = v === void 0 ? !1 : v, T = b === void 0 ? "gray" : b, E = c?.x ?? y?.x, D = c?.y ?? y?.y;
+	if (E === void 0 || D === void 0) return null;
+	let O = c?.translate ?? "";
+	m ||= S;
+	let k = d, A;
+	i[7] === o ? A = i[8] : (A = w("nodrag nopan", "likec4-edge-label-container", o), i[7] = o, i[8] = A);
+	let j = m || S, M;
+	i[9] === m ? M = i[10] : (M = m && { "data-likec4-animated": m }, i[9] = m, i[10] = M);
 	let N;
-	t[17] === w ? N = t[18] : (N = toCssVarValue(w), t[17] = w, t[18] = N);
-	let P = `translate(${M}, ${N}) ${T}`, F;
-	t[19] === P ? F = t[20] : (F = { transform: P }, t[19] = P, t[20] = F);
+	i[11] === h ? N = i[12] : (N = h !== !1 && { "data-likec4-selected": h }, i[11] = h, i[12] = N);
+	let P;
+	i[13] === C ? P = i[14] : (P = C !== !1 && { "data-likec4-dimmed": C }, i[13] = C, i[14] = P);
+	let F;
+	i[15] === E ? F = i[16] : (F = toCssVarValue(E), i[15] = E, i[16] = F);
 	let I;
-	t[21] === g ? I = t[22] : (I = g && { maxWidth: g.width + 20 }, t[21] = g, t[22] = I);
-	let L;
-	t[23] !== i || t[24] !== I ? (L = {
-		...i,
-		...I
-	}, t[23] = i, t[24] = I, t[25] = L) : L = t[25];
-	let R;
-	t[26] !== n || t[27] !== L ? (R = /* @__PURE__ */ Q("div", {
-		style: L,
-		children: n
-	}), t[26] = n, t[27] = L, t[28] = R) : R = t[28];
+	i[17] === D ? I = i[18] : (I = toCssVarValue(D), i[17] = D, i[18] = I);
+	let L = `translate(${F}, ${I}) ${O}`, R;
+	i[19] === L ? R = i[20] : (R = { transform: L }, i[19] = L, i[20] = R);
 	let z;
-	return t[29] !== x || t[30] !== c || t[31] !== y || t[32] !== v || t[33] !== o || t[34] !== O || t[35] !== k || t[36] !== A || t[37] !== j || t[38] !== F || t[39] !== R || t[40] !== D ? (z = /* @__PURE__ */ Q(ae, { children: /* @__PURE__ */ Q("div", {
-		...o,
-		className: D,
-		"data-likec4-hovered": v,
-		"data-likec4-color": x,
-		"data-edge-active": y,
-		"data-edge-animated": O,
-		...k,
-		...A,
-		...j,
-		style: F,
-		children: R
-	}, E) }), t[29] = x, t[30] = c, t[31] = y, t[32] = v, t[33] = o, t[34] = O, t[35] = k, t[36] = A, t[37] = j, t[38] = F, t[39] = R, t[40] = D, t[41] = z) : z = t[41], z;
+	i[21] === y ? z = i[22] : (z = y && { maxWidth: y.width + 20 }, i[21] = y, i[22] = z);
+	let B;
+	i[23] !== s || i[24] !== z ? (B = {
+		...s,
+		...z
+	}, i[23] = s, i[24] = z, i[25] = B) : B = i[25];
+	let V;
+	i[26] !== a || i[27] !== B ? (V = /* @__PURE__ */ X("div", {
+		style: B,
+		children: a
+	}), i[26] = a, i[27] = B, i[28] = V) : V = i[28];
+	let H;
+	return i[29] !== T || i[30] !== d || i[31] !== S || i[32] !== x || i[33] !== l || i[34] !== j || i[35] !== M || i[36] !== N || i[37] !== P || i[38] !== R || i[39] !== V || i[40] !== A ? (H = /* @__PURE__ */ X(ee, { children: /* @__PURE__ */ X("div", {
+		...l,
+		className: A,
+		"data-likec4-hovered": x,
+		"data-likec4-color": T,
+		"data-edge-active": S,
+		"data-edge-animated": j,
+		...M,
+		...N,
+		...P,
+		style: R,
+		children: V
+	}, k) }), i[29] = T, i[30] = d, i[31] = S, i[32] = x, i[33] = l, i[34] = j, i[35] = M, i[36] = N, i[37] = P, i[38] = R, i[39] = V, i[40] = A, i[41] = H) : H = i[41], H;
 }
 //#endregion
 //#region ../diagram/src/base-primitives/edge/EdgeMarkers.tsx
-var Open = (e) => {
-	let t = X(3), n;
-	t[0] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ Q("path", {
+var Open = (r) => {
+	let i = J(3), a;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ X("path", {
 		d: "M0,0 L7,4 L0,8 L4,4 Z",
 		stroke: "context-stroke",
 		fill: "context-stroke",
 		strokeDasharray: 0,
 		strokeWidth: 1,
 		strokeLinecap: "round"
-	}), t[0] = n) : n = t[0];
-	let r;
-	return t[1] === e ? r = t[2] : (r = /* @__PURE__ */ Q("marker", {
+	}), i[0] = a) : a = i[0];
+	let o;
+	return i[1] === r ? o = i[2] : (o = /* @__PURE__ */ X("marker", {
 		viewBox: "-4 -4 14 16",
 		refX: 5,
 		refY: 4,
@@ -826,18 +1100,18 @@ var Open = (e) => {
 		markerHeight: "8",
 		preserveAspectRatio: "xMaxYMid meet",
 		orient: "auto-start-reverse",
-		...e,
-		children: n
-	}), t[1] = e, t[2] = r), r;
-}, Arrow = (e) => {
-	let t = X(3), n;
-	t[0] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ Q("path", {
+		...r,
+		children: a
+	}), i[1] = r, i[2] = o), o;
+}, Arrow = (r) => {
+	let i = J(3), a;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ X("path", {
 		d: "M 0 0 L 8 3 L 0 6 L 1 3 z",
 		fill: "context-stroke",
 		strokeWidth: 0
-	}), t[0] = n) : n = t[0];
-	let r;
-	return t[1] === e ? r = t[2] : (r = /* @__PURE__ */ Q("marker", {
+	}), i[0] = a) : a = i[0];
+	let o;
+	return i[1] === r ? o = i[2] : (o = /* @__PURE__ */ X("marker", {
 		viewBox: "-1 -1 12 10",
 		refX: 4,
 		refY: 3,
@@ -845,18 +1119,18 @@ var Open = (e) => {
 		markerHeight: "6",
 		preserveAspectRatio: "xMaxYMid meet",
 		orient: "auto-start-reverse",
-		...e,
-		children: n
-	}), t[1] = e, t[2] = r), r;
-}, Crow = (e) => {
-	let t = X(3), n;
-	t[0] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ Q("path", {
+		...r,
+		children: a
+	}), i[1] = r, i[2] = o), o;
+}, Crow = (r) => {
+	let i = J(3), a;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ X("path", {
 		d: "M 8 0 L 0 4 L 8 8 M 8 4 L 0 4",
 		fill: "none",
 		strokeWidth: 1
-	}), t[0] = n) : n = t[0];
-	let r;
-	return t[1] === e ? r = t[2] : (r = /* @__PURE__ */ Q("marker", {
+	}), i[0] = a) : a = i[0];
+	let o;
+	return i[1] === r ? o = i[2] : (o = /* @__PURE__ */ X("marker", {
 		viewBox: "-1 -1 12 12",
 		refX: 8,
 		refY: 4,
@@ -864,21 +1138,21 @@ var Open = (e) => {
 		markerHeight: "8",
 		preserveAspectRatio: "xMaxYMid meet",
 		orient: "auto-start-reverse",
-		...e,
-		children: n
-	}), t[1] = e, t[2] = r), r;
-}, OArrow = (e) => {
-	let t = X(3), n;
-	t[0] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ Q("path", {
+		...r,
+		children: a
+	}), i[1] = r, i[2] = o), o;
+}, OArrow = (r) => {
+	let i = J(3), a;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ X("path", {
 		d: "M 0 0 L 8 3 L 0 6 L 1 3 z",
 		stroke: "context-stroke",
 		fill: "var(--likec4-background-color)",
 		strokeWidth: 1.25,
 		strokeLinejoin: "miter",
 		strokeLinecap: "square"
-	}), t[0] = n) : n = t[0];
-	let r;
-	return t[1] === e ? r = t[2] : (r = /* @__PURE__ */ Q("marker", {
+	}), i[0] = a) : a = i[0];
+	let o;
+	return i[1] === r ? o = i[2] : (o = /* @__PURE__ */ X("marker", {
 		viewBox: "-1 -1 12 10",
 		refX: 4,
 		refY: 3,
@@ -886,19 +1160,19 @@ var Open = (e) => {
 		markerHeight: "6",
 		preserveAspectRatio: "xMaxYMid meet",
 		orient: "auto-start-reverse",
-		...e,
-		children: n
-	}), t[1] = e, t[2] = r), r;
-}, Diamond = (e) => {
-	let t = X(3), n;
-	t[0] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ Q("path", {
+		...r,
+		children: a
+	}), i[1] = r, i[2] = o), o;
+}, Diamond = (r) => {
+	let i = J(3), a;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ X("path", {
 		d: "M5,0 L10,4 L5,8 L0,4 Z",
 		fill: "context-stroke",
 		strokeWidth: 0,
 		strokeLinecap: "round"
-	}), t[0] = n) : n = t[0];
-	let r;
-	return t[1] === e ? r = t[2] : (r = /* @__PURE__ */ Q("marker", {
+	}), i[0] = a) : a = i[0];
+	let o;
+	return i[1] === r ? o = i[2] : (o = /* @__PURE__ */ X("marker", {
 		viewBox: "-4 -4 16 14",
 		refX: 5,
 		refY: 4,
@@ -906,20 +1180,20 @@ var Open = (e) => {
 		markerHeight: "8",
 		preserveAspectRatio: "xMaxYMid meet",
 		orient: "auto-start-reverse",
-		...e,
-		children: n
-	}), t[1] = e, t[2] = r), r;
-}, ODiamond = (e) => {
-	let t = X(3), n;
-	t[0] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ Q("path", {
+		...r,
+		children: a
+	}), i[1] = r, i[2] = o), o;
+}, ODiamond = (r) => {
+	let i = J(3), a;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ X("path", {
 		d: "M5,0 L10,4 L5,8 L0,4 Z",
 		stroke: "context-stroke",
 		fill: "var(--likec4-background-color)",
 		strokeWidth: 1.25,
 		strokeLinecap: "round"
-	}), t[0] = n) : n = t[0];
-	let r;
-	return t[1] === e ? r = t[2] : (r = /* @__PURE__ */ Q("marker", {
+	}), i[0] = a) : a = i[0];
+	let o;
+	return i[1] === r ? o = i[2] : (o = /* @__PURE__ */ X("marker", {
 		viewBox: "-4 -4 16 14",
 		refX: 6,
 		refY: 4,
@@ -927,49 +1201,49 @@ var Open = (e) => {
 		markerHeight: "8",
 		preserveAspectRatio: "xMaxYMid meet",
 		orient: "auto-start-reverse",
-		...e,
-		children: n
-	}), t[1] = e, t[2] = r), r;
-}, Dot = (e) => {
-	let t = X(3), n;
-	t[0] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ Q("circle", {
+		...r,
+		children: a
+	}), i[1] = r, i[2] = o), o;
+}, Dot = (r) => {
+	let i = J(3), a;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ X("circle", {
 		strokeWidth: 0,
 		fill: "context-stroke",
 		cx: 4,
 		cy: 4,
 		r: 3
-	}), t[0] = n) : n = t[0];
-	let r;
-	return t[1] === e ? r = t[2] : (r = /* @__PURE__ */ Q("marker", {
+	}), i[0] = a) : a = i[0];
+	let o;
+	return i[1] === r ? o = i[2] : (o = /* @__PURE__ */ X("marker", {
 		viewBox: "0 0 10 10",
 		refX: 4,
 		refY: 4,
 		markerWidth: "6",
 		markerHeight: "6",
-		...e,
-		children: n
-	}), t[1] = e, t[2] = r), r;
-}, ODot = (e) => {
-	let t = X(3), n;
-	t[0] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ Q("circle", {
+		...r,
+		children: a
+	}), i[1] = r, i[2] = o), o;
+}, ODot = (r) => {
+	let i = J(3), a;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ X("circle", {
 		strokeWidth: 1.25,
 		stroke: "context-stroke",
 		fill: "var(--likec4-background-color)",
 		cx: 4,
 		cy: 4,
 		r: 3
-	}), t[0] = n) : n = t[0];
-	let r;
-	return t[1] === e ? r = t[2] : (r = /* @__PURE__ */ Q("marker", {
+	}), i[0] = a) : a = i[0];
+	let o;
+	return i[1] === r ? o = i[2] : (o = /* @__PURE__ */ X("marker", {
 		viewBox: "0 0 10 10",
 		refX: 4,
 		refY: 4,
 		markerWidth: "6",
 		markerHeight: "6",
-		...e,
-		children: n
-	}), t[1] = e, t[2] = r), r;
-}, Ke = {
+		...r,
+		children: a
+	}), i[1] = r, i[2] = o), o;
+}, nt = {
 	Arrow,
 	Crow,
 	OArrow,
@@ -979,8 +1253,8 @@ var Open = (e) => {
 	Dot,
 	ODot
 };
-function arrowTypeToMarker(e) {
-	if (!(!e || e === "none")) switch (e) {
+function arrowTypeToMarker(r) {
+	if (!(!r || r === "none")) switch (r) {
 		case "normal": return "Arrow";
 		case "crow": return "Crow";
 		case "onormal": return "OArrow";
@@ -990,79 +1264,79 @@ function arrowTypeToMarker(e) {
 		case "vee": return "Open";
 		case "dot": return "Dot";
 		case "odot": return "ODot";
-		default: Se(e);
+		default: ge(r);
 	}
 }
 //#endregion
 //#region ../diagram/src/base-primitives/edge/EdgePath.tsx
-var qe = J((e, t) => {
-	let n = X(54), { edgeProps: r, isDragging: i, onEdgePointerDown: a, strokeWidth: o, svgPath: s } = e, { id: c, data: l, selectable: u, style: d, interactionWidth: f } = r, { line: p, dir: m, tail: h, head: g } = l, _ = u === void 0 ? !0 : u, v = i === void 0 ? !1 : i, y = arrowTypeToMarker(h), b = arrowTypeToMarker(g ?? "normal");
-	m === "back" && ([y, b] = [b, y]);
-	let x = y ? Ke[y] : null, w = b ? Ke[b] : null, E = p === "dotted", D = E || p === "dashed", O;
-	E ? O = "1,8" : D && (O = "8,10");
-	let k, A, j, M, N, P, F, I;
-	if (n[0] !== w || n[1] !== x || n[2] !== c || n[3] !== f || n[4] !== v || n[5] !== a || n[6] !== _ || n[7] !== d || n[8] !== s || n[9] !== t) {
-		let e = T();
-		n[18] !== f || n[19] !== v || n[20] !== a || n[21] !== _ || n[22] !== s ? (A = _ && /* @__PURE__ */ Q("path", {
-			className: S("react-flow__edge-interaction", C({ fill: "none" })),
-			onPointerDown: a,
-			d: s,
+var rt = K((r, i) => {
+	let a = J(54), { edgeProps: o, isDragging: s, onEdgePointerDown: c, strokeWidth: l, svgPath: u } = r, { id: d, data: f, selectable: p, style: m, interactionWidth: h } = o, { line: g, dir: _, tail: v, head: y } = f, b = p === void 0 ? !0 : p, x = s === void 0 ? !1 : s, S = arrowTypeToMarker(v), C = arrowTypeToMarker(y ?? "normal");
+	_ === "back" && ([S, C] = [C, S]);
+	let E = S ? nt[S] : null, O = C ? nt[C] : null, k = g === "dotted", A = k || g === "dashed", j;
+	k ? j = "1,8" : A && (j = "8,10");
+	let M, N, P, F, I, L, R, z;
+	if (a[0] !== O || a[1] !== E || a[2] !== d || a[3] !== h || a[4] !== x || a[5] !== c || a[6] !== b || a[7] !== m || a[8] !== u || a[9] !== i) {
+		let r = D();
+		a[18] !== h || a[19] !== x || a[20] !== c || a[21] !== b || a[22] !== u ? (N = b && /* @__PURE__ */ X("path", {
+			className: w("react-flow__edge-interaction", T({ fill: "none" })),
+			onPointerDown: c,
+			d: u,
 			style: {
-				strokeWidth: f ?? 10,
+				strokeWidth: h ?? 10,
 				stroke: "currentcolor",
 				strokeOpacity: 0,
-				...v ? { display: "none" } : {}
+				...x ? { display: "none" } : {}
 			}
-		}), n[18] = f, n[19] = v, n[20] = a, n[21] = _, n[22] = s, n[23] = A) : A = n[23];
-		let r = `path("${s}")`, i;
-		n[24] === r ? i = n[25] : (i = { offsetPath: r }, n[24] = r, n[25] = i), j = /* @__PURE__ */ Q("circle", {
-			className: S("likec4-edge-middle-point", e.middlePoint),
-			"data-edge-id": c,
-			style: i
-		}), P = e.markersCtx, F = a;
-		let o;
-		n[26] !== x || n[27] !== c ? (o = x && /* @__PURE__ */ Q(x, { id: "start" + c }), n[26] = x, n[27] = c, n[28] = o) : o = n[28];
+		}), a[18] = h, a[19] = x, a[20] = c, a[21] = b, a[22] = u, a[23] = N) : N = a[23];
+		let o = `path("${u}")`, s;
+		a[24] === o ? s = a[25] : (s = { offsetPath: o }, a[24] = o, a[25] = s), P = /* @__PURE__ */ X("circle", {
+			className: w("likec4-edge-middle-point", r.middlePoint),
+			"data-edge-id": d,
+			style: s
+		}), L = r.markersCtx, R = c;
 		let l;
-		n[29] !== w || n[30] !== c ? (l = w && /* @__PURE__ */ Q(w, { id: "end" + c }), n[29] = w, n[30] = c, n[31] = l) : l = n[31], n[32] !== o || n[33] !== l ? (I = /* @__PURE__ */ $("defs", { children: [o, l] }), n[32] = o, n[33] = l, n[34] = I) : I = n[34], k = /* @__PURE__ */ Q("path", {
-			className: S("react-flow__edge-path", "hide-on-reduced-graphics", e.pathBg, v && C({ display: "none" })),
-			d: s,
-			style: d,
+		a[26] !== E || a[27] !== d ? (l = E && /* @__PURE__ */ X(E, { id: "start" + d }), a[26] = E, a[27] = d, a[28] = l) : l = a[28];
+		let f;
+		a[29] !== O || a[30] !== d ? (f = O && /* @__PURE__ */ X(O, { id: "end" + d }), a[29] = O, a[30] = d, a[31] = f) : f = a[31], a[32] !== l || a[33] !== f ? (z = /* @__PURE__ */ Z("defs", { children: [l, f] }), a[32] = l, a[33] = f, a[34] = z) : z = a[34], M = /* @__PURE__ */ X("path", {
+			className: w("react-flow__edge-path", "hide-on-reduced-graphics", r.pathBg, x && T({ display: "none" })),
+			d: u,
+			style: m,
 			strokeLinecap: "round"
-		}), M = t, N = S("react-flow__edge-path", e.path, _ && "react-flow__edge-interaction"), n[0] = w, n[1] = x, n[2] = c, n[3] = f, n[4] = v, n[5] = a, n[6] = _, n[7] = d, n[8] = s, n[9] = t, n[10] = k, n[11] = A, n[12] = j, n[13] = M, n[14] = N, n[15] = P, n[16] = F, n[17] = I;
-	} else k = n[10], A = n[11], j = n[12], M = n[13], N = n[14], P = n[15], F = n[16], I = n[17];
-	let L = x ? `url(#start${c})` : void 0, R = w ? `url(#end${c})` : void 0, z;
-	n[35] !== O || n[36] !== o || n[37] !== d || n[38] !== s || n[39] !== L || n[40] !== R || n[41] !== M || n[42] !== N ? (z = /* @__PURE__ */ Q("path", {
-		ref: M,
-		className: N,
-		d: s,
-		style: d,
-		strokeWidth: o,
+		}), F = i, I = w("react-flow__edge-path", r.path, b && "react-flow__edge-interaction"), a[0] = O, a[1] = E, a[2] = d, a[3] = h, a[4] = x, a[5] = c, a[6] = b, a[7] = m, a[8] = u, a[9] = i, a[10] = M, a[11] = N, a[12] = P, a[13] = F, a[14] = I, a[15] = L, a[16] = R, a[17] = z;
+	} else M = a[10], N = a[11], P = a[12], F = a[13], I = a[14], L = a[15], R = a[16], z = a[17];
+	let B = E ? `url(#start${d})` : void 0, ee = O ? `url(#end${d})` : void 0, V;
+	a[35] !== j || a[36] !== l || a[37] !== m || a[38] !== u || a[39] !== B || a[40] !== ee || a[41] !== F || a[42] !== I ? (V = /* @__PURE__ */ X("path", {
+		ref: F,
+		className: I,
+		d: u,
+		style: m,
+		strokeWidth: l,
 		strokeLinecap: "round",
-		strokeDasharray: O,
-		markerStart: L,
-		markerEnd: R
-	}), n[35] = O, n[36] = o, n[37] = d, n[38] = s, n[39] = L, n[40] = R, n[41] = M, n[42] = N, n[43] = z) : z = n[43];
-	let B;
-	n[44] !== k || n[45] !== z || n[46] !== P || n[47] !== F || n[48] !== I ? (B = /* @__PURE__ */ $("g", {
-		className: P,
-		onPointerDown: F,
+		strokeDasharray: j,
+		markerStart: B,
+		markerEnd: ee
+	}), a[35] = j, a[36] = l, a[37] = m, a[38] = u, a[39] = B, a[40] = ee, a[41] = F, a[42] = I, a[43] = V) : V = a[43];
+	let H;
+	a[44] !== M || a[45] !== V || a[46] !== L || a[47] !== R || a[48] !== z ? (H = /* @__PURE__ */ Z("g", {
+		className: L,
+		onPointerDown: R,
 		children: [
-			I,
-			k,
-			z
+			z,
+			M,
+			V
 		]
-	}), n[44] = k, n[45] = z, n[46] = P, n[47] = F, n[48] = I, n[49] = B) : B = n[49];
-	let ee;
-	return n[50] !== A || n[51] !== j || n[52] !== B ? (ee = /* @__PURE__ */ $(Z, { children: [
-		A,
-		j,
-		B
-	] }), n[50] = A, n[51] = j, n[52] = B, n[53] = ee) : ee = n[53], ee;
+	}), a[44] = M, a[45] = V, a[46] = L, a[47] = R, a[48] = z, a[49] = H) : H = a[49];
+	let U;
+	return a[50] !== N || a[51] !== P || a[52] !== H ? (U = /* @__PURE__ */ Z(Y, { children: [
+		N,
+		P,
+		H
+	] }), a[50] = N, a[51] = P, a[52] = H, a[53] = U) : U = a[53], U;
 });
-qe.displayName = "EdgePath";
+rt.displayName = "EdgePath";
 //#endregion
 //#region ../diagram/src/base-primitives/element/ElementActionButtons.tsx
-var Je = {
+var it = {
 	normal: {
 		originY: 0,
 		opacity: .75,
@@ -1082,785 +1356,809 @@ var Je = {
 		y: 7
 	}
 };
-function ElementActionButtons(e) {
-	let t = X(12), { selected: n, data: r, buttons: i } = e, a = n === void 0 ? !1 : n, { hovered: o } = r, s = o === void 0 ? !1 : o, c = h();
-	if (!i.length) return null;
-	let l;
+function ElementActionButtons(r) {
+	let i = J(14), { selected: a, data: o, buttons: s } = r, c = a === void 0 ? !1 : a, { hovered: l } = o, u = l === void 0 ? !1 : l, d = g();
+	if (!s.length) return null;
+	let f;
 	bb0: switch (!0) {
-		case s:
-			l = "hovered";
+		case u:
+			f = "hovered";
 			break bb0;
-		case a:
-			l = "selected";
+		case c:
+			f = "selected";
 			break bb0;
-		default: l = "normal";
+		default: f = "normal";
 	}
-	let u;
-	t[0] === Symbol.for("react.memo_cache_sentinel") ? (u = O(), t[0] = u) : u = t[0];
-	let d = l, f = `${s}-${a}`, p;
-	t[1] === Symbol.for("react.memo_cache_sentinel") ? (p = S("nodrag nopan"), t[1] = p) : p = t[1];
-	let m;
-	if (t[2] !== i || t[3] !== c) {
+	let p = u || c, m;
+	i[0] === Symbol.for("react.memo_cache_sentinel") ? (m = A(), i[0] = m) : m = i[0];
+	let h = f, _ = `${u}-${c}`, v;
+	i[1] === Symbol.for("react.memo_cache_sentinel") ? (v = w("nodrag nopan"), i[1] = v) : v = i[1];
+	let b;
+	if (i[2] !== s || i[3] !== d || i[4] !== p) {
 		let t9;
-		t[5] === c ? t9 = t[6] : (t9 = (e, t) => /* @__PURE__ */ Q(b, {
-			component: de,
-			className: D({}),
+		i[6] !== d || i[7] !== p ? (t9 = (r, i) => /* @__PURE__ */ X(y, {
+			component: oe,
+			className: k({}),
 			initial: !1,
 			whileTap: { scale: 1 },
 			whileHover: { scale: 1.3 },
-			tabIndex: -1,
-			onClick: e.onClick,
+			tabIndex: p ? 0 : -1,
+			inert: p ? void 0 : !0,
+			"aria-label": r.ariaLabel ?? r.key ?? "Element action",
+			onClick: r.onClick,
 			onDoubleClick: stopPropagation,
-			children: e.icon || /* @__PURE__ */ Q(R, {})
-		}, `${c}-${e.key ?? t}`), t[5] = c, t[6] = t9), m = i.map(t9), t[2] = i, t[3] = c, t[4] = m;
-	} else m = t[4];
-	let g;
-	return t[7] !== s || t[8] !== f || t[9] !== m || t[10] !== l ? (g = /* @__PURE__ */ Q("div", {
-		className: u,
-		children: /* @__PURE__ */ Q(fe, {
+			children: r.icon || /* @__PURE__ */ X(Te, {})
+		}, `${d}-${r.key ?? i}`), i[6] = d, i[7] = p, i[8] = t9) : t9 = i[8], b = s.map(t9), i[2] = s, i[3] = d, i[4] = p, i[5] = b;
+	} else b = i[5];
+	let x;
+	return i[9] !== u || i[10] !== _ || i[11] !== b || i[12] !== f ? (x = /* @__PURE__ */ X("div", {
+		className: m,
+		children: /* @__PURE__ */ X(G, {
 			layoutRoot: !0,
 			initial: !1,
-			variants: Je,
-			animate: d,
-			layoutDependency: f,
-			"data-likec4-hovered": s,
-			className: p,
+			variants: it,
+			animate: h,
+			layoutDependency: _,
+			"data-likec4-hovered": u,
+			className: v,
 			onClick: stopPropagation,
-			children: m
+			children: b
 		})
-	}), t[7] = s, t[8] = f, t[9] = m, t[10] = l, t[11] = g) : g = t[11], g;
+	}), i[9] = u, i[10] = _, i[11] = b, i[12] = f, i[13] = x) : x = i[13], x;
 }
 //#endregion
 //#region ../diagram/src/base-primitives/element/ElementData.tsx
-var resolveIconColor = (e, t) => {
-	let n = t.style.iconColor;
-	if (!n) return;
-	let r = e.colors(n).elements;
-	return n === t.color ? r.stroke : r.fill;
-}, Ye = J((e, t) => {
-	let n = X(28), r, i, a, o;
-	n[0] === e ? (r = n[1], i = n[2], a = n[3], o = n[4]) : ({className: r, style: o, data: i, ...a} = e, n[0] = e, n[1] = r, n[2] = i, n[3] = a, n[4] = o);
-	let s = useLikeC4Styles(), c;
-	n[5] !== i.style || n[6] !== s ? (c = i.style.iconSize ? s.nodeSizes(i.style).values.iconSize : void 0, n[5] = i.style, n[6] = s, n[7] = c) : c = n[7];
-	let l = c, u;
-	n[8] !== i || n[9] !== s ? (u = resolveIconColor(s, i), n[8] = i, n[9] = s, n[10] = u) : u = n[10];
-	let d = u, f;
-	n[11] !== r || n[12] !== i.style.iconPosition || n[13] !== d ? (f = S(r, k({
-		iconPosition: i.style.iconPosition,
-		withIconColor: !!d
-	}), "likec4-element"), n[11] = r, n[12] = i.style.iconPosition, n[13] = d, n[14] = f) : f = n[14];
-	let p;
-	n[15] === l ? p = n[16] : (p = l && { "--likec4-icon-size": `${l}px` }, n[15] = l, n[16] = p);
-	let m;
-	n[17] === d ? m = n[18] : (m = d && { "--likec4-icon-color": d }, n[17] = d, n[18] = m);
-	let h;
-	n[19] !== o || n[20] !== p || n[21] !== m ? (h = {
-		...o,
-		...p,
-		...m
-	}, n[19] = o, n[20] = p, n[21] = m, n[22] = h) : h = n[22];
+var resolveIconColor = (r, i) => {
+	let a = i.style.iconColor;
+	if (!a) return;
+	let o = r.colors(a).elements;
+	return a === i.color ? o.stroke : o.fill;
+}, at = K((r, i) => {
+	let a = J(28), o, s, c, l;
+	a[0] === r ? (o = a[1], s = a[2], c = a[3], l = a[4]) : ({className: o, style: l, data: s, ...c} = r, a[0] = r, a[1] = o, a[2] = s, a[3] = c, a[4] = l);
+	let u = useLikeC4Styles(), d;
+	a[5] !== s.style || a[6] !== u ? (d = s.style.iconSize ? u.nodeSizes(s.style).values.iconSize : void 0, a[5] = s.style, a[6] = u, a[7] = d) : d = a[7];
+	let f = d, p;
+	a[8] !== s || a[9] !== u ? (p = resolveIconColor(u, s), a[8] = s, a[9] = u, a[10] = p) : p = a[10];
+	let m = p, h;
+	a[11] !== o || a[12] !== s.style.iconPosition || a[13] !== m ? (h = w(o, M({
+		iconPosition: s.style.iconPosition,
+		withIconColor: !!m
+	}), "likec4-element"), a[11] = o, a[12] = s.style.iconPosition, a[13] = m, a[14] = h) : h = a[14];
 	let g;
-	return n[23] !== a || n[24] !== t || n[25] !== f || n[26] !== h ? (g = /* @__PURE__ */ Q("div", {
-		...a,
-		ref: t,
-		className: f,
-		style: h
-	}), n[23] = a, n[24] = t, n[25] = f, n[26] = h, n[27] = g) : g = n[27], g;
-}), Icon = (e) => {
-	let t = X(6), n, r;
-	t[0] === e ? (n = t[1], r = t[2]) : ({data: n, ...r} = e, t[0] = e, t[1] = n, t[2] = r);
-	let i;
-	return t[3] !== n || t[4] !== r ? (i = /* @__PURE__ */ Q(IconRenderer, {
-		element: n,
-		...r
-	}), t[3] = n, t[4] = r, t[5] = i) : i = t[5], i;
-}, Xe = J((e, t) => {
-	let n = X(9), r, i;
-	n[0] === e ? (r = n[1], i = n[2]) : ({className: r, ...i} = e, n[0] = e, n[1] = r, n[2] = i);
-	let a;
-	n[3] === r ? a = n[4] : (a = S(r, "likec4-element-node-content"), n[3] = r, n[4] = a);
-	let o;
-	return n[5] !== i || n[6] !== t || n[7] !== a ? (o = /* @__PURE__ */ Q("div", {
-		...i,
-		className: a,
-		ref: t
-	}), n[5] = i, n[6] = t, n[7] = a, n[8] = o) : o = n[8], o;
-}), Ze = J((e, t) => {
-	let n = X(11), r, i, a;
-	n[0] === e ? (r = n[1], i = n[2], a = n[3]) : ({data: a, className: r, ...i} = e, n[0] = e, n[1] = r, n[2] = i, n[3] = a);
-	let { title: o } = a, s;
-	n[4] === r ? s = n[5] : (s = S(r, "likec4-element-title"), n[4] = r, n[5] = s);
+	a[15] === f ? g = a[16] : (g = f && { "--likec4-icon-size": `${f}px` }, a[15] = f, a[16] = g);
+	let _;
+	a[17] === m ? _ = a[18] : (_ = m && { "--likec4-icon-color": m }, a[17] = m, a[18] = _);
+	let v;
+	a[19] !== l || a[20] !== g || a[21] !== _ ? (v = {
+		...l,
+		...g,
+		..._
+	}, a[19] = l, a[20] = g, a[21] = _, a[22] = v) : v = a[22];
+	let y;
+	return a[23] !== c || a[24] !== i || a[25] !== h || a[26] !== v ? (y = /* @__PURE__ */ X("div", {
+		...c,
+		ref: i,
+		className: h,
+		style: v
+	}), a[23] = c, a[24] = i, a[25] = h, a[26] = v, a[27] = y) : y = a[27], y;
+}), Icon = (r) => {
+	let i = J(6), a, o;
+	i[0] === r ? (a = i[1], o = i[2]) : ({data: a, ...o} = r, i[0] = r, i[1] = a, i[2] = o);
+	let s;
+	return i[3] !== a || i[4] !== o ? (s = /* @__PURE__ */ X(IconRenderer, {
+		element: a,
+		...o
+	}), i[3] = a, i[4] = o, i[5] = s) : s = i[5], s;
+}, ot = K((r, i) => {
+	let a = J(9), o, s;
+	a[0] === r ? (o = a[1], s = a[2]) : ({className: o, ...s} = r, a[0] = r, a[1] = o, a[2] = s);
 	let c;
-	return n[6] !== i || n[7] !== t || n[8] !== s || n[9] !== o ? (c = /* @__PURE__ */ Q("div", {
-		...i,
-		className: s,
+	a[3] === o ? c = a[4] : (c = w(o, "likec4-element-node-content"), a[3] = o, a[4] = c);
+	let l;
+	return a[5] !== s || a[6] !== i || a[7] !== c ? (l = /* @__PURE__ */ X("div", {
+		...s,
+		className: c,
+		ref: i
+	}), a[5] = s, a[6] = i, a[7] = c, a[8] = l) : l = a[8], l;
+}), st = K((r, i) => {
+	let a = J(11), o, s, c;
+	a[0] === r ? (o = a[1], s = a[2], c = a[3]) : ({data: c, className: o, ...s} = r, a[0] = r, a[1] = o, a[2] = s, a[3] = c);
+	let { title: l } = c, u;
+	a[4] === o ? u = a[5] : (u = w(o, "likec4-element-title"), a[4] = o, a[5] = u);
+	let d;
+	return a[6] !== s || a[7] !== i || a[8] !== u || a[9] !== l ? (d = /* @__PURE__ */ X("div", {
+		...s,
+		className: u,
 		"data-likec4-node-title": "",
-		ref: t,
-		children: o
-	}), n[6] = i, n[7] = t, n[8] = s, n[9] = o, n[10] = c) : c = n[10], c;
-}), Qe = J((e, t) => {
-	let n = X(10), r, i, a, o;
-	n[0] === e ? (r = n[1], i = n[2], a = n[3], o = n[4]) : ({data: a, children: r, className: i, ...o} = e, n[0] = e, n[1] = r, n[2] = i, n[3] = a, n[4] = o);
-	let s = a?.technology ?? r, c;
-	return n[5] !== i || n[6] !== o || n[7] !== t || n[8] !== s ? (c = u(s) ? /* @__PURE__ */ Q("div", {
-		...o,
-		className: S(i, "likec4-element-technology"),
+		ref: i,
+		children: l
+	}), a[6] = s, a[7] = i, a[8] = u, a[9] = l, a[10] = d) : d = a[10], d;
+}), ct = K((r, i) => {
+	let a = J(10), o, s, c, l;
+	a[0] === r ? (o = a[1], s = a[2], c = a[3], l = a[4]) : ({data: c, children: o, className: s, ...l} = r, a[0] = r, a[1] = o, a[2] = s, a[3] = c, a[4] = l);
+	let u = c?.technology ?? o, d;
+	return a[5] !== s || a[6] !== l || a[7] !== i || a[8] !== u ? (d = e(u) ? /* @__PURE__ */ X("div", {
+		...l,
+		className: w(s, "likec4-element-technology"),
 		"data-likec4-node-technology": "",
-		ref: t,
-		children: s
-	}) : null, n[5] = i, n[6] = o, n[7] = t, n[8] = s, n[9] = c) : c = n[9], c;
-}), $e = J((e, t) => {
-	let n = X(16), r, i, a;
-	n[0] === e ? (r = n[1], i = n[2], a = n[3]) : ({data: a, className: r, ...i} = e, n[0] = e, n[1] = r, n[2] = i, n[3] = a);
-	let { description: o } = a;
-	if (!o) return null;
-	let s;
-	n[4] === o ? s = n[5] : (s = Oe.from(o), n[4] = o, n[5] = s);
-	let c = s, l;
-	n[6] === r ? l = n[7] : (l = S(r, "likec4-element-description"), n[6] = r, n[7] = l);
-	let u = c.isMarkdown ? "8rem" : void 0, d;
-	n[8] === u ? d = n[9] : (d = { maxHeight: u }, n[8] = u, n[9] = d);
-	let f;
-	return n[10] !== c || n[11] !== i || n[12] !== t || n[13] !== l || n[14] !== d ? (f = /* @__PURE__ */ Q(te, {
-		...i,
-		className: l,
+		ref: i,
+		children: u
+	}) : null, a[5] = s, a[6] = l, a[7] = i, a[8] = u, a[9] = d) : d = a[9], d;
+}), lt = K((r, i) => {
+	let a = J(16), o, s, c;
+	a[0] === r ? (o = a[1], s = a[2], c = a[3]) : ({data: c, className: o, ...s} = r, a[0] = r, a[1] = o, a[2] = s, a[3] = c);
+	let { description: u } = c;
+	if (!u) return null;
+	let d;
+	a[4] === u ? d = a[5] : (d = be.from(u), a[4] = u, a[5] = d);
+	let f = d, p;
+	a[6] === o ? p = a[7] : (p = w(o, "likec4-element-description"), a[6] = o, a[7] = p);
+	let m = f.isMarkdown ? "8rem" : void 0, h;
+	a[8] === m ? h = a[9] : (h = { maxHeight: m }, a[8] = m, a[9] = h);
+	let g;
+	return a[10] !== f || a[11] !== s || a[12] !== i || a[13] !== p || a[14] !== h ? (g = /* @__PURE__ */ X(l, {
+		...s,
+		className: p,
 		"data-likec4-node-description": "",
-		value: c,
+		value: f,
 		uselikec4palette: !0,
 		hideIfEmpty: !0,
-		style: d,
-		ref: t
-	}), n[10] = c, n[11] = i, n[12] = t, n[13] = l, n[14] = d, n[15] = f) : f = n[15], f;
+		style: h,
+		ref: i
+	}), a[10] = f, a[11] = s, a[12] = i, a[13] = p, a[14] = h, a[15] = g) : g = a[15], g;
 });
-function ElementData(e) {
-	let t = X(8), { data: n } = e, r;
-	t[0] === n ? r = t[1] : (r = /* @__PURE__ */ Q(Icon, { data: n }), t[0] = n, t[1] = r);
-	let i;
-	t[2] === n ? i = t[3] : (i = /* @__PURE__ */ $(Xe, { children: [
-		/* @__PURE__ */ Q(Ze, { data: n }),
-		/* @__PURE__ */ Q(Qe, { data: n }),
-		/* @__PURE__ */ Q($e, { data: n })
-	] }), t[2] = n, t[3] = i);
-	let a;
-	return t[4] !== n || t[5] !== r || t[6] !== i ? (a = /* @__PURE__ */ $(Ye, {
-		data: n,
-		children: [r, i]
-	}), t[4] = n, t[5] = r, t[6] = i, t[7] = a) : a = t[7], a;
-}
-ElementData.Root = Ye, ElementData.Icon = Icon, ElementData.Content = Xe, ElementData.Title = Ze, ElementData.Technology = Qe, ElementData.Description = $e;
+function ElementData(r) {
+	let i = J(9), { data: a, "aria-hidden": o } = r, s;
+	i[0] === a ? s = i[1] : (s = /* @__PURE__ */ X(Icon, { data: a }), i[0] = a, i[1] = s);
+	let c;
+	i[2] === a ? c = i[3] : (c = /* @__PURE__ */ Z(ot, { children: [
+		/* @__PURE__ */ X(st, { data: a }),
+		/* @__PURE__ */ X(ct, { data: a }),
+		/* @__PURE__ */ X(lt, { data: a })
+	] }), i[2] = a, i[3] = c);
+	let l;
+	return i[4] !== o || i[5] !== a || i[6] !== s || i[7] !== c ? (l = /* @__PURE__ */ Z(at, {
+		data: a,
+		"aria-hidden": o,
+		children: [s, c]
+	}), i[4] = o, i[5] = a, i[6] = s, i[7] = c, i[8] = l) : l = i[8], l;
+}
+ElementData.Root = at, ElementData.Icon = Icon, ElementData.Content = ot, ElementData.Title = st, ElementData.Technology = ct, ElementData.Description = lt;
 //#endregion
 //#region ../diagram/src/base-primitives/element/ElementNodeContainer.tsx
-var et = {
+var ut = {
 	normal: { scale: 1 },
 	hovered: { scale: 1.05 },
 	selected: { scale: 1.02 },
 	tap: { scale: .98 }
-}, tt = J((e, t) => {
-	let n = X(34), r, i, a, o, s;
-	n[0] === e ? (r = n[1], i = n[2], a = n[3], o = n[4], s = n[5]) : ({nodeProps: s, className: i, style: o, children: r, ...a} = e, n[0] = e, n[1] = r, n[2] = i, n[3] = a, n[4] = o, n[5] = s);
-	let { selected: c, selectable: l, data: u } = s, d = c === void 0 ? !1 : c, f = l === void 0 ? !1 : l, p, m, h, g, _;
-	if (n[6] !== d || n[7] !== u) {
-		let { hovered: e, dimmed: t, ...r } = u;
-		p = r, h = e === void 0 ? !1 : e, m = t === void 0 ? !1 : t;
+}, dt = K((r, i) => {
+	let a = J(34), o, s, c, l, u;
+	a[0] === r ? (o = a[1], s = a[2], c = a[3], l = a[4], u = a[5]) : ({nodeProps: u, className: s, style: l, children: o, ...c} = r, a[0] = r, a[1] = o, a[2] = s, a[3] = c, a[4] = l, a[5] = u);
+	let { selected: d, selectable: f, data: p } = u, m = d === void 0 ? !1 : d, h = f === void 0 ? !1 : f, g, _, v, y, b;
+	if (a[6] !== m || a[7] !== p) {
+		let { hovered: r, dimmed: i, ...o } = p;
+		g = o, v = r === void 0 ? !1 : r, _ = i === void 0 ? !1 : i;
 		bb0: switch (!0) {
-			case h:
-				_ = "hovered";
+			case v:
+				b = "hovered";
 				break bb0;
-			case d:
-				_ = "selected";
+			case m:
+				b = "selected";
 				break bb0;
-			default: _ = "normal";
+			default: b = "normal";
 		}
-		g = ke(p.style ?? {}), n[6] = d, n[7] = u, n[8] = p, n[9] = m, n[10] = h, n[11] = g, n[12] = _;
-	} else p = n[8], m = n[9], h = n[10], g = n[11], _ = n[12];
-	let { size: v, padding: y, textSize: b } = g, x;
-	n[13] === i ? x = n[14] : (x = S(A(), "group", i), n[13] = i, n[14] = x);
-	let C;
-	n[15] !== f || n[16] !== _ ? (C = f && {
-		animate: _,
+		y = xe(g.style ?? {}), a[6] = m, a[7] = p, a[8] = g, a[9] = _, a[10] = v, a[11] = y, a[12] = b;
+	} else g = a[8], _ = a[9], v = a[10], y = a[11], b = a[12];
+	let { size: x, padding: S, textSize: C } = y, T;
+	a[13] === s ? T = a[14] : (T = w(P(), "group", s), a[13] = s, a[14] = T);
+	let E;
+	a[15] !== h || a[16] !== b ? (E = h && {
+		animate: b,
 		whileTap: "tap"
-	}, n[15] = f, n[16] = _, n[17] = C) : C = n[17];
-	let w;
-	n[18] === m ? w = n[19] : (w = m !== !1 && { "data-likec4-dimmed": m }, n[18] = m, n[19] = w);
-	let T = o, E;
-	return n[20] !== r || n[21] !== p.color || n[22] !== p.shape || n[23] !== h || n[24] !== y || n[25] !== t || n[26] !== a || n[27] !== v || n[28] !== x || n[29] !== C || n[30] !== w || n[31] !== T || n[32] !== b ? (E = /* @__PURE__ */ Q(fe, {
-		ref: t,
-		className: x,
-		variants: et,
+	}, a[15] = h, a[16] = b, a[17] = E) : E = a[17];
+	let D;
+	a[18] === _ ? D = a[19] : (D = _ !== !1 && { "data-likec4-dimmed": _ }, a[18] = _, a[19] = D);
+	let O = l, k;
+	return a[20] !== o || a[21] !== g.color || a[22] !== g.shape || a[23] !== v || a[24] !== S || a[25] !== i || a[26] !== c || a[27] !== x || a[28] !== T || a[29] !== E || a[30] !== D || a[31] !== O || a[32] !== C ? (k = /* @__PURE__ */ X(G, {
+		ref: i,
+		className: T,
+		variants: ut,
 		initial: !1,
-		...C,
-		"data-likec4-hovered": h,
-		"data-likec4-color": p.color,
-		"data-likec4-shape": p.shape,
-		"data-likec4-shape-size": v,
-		"data-likec4-spacing": y,
-		"data-likec4-text-size": b,
-		...w,
-		style: T,
+		...E,
+		"data-likec4-hovered": v,
+		"data-likec4-color": g.color,
+		"data-likec4-shape": g.shape,
+		"data-likec4-shape-size": x,
+		"data-likec4-spacing": S,
+		"data-likec4-text-size": C,
+		...D,
+		style: O,
 		tabIndex: -1,
-		...a,
-		children: r
-	}), n[20] = r, n[21] = p.color, n[22] = p.shape, n[23] = h, n[24] = y, n[25] = t, n[26] = a, n[27] = v, n[28] = x, n[29] = C, n[30] = w, n[31] = T, n[32] = b, n[33] = E) : E = n[33], E;
+		...c,
+		children: o
+	}), a[20] = o, a[21] = g.color, a[22] = g.shape, a[23] = v, a[24] = S, a[25] = i, a[26] = c, a[27] = x, a[28] = T, a[29] = E, a[30] = D, a[31] = O, a[32] = C, a[33] = k) : k = a[33], k;
 });
-tt.displayName = "ElementNodeContainer";
+dt.displayName = "ElementNodeContainer";
 //#endregion
 //#region ../diagram/src/base-primitives/element/ElementShape.tsx
-function cylinderSVGPath(e, t, n = .07) {
-	let r = Math.round(e / 2), i = r, a = roundDpr(n * r), o = t - 2 * a;
+function cylinderSVGPath(r, i, a = .07) {
+	let o = Math.round(r / 2), s = o, c = roundDpr(a * o), l = i - 2 * c;
 	return {
-		path: `  M ${e},${a}
-        a ${i},${a} 0,0,0 ${-e} 0
-        l 0,${o}
-        a ${i},${a} 0,0,0 ${e} 0
-        l 0,${-o}
+		path: `  M ${r},${c}
+        a ${s},${c} 0,0,0 ${-r} 0
+        l 0,${l}
+        a ${s},${c} 0,0,0 ${r} 0
+        l 0,${-l}
         z
         `.replace(/\s+/g, " ").trim(),
-		ry: a,
-		rx: i
+		ry: c,
+		rx: s
 	};
 }
-function docSVGPath(e, t) {
-	let n = roundDpr(t - t / 8 / 2), r = roundDpr(t / 6);
+function docSVGPath(r, i) {
+	let a = roundDpr(i - i / 8 / 2), o = roundDpr(i / 6);
 	return { path: `
-    M 0 ${n}
+    M 0 ${a}
     V 6
     Q 0 0 6 0
-    H ${e - 6}
-    Q ${e} 0 ${e} 6
-    V ${n}
-    C ${roundDpr(e * .75)} ${n + r}, ${roundDpr(e * .5)} ${n - r}, 0 ${n}
+    H ${r - 6}
+    Q ${r} 0 ${r} 6
+    V ${a}
+    C ${roundDpr(r * .75)} ${a + o}, ${roundDpr(r * .5)} ${a - o}, 0 ${a}
   `.replace(/\s+/g, " ").trim() };
 }
-function bucketSVGPath(e, t) {
-	let n = e / 2, r = roundDpr(n), i = roundDpr(Math.min(t / 8, r * .08)), a = roundDpr(r * .8), o = roundDpr(i * 1.05), s = i, c = t - o, l = n - a;
+function bucketSVGPath(r, i) {
+	let a = r / 2, o = roundDpr(a), s = roundDpr(Math.min(i / 8, o * .08)), c = roundDpr(o * .8), l = roundDpr(s * 1.05), u = s, d = i - l, f = a - c;
 	return {
 		path: `
-    M ${e},${s}
-    a ${r},${i} 0,0,0 ${-e} 0
-    L ${l},${c}
-    a ${a},${o} 0,0,0 ${a * 2} 0
+    M ${r},${u}
+    a ${o},${s} 0,0,0 ${-r} 0
+    L ${f},${d}
+    a ${c},${l} 0,0,0 ${c * 2} 0
     Z
   `.replace(/\s+/g, " ").trim(),
-		topRx: r,
-		topRy: i,
-		bottomRx: a,
-		bottomRy: o
+		topRx: o,
+		topRy: s,
+		bottomRx: c,
+		bottomRy: l
 	};
 }
-function queueSVGPath(e, t, n = .185) {
-	let r = t, i = Math.round(r / 2), a = roundDpr(r / 2 * n);
+function queueSVGPath(r, i, a = .185) {
+	let o = i, s = Math.round(o / 2), c = roundDpr(o / 2 * a);
 	return {
 		path: `
-    M ${a},0
-    a ${a},${i} 0,0,0 0 ${r}
-    l ${e - 2 * a},0
-    a ${a},${i} 0,0,0 0 ${-r}
+    M ${c},0
+    a ${c},${s} 0,0,0 0 ${o}
+    l ${r - 2 * c},0
+    a ${c},${s} 0,0,0 0 ${-o}
     z`.replace(/\s+/g, " ").trim(),
-		ry: i,
-		rx: a
+		ry: s,
+		rx: c
 	};
 }
-var nt = {
+var ft = {
 	width: 115,
 	height: 120,
 	path: "M57.9197 0C10.9124 0 33.5766 54.75 33.5766 54.75C38.6131 62.25 45.3285 60.75 45.3285 66C45.3285 70.5 39.4526 72 33.5766 72.75C24.3431 72.75 15.9489 71.25 7.55474 84.75C2.51825 93 0 120 0 120H115C115 120 112.482 93 108.285 84.75C99.8905 70.5 91.4963 72.75 82.2628 72C76.3869 71.25 70.5109 69.75 70.5109 65.25C70.5109 60.75 77.2263 62.25 82.2628 54C82.2628 54.75 104.927 0 57.9197 0V0Z"
-}, ComponentTopLeftRect = (e) => {
-	let t = X(5), { index: n, size: r } = e, i, a, o, s, c;
-	bb0: switch (r) {
+}, ComponentTopLeftRect = (r) => {
+	let i = J(5), { index: a, size: o } = r, s, c, l, u, d;
+	bb0: switch (o) {
 		case "xs":
 		case "sm":
-			i = 40, a = 18, o = -16, s = 16, c = 10;
+			s = 40, c = 18, l = -16, u = 16, d = 10;
 			break bb0;
 		case "md":
-			i = 60, a = 26, o = -20, s = 22, c = 14;
+			s = 60, c = 26, l = -20, u = 22, d = 14;
 			break bb0;
 		case "lg":
 		case "xl":
-			i = 70, a = 32, o = -24, s = 32, c = 18;
+			s = 70, c = 32, l = -24, u = 32, d = 18;
 			break bb0;
-		default: Se(r);
+		default: ge(o);
 	}
-	let l = s + (a + c) * n, u;
-	return t[0] !== a || t[1] !== o || t[2] !== l || t[3] !== i ? (u = /* @__PURE__ */ Q("rect", {
-		x: o,
-		y: l,
-		width: i,
-		height: a,
+	let f = u + (c + d) * a, p;
+	return i[0] !== c || i[1] !== l || i[2] !== f || i[3] !== s ? (p = /* @__PURE__ */ X("rect", {
+		x: l,
+		y: f,
+		width: s,
+		height: c,
 		rx: 3,
 		className: "top-left-rect",
 		strokeWidth: 2
-	}), t[0] = a, t[1] = o, t[2] = l, t[3] = i, t[4] = u) : u = t[4], u;
+	}), i[0] = c, i[1] = l, i[2] = f, i[3] = s, i[4] = p) : p = i[4], p;
 };
-function ShapeSvg(e) {
-	let t = X(94), { shape: n, w: r, h: i, size: a } = e, o = a === void 0 ? "md" : a;
-	switch (n) {
+function ShapeSvg(r) {
+	let i = J(94), { shape: a, w: o, h: s, size: c } = r, l = c === void 0 ? "md" : c;
+	switch (a) {
 		case "component": {
-			let e;
-			t[0] !== i || t[1] !== r ? (e = /* @__PURE__ */ Q("rect", {
-				width: r,
-				height: i,
+			let r;
+			i[0] !== s || i[1] !== o ? (r = /* @__PURE__ */ X("rect", {
+				width: o,
+				height: s,
 				rx: 6,
 				strokeWidth: 0
-			}), t[0] = i, t[1] = r, t[2] = e) : e = t[2];
-			let n, a;
-			t[3] === o ? (n = t[4], a = t[5]) : (n = /* @__PURE__ */ Q(ComponentTopLeftRect, {
+			}), i[0] = s, i[1] = o, i[2] = r) : r = i[2];
+			let a, c;
+			i[3] === l ? (a = i[4], c = i[5]) : (a = /* @__PURE__ */ X(ComponentTopLeftRect, {
 				index: 0,
-				size: o
-			}), a = /* @__PURE__ */ Q(ComponentTopLeftRect, {
+				size: l
+			}), c = /* @__PURE__ */ X(ComponentTopLeftRect, {
 				index: 1,
-				size: o
-			}), t[3] = o, t[4] = n, t[5] = a);
-			let s;
-			return t[6] !== e || t[7] !== n || t[8] !== a ? (s = /* @__PURE__ */ $(Z, { children: [
-				e,
-				n,
-				a
-			] }), t[6] = e, t[7] = n, t[8] = a, t[9] = s) : s = t[9], s;
+				size: l
+			}), i[3] = l, i[4] = a, i[5] = c);
+			let u;
+			return i[6] !== r || i[7] !== a || i[8] !== c ? (u = /* @__PURE__ */ Z(Y, { children: [
+				r,
+				a,
+				c
+			] }), i[6] = r, i[7] = a, i[8] = c, i[9] = u) : u = i[9], u;
 		}
 		case "mobile": {
-			let e;
-			t[10] !== i || t[11] !== r ? (e = /* @__PURE__ */ Q("rect", {
-				width: r,
-				height: i,
+			let r;
+			i[10] !== s || i[11] !== o ? (r = /* @__PURE__ */ X("rect", {
+				width: o,
+				height: s,
 				rx: 6,
 				"data-likec4-fill": "mix-stroke",
 				strokeWidth: 0
-			}), t[10] = i, t[11] = r, t[12] = e) : e = t[12];
-			let n = i / 2, a;
-			t[13] === n ? a = t[14] : (a = /* @__PURE__ */ Q("circle", {
+			}), i[10] = s, i[11] = o, i[12] = r) : r = i[12];
+			let a = s / 2, c;
+			i[13] === a ? c = i[14] : (c = /* @__PURE__ */ X("circle", {
 				cx: 17,
-				cy: n,
+				cy: a,
 				r: 12
-			}), t[13] = n, t[14] = a);
-			let o = r - 44, s = i - 24, c;
-			t[15] !== o || t[16] !== s ? (c = /* @__PURE__ */ Q("rect", {
+			}), i[13] = a, i[14] = c);
+			let l = o - 44, u = s - 24, d;
+			i[15] !== l || i[16] !== u ? (d = /* @__PURE__ */ X("rect", {
 				x: 33,
 				y: 12,
-				width: o,
-				height: s,
+				width: l,
+				height: u,
 				rx: 5
-			}), t[15] = o, t[16] = s, t[17] = c) : c = t[17];
-			let l;
-			t[18] !== a || t[19] !== c ? (l = /* @__PURE__ */ $("g", {
+			}), i[15] = l, i[16] = u, i[17] = d) : d = i[17];
+			let f;
+			i[18] !== c || i[19] !== d ? (f = /* @__PURE__ */ Z("g", {
 				"data-likec4-fill": "fill",
 				strokeWidth: 0,
-				children: [a, c]
-			}), t[18] = a, t[19] = c, t[20] = l) : l = t[20];
-			let u;
-			return t[21] !== e || t[22] !== l ? (u = /* @__PURE__ */ $(Z, { children: [e, l] }), t[21] = e, t[22] = l, t[23] = u) : u = t[23], u;
+				children: [c, d]
+			}), i[18] = c, i[19] = d, i[20] = f) : f = i[20];
+			let p;
+			return i[21] !== r || i[22] !== f ? (p = /* @__PURE__ */ Z(Y, { children: [r, f] }), i[21] = r, i[22] = f, i[23] = p) : p = i[23], p;
 		}
 		case "document": {
-			let e;
-			t[24] !== i || t[25] !== r ? (e = docSVGPath(r, i), t[24] = i, t[25] = r, t[26] = e) : e = t[26];
-			let { path: n } = e, a;
-			return t[27] === n ? a = t[28] : (a = /* @__PURE__ */ Q("path", {
-				d: n,
+			let r;
+			i[24] !== s || i[25] !== o ? (r = docSVGPath(o, s), i[24] = s, i[25] = o, i[26] = r) : r = i[26];
+			let { path: a } = r, c;
+			return i[27] === a ? c = i[28] : (c = /* @__PURE__ */ X("path", {
+				d: a,
 				"data-likec4-fill": "fill",
 				strokeWidth: 2
-			}), t[27] = n, t[28] = a), a;
+			}), i[27] = a, i[28] = c), c;
 		}
 		case "browser": {
-			let e;
-			t[29] !== i || t[30] !== r ? (e = /* @__PURE__ */ Q("rect", {
-				width: r,
-				height: i,
+			let r;
+			i[29] !== s || i[30] !== o ? (r = /* @__PURE__ */ X("rect", {
+				width: o,
+				height: s,
 				rx: 6,
 				"data-likec4-fill": "mix-stroke",
 				strokeWidth: 0
-			}), t[29] = i, t[30] = r, t[31] = e) : e = t[31];
-			let n, a, o;
-			t[32] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ Q("circle", {
+			}), i[29] = s, i[30] = o, i[31] = r) : r = i[31];
+			let a, c, l;
+			i[32] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ X("circle", {
 				cx: 16,
 				cy: 17,
 				r: 7
-			}), a = /* @__PURE__ */ Q("circle", {
+			}), c = /* @__PURE__ */ X("circle", {
 				cx: 36,
 				cy: 17,
 				r: 7
-			}), o = /* @__PURE__ */ Q("circle", {
+			}), l = /* @__PURE__ */ X("circle", {
 				cx: 56,
 				cy: 17,
 				r: 7
-			}), t[32] = n, t[33] = a, t[34] = o) : (n = t[32], a = t[33], o = t[34]);
-			let s = r - 80, c;
-			t[35] === s ? c = t[36] : (c = /* @__PURE__ */ Q("rect", {
+			}), i[32] = a, i[33] = c, i[34] = l) : (a = i[32], c = i[33], l = i[34]);
+			let u = o - 80, d;
+			i[35] === u ? d = i[36] : (d = /* @__PURE__ */ X("rect", {
 				x: 70,
 				y: 8,
-				width: s,
+				width: u,
 				height: 17,
 				rx: 4
-			}), t[35] = s, t[36] = c);
-			let l = r - 20, u = i - 42, d;
-			t[37] !== l || t[38] !== u ? (d = /* @__PURE__ */ Q("rect", {
+			}), i[35] = u, i[36] = d);
+			let f = o - 20, p = s - 42, m;
+			i[37] !== f || i[38] !== p ? (m = /* @__PURE__ */ X("rect", {
 				x: 10,
 				y: 32,
-				width: l,
-				height: u,
+				width: f,
+				height: p,
 				rx: 4
-			}), t[37] = l, t[38] = u, t[39] = d) : d = t[39];
-			let f;
-			t[40] !== d || t[41] !== c ? (f = /* @__PURE__ */ $("g", {
+			}), i[37] = f, i[38] = p, i[39] = m) : m = i[39];
+			let h;
+			i[40] !== m || i[41] !== d ? (h = /* @__PURE__ */ Z("g", {
 				"data-likec4-fill": "fill",
 				strokeWidth: 0,
 				children: [
-					n,
 					a,
-					o,
 					c,
-					d
+					l,
+					d,
+					m
 				]
-			}), t[40] = d, t[41] = c, t[42] = f) : f = t[42];
-			let p;
-			return t[43] !== f || t[44] !== e ? (p = /* @__PURE__ */ $(Z, { children: [e, f] }), t[43] = f, t[44] = e, t[45] = p) : p = t[45], p;
+			}), i[40] = m, i[41] = d, i[42] = h) : h = i[42];
+			let g;
+			return i[43] !== h || i[44] !== r ? (g = /* @__PURE__ */ Z(Y, { children: [r, h] }), i[43] = h, i[44] = r, i[45] = g) : g = i[45], g;
 		}
 		case "person": {
-			let e;
-			t[46] !== i || t[47] !== r ? (e = /* @__PURE__ */ Q("rect", {
-				width: r,
-				height: i,
+			let r;
+			i[46] !== s || i[47] !== o ? (r = /* @__PURE__ */ X("rect", {
+				width: o,
+				height: s,
 				rx: 6,
 				strokeWidth: 0
-			}), t[46] = i, t[47] = r, t[48] = e) : e = t[48];
-			let n = r - nt.width - 6, a = i - nt.height, o;
-			t[49] === Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ Q("path", {
+			}), i[46] = s, i[47] = o, i[48] = r) : r = i[48];
+			let a = o - ft.width - 6, c = s - ft.height, l;
+			i[49] === Symbol.for("react.memo_cache_sentinel") ? (l = /* @__PURE__ */ X("path", {
 				strokeWidth: 0,
-				d: nt.path
-			}), t[49] = o) : o = t[49];
-			let s;
-			t[50] !== n || t[51] !== a ? (s = /* @__PURE__ */ Q("svg", {
-				x: n,
-				y: a,
-				width: nt.width,
-				height: nt.height,
-				viewBox: `0 0 ${nt.width} ${nt.height}`,
+				d: ft.path
+			}), i[49] = l) : l = i[49];
+			let u;
+			i[50] !== a || i[51] !== c ? (u = /* @__PURE__ */ X("svg", {
+				x: a,
+				y: c,
+				width: ft.width,
+				height: ft.height,
+				viewBox: `0 0 ${ft.width} ${ft.height}`,
 				"data-likec4-fill": "mix-stroke",
-				children: o
-			}), t[50] = n, t[51] = a, t[52] = s) : s = t[52];
-			let c;
-			return t[53] !== e || t[54] !== s ? (c = /* @__PURE__ */ $(Z, { children: [e, s] }), t[53] = e, t[54] = s, t[55] = c) : c = t[55], c;
+				children: l
+			}), i[50] = a, i[51] = c, i[52] = u) : u = i[52];
+			let d;
+			return i[53] !== r || i[54] !== u ? (d = /* @__PURE__ */ Z(Y, { children: [r, u] }), i[53] = r, i[54] = u, i[55] = d) : d = i[55], d;
 		}
 		case "queue": {
-			let e;
-			t[56] !== i || t[57] !== r ? (e = queueSVGPath(r, i), t[56] = i, t[57] = r, t[58] = e) : e = t[58];
-			let { path: n, rx: a, ry: o } = e, s;
-			t[59] === n ? s = t[60] : (s = /* @__PURE__ */ Q("path", {
-				d: n,
+			let r;
+			i[56] !== s || i[57] !== o ? (r = queueSVGPath(o, s), i[56] = s, i[57] = o, i[58] = r) : r = i[58];
+			let { path: a, rx: c, ry: l } = r, u;
+			i[59] === a ? u = i[60] : (u = /* @__PURE__ */ X("path", {
+				d: a,
 				strokeWidth: 2
-			}), t[59] = n, t[60] = s);
-			let c = o - .75, l;
-			t[61] !== a || t[62] !== o || t[63] !== c ? (l = /* @__PURE__ */ Q("ellipse", {
-				cx: a,
-				cy: o,
-				ry: c,
-				rx: a,
+			}), i[59] = a, i[60] = u);
+			let d = l - .75, f;
+			i[61] !== c || i[62] !== l || i[63] !== d ? (f = /* @__PURE__ */ X("ellipse", {
+				cx: c,
+				cy: l,
+				ry: d,
+				rx: c,
 				"data-likec4-fill": "mix-stroke",
 				strokeWidth: 2
-			}), t[61] = a, t[62] = o, t[63] = c, t[64] = l) : l = t[64];
-			let u;
-			return t[65] !== s || t[66] !== l ? (u = /* @__PURE__ */ $(Z, { children: [s, l] }), t[65] = s, t[66] = l, t[67] = u) : u = t[67], u;
+			}), i[61] = c, i[62] = l, i[63] = d, i[64] = f) : f = i[64];
+			let p;
+			return i[65] !== u || i[66] !== f ? (p = /* @__PURE__ */ Z(Y, { children: [u, f] }), i[65] = u, i[66] = f, i[67] = p) : p = i[67], p;
 		}
 		case "bucket": {
-			let e;
-			t[68] !== i || t[69] !== r ? (e = bucketSVGPath(r, i), t[68] = i, t[69] = r, t[70] = e) : e = t[70];
-			let { path: n, topRx: a, topRy: o } = e, s;
-			t[71] === n ? s = t[72] : (s = /* @__PURE__ */ Q("path", {
-				d: n,
+			let r;
+			i[68] !== s || i[69] !== o ? (r = bucketSVGPath(o, s), i[68] = s, i[69] = o, i[70] = r) : r = i[70];
+			let { path: a, topRx: c, topRy: l } = r, u;
+			i[71] === a ? u = i[72] : (u = /* @__PURE__ */ X("path", {
+				d: a,
 				strokeWidth: 2
-			}), t[71] = n, t[72] = s);
-			let c = r / 2, l;
-			t[73] !== c || t[74] !== a || t[75] !== o ? (l = /* @__PURE__ */ Q("ellipse", {
-				cx: c,
-				cy: o,
-				rx: a,
-				ry: o,
+			}), i[71] = a, i[72] = u);
+			let d = o / 2, f;
+			i[73] !== d || i[74] !== c || i[75] !== l ? (f = /* @__PURE__ */ X("ellipse", {
+				cx: d,
+				cy: l,
+				rx: c,
+				ry: l,
 				"data-likec4-fill": "mix-stroke",
 				strokeWidth: 2
-			}), t[73] = c, t[74] = a, t[75] = o, t[76] = l) : l = t[76];
-			let u;
-			return t[77] !== s || t[78] !== l ? (u = /* @__PURE__ */ $(Z, { children: [s, l] }), t[77] = s, t[78] = l, t[79] = u) : u = t[79], u;
+			}), i[73] = d, i[74] = c, i[75] = l, i[76] = f) : f = i[76];
+			let p;
+			return i[77] !== u || i[78] !== f ? (p = /* @__PURE__ */ Z(Y, { children: [u, f] }), i[77] = u, i[78] = f, i[79] = p) : p = i[79], p;
 		}
 		case "storage":
 		case "cylinder": {
-			let e;
-			t[80] !== i || t[81] !== r ? (e = cylinderSVGPath(r, i), t[80] = i, t[81] = r, t[82] = e) : e = t[82];
-			let { path: n, rx: a, ry: o } = e, s;
-			t[83] === n ? s = t[84] : (s = /* @__PURE__ */ Q("path", {
-				d: n,
+			let r;
+			i[80] !== s || i[81] !== o ? (r = cylinderSVGPath(o, s), i[80] = s, i[81] = o, i[82] = r) : r = i[82];
+			let { path: a, rx: c, ry: l } = r, u;
+			i[83] === a ? u = i[84] : (u = /* @__PURE__ */ X("path", {
+				d: a,
 				strokeWidth: 2
-			}), t[83] = n, t[84] = s);
-			let c = a - .75, l;
-			t[85] !== a || t[86] !== o || t[87] !== c ? (l = /* @__PURE__ */ Q("ellipse", {
-				cx: a,
-				cy: o,
-				ry: o,
-				rx: c,
+			}), i[83] = a, i[84] = u);
+			let d = c - .75, f;
+			i[85] !== c || i[86] !== l || i[87] !== d ? (f = /* @__PURE__ */ X("ellipse", {
+				cx: c,
+				cy: l,
+				ry: l,
+				rx: d,
 				"data-likec4-fill": "mix-stroke",
 				strokeWidth: 2
-			}), t[85] = a, t[86] = o, t[87] = c, t[88] = l) : l = t[88];
-			let u;
-			return t[89] !== s || t[90] !== l ? (u = /* @__PURE__ */ $(Z, { children: [s, l] }), t[89] = s, t[90] = l, t[91] = u) : u = t[91], u;
+			}), i[85] = c, i[86] = l, i[87] = d, i[88] = f) : f = i[88];
+			let p;
+			return i[89] !== u || i[90] !== f ? (p = /* @__PURE__ */ Z(Y, { children: [u, f] }), i[89] = u, i[90] = f, i[91] = p) : p = i[91], p;
 		}
 		default: {
-			let e;
-			return t[92] === n ? e = t[93] : (e = Se(n), t[92] = n, t[93] = e), e;
+			let r;
+			return i[92] === a ? r = i[93] : (r = ge(a), i[92] = a, i[93] = r), r;
 		}
 	}
 }
-function ShapeSvgOutline(e) {
-	let t = X(25), { shape: n, w: r, h: i } = e, a;
-	bb0: switch (n) {
+function ShapeSvgOutline(r) {
+	let i = J(25), { shape: a, w: o, h: s } = r, c;
+	bb0: switch (a) {
 		case "bucket": {
-			let e = r + 6, n = i + 6, o;
-			t[0] !== e || t[1] !== n ? (o = bucketSVGPath(e, n), t[0] = e, t[1] = n, t[2] = o) : o = t[2];
-			let s;
-			t[3] === o.path ? s = t[4] : (s = /* @__PURE__ */ Q("g", {
+			let r = o + 6, a = s + 6, l;
+			i[0] !== r || i[1] !== a ? (l = bucketSVGPath(r, a), i[0] = r, i[1] = a, i[2] = l) : l = i[2];
+			let u;
+			i[3] === l.path ? u = i[4] : (u = /* @__PURE__ */ X("g", {
 				transform: "translate(-3 -3)",
-				children: /* @__PURE__ */ Q("path", { d: o.path })
-			}), t[3] = o.path, t[4] = s), a = s;
+				children: /* @__PURE__ */ X("path", { d: l.path })
+			}), i[3] = l.path, i[4] = u), c = u;
 			break bb0;
 		}
 		case "queue": {
-			let e = r + 6, n = i + 6, o;
-			t[5] !== e || t[6] !== n ? (o = queueSVGPath(e, n), t[5] = e, t[6] = n, t[7] = o) : o = t[7];
-			let s;
-			t[8] === o.path ? s = t[9] : (s = /* @__PURE__ */ Q("g", {
+			let r = o + 6, a = s + 6, l;
+			i[5] !== r || i[6] !== a ? (l = queueSVGPath(r, a), i[5] = r, i[6] = a, i[7] = l) : l = i[7];
+			let u;
+			i[8] === l.path ? u = i[9] : (u = /* @__PURE__ */ X("g", {
 				transform: "translate(-3 -3)",
-				children: /* @__PURE__ */ Q("path", { d: o.path })
-			}), t[8] = o.path, t[9] = s), a = s;
+				children: /* @__PURE__ */ X("path", { d: l.path })
+			}), i[8] = l.path, i[9] = u), c = u;
 			break bb0;
 		}
 		case "document": {
-			let e = r + 6, n = i + 6, o;
-			t[10] !== e || t[11] !== n ? (o = docSVGPath(e, n), t[10] = e, t[11] = n, t[12] = o) : o = t[12];
-			let s;
-			t[13] === o.path ? s = t[14] : (s = /* @__PURE__ */ Q("g", {
+			let r = o + 6, a = s + 6, l;
+			i[10] !== r || i[11] !== a ? (l = docSVGPath(r, a), i[10] = r, i[11] = a, i[12] = l) : l = i[12];
+			let u;
+			i[13] === l.path ? u = i[14] : (u = /* @__PURE__ */ X("g", {
 				transform: "translate(-3 -3)",
-				children: /* @__PURE__ */ Q("path", { d: o.path })
-			}), t[13] = o.path, t[14] = s), a = s;
+				children: /* @__PURE__ */ X("path", { d: l.path })
+			}), i[13] = l.path, i[14] = u), c = u;
 			break bb0;
 		}
 		case "storage":
 		case "cylinder": {
-			let e = r + 6, n = i + 6, o;
-			t[15] !== e || t[16] !== n ? (o = cylinderSVGPath(e, n), t[15] = e, t[16] = n, t[17] = o) : o = t[17];
-			let s;
-			t[18] === o.path ? s = t[19] : (s = /* @__PURE__ */ Q("g", {
+			let r = o + 6, a = s + 6, l;
+			i[15] !== r || i[16] !== a ? (l = cylinderSVGPath(r, a), i[15] = r, i[16] = a, i[17] = l) : l = i[17];
+			let u;
+			i[18] === l.path ? u = i[19] : (u = /* @__PURE__ */ X("g", {
 				transform: "translate(-3 -3)",
-				children: /* @__PURE__ */ Q("path", { d: o.path })
-			}), t[18] = o.path, t[19] = s), a = s;
+				children: /* @__PURE__ */ X("path", { d: l.path })
+			}), i[18] = l.path, i[19] = u), c = u;
 			break bb0;
 		}
 		default: {
-			let e = r + 6, n = i + 6, o;
-			t[20] !== e || t[21] !== n ? (o = /* @__PURE__ */ Q("rect", {
+			let r = o + 6, a = s + 6, l;
+			i[20] !== r || i[21] !== a ? (l = /* @__PURE__ */ X("rect", {
 				x: -3,
 				y: -3,
-				width: e,
-				height: n,
+				width: r,
+				height: a,
 				rx: 8
-			}), t[20] = e, t[21] = n, t[22] = o) : o = t[22], a = o;
+			}), i[20] = r, i[21] = a, i[22] = l) : l = i[22], c = l;
 		}
 	}
-	let o;
-	return t[23] === a ? o = t[24] : (o = /* @__PURE__ */ Q("g", {
+	let l;
+	return i[23] === c ? l = i[24] : (l = /* @__PURE__ */ X("g", {
 		className: "likec4-shape-outline",
-		children: a
-	}), t[23] = a, t[24] = o), o;
-}
-function ElementShape(e) {
-	let t = X(38), { data: n, width: r, height: i, showSelectionOutline: a } = e, o = a === void 0 ? !0 : a, s = r && r > 10 ? r : n.width, c = i && i > 10 ? i : n.height, l = n.style?.multiple ?? !1, u = n.style?.border ?? "none", d = u !== "none";
-	if (n.shape === "rectangle") {
-		let e;
-		t[0] === u ? e = t[1] : (e = { borderStyle: u }, t[0] = u, t[1] = e);
-		let n;
-		t[2] !== o || t[3] !== d ? (n = w({
-			shapetype: "html",
-			withBorder: d,
-			withOutline: o
-		}), t[2] = o, t[3] = d, t[4] = n) : n = t[4];
+		children: c
+	}), i[23] = c, i[24] = l), l;
+}
+function ElementShape(r) {
+	let i = J(38), { data: a, width: o, height: s, showSelectionOutline: c } = r, l = c === void 0 ? !0 : c, u = o && o > 10 ? o : a.width, d = s && s > 10 ? s : a.height, f = a.style?.multiple ?? !1, p = a.style?.border ?? "none", m = p !== "none";
+	if (a.shape === "rectangle") {
 		let r;
-		t[5] === l ? r = t[6] : (r = l && /* @__PURE__ */ Q("div", { className: "likec4-shape-multiple" }), t[5] = l, t[6] = r);
-		let i;
-		t[7] === Symbol.for("react.memo_cache_sentinel") ? (i = /* @__PURE__ */ Q("div", { className: "likec4-shape-outline" }), t[7] = i) : i = t[7];
+		i[0] === p ? r = i[1] : (r = { borderStyle: p }, i[0] = p, i[1] = r);
 		let a;
-		return t[8] !== e || t[9] !== n || t[10] !== r ? (a = /* @__PURE__ */ $("div", {
-			style: e,
-			className: n,
-			children: [r, i]
-		}), t[8] = e, t[9] = n, t[10] = r, t[11] = a) : a = t[11], a;
+		i[2] !== l || i[3] !== m ? (a = E({
+			shapetype: "html",
+			withBorder: m,
+			withOutline: l
+		}), i[2] = l, i[3] = m, i[4] = a) : a = i[4];
+		let o;
+		i[5] === f ? o = i[6] : (o = f && /* @__PURE__ */ X("div", { className: "likec4-shape-multiple" }), i[5] = f, i[6] = o);
+		let s;
+		i[7] === Symbol.for("react.memo_cache_sentinel") ? (s = /* @__PURE__ */ X("div", { className: "likec4-shape-outline" }), i[7] = s) : s = i[7];
+		let c;
+		return i[8] !== r || i[9] !== a || i[10] !== o ? (c = /* @__PURE__ */ Z("div", {
+			"aria-hidden": !0,
+			style: r,
+			className: a,
+			children: [o, s]
+		}), i[8] = r, i[9] = a, i[10] = o, i[11] = c) : c = i[11], c;
 	}
-	let f;
-	t[12] === o ? f = t[13] : (f = w({
+	let h;
+	i[12] === l ? h = i[13] : (h = E({
 		shapetype: "svg",
-		withOutline: o
-	}), t[12] = o, t[13] = f);
-	let p = f, m;
-	t[14] !== p || t[15] !== n.shape || t[16] !== n.style?.size || t[17] !== c || t[18] !== l || t[19] !== s ? (m = l && /* @__PURE__ */ Q("svg", {
-		className: p,
+		withOutline: l
+	}), i[12] = l, i[13] = h);
+	let g = h, _;
+	i[14] !== g || i[15] !== a.shape || i[16] !== a.style?.size || i[17] !== d || i[18] !== f || i[19] !== u ? (_ = f && /* @__PURE__ */ X("svg", {
+		"aria-hidden": !0,
+		className: g,
 		"data-likec4-shape-multiple": "true",
-		viewBox: `0 0 ${s} ${c}`,
-		children: /* @__PURE__ */ Q(ShapeSvg, {
-			shape: n.shape,
-			size: n.style?.size,
-			w: s,
-			h: c
+		viewBox: `0 0 ${u} ${d}`,
+		children: /* @__PURE__ */ X(ShapeSvg, {
+			shape: a.shape,
+			size: a.style?.size,
+			w: u,
+			h: d
 		})
-	}), t[14] = p, t[15] = n.shape, t[16] = n.style?.size, t[17] = c, t[18] = l, t[19] = s, t[20] = m) : m = t[20];
-	let h = `0 0 ${s} ${c}`, g;
-	t[21] !== n.shape || t[22] !== c || t[23] !== s ? (g = /* @__PURE__ */ Q(ShapeSvgOutline, {
-		shape: n.shape,
-		w: s,
-		h: c
-	}), t[21] = n.shape, t[22] = c, t[23] = s, t[24] = g) : g = t[24];
-	let _ = n.style?.size, v;
-	t[25] !== n.shape || t[26] !== c || t[27] !== _ || t[28] !== s ? (v = /* @__PURE__ */ Q(ShapeSvg, {
-		shape: n.shape,
-		size: _,
-		w: s,
-		h: c
-	}), t[25] = n.shape, t[26] = c, t[27] = _, t[28] = s, t[29] = v) : v = t[29];
-	let y;
-	t[30] !== p || t[31] !== h || t[32] !== g || t[33] !== v ? (y = /* @__PURE__ */ $("svg", {
-		className: p,
-		viewBox: h,
-		children: [g, v]
-	}), t[30] = p, t[31] = h, t[32] = g, t[33] = v, t[34] = y) : y = t[34];
-	let b;
-	return t[35] !== m || t[36] !== y ? (b = /* @__PURE__ */ $(Z, { children: [m, y] }), t[35] = m, t[36] = y, t[37] = b) : b = t[37], b;
+	}), i[14] = g, i[15] = a.shape, i[16] = a.style?.size, i[17] = d, i[18] = f, i[19] = u, i[20] = _) : _ = i[20];
+	let v = `0 0 ${u} ${d}`, y;
+	i[21] !== a.shape || i[22] !== d || i[23] !== u ? (y = /* @__PURE__ */ X(ShapeSvgOutline, {
+		shape: a.shape,
+		w: u,
+		h: d
+	}), i[21] = a.shape, i[22] = d, i[23] = u, i[24] = y) : y = i[24];
+	let b = a.style?.size, x;
+	i[25] !== a.shape || i[26] !== d || i[27] !== b || i[28] !== u ? (x = /* @__PURE__ */ X(ShapeSvg, {
+		shape: a.shape,
+		size: b,
+		w: u,
+		h: d
+	}), i[25] = a.shape, i[26] = d, i[27] = b, i[28] = u, i[29] = x) : x = i[29];
+	let S;
+	i[30] !== g || i[31] !== v || i[32] !== y || i[33] !== x ? (S = /* @__PURE__ */ Z("svg", {
+		"aria-hidden": !0,
+		className: g,
+		viewBox: v,
+		children: [y, x]
+	}), i[30] = g, i[31] = v, i[32] = y, i[33] = x, i[34] = S) : S = i[34];
+	let C;
+	return i[35] !== _ || i[36] !== S ? (C = /* @__PURE__ */ Z(Y, { children: [_, S] }), i[35] = _, i[36] = S, i[37] = C) : C = i[37], C;
 }
 //#endregion
 //#region ../diagram/src/base-primitives/memoEdge.ts
-var isSame = (e, t) => Math.abs(e - t) < 2.5, edgePropsEqual = (e, t) => e.id === t.id && K(e.selected ?? !1, t.selected ?? !1) && K(e.animated ?? !1, t.animated ?? !1) && K(e.source, t.source) && K(e.target, t.target) && isSame(e.sourceX, t.sourceX) && isSame(e.sourceY, t.sourceY) && isSame(e.targetX, t.targetX) && isSame(e.targetY, t.targetY) && K(e.sourceHandleId ?? null, t.sourceHandleId ?? null) && K(e.targetHandleId ?? null, t.targetHandleId ?? null) && K(e.sourcePosition, t.sourcePosition) && K(e.targetPosition, t.targetPosition) && K(e.data, t.data);
-function memoEdge(e) {
-	let t = Y(e, edgePropsEqual);
-	return t.displayName = `MemoEdge(${e.displayName || e.name})`, t;
+var isSame = (r, i) => Math.abs(r - i) < 2.5, edgePropsEqual = (r, i) => r.id === i.id && W(r.selected ?? !1, i.selected ?? !1) && W(r.animated ?? !1, i.animated ?? !1) && W(r.source, i.source) && W(r.target, i.target) && isSame(r.sourceX, i.sourceX) && isSame(r.sourceY, i.sourceY) && isSame(r.targetX, i.targetX) && isSame(r.targetY, i.targetY) && W(r.sourceHandleId ?? null, i.sourceHandleId ?? null) && W(r.targetHandleId ?? null, i.targetHandleId ?? null) && W(r.sourcePosition, i.sourcePosition) && W(r.targetPosition, i.targetPosition) && W(r.data, i.data);
+function memoEdge(r) {
+	let i = le(r, edgePropsEqual);
+	return i.displayName = `MemoEdge(${r.displayName || r.name})`, i;
 }
 //#endregion
 //#region ../diagram/src/base-primitives/NodeHandles.tsx
-function DefaultHandles(e) {
-	let t = X(7), { direction: n } = e, r = n === void 0 ? "TB" : n, i, a;
-	bb0: switch (r) {
+function DefaultHandles(r) {
+	let i = J(7), { direction: a } = r, o = a === void 0 ? "TB" : a, s, c;
+	bb0: switch (o) {
 		case "TB":
-			i = V.Bottom, a = V.Top;
+			s = F.Bottom, c = F.Top;
 			break bb0;
 		case "BT":
-			i = V.Top, a = V.Bottom;
+			s = F.Top, c = F.Bottom;
 			break bb0;
 		case "LR":
-			i = V.Right, a = V.Left;
+			s = F.Right, c = F.Left;
 			break bb0;
 		case "RL":
-			i = V.Left, a = V.Right;
+			s = F.Left, c = F.Right;
 			break bb0;
-		default: Se(r);
+		default: ge(o);
 	}
-	let o;
-	t[0] === i ? o = t[1] : (o = /* @__PURE__ */ Q(H, {
+	let l;
+	i[0] === s ? l = i[1] : (l = /* @__PURE__ */ X(I, {
 		type: "source",
-		position: i,
+		position: s,
 		className: "likec4-node-handle-center"
-	}), t[0] = i, t[1] = o);
-	let s;
-	t[2] === a ? s = t[3] : (s = /* @__PURE__ */ Q(H, {
+	}), i[0] = s, i[1] = l);
+	let u;
+	i[2] === c ? u = i[3] : (u = /* @__PURE__ */ X(I, {
 		type: "target",
-		position: a,
+		position: c,
 		className: "likec4-node-handle-center"
-	}), t[2] = a, t[3] = s);
-	let c;
-	return t[4] !== o || t[5] !== s ? (c = /* @__PURE__ */ $(Z, { children: [o, s] }), t[4] = o, t[5] = s, t[6] = c) : c = t[6], c;
+	}), i[2] = c, i[3] = u);
+	let d;
+	return i[4] !== l || i[5] !== u ? (d = /* @__PURE__ */ Z(Y, { children: [l, u] }), i[4] = l, i[5] = u, i[6] = d) : d = i[6], d;
 }
 //#endregion
 //#region ../diagram/src/components/Logo.tsx
-var rt = J((e, t) => {
-	let n = X(5), r, i;
-	n[0] === Symbol.for("react.memo_cache_sentinel") ? (r = /* @__PURE__ */ Q("path", {
+var pt = K((r, i) => {
+	let a = J(5), o, s;
+	a[0] === Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ X("path", {
 		fill: "#5E98AF",
 		d: "M33.95 33.78V0H2.37A2.37 2.37 0 0 0 0 2.35V33.9h33.95v-.12ZM38.57 33.78H55.6v-14.6c0-1.3-1.06-2.35-2.36-2.35H38.57v16.95ZM33.95 38.37H17.04v14.6c0 1.29 1.06 2.35 2.36 2.35h14.67V38.37h-.12ZM38.57 38.37v16.95h14.67c1.3 0 2.36-1.06 2.36-2.36v-14.6H38.57Z"
-	}), i = /* @__PURE__ */ Q("path", {
-		className: C({
+	}), s = /* @__PURE__ */ X("path", {
+		className: T({
 			fill: "[#FCFBF7]",
 			_light: { fill: "[#222221]" }
 		}),
 		d: "M71.61 12.08c-.06 3.61.3 29.95.23 31.87 0 1.8 0 3.6.06 5.41 0 .3.18.58.47.58 4.1.18 8.13-.17 12.22-.11 1.34.05 2.69 0 3.97 0 1.29-.06 1.4-.59 1.35-1.63-.06-1.63-.06-3.08-.06-4.65-.06-.82-.53-1.11-1.23-1.11-2.4.06-4.8-.06-7.19.06-.4.06-.82.06-1.23.06-.7-.06-.87-.24-.93-1v-.86c-.18-4.83.17-9.83.17-14.66-.06-4.07 0-7.73-.06-11.34 0-1.57 0-3.14-.05-4.65-.06-.93 0-1.92-.24-2.85-.11-.35-.29-.81-.7-.81h-5.5c-.93 0-1.22.64-1.28 1.57v4.12ZM103.81 35c-.17-6.63-.1-13.67-.05-20.24 0-2.04-.12-4.25-.12-6.28 0-2.21-.87-2.1-2.04-2.15-1.7-.06-2.46-.06-4.15-.06-1.11-.06-1.58.23-1.58 1.34 0 5.7-.18 21.8-.12 24.13.06 2.33.3 12.91.18 15.24-.06.81 0 1.62.06 2.44.05.29.23.58.7.58 1.93-.12 3.74-.12 5.67-.17.7-.06 1.28-.24 1.58-1 .05-.4-.12-11.04-.12-13.83Zm13.92 4.47c0-2.03-.3-7.56-.23-8.72 0-.17.11-.4.17-.4.12 0 .35.11.41.17 1.87 2.44 10.64 19.36 11.7 19.42.28.06.58.06.87.06 1.99-.12 3.74 0 5.73 0 2.04 0 .7-1.98.35-2.5-.53-.76-7.48-13.14-7.9-13.9-1.16-1.98-2.16-4.13-3.32-6.05-.12-.23-.24-.58-.18-.81.12-.7.3-1.34.59-1.98a93.18 93.18 0 0 1 4.55-8.14c1.88-2.97 2.93-4.83 4.45-7.5.35-.64.58-1.34.82-2.1.05-.29-.18-.58-.53-.58-1.11-.05-5.15 0-6.43 0-.59 0-1.17.12-1.46.64-.76 1.46-8.6 15.7-9.35 16.98-.06.12-.24.18-.41.18 0 0-.12-.18-.12-.3-.06-3.25.53-13.9.4-16.04-.05-1.28-.28-1.4-1.57-1.46-1.4-.05-3.33-.05-4.73-.05-1.3 0-1.4.7-1.58 1.62-.06.18-.06 5.64-.06 8.09 0 3.54-.3 25.76.11 32.8 0 .7.18 1.1.77 1.1 1.57-.12 3.91 0 5.49 0 1.11 0 1.29-.12 1.29-1.98 0-2.5.23-4.77.23-7.85 0-.23-.06-.46-.06-.7Zm25.66-1.4h-.06c0 1.46-.05 2.97 0 4.49.06 1.86.18 3.72.3 5.58 0 .64.17.81.76.93 1.22.29 2.4.35 3.62.35 3.16-.12 6.31.11 9.47 0 1.29-.06 1.87.06 3.16-.18 1.17-.23 1.58-.87 1.58-2.61-.12-1.1-.06-1.57-.06-2.91 0-1.92-1.35-2.56-2.52-2.5-.81.06-4.73-.06-6.31-.06-2.63.06-2.22.4-2.22-2.33 0-2.2.06-5.05.06-7.32 0-1.22.11-1.63 1.28-1.63h7.31c1.17.17 1.99-.64 1.99-1.86 0-1.22.12-1.28.12-2.5l-.18-1.75c-.12-.99-.47-1.33-1.46-1.33-.64 0-1.29.05-1.93.11-2.52.18-3.68-.17-6.14 0-.82 0-.93-.11-1-.87-.23-2.27 0-4.77.24-7.04.06-.93.3-1.1 1.17-1.16l8.24-.06c1.11-.11 1.46-.06 1.4-1.16-.11-1.69.06-3.43-.11-5.12-.12-.93-.41-1.1-1.46-1.1-1.76.05-2.17.05-3.92.17-1.75.06-8.77.06-10.46.06-2.46 0-2.63-.18-2.7 2.8-.1 2.32-.05 4.7-.05 7.09 0 4.07-.23 18.66-.12 21.92Zm47.76-24.82c.06-1.92 0-3.5 0-5.35 0-2.15-3.92-1.92-5.32-1.86a18.95 18.95 0 0 0-15.08 9.77c-.82 1.57-1.4 3.2-1.81 4.88a34 34 0 0 0-.59 12.15c.41 3.78 1.4 7.56 3.74 10.59 4.04 5.3 11.46 7.15 17.83 6.16.3-.06.59-.11.82-.29.18-.11.35-.35.35-.58l.18-3.31c.06-1.05 0-1 0-2.04 0-1.4-2.93-.35-4.74-.35-1.75 0-3.62-.06-5.2-.87-2.8-1.57-4.38-4.71-5.26-7.68-1-3.2-1.23-6.63-.64-9.88.7-4.25 2.74-9.13 7.25-10.59 2.57-.87 5.31-.58 7.89-.29.35.06.58-.17.58-.46Zm26.77 15.3c.06-2.5 0-14.84 0-18.38.06-.82 0-1.63-.11-2.45-.06-.99-.24-1.28-1.29-1.33h-4.44c-.82 0-1.35.4-1.82 1.27-1.34 3.2-10.75 24.02-12.15 26.58-.53.99-1 1.63-1 2.68v4.24c0 .76-.06 1.28 1.23 1.28l11.1-.06c1.47 0 1.47.3 1.47 1.1 0 .88-.12 4.9-.12 5.3 0 .58.12 1.16 1.23 1.16h5.08c1.23 0 1.23-.7 1.23-2.03.06-1.17-.06-3.5-.06-4.66 0-.93.18-.98 1.76-.98 1.22 0 1.75-.12 1.75-.88.06-1.57 0-2.67 0-4.42 0-1.04-.93-.98-2.92-.98-.65 0-.7-.18-.7-1.05-.12-1.8-.24-4.6-.24-6.4Zm-7.25-5.94c-.05.7-.11 10.82-.11 12.27-.06.81-.24 1.05-1 1.1-1.93.06-3.85.06-5.78.06-.47 0-.65-.4-.41-.87.23-.4 4.85-11.57 6.13-14.48.18-.17.24-.35.41-.52.18-.12.41-.18.59-.23.06 0 .23.29.23.46 0 .76-.06 1.51-.06 2.21Z"
-	}), n[0] = r, n[1] = i) : (r = n[0], i = n[1]);
-	let a;
-	return n[2] !== e || n[3] !== t ? (a = /* @__PURE__ */ $("svg", {
-		ref: t,
+	}), a[0] = o, a[1] = s) : (o = a[0], s = a[1]);
+	let c;
+	return a[2] !== r || a[3] !== i ? (c = /* @__PURE__ */ Z("svg", {
+		ref: i,
 		xmlns: "http://www.w3.org/2000/svg",
 		fill: "none",
 		viewBox: "0 0 222 56",
-		...e,
-		children: [r, i]
-	}), n[2] = e, n[3] = t, n[4] = a) : a = n[4], a;
-}), it = J((e, t) => {
-	let n = X(4), r;
-	n[0] === Symbol.for("react.memo_cache_sentinel") ? (r = /* @__PURE__ */ Q("path", {
+		...r,
+		children: [o, s]
+	}), a[2] = r, a[3] = i, a[4] = c) : c = a[4], c;
+}), mt = K((r, i) => {
+	let a = J(4), o;
+	a[0] === Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ X("path", {
 		fill: "#5E98AF",
 		d: "M33.95 33.78V0H2.37A2.37 2.37 0 0 0 0 2.35V33.9h33.95v-.12ZM38.57 33.78H55.6v-14.6c0-1.3-1.06-2.35-2.36-2.35H38.57v16.95ZM33.95 38.37H17.04v14.6c0 1.29 1.06 2.35 2.36 2.35h14.67V38.37h-.12ZM38.57 38.37v16.95h14.67c1.3 0 2.36-1.06 2.36-2.36v-14.6H38.57Z"
-	}), n[0] = r) : r = n[0];
-	let i;
-	return n[1] !== e || n[2] !== t ? (i = /* @__PURE__ */ Q("svg", {
-		ref: t,
+	}), a[0] = o) : o = a[0];
+	let s;
+	return a[1] !== r || a[2] !== i ? (s = /* @__PURE__ */ X("svg", {
+		ref: i,
 		xmlns: "http://www.w3.org/2000/svg",
 		fill: "none",
 		viewBox: "0 0 56 56",
-		...e,
-		children: r
-	}), n[1] = e, n[2] = t, n[3] = i) : i = n[3], i;
-}), scheme = (e) => `[data-mantine-color-scheme="${e}"]`, at = scheme("dark"), generateCompoundColors = (e, t, n, r) => `
-${`${e} :is([data-likec4-color="${t}"][data-compound-depth="${r}"])`} {
-  --likec4-palette-fill: ${n.fill};
-  --likec4-palette-stroke: ${n.stroke};  
+		...r,
+		children: o
+	}), a[1] = r, a[2] = i, a[3] = s) : s = a[3], s;
+}), { withProvider: ht, withContext: gt } = S(N), shouldForwardProp = (r, i) => !i.includes(r) && (re(r) || !j(r)), _t = K((r, i) => {
+	let a = J(11), o, s;
+	a[0] === r ? (o = a[1], s = a[2]) : ({className: o, ...s} = r, a[0] = r, a[1] = o, a[2] = s);
+	let c;
+	a[3] === o ? c = a[4] : (c = w("mantine-active", o), a[3] = o, a[4] = c);
+	let l, u;
+	a[5] === Symbol.for("react.memo_cache_sentinel") ? (l = /* @__PURE__ */ X(mt, { "data-logo-icon": !0 }), u = /* @__PURE__ */ X(pt, { "data-logo-full": !0 }), a[5] = l, a[6] = u) : (l = a[5], u = a[6]);
+	let d;
+	return a[7] !== s || a[8] !== i || a[9] !== c ? (d = /* @__PURE__ */ Z("button", {
+		...s,
+		ref: i,
+		className: c,
+		children: [l, u]
+	}), a[7] = s, a[8] = i, a[9] = c, a[10] = d) : d = a[10], d;
+}), vt = {
+	Root: ht(G, "root", { shouldForwardProp }),
+	Body: gt(G, "body", { shouldForwardProp }),
+	Logo: gt(_t, "logo", { shouldForwardProp }),
+	Label: gt(G, "label", { shouldForwardProp }),
+	Dropdown: gt(G, "dropdown", { shouldForwardProp })
+}, scheme = (r) => `[data-mantine-color-scheme="${r}"]`, yt = scheme("dark"), generateCompoundColors = (r, i, a, o) => `
+${`${r} :is([data-likec4-color="${i}"][data-compound-depth="${o}"])`} {
+  --likec4-palette-fill: ${a.fill};
+  --likec4-palette-stroke: ${a.stroke};  
 }
   `;
-function toStyle(e, t) {
-	let { rootSelector: n, name: r, colors: i } = t, { elements: a, relationships: o } = i, s = `${n} :is([data-likec4-color=${r}])`;
+function toStyle(r, i) {
+	let { rootSelector: a, name: o, colors: s } = i, { elements: c, relationships: l } = s, u = `${a} :is([data-likec4-color=${o}])`;
 	return [`
-${s} {
-  --likec4-palette-fill: ${a.fill};
-  --likec4-palette-stroke: ${a.stroke};
-  --likec4-palette-hiContrast: ${a.hiContrast};
-  --likec4-palette-loContrast: ${a.loContrast};
-  --likec4-palette-relation-stroke: ${o.line};
-  --likec4-palette-relation-label: ${o.label};
-  --likec4-palette-relation-label-bg: ${o.labelBg};
-  --likec4-palette-relation-stroke-selected: oklch(from ${o.line} calc(l - 0.15) c h);
-}
-${at} ${s} {
-  --likec4-palette-relation-stroke-selected: oklch(from ${o.line} calc(l + 0.15) c h);
+${u} {
+  --likec4-palette-fill: ${c.fill};
+  --likec4-palette-stroke: ${c.stroke};
+  --likec4-palette-hiContrast: ${c.hiContrast};
+  --likec4-palette-loContrast: ${c.loContrast};
+  --likec4-palette-relation-stroke: ${l.line};
+  --likec4-palette-relation-label: ${l.label};
+  --likec4-palette-relation-label-bg: ${l.labelBg};
+  --likec4-palette-relation-stroke-selected: oklch(from ${l.line} calc(l - 0.15) c h);
+}
+${yt} ${u} {
+  --likec4-palette-relation-stroke-selected: oklch(from ${l.line} calc(l + 0.15) c h);
 }
 
-  `, ...e.colorsForCompounds(a, 5).map((e, t) => generateCompoundColors(n, r, e, t + 1))].map((e) => e.trim()).join("\n");
-}
-function generateBuiltInColorStyles(e, t) {
-	return s(e.theme.colors, o(), c(([n, r]) => toStyle(e, {
-		rootSelector: t,
-		name: n,
-		colors: r
-	})), l("\n"));
-}
-function LikeC4Styles$1(e) {
-	let t = X(7), { id: n } = e, r = `#${n}`, i = p()?.(), a = useLikeC4Styles(), o;
-	t[0] !== a || t[1] !== r ? (o = generateBuiltInColorStyles(a, r), t[0] = a, t[1] = r, t[2] = o) : o = t[2];
-	let s = o, c;
-	return t[3] !== s || t[4] !== n || t[5] !== i ? (c = /* @__PURE__ */ Q(ot, {
-		id: n,
-		nonce: i,
-		colorsStyles: s
-	}), t[3] = s, t[4] = n, t[5] = i, t[6] = c) : c = t[6], c;
-}
-e(LikeC4Styles$1, "LikeC4Styles");
-var ot = Y((e) => {
-	let t = X(6), { id: n, nonce: r, colorsStyles: i } = e, a;
-	t[0] === i ? a = t[1] : (a = { __html: i }, t[0] = i, t[1] = a);
-	let o = r || void 0, s;
-	return t[2] !== n || t[3] !== a || t[4] !== o ? (s = /* @__PURE__ */ Q("style", {
+  `, ...r.colorsForCompounds(c, 5).map((r, i) => generateCompoundColors(a, o, r, i + 1))].map((r) => r.trim()).join("\n");
+}
+function generateBuiltInColorStyles(r, i) {
+	return a(r.theme.colors, t$2(), u(([a, o]) => toStyle(r, {
+		rootSelector: i,
+		name: a,
+		colors: o
+	})), t$1("\n"));
+}
+function LikeC4Styles$1({ id: r }) {
+	let i = `#${r}`, a = h()?.(), o = useLikeC4Styles();
+	return /* @__PURE__ */ X(bt, {
+		id: r,
+		nonce: a,
+		colorsStyles: de(() => generateBuiltInColorStyles(o, i), [i, o.fingerprint])
+	});
+}
+r(LikeC4Styles$1, "LikeC4Styles");
+var bt = le((r) => {
+	let i = J(6), { id: a, nonce: o, colorsStyles: s } = r, c;
+	i[0] === s ? c = i[1] : (c = { __html: s }, i[0] = s, i[1] = c);
+	let l = o || void 0, u;
+	return i[2] !== a || i[3] !== c || i[4] !== l ? (u = /* @__PURE__ */ X("style", {
 		type: "text/css",
-		"data-likec4-colors": n,
-		dangerouslySetInnerHTML: a,
-		nonce: o
-	}), t[2] = n, t[3] = a, t[4] = o, t[5] = s) : s = t[5], s;
+		"data-likec4-colors": a,
+		dangerouslySetInnerHTML: c,
+		nonce: l
+	}), i[2] = a, i[3] = c, i[4] = l, i[5] = u) : u = i[5], u;
 });
-ot.displayName = "MemoizedStyle";
+bt.displayName = "MemoizedStyle";
 //#endregion
-export { IconRendererProvider as $, useRootContainerElement as A, getNodeIntersectionFromCenterToPoint as B, useOptionalLikeC4Model as C, RootContainer as D, DefaultMantineProvider as E, Fe as F, roundDpr as G, nodeToRect as H, Pe as I, useXYStore as J, useCurrentZoomAtLeast as K, bezierControlPoints as L, BaseXYFlow as M, Le as N, useRootContainer as O, Ie as P, IconRenderer as Q, bezierPath as R, useOptionalCurrentViewModel as S, EnsureMantine as T, parsePaddings as U, isSamePoint as V, stopPropagation as W, useCallbackRef as X, useXYStoreApi as Y, IconOrShapeRenderer as Z, pickViewBounds as _, memoEdge as a, We as b, ElementData as c, EdgeLabelContainer as d, Ge as f, calcViewBounds as g, calcEdgeBounds as h, DefaultHandles as i, useRootContainerRef as j, useRootContainerContext as k, ElementActionButtons as l, Te as m, rt as n, ElementShape as o, EdgeContainer as p, useXYFlow as q, it as r, tt as s, LikeC4Styles$1 as t, qe as u, useLikeC4Styles as v, FramerMotionConfig as w, He as x, useId$1 as y, getNodeCenter as z };
+export { stopPropagation as $, useOptionalCurrentViewModel as A, BaseXYFlow as B, useLikeC4Projects as C, useId$1 as D, useOptionalProjectsContext as E, RootContainer as F, hasSubObject as G, Be as H, useRootContainer as I, getNodeCenter as J, bezierControlPoints as K, useRootContainerContext as L, FramerMotionConfig as M, EnsureMantine as N, Ye as O, DefaultMantineProvider as P, parsePaddings as Q, useRootContainerElement as R, useLikeC4ProjectId as S, Ze as T, ze as U, Ve as V, Re as W, isSamePoint as X, getNodeIntersectionFromCenterToPoint as Y, nodeToRect as Z, calcEdgeBounds as _, t$3 as _t, DefaultHandles as a, useXYStoreApi as at, useLikeC4Styles as b, dt as c, IconRenderer as ct, rt as d, t as dt, roundDpr as et, EdgeLabelContainer as f, t$1 as ft, readableText as g, t$2 as gt, _e as h, e$2 as ht, mt as i, useXYStore as it, useOptionalLikeC4Model as j, qe as k, ElementData as l, IconRendererProvider as lt, EdgeContainer as m, e$1 as mt, vt as n, useCurrentZoomAtLeast as nt, memoEdge as o, useCallbackRef as ot, tt as p, e as pt, bezierPath as q, pt as r, useXYFlow as rt, ElementShape as s, IconOrShapeRenderer as st, LikeC4Styles$1 as t, selectXYStore as tt, ElementActionButtons as u, Ne as ut, calcViewBounds as v, t$4 as vt, useLikeC4ProjectsContext as w, useChangeLikeC4Project as x, pickViewBounds as y, useRootContainerRef as z };