@pi-outpost/embed 0.32.4 → 0.34.0

package/dist/{chunk-ZLD2IHE6-CqnVd2rq.js → stateDiagram-v2-TBUQTH76-PRnBJSrY.js}

@@ -1,13 +1,21 @@
 import { n as e } from "./chunk-Y2CYZVJY-CwsV_8W4.js";
 import { m as t, p as n } from "./src-Dkp7vqs8.js";
-import { $ as r, H as i, K as a, U as o, a as s, s as c, v as l, w as u, x as d, y as f } from "./chunk-DU6HZSFF-BW30DVuW.js";
-import { g as p, s as m } from "./chunk-75Z2AOVW-DoA8rENV.js";
-import { t as h } from "./chunk-F27PBJKO-s9M3oGHp.js";
-import { t as g } from "./chunk-XXDRQBXY-IzhWXllg.js";
-import { t as _ } from "./chunk-POPQ4Y6H-vLTNjxsT.js";
-import { d as v } from "./mermaid.core-DI1iFk6G.js";
-//#region ../node_modules/mermaid/dist/chunks/mermaid.core/chunk-ZLD2IHE6.mjs
-var y = (function() {
+import { C as r, H as i, U as a, _ as o, a as s, b as c, et as l, q as u, s as d, v as f } from "./chunk-VPRB5NB3-DJh7spRO.js";
+import { _ as p, s as m } from "./chunk-3YJQHVM4-BNbfg-7y.js";
+import "./chunk-HJ2JQQFS-CgYTXthn.js";
+import "./chunk-E2ZNV5FY-Bu796yUY.js";
+import "./chunk-4EA7E6EY-B5P7n2an.js";
+import { a as h, i as g, o as _, r as v } from "./chunk-J5ZVWO5B-DEP-pB-1.js";
+import "./chunk-XC4XBNZT-CSiWBPH9.js";
+import "./chunk-DBDB3WZW-DpEOsLsQ.js";
+import "./chunk-2BW5OAIV-DWtmlmt_.js";
+import { t as y } from "./chunk-7TKQ45FW-CD1KuemG.js";
+import { t as b } from "./chunk-XXDRQBXY-IzhWXllg.js";
+import { t as x } from "./chunk-KQW6MTUR-c0XOjr_c.js";
+import "./chunk-NTY3LDVX-CvRtOCpm.js";
+import { a as S, i as C } from "./mermaid.core-BJkDCzqA.js";
+//#region ../node_modules/mermaid/dist/chunks/mermaid.core/stateDiagram-v2-TBUQTH76.mjs
+var w = (function() {
 	var t = /* @__PURE__ */ e(function(e, t, n, r) {
 		for (n ||= {}, r = e.length; r--; n[e[r]] = t);
 		return n;
@@ -1347,97 +1355,56 @@ var y = (function() {
 	}
 	return e(P, "Parser"), P.prototype = N, N.Parser = P, new P();
 })();
-y.parser = y;
-var b = y, x = "TB", S = "TB", C = "dir", w = "state", T = "root", E = "relation", D = "classDef", O = "style", k = "applyClass", A = "default", j = "divider", M = "fill:none", N = "fill: #333", P = "c", ee = "markdown", F = "normal", I = "rect", L = "rectWithTitle", te = "stateStart", ne = "stateEnd", R = "divider", re = "roundedWithTitle", ie = "note", ae = "noteGroup", z = "statediagram", oe = `${z}-state`, B = "transition", se = "note", ce = `${B} note-edge`, le = `${z}-${se}`, ue = `${z}-cluster`, de = `${z}-cluster-alt`, V = "parent", H = "note", fe = "state", U = "----", pe = `${U}${H}`, W = `${U}${V}`, G = /* @__PURE__ */ e((e, t = S) => {
-	if (!e.doc) return t;
-	let n = t;
-	for (let t of e.doc) t.stmt === "dir" && (n = t.value);
-	return n;
-}, "getDir"), me = {
-	getClasses: /* @__PURE__ */ e(function(e, t) {
-		return t.db.getClasses();
-	}, "getClasses"),
-	draw: /* @__PURE__ */ e(async function(e, n, r, i) {
-		t.info("REF0:"), t.info("Drawing state diagram (v2)", n);
-		let { securityLevel: a, state: o, layout: s } = d();
-		i.db.extract(i.db.getRootDocV2());
-		let c = i.db.getData(), l = g(n, a);
-		c.type = i.type, c.layoutAlgorithm = s, c.nodeSpacing = o?.nodeSpacing || 50, c.rankSpacing = o?.rankSpacing || 50, c.markers = d().look === "neo" ? ["barbNeo"] : ["barb"], c.diagramId = n, await v(c, l);
-		try {
-			(typeof i.db.getLinks == "function" ? i.db.getLinks() : /* @__PURE__ */ new Map()).forEach((e, n) => {
-				let r = typeof n == "string" ? n : typeof n?.id == "string" ? n.id : "", i = c.nodes.find((e) => e.id === r);
-				if (!r) {
-					t.warn("⚠️ Invalid or missing stateId from key:", JSON.stringify(n));
-					return;
-				}
-				let a = l.node()?.querySelectorAll("g.node, g.rough-node"), o;
-				if (a?.forEach((e) => {
-					let t = e.textContent?.trim();
-					(e.id === i?.domId || t === r) && (o = e);
-				}), !o) {
-					t.warn("⚠️ Could not find node matching text:", r);
-					return;
-				}
-				let s = o.parentNode;
-				if (!s) {
-					t.warn("⚠️ Node has no parent, cannot wrap:", r);
-					return;
-				}
-				let u = document.createElementNS("http://www.w3.org/2000/svg", "a"), d = e.url.replace(/^"+|"+$/g, "");
-				if (u.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", d), u.setAttribute("target", "_blank"), e.tooltip) {
-					let t = e.tooltip.replace(/^"+|"+$/g, "");
-					u.setAttribute("title", t), o.setAttribute("title", t);
-				}
-				s.replaceChild(u, o), u.appendChild(o), t.info("🔗 Wrapped node in <a> tag for:", r, e.url);
-			});
-		} catch (e) {
-			t.error("❌ Error injecting clickable links:", e);
-		}
-		p.insertTitle(l, "statediagramTitleText", o?.titleTopMargin ?? 25, i.db.getDiagramTitle()), _(l, 8, z, o?.useMaxWidth ?? !0);
-	}, "draw"),
-	getDir: G
-}, K = /* @__PURE__ */ new Map(), q = 0;
-function J(e = "", t = 0, n = "", r = U) {
-	return `${fe}-${e}${n !== null && n.length > 0 ? `${r}${n}` : ""}-${t}`;
+w.parser = w;
+var T = w, E = "TB", D = "TB", O = "dir", k = "state", A = "root", j = "relation", M = "classDef", N = "style", P = "applyClass", F = "default", ee = "divider", te = "fill:none", ne = "fill: #333", re = "c", ie = "markdown", ae = "normal", I = "rect", L = "rectWithTitle", oe = "stateStart", se = "stateEnd", R = "divider", ce = "roundedWithTitle", le = "note", ue = "noteGroup", z = "statediagram", de = `${z}-state`, B = "transition", fe = "note", pe = `${B} note-edge`, me = `${z}-${fe}`, he = `${z}-cluster`, ge = `${z}-cluster-alt`, V = "parent", H = "note", _e = "state", U = "----", ve = `${U}${H}`, ye = `${U}${V}`, W = /* @__PURE__ */ new Map(), G = 0, be = 0, K = /* @__PURE__ */ new Map(), xe = /* @__PURE__ */ e((e, t, n, r) => {
+	if (e === R && n?.id !== void 0 && K.has(n.id)) {
+		let e = K.get(n.id);
+		return K.set(t, e), e;
+	}
+	let i = be++, a = r ? void 0 : i;
+	return K.set(t, a), a;
+}, "colorSlotFor");
+function q(e = "", t = 0, n = "", r = U) {
+	return `${_e}-${e}${n !== null && n.length > 0 ? `${r}${n}` : ""}-${t}`;
 }
-e(J, "stateDomId");
-var he = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
+e(q, "stateDomId");
+var Se = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 	t.trace("items", n), n.forEach((t) => {
 		switch (t.stmt) {
-			case w:
-				Z(e, t, r, i, a, o, s, l);
+			case k:
+				X(e, t, r, i, a, o, s, l);
 				break;
-			case A:
-				Z(e, t, r, i, a, o, s, l);
+			case F:
+				X(e, t, r, i, a, o, s, l);
 				break;
-			case E: {
-				Z(e, t.state1, r, i, a, o, s, l), Z(e, t.state2, r, i, a, o, s, l);
+			case j: {
+				X(e, t.state1, r, i, a, o, s, l), X(e, t.state2, r, i, a, o, s, l);
 				let n = s === "neo", u = {
-					id: "edge" + q,
+					id: "edge" + G,
 					start: t.state1.id,
 					end: t.state2.id,
 					arrowhead: "normal",
 					arrowTypeEnd: n ? "arrow_barb_neo" : "arrow_barb",
-					style: M,
+					style: te,
 					labelStyle: "",
-					label: c.sanitizeText(t.description ?? "", d()),
-					arrowheadStyle: N,
-					labelpos: P,
-					labelType: ee,
-					thickness: F,
+					label: d.sanitizeText(t.description ?? "", c()),
+					arrowheadStyle: ne,
+					labelpos: re,
+					labelType: ie,
+					thickness: ae,
 					classes: B,
 					look: s
 				};
-				a.push(u), q++;
+				a.push(u), G++;
 			}
 		}
 	});
-}, "setupDoc"), ge = /* @__PURE__ */ e((e, t = S) => {
+}, "setupDoc"), Ce = /* @__PURE__ */ e((e, t = D) => {
 	let n = t;
 	if (e.doc) for (let t of e.doc) t.stmt === "dir" && (n = t.value);
 	return n;
 }, "getDir");
-function Y(e, t, n) {
+function J(e, t, n) {
 	if (!t.id || t.id === "</join></fork>" || t.id === "</choice>") return;
 	t.cssClasses && (Array.isArray(t.cssCompiledStyles) || (t.cssCompiledStyles = []), t.cssClasses.split(" ").forEach((e) => {
 		let r = n.get(e);
@@ -1446,40 +1413,41 @@ function Y(e, t, n) {
 	let r = e.find((e) => e.id === t.id);
 	r ? Object.assign(r, t) : e.push(t);
 }
-e(Y, "insertOrUpdateNode");
-function X(e) {
+e(J, "insertOrUpdateNode");
+function we(e) {
 	return e?.classes?.join(" ") ?? "";
 }
-e(X, "getClassesFromDbInfo");
-function _e(e) {
+e(we, "getClassesFromDbInfo");
+function Y(e) {
 	return e?.styles ?? [];
 }
-e(_e, "getStylesFromDbInfo");
-var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
-	let u = n.id, f = r.get(u), p = X(f), m = _e(f), h = d();
+e(Y, "getStylesFromDbInfo");
+var X = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
+	let u = n.id, f = r.get(u), p = we(f), m = Y(f), h = c(), g = p.trim() !== "" || m.length > 0;
 	if (t.info("dataFetcher parsedItem", n, f, m), u !== "root") {
 		let r = I;
-		n.start === !0 ? r = te : n.start === !1 && (r = ne), n.type !== A && (r = n.type), K.get(u) || K.set(u, {
+		n.start === !0 ? r = oe : n.start === !1 && (r = se), n.type !== F && (r = n.type), W.get(u) || W.set(u, {
 			id: u,
 			shape: r,
-			description: c.sanitizeText(u, h),
-			cssClasses: `${p} ${oe}`,
+			description: d.sanitizeText(u, h),
+			cssClasses: `${p} ${de}`,
 			cssStyles: m
 		});
-		let d = K.get(u);
-		n.description && (Array.isArray(d.description) ? (d.shape = L, d.description.push(n.description)) : d.description?.length && d.description.length > 0 ? (d.shape = L, d.description = d.description === u ? [n.description] : [d.description, n.description]) : (d.shape = I, d.description = n.description), d.description = c.sanitizeTextOrArray(d.description, h)), d.description?.length === 1 && d.shape === L && (d.shape = d.type === "group" ? re : I), !d.type && n.doc && (t.info("Setting cluster for XCX", u, ge(n)), d.type = "group", d.isGroup = !0, d.dir = ge(n), d.shape = n.type === j ? R : re, d.cssClasses = `${d.cssClasses} ${ue} ${o ? de : ""}`);
+		let c = W.get(u);
+		n.description && (Array.isArray(c.description) ? (c.shape = L, c.description.push(n.description)) : c.description?.length && c.description.length > 0 ? (c.shape = L, c.description = c.description === u ? [n.description] : [c.description, n.description]) : (c.shape = I, c.description = n.description), c.description = d.sanitizeTextOrArray(c.description, h)), c.description?.length === 1 && c.shape === L && (c.shape = c.type === "group" ? ce : I), !c.type && n.doc && (t.info("Setting cluster for XCX", u, Ce(n)), c.type = "group", c.isGroup = !0, c.dir = Ce(n), c.shape = n.type === ee ? R : ce, c.colorIndex = xe(c.shape, u, e, g), c.cssClasses = `${c.cssClasses} ${he} ${o ? ge : ""}`);
 		let f = {
 			labelStyle: "",
-			shape: d.shape,
-			label: d.description,
-			cssClasses: d.cssClasses,
+			shape: c.shape,
+			label: c.description,
+			cssClasses: c.cssClasses,
 			cssCompiledStyles: [],
-			cssStyles: d.cssStyles,
+			cssStyles: c.cssStyles,
 			id: u,
-			dir: d.dir,
-			domId: J(u, q),
-			type: d.type,
-			isGroup: d.type === "group",
+			dir: c.dir,
+			domId: q(u, G),
+			type: c.type,
+			isGroup: c.type === "group",
+			colorIndex: c.colorIndex,
 			padding: 8,
 			rx: 10,
 			ry: 10,
@@ -1489,56 +1457,105 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 		if (f.shape === R && (f.label = ""), e && e.id !== "root" && (t.trace("Setting node ", u, " to be child of its parent ", e.id), f.parentId = e.id), f.centerLabel = !0, n.note) {
 			let e = {
 				labelStyle: "",
-				shape: ie,
+				shape: le,
 				label: n.note.text,
 				labelType: "markdown",
-				cssClasses: le,
+				cssClasses: me,
 				cssStyles: [],
 				cssCompiledStyles: [],
-				id: u + pe + "-" + q,
-				domId: J(u, q, H),
-				type: d.type,
-				isGroup: d.type === "group",
+				id: u + ve + "-" + G,
+				domId: q(u, G, H),
+				type: "node",
+				isGroup: !1,
 				padding: h.flowchart?.padding,
 				look: s,
 				position: n.note.position
-			}, t = u + W, r = {
+			}, t = u + ye, r = {
 				labelStyle: "",
-				shape: ae,
+				shape: ue,
 				label: n.note.text,
-				cssClasses: d.cssClasses,
+				cssClasses: c.cssClasses,
 				cssStyles: [],
-				id: u + W,
-				domId: J(u, q, V),
+				id: u + ye,
+				domId: q(u, G, V),
 				type: "group",
 				isGroup: !0,
 				padding: 16,
 				look: s,
 				position: n.note.position
 			};
-			q++, r.id = t, e.parentId = t, Y(i, r, l), Y(i, e, l), Y(i, f, l);
-			let o = u, c = e.id;
-			n.note.position === "left of" && (o = e.id, c = u), a.push({
-				id: o + "-" + c,
+			G++, r.id = t, e.parentId = t, J(i, r, l), J(i, e, l), J(i, f, l);
+			let o = u, d = e.id;
+			n.note.position === "left of" && (o = e.id, d = u), a.push({
+				id: o + "-" + d,
 				start: o,
-				end: c,
+				end: d,
 				arrowhead: "none",
 				arrowTypeEnd: "",
-				style: M,
+				style: te,
 				labelStyle: "",
-				classes: ce,
-				arrowheadStyle: N,
-				labelpos: P,
-				labelType: ee,
-				thickness: F,
+				classes: pe,
+				pattern: "dashed",
+				arrowheadStyle: ne,
+				labelpos: re,
+				labelType: ie,
+				thickness: ae,
 				look: s
 			});
-		} else Y(i, f, l);
+		} else J(i, f, l);
 	}
-	n.doc && (t.trace("Adding nodes children "), he(n, n.doc, r, i, a, !o, s, l));
-}, "dataFetcher"), ve = /* @__PURE__ */ e(() => {
-	K.clear(), q = 0;
-}, "reset"), Q = {
+	n.doc && (t.trace("Adding nodes children "), Se(n, n.doc, r, i, a, !o, s, l));
+}, "dataFetcher"), Te = /* @__PURE__ */ e(() => {
+	W.clear(), G = 0, be = 0, K.clear();
+}, "reset"), Ee = /* @__PURE__ */ e((e, t = D) => {
+	if (!e.doc) return t;
+	let n = t;
+	for (let t of e.doc) t.stmt === "dir" && (n = t.value);
+	return n;
+}, "getDir"), De = {
+	getClasses: /* @__PURE__ */ e(function(e, t) {
+		return t.db.getClasses();
+	}, "getClasses"),
+	draw: /* @__PURE__ */ e(async function(e, n, r, i) {
+		t.info("REF0:"), t.info("Drawing state diagram (v2)", n);
+		let { securityLevel: a, state: o, layout: s } = c();
+		i.db.extract(i.db.getRootDocV2());
+		let l = i.db.getData(), u = b(n, a);
+		l.type = i.type, l.layoutAlgorithm = C(s), l.nodeSpacing = o?.nodeSpacing || 50, l.rankSpacing = o?.rankSpacing || 50, l.markers = c().look === "neo" ? ["barbNeo"] : ["barb"], l.diagramId = n, await S(l, u);
+		try {
+			(typeof i.db.getLinks == "function" ? i.db.getLinks() : /* @__PURE__ */ new Map()).forEach((e, n) => {
+				let r = typeof n == "string" ? n : typeof n?.id == "string" ? n.id : "", i = l.nodes.find((e) => e.id === r);
+				if (!r) {
+					t.warn("⚠️ Invalid or missing stateId from key:", JSON.stringify(n));
+					return;
+				}
+				let a = u.node()?.querySelectorAll("g.node, g.rough-node"), o;
+				if (a?.forEach((e) => {
+					let t = e.textContent?.trim();
+					(e.id === i?.domId || t === r) && (o = e);
+				}), !o) {
+					t.warn("⚠️ Could not find node matching text:", r);
+					return;
+				}
+				let s = o.parentNode;
+				if (!s) {
+					t.warn("⚠️ Node has no parent, cannot wrap:", r);
+					return;
+				}
+				let c = document.createElementNS("http://www.w3.org/2000/svg", "a"), d = e.url.replace(/^"+|"+$/g, "");
+				if (c.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", d), c.setAttribute("target", "_blank"), e.tooltip) {
+					let t = e.tooltip.replace(/^"+|"+$/g, "");
+					c.setAttribute("title", t), o.setAttribute("title", t);
+				}
+				s.replaceChild(c, o), c.appendChild(o), t.info("🔗 Wrapped node in <a> tag for:", r, e.url);
+			});
+		} catch (e) {
+			t.error("❌ Error injecting clickable links:", e);
+		}
+		p.insertTitle(u, "statediagramTitleText", o?.titleTopMargin ?? 25, i.db.getDiagramTitle()), x(u, 8, z, o?.useMaxWidth ?? !0);
+	}, "draw"),
+	getDir: Ee
+}, Z = {
 	START_NODE: "[*]",
 	START_TYPE: "start",
 	END_NODE: "[*]",
@@ -1547,13 +1564,13 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 	FILL_KEYWORD: "fill",
 	BG_FILL: "bgFill",
 	STYLECLASS_SEP: ","
-}, ye = /* @__PURE__ */ e(() => /* @__PURE__ */ new Map(), "newClassesList"), be = /* @__PURE__ */ e(() => ({
+}, Oe = /* @__PURE__ */ e(() => /* @__PURE__ */ new Map(), "newClassesList"), Q = /* @__PURE__ */ e(() => ({
 	relations: [],
 	states: /* @__PURE__ */ new Map(),
 	documents: {}
-}), "newDoc"), $ = /* @__PURE__ */ e((e) => JSON.parse(JSON.stringify(e)), "clone"), xe = class {
+}), "newDoc"), $ = /* @__PURE__ */ e((e) => JSON.parse(JSON.stringify(e)), "clone"), ke = class {
 	constructor(e) {
-		this.version = e, this.nodes = [], this.edges = [], this.rootDoc = [], this.classes = ye(), this.documents = { root: be() }, this.currentDocument = this.documents.root, this.startEndCount = 0, this.dividerCnt = 0, this.links = /* @__PURE__ */ new Map(), this.funs = [], this.getAccTitle = f, this.setAccTitle = o, this.getAccDescription = l, this.setAccDescription = i, this.setDiagramTitle = a, this.getDiagramTitle = u, this.clear(), this.setRootDoc = this.setRootDoc.bind(this), this.getDividerId = this.getDividerId.bind(this), this.setDirection = this.setDirection.bind(this), this.trimColon = this.trimColon.bind(this), this.bindFunctions = this.bindFunctions.bind(this);
+		this.version = e, this.nodes = [], this.edges = [], this.rootDoc = [], this.classes = Oe(), this.documents = { root: Q() }, this.currentDocument = this.documents.root, this.startEndCount = 0, this.dividerCnt = 0, this.links = /* @__PURE__ */ new Map(), this.funs = [], this.getAccTitle = f, this.setAccTitle = a, this.getAccDescription = o, this.setAccDescription = i, this.setDiagramTitle = u, this.getDiagramTitle = r, this.clear(), this.setRootDoc = this.setRootDoc.bind(this), this.getDividerId = this.getDividerId.bind(this), this.setDirection = this.setDirection.bind(this), this.trimColon = this.trimColon.bind(this), this.bindFunctions = this.bindFunctions.bind(this);
 	}
 	static {
 		e(this, "StateDB");
@@ -1569,25 +1586,25 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 	extract(e) {
 		this.clear(!0);
 		for (let t of Array.isArray(e) ? e : e.doc) switch (t.stmt) {
-			case w:
+			case k:
 				this.addState(t.id.trim(), t.type, t.doc, t.description, t.note);
 				break;
-			case E:
+			case j:
 				this.addRelation(t.state1, t.state2, t.description);
 				break;
-			case D:
+			case M:
 				this.addStyleClass(t.id.trim(), t.classes);
 				break;
-			case O:
+			case N:
 				this.handleStyleDef(t);
 				break;
-			case k:
+			case P:
 				this.setCssClass(t.id.trim(), t.styleClass);
 				break;
 			case "click": this.addLink(t.id, t.url, t.tooltip);
 		}
-		let t = this.getStates(), n = d();
-		ve(), Z(void 0, this.getRootDocV2(), t, this.nodes, this.edges, !0, n.look, this.classes);
+		let t = this.getStates(), n = c();
+		Te(), X(void 0, this.getRootDocV2(), t, this.nodes, this.edges, !0, n.look, this.classes);
 		for (let e of this.nodes) if (Array.isArray(e.label)) {
 			if (e.description = e.label.slice(1), e.isGroup && e.description.length > 0) throw Error(`Group nodes can only have label. Remove the additional description for node [${e.id}]`);
 			e.label = e.label[0];
@@ -1608,19 +1625,19 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 		t.info("Setting root doc", e), this.rootDoc = e, this.version === 1 ? this.extract(e) : this.extract(this.getRootDocV2());
 	}
 	docTranslator(e, t, n) {
-		if (t.stmt === E) {
+		if (t.stmt === j) {
 			this.docTranslator(e, t.state1, !0), this.docTranslator(e, t.state2, !1);
 			return;
 		}
-		if (t.stmt === w && (t.id === Q.START_NODE ? (t.id = e.id + (n ? "_start" : "_end"), t.start = n) : t.id = t.id.trim()), t.stmt !== T && t.stmt !== w || !t.doc) return;
+		if (t.stmt === k && (t.id === Z.START_NODE ? (t.id = e.id + (n ? "_start" : "_end"), t.start = n) : t.id = t.id.trim()), t.stmt !== A && t.stmt !== k || !t.doc) return;
 		let r = [], i = [];
-		for (let e of t.doc) if (e.type === j) {
+		for (let e of t.doc) if (e.type === ee) {
 			let t = $(e);
 			t.doc = $(i), r.push(t), i = [];
 		} else i.push(e);
 		if (r.length > 0 && i.length > 0) {
 			let e = {
-				stmt: w,
+				stmt: k,
 				id: m(),
 				type: "divider",
 				doc: $(i)
@@ -1631,21 +1648,21 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 	}
 	getRootDocV2() {
 		return this.docTranslator({
-			id: T,
-			stmt: T
+			id: A,
+			stmt: A
 		}, {
-			id: T,
-			stmt: T,
+			id: A,
+			stmt: A,
 			doc: this.rootDoc
 		}, !0), {
-			id: T,
+			id: A,
 			doc: this.rootDoc
 		};
 	}
-	addState(e, n = A, r = void 0, i = void 0, a = void 0, o = void 0, s = void 0, l = void 0) {
+	addState(e, n = F, r = void 0, i = void 0, a = void 0, o = void 0, s = void 0, l = void 0) {
 		let u = e?.trim();
 		if (!this.currentDocument.states.has(u)) t.info("Adding state ", u, i), this.currentDocument.states.set(u, {
-			stmt: w,
+			stmt: k,
 			id: u,
 			descriptions: [],
 			type: n,
@@ -1663,12 +1680,12 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 		if (i && (t.info("Setting state description", u, i), (Array.isArray(i) ? i : [i]).forEach((e) => this.addDescription(u, e.trim()))), a) {
 			let e = this.currentDocument.states.get(u);
 			if (!e) throw Error(`State not found: ${u}`);
-			e.note = a, e.note.text = c.sanitizeText(e.note.text, d());
+			e.note = a, e.note.text = d.sanitizeText(e.note.text, c());
 		}
 		o && (t.info("Setting state classes", u, o), (Array.isArray(o) ? o : [o]).forEach((e) => this.setCssClass(u, e.trim()))), s && (t.info("Setting state styles", u, s), (Array.isArray(s) ? s : [s]).forEach((e) => this.setStyle(u, e.trim()))), l && (t.info("Setting state styles", u, s), (Array.isArray(l) ? l : [l]).forEach((e) => this.setTextStyle(u, e.trim())));
 	}
 	clear(e) {
-		this.nodes = [], this.edges = [], this.funs = [this.setupToolTips.bind(this)], this.documents = { root: be() }, this.currentDocument = this.documents.root, this.startEndCount = 0, this.classes = ye(), e || (this.links = /* @__PURE__ */ new Map(), s());
+		this.nodes = [], this.edges = [], this.funs = [this.setupToolTips.bind(this)], this.documents = { root: Q() }, this.currentDocument = this.documents.root, this.startEndCount = 0, this.classes = Oe(), e || (this.links = /* @__PURE__ */ new Map(), s());
 	}
 	getState(e) {
 		return this.currentDocument.states.get(e);
@@ -1692,23 +1709,23 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 		return this.links;
 	}
 	startIdIfNeeded(e = "") {
-		return e === Q.START_NODE ? (this.startEndCount++, `${Q.START_TYPE}${this.startEndCount}`) : e;
+		return e === Z.START_NODE ? (this.startEndCount++, `${Z.START_TYPE}${this.startEndCount}`) : e;
 	}
-	startTypeIfNeeded(e = "", t = A) {
-		return e === Q.START_NODE ? Q.START_TYPE : t;
+	startTypeIfNeeded(e = "", t = F) {
+		return e === Z.START_NODE ? Z.START_TYPE : t;
 	}
 	endIdIfNeeded(e = "") {
-		return e === Q.END_NODE ? (this.startEndCount++, `${Q.END_TYPE}${this.startEndCount}`) : e;
+		return e === Z.END_NODE ? (this.startEndCount++, `${Z.END_TYPE}${this.startEndCount}`) : e;
 	}
-	endTypeIfNeeded(e = "", t = A) {
-		return e === Q.END_NODE ? Q.END_TYPE : t;
+	endTypeIfNeeded(e = "", t = F) {
+		return e === Z.END_NODE ? Z.END_TYPE : t;
 	}
 	addRelationObjs(e, t, n = "") {
 		let r = this.startIdIfNeeded(e.id.trim()), i = this.startTypeIfNeeded(e.id.trim(), e.type), a = this.startIdIfNeeded(t.id.trim()), o = this.startTypeIfNeeded(t.id.trim(), t.type);
 		this.addState(r, i, e.doc, e.description, e.note, e.classes, e.styles, e.textStyles), this.addState(a, o, t.doc, t.description, t.note, t.classes, t.styles, t.textStyles), this.currentDocument.relations.push({
 			id1: r,
 			id2: a,
-			relationTitle: c.sanitizeText(n, d())
+			relationTitle: d.sanitizeText(n, c())
 		});
 	}
 	addRelation(e, t, n) {
@@ -1718,13 +1735,13 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 			this.addState(r, i), this.addState(a, o), this.currentDocument.relations.push({
 				id1: r,
 				id2: a,
-				relationTitle: n ? c.sanitizeText(n, d()) : void 0
+				relationTitle: n ? d.sanitizeText(n, c()) : void 0
 			});
 		}
 	}
 	addDescription(e, t) {
 		let n = this.currentDocument.states.get(e), r = t.startsWith(":") ? t.replace(":", "").trim() : t;
-		n?.descriptions?.push(c.sanitizeText(r, d()));
+		n?.descriptions?.push(d.sanitizeText(r, c()));
 	}
 	cleanupLabel(e) {
 		return e.startsWith(":") ? e.slice(2).trim() : e.trim();
@@ -1739,10 +1756,10 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 			textStyles: []
 		});
 		let n = this.classes.get(e);
-		t && n && t.split(Q.STYLECLASS_SEP).forEach((e) => {
+		t && n && t.split(Z.STYLECLASS_SEP).forEach((e) => {
 			let t = e.replace(/([^;]*);/, "$1").trim();
-			if (RegExp(Q.COLOR_KEYWORD).exec(e)) {
-				let e = t.replace(Q.FILL_KEYWORD, Q.BG_FILL).replace(Q.COLOR_KEYWORD, Q.FILL_KEYWORD);
+			if (RegExp(Z.COLOR_KEYWORD).exec(e)) {
+				let e = t.replace(Z.FILL_KEYWORD, Z.BG_FILL).replace(Z.COLOR_KEYWORD, Z.FILL_KEYWORD);
 				n.textStyles.push(e);
 			}
 			n.styles.push(t);
@@ -1752,12 +1769,12 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 		return this.classes;
 	}
 	setupToolTips(e) {
-		let t = h();
+		let t = y();
 		n(e).select("svg").selectAll("g.node, g.rough-node").on("mouseover", (e) => {
-			let i = n(e.currentTarget), a = i.attr("title");
-			if (a === null) return;
-			let o = e.currentTarget?.getBoundingClientRect();
-			t.transition().duration(200).style("opacity", ".9"), t.style("left", window.scrollX + o.left + (o.right - o.left) / 2 + "px").style("top", window.scrollY + o.bottom + "px"), t.html(r.sanitize(a)), i.classed("hover", !0);
+			let r = n(e.currentTarget), i = r.attr("title");
+			if (i === null) return;
+			let a = e.currentTarget?.getBoundingClientRect();
+			t.transition().duration(200).style("opacity", ".9"), t.style("left", window.scrollX + a.left + (a.right - a.left) / 2 + "px").style("top", window.scrollY + a.bottom + "px"), t.html(l.sanitize(i)), r.classed("hover", !0);
 		}).on("mouseout", (e) => {
 			t.transition().duration(500).style("opacity", 0), n(e.currentTarget).classed("hover", !1);
 		});
@@ -1784,15 +1801,15 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 		});
 	}
 	getDirectionStatement() {
-		return this.rootDoc.find((e) => e.stmt === C);
+		return this.rootDoc.find((e) => e.stmt === O);
 	}
 	getDirection() {
-		return this.getDirectionStatement()?.value ?? x;
+		return this.getDirectionStatement()?.value ?? E;
 	}
 	setDirection(e) {
 		let t = this.getDirectionStatement();
 		t ? t.value = e : this.rootDoc.unshift({
-			stmt: C,
+			stmt: O,
 			value: e
 		});
 	}
@@ -1800,19 +1817,95 @@ var Z = /* @__PURE__ */ e((e, n, r, i, a, o, s, l) => {
 		return e.startsWith(":") ? e.slice(1).trim() : e.trim();
 	}
 	getData() {
-		let e = d();
+		let e = c();
+		for (let t of this.nodes) t.wrappingWidth ??= e.state?.wrappingWidth, t.isGroup || (t.minWidth ??= e.state?.minNodeWidth);
 		return {
 			nodes: this.nodes,
 			edges: this.edges,
 			other: {},
 			config: e,
-			direction: G(this.getRootDocV2())
+			direction: Ee(this.getRootDocV2())
 		};
 	}
 	getConfig() {
-		return d().state;
+		return c().state;
+	}
+}, Ae = /* @__PURE__ */ e((e) => {
+	let { theme: t, bkgColorArray: n, borderColorArray: r } = e;
+	if (!g(t, r)) return "";
+	let i = _(e.look), a = v(n), o = "";
+	for (let e = 0; e < h(r); e++) {
+		let t = r[e], s = a ? `fill: ${n[e % n.length]};` : "", c = `[data-look="${i}"][data-color-id="color-${e}"]`;
+		o += `
+
+    /* The title strip: \`rect.outer\` spans the whole composite and \`rect.inner\` covers
+       the body, so what stays visible of \`outer\` is the band behind the label. */
+    ${c}.statediagram-cluster rect.outer {
+      stroke: ${t};
+      ${s}
+    }
+
+    ${c}.statediagram-cluster rect.inner {
+      stroke: ${t};
+    }
+
+    /* Concurrency regions. Siblings of one composite share a slot, so a divided composite
+       reads as one thing split into parts rather than as several composites. */
+    ${c}.statediagram-cluster rect.divider {
+      stroke: ${t};
+      ${s}
+    }
+
+    /* handDrawn draws the same container as roughjs shapes rather than plain rects, so it
+       needs its own rules. \`roundedWithTitle\` and \`divider\` name those groups \`outer\`,
+       \`inner\` and \`divider\` to match the classic branch, which is what lets these
+       discriminate -- a bare \`.statediagram-cluster path\` rule reached the body as well and
+       tinted the whole composite, losing \`compositeBackground\` and diverging from what
+       classic and neo do.
+
+       roughjs emits two paths per shape and marks them: the filled shape carries
+       \`stroke="none"\` and the sketched outline carries \`fill="none"\`. Splitting on that is
+       what keeps \`fill\` off the outline -- a rough outline is open squiggles, not a closed
+       region, so filling it produces smears -- and keeps \`stroke\` off the fill shape, which
+       would otherwise gain an edge it was drawn without. */
+    ${c}.statediagram-cluster .outer path[stroke='none'] {
+      ${s}
+    }
+
+    ${c}.statediagram-cluster .outer path[fill='none'] {
+      stroke: ${t};
+    }
+
+    /* No \`.inner\` rule on purpose. The body shape is left entirely alone under handDrawn,
+       where a rect's \`inner\` counterpart cannot be recoloured safely: roughjs draws a
+       hachure fill as *stroked* lines, so its fill paths carry \`fill="none"\` exactly like
+       the outline and no selector separates them. An \`.inner\` stroke rule therefore
+       repainted the hatching of every alt composite in the palette colour instead of
+       leaving it on \`altBackground\`. The container still reads as palette-coloured: the
+       \`outer\` shape spans the whole composite, so its outline already frames the body. */
+
+    /* Regions split the same way, which is why \`divider\` fills solid rather than taking
+       roughjs's default hachure -- see the note on that call. Hatched, both of its paths
+       carried \`fill="none"\` and these two rules degenerated: the tint matched nothing and
+       the border rule repainted the hatching. */
+    ${c}.statediagram-cluster .divider path[stroke='none'] {
+      ${s}
+    }
+
+    ${c}.statediagram-cluster .divider path[fill='none'] {
+      stroke: ${t};
+    }
+    `;
 	}
-}, Se = /* @__PURE__ */ e((e) => `
+	return o;
+}, "genColor"), je = {
+	parser: T,
+	get db() {
+		return new ke(2);
+	},
+	renderer: De,
+	styles: /* @__PURE__ */ e((e) => `
+${Ae(e)}
 defs [id$="-barbEnd"] {
     fill: ${e.transitionColor};
     stroke: ${e.transitionColor};
@@ -2037,6 +2130,10 @@ g.stateGroup line {
   ry: ${e.radius}px;
   filter: ${e.dropShadow ? e.dropShadow.replace("url(#drop-shadow)", `url(${e.svgId}-drop-shadow)`) : "none"}
 }
-`, "getStyles");
+`, "getStyles"),
+	init: /* @__PURE__ */ e((e) => {
+		e.state ||= {}, e.state.arrowMarkerAbsolute = e.arrowMarkerAbsolute;
+	}, "init")
+};
 //#endregion
-export { Se as i, b as n, me as r, xe as t };
+export { je as diagram };