@xiangfa/mindmap 0.4.0 → 0.5.0

package/dist/esm/MindMap2.js

@@ -1,7 +1,8 @@
-import { runRenderOverlay as e } from "./plugins/runner.js";
-import { computeEdgePath as t, layoutMultiRoot as n } from "./utils/layout.js";
-import { buildExportSVG as r, buildExportSVGForPNG as i, exportToPNG as a } from "./utils/export.js";
-import { parseMarkdownMultiRoot as o, parseMarkdownWithFrontMatter as s, toMarkdownMultiRoot as c } from "./utils/markdown.js";
+import { generateCSSVariables as e } from "./utils/theme.js";
+import { runRenderOverlay as t } from "./plugins/runner.js";
+import { computeEdgePath as n, layoutMultiRoot as r } from "./utils/layout.js";
+import { buildExportSVG as i, buildExportSVGForPNG as a, exportToPNG as o } from "./utils/export.js";
+import { parseMarkdownMultiRoot as s, parseMarkdownWithFrontMatter as c, toMarkdownMultiRoot as l } from "./utils/markdown.js";
 import { detectLocale as ee, resolveMessages as te } from "./utils/i18n.js";
 import { addChildMulti as ne, addChildToSide as re, findSubtreeMulti as ie, generateId as ae, normalizeData as oe, regenerateIds as se, removeNodeMulti as ce } from "./utils/tree-ops.js";
 import { useTheme as le } from "./hooks/useTheme.js";
@@ -14,18 +15,18 @@ import { MindMapControls as he } from "./components/MindMapControls.js";
 import { MindMapContextMenu as ge } from "./components/MindMapContextMenu.js";
 import { MindMapAIInput as _e } from "./components/MindMapAIInput.js";
 /* empty css        */
-import { forwardRef as l, useCallback as u, useEffect as d, useImperativeHandle as ve, useMemo as f, useRef as p, useState as m } from "react";
-import { Fragment as ye, jsx as h, jsxs as g } from "react/jsx-runtime";
+import { forwardRef as u, useCallback as d, useEffect as f, useImperativeHandle as ve, useMemo as p, useRef as m, useState as h } from "react";
+import { Fragment as ye, jsx as g, jsxs as _ } from "react/jsx-runtime";
 //#region src/components/MindMap/MindMap.tsx
 function be(e, t) {
 	let n = URL.createObjectURL(e), r = document.createElement("a");
 	r.href = n, r.download = t, document.body.appendChild(r), r.click(), document.body.removeChild(r), URL.revokeObjectURL(n);
 }
-var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme: Se = "auto", locale: Ce, messages: we, readonly: v = !1, toolbar: y = !0, ai: Te, onDataChange: Ee, onEvent: De, plugins: Oe }, ke) {
-	let Ae = p(null), b = p(null), x = Oe && Oe.length > 0 ? Oe : void 0, S = f(() => {
-		if (l || _ === void 0) return null;
-		if (x) {
-			let e = s(_, x), t = e.frontMatter.direction, n = e.frontMatter.theme;
+var v = u(function({ data: u, markdown: v, defaultDirection: xe = "both", theme: Se = "auto", locale: Ce, messages: we, readonly: y = !1, toolbar: b = !0, ai: Te, onDataChange: Ee, onEvent: De, plugins: Oe }, ke) {
+	let Ae = m(null), x = m(null), S = Oe && Oe.length > 0 ? Oe : void 0, C = p(() => {
+		if (u || v === void 0) return null;
+		if (S) {
+			let e = c(v, S), t = e.frontMatter.direction, n = e.frontMatter.theme;
 			return {
 				roots: e.roots,
 				direction: t === "left" || t === "right" || t === "both" ? t : void 0,
@@ -33,142 +34,142 @@ var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme:
 			};
 		}
 		return {
-			roots: o(_),
+			roots: s(v),
 			direction: void 0,
 			theme: void 0
 		};
-	}, []), [C, w] = m(() => l ? oe(l) : S ? S.roots : [{
+	}, []), [w, T] = h(() => u ? oe(u) : C ? C.roots : [{
 		id: "md-0",
 		text: "Root"
-	}]), [T, je] = m(() => S?.direction ?? xe), [E, D] = m({}), [O, k] = m(null), [A, Me] = m(null), [j, Ne] = m({}), M = p(null), [Pe, Fe] = m("view"), [Ie, Le] = m(!1), [N, P] = m(""), [Re, ze] = m(null), [Be, Ve] = m({}), [He, Ue] = m(null), [We, Ge] = m(() => S?.theme);
-	d(() => {
-		l && w(oe(l));
-	}, [l]), d(() => {
-		if (_ !== void 0) if (x) {
-			let { roots: e, frontMatter: t } = s(_, x);
-			if (w(e), t.direction) {
+	}]), [E, je] = h(() => C?.direction ?? xe), [D, O] = h({}), [k, A] = h(null), [j, Me] = h(null), [M, Ne] = h({}), Pe = m(null), [Fe, Ie] = h("view"), [Le, Re] = h(!1), [ze, N] = h(""), [Be, Ve] = h(null), [He, Ue] = h({}), [We, Ge] = h(null), [Ke, qe] = h(() => C?.theme);
+	f(() => {
+		u && T(oe(u));
+	}, [u]), f(() => {
+		if (v !== void 0) if (S) {
+			let { roots: e, frontMatter: t } = c(v, S);
+			if (T(e), t.direction) {
 				let e = t.direction;
 				(e === "left" || e === "right" || e === "both") && je(e);
 			}
 			if (t.theme) {
 				let e = t.theme;
-				(e === "light" || e === "dark" || e === "auto") && Ge(e);
+				(e === "light" || e === "dark" || e === "auto") && qe(e);
 			}
-		} else w(o(_));
-	}, [_, x]);
-	let F = u((e) => {
-		w((t) => {
+		} else T(s(v));
+	}, [v, S]);
+	let P = d((e) => {
+		T((t) => {
 			let n = e(t);
 			return Ee?.(n), n;
 		});
-	}, [Ee]), Ke = p(De);
-	Ke.current = De;
-	let I = u((e) => {
-		Ke.current?.(e);
-	}, []), L = le(We ?? Se), R = f(() => te(Ce ?? ee(), we), [Ce, we]), qe = f(() => y === !1 ? { zoom: !1 } : y === !0 || y === void 0 ? { zoom: !0 } : { zoom: y.zoom ?? !0 }, [y]), { nodes: z, edges: B } = f(() => n(C, T, j, E, x, v, Be), [
-		C,
-		T,
-		j,
+	}, [Ee]), Je = m(De);
+	Je.current = De;
+	let F = d((e) => {
+		Je.current?.(e);
+	}, []), I = le(Ke ?? Se), L = p(() => te(Ce ?? ee(), we), [Ce, we]), Ye = p(() => b === !1 ? { zoom: !1 } : b === !0 || b === void 0 ? { zoom: !0 } : { zoom: b.zoom ?? !0 }, [b]), { nodes: R, edges: z } = p(() => r(w, E, M, D, S, y, He), [
+		w,
 		E,
-		x,
-		v,
-		Be
+		M,
+		D,
+		S,
+		y,
+		He
 	]);
-	d(() => {
+	f(() => {
 		let e = {}, t = !1;
-		for (let n of z) n.depth === 1 && !j[n.id] && (e[n.id] = n.color, t = !0);
+		for (let n of R) n.depth === 1 && !M[n.id] && (e[n.id] = n.color, t = !0);
 		t && Ne((t) => ({
 			...t,
 			...e
 		}));
-	}, [z, j]);
-	let V = f(() => {
+	}, [R, M]);
+	let B = p(() => {
 		let e = {};
-		for (let t of z) e[t.id] = t;
+		for (let t of R) e[t.id] = t;
 		return e;
-	}, [z]), Je = f(() => {
-		if (!He) return {};
+	}, [R]), Xe = p(() => {
+		if (!We) return {};
 		let e = {}, t = [];
-		for (let e of z) e.parentId === He && t.push({
+		for (let e of R) e.parentId === We && t.push({
 			id: e.id,
 			depth: 1
 		});
 		for (; t.length > 0;) {
 			let { id: n, depth: r } = t.shift();
 			e[n] = r * 100;
-			for (let e of z) e.parentId === n && t.push({
+			for (let e of R) e.parentId === n && t.push({
 				id: e.id,
 				depth: r + 1
 			});
 		}
 		return e;
-	}, [He, z]), { pan: H, setPan: Ye, zoom: U, setZoom: Xe, animateTo: Ze, autoFit: Qe, zoomIn: $e, zoomOut: et, contentCenter: tt, panToNode: nt } = ue(b, z), { draggingCanvas: rt, floatingNodeId: W, floatingPos: G, floatingSubtreeIds: K, didDragRef: it, handleCanvasMouseDown: at, handleMouseMove: ot, handleMouseUp: st, handleNodeMouseDown: ct } = de({
-		svgRef: b,
+	}, [We, R]), { pan: V, setPan: H, zoom: U, setZoom: Ze, animateTo: Qe, autoFit: $e, zoomIn: et, zoomOut: tt, contentCenter: nt, panToNode: rt } = ue(x, R), { draggingCanvas: it, floatingNodeId: W, floatingPos: G, floatingSubtreeIds: K, didDragRef: at, handleCanvasMouseDown: ot, handleMouseMove: st, handleMouseUp: ct, handleNodeMouseDown: lt } = de({
+		svgRef: x,
 		zoom: U,
-		pan: H,
-		setPan: Ye,
-		setZoom: Xe,
-		nodeMap: V,
-		nodes: z,
-		updateData: F,
-		direction: T,
-		splitIndices: E,
-		setSplitIndices: D,
-		mapData: C,
-		contentCenter: tt
-	}), { editingId: lt, editText: ut, setEditText: q, pendingEditId: J, setPendingEditId: Y, handleNodeDoubleClick: dt, commitEdit: ft, cancelEdit: pt } = fe({
-		nodeMap: V,
-		updateData: F,
+		pan: V,
+		setPan: H,
+		setZoom: Ze,
+		nodeMap: B,
+		nodes: R,
+		updateData: P,
+		direction: E,
+		splitIndices: D,
+		setSplitIndices: O,
+		mapData: w,
+		contentCenter: nt
+	}), { editingId: ut, editText: dt, setEditText: q, pendingEditId: J, setPendingEditId: Y, handleNodeDoubleClick: ft, commitEdit: pt, cancelEdit: mt } = fe({
+		nodeMap: B,
+		updateData: P,
 		onTextChange: (e, t, n) => {
-			I({
+			F({
 				type: "nodeTextChange",
 				nodeId: e,
 				oldText: t,
 				newText: n
 			});
 		}
-	}), mt = pe(z), [X, ht] = m(!1);
-	d(() => {
+	}), ht = pe(R), [X, gt] = h(!1);
+	f(() => {
 		if (W || J) return;
-		let e = Qe();
-		e ? X ? (Xe(e.zoom), Ye({
+		let e = $e();
+		e ? X ? (Ze(e.zoom), H({
 			x: e.panX,
 			y: e.panY
-		})) : (Xe(e.zoom * .92), Ye({
+		})) : (Ze(e.zoom * .92), H({
 			x: e.panX,
 			y: e.panY
 		}), requestAnimationFrame(() => {
-			ht(!0), Ze(e.zoom, e.panX, e.panY);
-		})) : X || requestAnimationFrame(() => ht(!0));
+			gt(!0), Qe(e.zoom, e.panX, e.panY);
+		})) : X || requestAnimationFrame(() => gt(!0));
 	}, [
-		z,
-		Qe,
+		R,
+		$e,
 		W,
 		J,
-		Xe,
-		Ye,
+		Ze,
+		H,
 		X,
-		Ze
-	]), d(() => {
-		J && V[J] && nt(J);
+		Qe
+	]), f(() => {
+		J && B[J] && rt(J);
 	}, [
 		J,
-		V,
-		nt
+		B,
+		rt
 	]);
-	let gt = u((e) => {
-		Me(null), at(e);
-	}, [at]), _t = u((e, t) => {
-		e.stopPropagation(), it.current || (k(t), I({
+	let _t = d((e) => {
+		Me(null), ot(e);
+	}, [ot]), vt = d((e, t) => {
+		e.stopPropagation(), at.current || (A(t), F({
 			type: "nodeSelect",
 			nodeId: t
 		}));
-	}, [it, I]), vt = u(() => {
-		it.current || (k(null), I({
+	}, [at, F]), yt = d(() => {
+		at.current || (A(null), F({
 			type: "nodeSelect",
 			nodeId: null
 		}));
-	}, [it, I]), yt = u((e) => {
+	}, [at, F]), bt = d((e) => {
 		e.preventDefault(), e.stopPropagation();
 		let t = Ae.current;
 		if (!t) return;
@@ -177,167 +178,167 @@ var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme:
 			x: e.clientX - n.left,
 			y: e.clientY - n.top
 		});
-	}, []), Z = u(() => {
+	}, []), Z = d(() => {
 		Me(null);
-	}, []), bt = u((e) => {
+	}, []), xt = d((e) => {
 		if (!e) {
-			ze(null);
+			Ve(null);
 			return;
 		}
-		let t = V[e];
+		let t = B[e];
 		if (!t || !t.remark) {
-			ze(null);
+			Ve(null);
 			return;
 		}
-		let n = b.current;
+		let n = x.current;
 		if (!n) return;
-		let r = n.getBoundingClientRect(), i = (t.x + t.width / 2) * U + H.x, a = (t.y - t.height / 2) * U + H.y;
-		ze({
+		let r = n.getBoundingClientRect(), i = (t.x + t.width / 2) * U + V.x, a = (t.y - t.height / 2) * U + V.y;
+		Ve({
 			nodeId: e,
 			text: t.remark,
 			x: Math.min(i, r.width - 300),
 			y: a - 8
 		});
 	}, [
-		V,
+		B,
 		U,
-		H
-	]), xt = u((e, t, n) => {
-		if (e.stopPropagation(), v) return;
+		V
+	]), St = d((e, t, n) => {
+		if (e.stopPropagation(), y) return;
 		let r = ae(), i = {
 			id: r,
-			text: R.newNode
+			text: L.newNode
 		};
-		C.some((e) => e.id === t) && n && T === "both" ? F((e) => e.map((e) => {
+		w.some((e) => e.id === t) && n && E === "both" ? P((e) => e.map((e) => {
 			if (e.id !== t) return e;
-			let r = e.children || [], a = E[t] ?? Math.ceil(r.length / 2), o = a, s = r.length - a, c = n;
+			let r = e.children || [], a = D[t] ?? Math.ceil(r.length / 2), o = a, s = r.length - a, c = n;
 			n === "right" && o >= 3 * Math.max(s, 1) ? c = "left" : n === "left" && s >= 3 * Math.max(o, 1) && (c = "right");
-			let ee = re(e, i, c, a);
-			return D((e) => ({
+			let l = re(e, i, c, a);
+			return O((e) => ({
 				...e,
-				[t]: ee.newSplitIndex
-			})), ee.data;
-		})) : F((e) => ne(e, t, i)), I({
+				[t]: l.newSplitIndex
+			})), l.data;
+		})) : P((e) => ne(e, t, i)), F({
 			type: "nodeAdd",
 			node: i,
 			parentId: t
 		}), Y(r), q("");
 	}, [
-		F,
-		C,
-		T,
+		P,
+		w,
 		E,
+		D,
 		Y,
 		q,
-		R,
-		v,
-		I
-	]), St = u(() => {
-		if (v) return;
+		L,
+		y,
+		F
+	]), Ct = d(() => {
+		if (y) return;
 		let e = ae(), t = {
 			id: e,
-			text: R.newNode
+			text: L.newNode
 		};
-		F((e) => [...e, t]), I({
+		P((e) => [...e, t]), F({
 			type: "nodeAdd",
 			node: t,
 			parentId: null
 		}), Y(e), q(""), Z();
 	}, [
-		F,
+		P,
 		Z,
 		Y,
 		q,
-		R,
-		v,
-		I
-	]), Ct = u(() => {
-		let e = r(z, B, {}, L, x);
+		L,
+		y,
+		F
+	]), wt = d(() => {
+		let e = i(R, z, {}, I, S);
 		be(new Blob([e], { type: "image/svg+xml;charset=utf-8" }), "mindmap.svg"), Z();
 	}, [
+		R,
 		z,
-		B,
-		L,
+		I,
 		Z,
-		x
-	]), wt = u(async () => {
-		be(await a(i(z, B, { pngSafe: !0 }, L, x)), "mindmap.png"), Z();
+		S
+	]), Tt = d(async () => {
+		be(await o(a(R, z, { pngSafe: !0 }, I, S)), "mindmap.png"), Z();
 	}, [
+		R,
 		z,
-		B,
-		L,
+		I,
 		Z,
-		x
-	]), Tt = u(() => {
-		let e = c(C, x);
+		S
+	]), Et = d(() => {
+		let e = l(w, S);
 		be(new Blob([e], { type: "text/markdown;charset=utf-8" }), "mindmap.md"), Z();
 	}, [
-		C,
+		w,
 		Z,
-		x
-	]), Q = u(() => {
-		let e = Qe();
-		e && Ze(e.zoom, e.panX, e.panY);
-	}, [Qe, Ze]), $ = u((e) => {
-		je(e), D({}), I({
+		S
+	]), Q = d(() => {
+		let e = $e();
+		e && Qe(e.zoom, e.panX, e.panY);
+	}, [$e, Qe]), $ = d((e) => {
+		je(e), O({}), F({
 			type: "directionChange",
 			direction: e
 		});
-	}, [I]), Et = u(() => {
-		Fe((e) => {
-			if (e === "view") return P(c(C, x)), I({
+	}, [F]), Dt = d(() => {
+		Ie((e) => {
+			if (e === "view") return N(l(w, S)), F({
 				type: "modeChange",
 				mode: "text"
 			}), "text";
 			{
-				let e = x ? s(N, x).roots : o(N);
-				return F(() => e), D({}), I({
+				let e = S ? c(ze, S).roots : s(ze);
+				return P(() => e), O({}), F({
 					type: "modeChange",
 					mode: "view"
 				}), "view";
 			}
 		});
 	}, [
-		C,
-		N,
-		F,
-		x,
-		I
-	]), Dt = u(() => {
+		w,
+		ze,
+		P,
+		S,
+		F
+	]), Ot = d(() => {
 		let e = Ae.current;
 		e && (document.fullscreenElement ? document.exitFullscreen() : e.requestFullscreen());
 	}, []);
-	d(() => {
+	f(() => {
 		let e = () => {
 			let e = !!document.fullscreenElement;
-			Le(e), I({
+			Re(e), F({
 				type: "fullscreenChange",
 				fullscreen: e
 			});
 		};
 		return document.addEventListener("fullscreenchange", e), () => document.removeEventListener("fullscreenchange", e);
-	}, [I]);
-	let Ot = p(U);
-	d(() => {
-		U !== Ot.current && (Ot.current = U, I({
+	}, [F]);
+	let kt = m(U);
+	f(() => {
+		U !== kt.current && (kt.current = U, F({
 			type: "zoomChange",
 			zoom: U
 		}));
-	}, [U, I]);
-	let kt = u((e) => {
-		if (e.key === "Escape" && A) {
+	}, [U, F]);
+	let At = d((e) => {
+		if (e.key === "Escape" && j) {
 			e.preventDefault(), Z();
 			return;
 		}
-		if (lt) return;
+		if (ut) return;
 		let t = e.metaKey || e.ctrlKey;
 		if (e.shiftKey && !t) {
 			if (e.code === "Equal") {
-				e.preventDefault(), $e();
+				e.preventDefault(), et();
 				return;
 			}
 			if (e.code === "Minus") {
-				e.preventDefault(), et();
+				e.preventDefault(), tt();
 				return;
 			}
 			if (e.code === "Digit0") {
@@ -357,93 +358,93 @@ var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme:
 				return;
 			}
 		}
-		if (e.key === "Enter" && !t && O && !v) {
+		if (e.key === "Enter" && !t && k && !y) {
 			e.preventDefault();
 			let t = ae(), n = {
 				id: t,
-				text: R.newNode
+				text: L.newNode
 			};
-			C.some((e) => e.id === O) && T === "both" ? F((e) => e.map((e) => {
-				if (e.id !== O) return e;
-				let t = e.children || [], r = re(e, n, "right", E[O] ?? Math.ceil(t.length / 2));
-				return D((e) => ({
+			w.some((e) => e.id === k) && E === "both" ? P((e) => e.map((e) => {
+				if (e.id !== k) return e;
+				let t = e.children || [], r = re(e, n, "right", D[k] ?? Math.ceil(t.length / 2));
+				return O((e) => ({
 					...e,
-					[O]: r.newSplitIndex
+					[k]: r.newSplitIndex
 				})), r.data;
-			})) : F((e) => ne(e, O, n)), Y(t), q(""), I({
+			})) : P((e) => ne(e, k, n)), Y(t), q(""), F({
 				type: "nodeAdd",
 				node: n,
-				parentId: O
+				parentId: k
 			});
 			return;
 		}
-		if ((e.key === "Delete" || e.key === "Backspace") && O && !v) {
-			if (e.preventDefault(), C.some((e) => e.id === O) && C.length <= 1) return;
-			I({
+		if ((e.key === "Delete" || e.key === "Backspace") && k && !y) {
+			if (e.preventDefault(), w.some((e) => e.id === k) && w.length <= 1) return;
+			F({
 				type: "nodeDelete",
-				nodeId: O
-			}), F((e) => ce(e, O)), k(null);
+				nodeId: k
+			}), P((e) => ce(e, k)), A(null);
 			return;
 		}
-		if (t && e.key === "c" && O) {
-			e.preventDefault(), M.current = ie(C, O);
+		if (t && e.key === "c" && k) {
+			e.preventDefault(), Pe.current = ie(w, k);
 			return;
 		}
-		if (t && e.key === "x" && O && !v) {
-			if (e.preventDefault(), M.current = ie(C, O), C.some((e) => e.id === O) && C.length <= 1) return;
-			I({
+		if (t && e.key === "x" && k && !y) {
+			if (e.preventDefault(), Pe.current = ie(w, k), w.some((e) => e.id === k) && w.length <= 1) return;
+			F({
 				type: "nodeDelete",
-				nodeId: O
-			}), F((e) => ce(e, O)), k(null);
+				nodeId: k
+			}), P((e) => ce(e, k)), A(null);
 			return;
 		}
-		if (t && e.key === "v" && O && M.current && !v) {
+		if (t && e.key === "v" && k && Pe.current && !y) {
 			e.preventDefault();
-			let t = se(M.current);
-			F((e) => ne(e, O, t)), I({
+			let t = se(Pe.current);
+			P((e) => ne(e, k, t)), F({
 				type: "nodeAdd",
 				node: t,
-				parentId: O
+				parentId: k
 			});
 			return;
 		}
 	}, [
-		lt,
-		O,
-		C,
-		T,
+		ut,
+		k,
+		w,
 		E,
-		F,
-		A,
+		D,
+		P,
+		j,
 		Z,
 		Y,
 		q,
-		R,
-		$e,
+		L,
 		et,
+		tt,
 		Q,
 		$,
-		v,
-		I
+		y,
+		F
 	]);
 	ve(ke, () => ({
 		exportToSVG() {
-			return r(z, B, {}, L, x);
+			return i(R, z, {}, I, S);
 		},
 		async exportToPNG() {
-			return a(i(z, B, {}, L, x));
+			return o(a(R, z, {}, I, S));
 		},
 		exportToOutline() {
-			return c(C, x);
+			return l(w, S);
 		},
 		getData() {
-			return C;
+			return w;
 		},
 		setData(e) {
-			w(oe(e)), D({});
+			T(oe(e)), O({});
 		},
 		setMarkdown(e) {
-			w(x ? s(e, x).roots : o(e)), D({});
+			T(S ? c(e, S).roots : s(e)), O({});
 		},
 		fitView() {
 			Q();
@@ -452,23 +453,23 @@ var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme:
 			$(e);
 		}
 	}), [
+		R,
 		z,
-		B,
-		C,
-		x,
+		w,
+		S,
 		Q,
 		$,
-		L
-	]), d(() => {
-		if (!A) return;
+		I
+	]), f(() => {
+		if (!j) return;
 		let e = () => Z();
 		return window.addEventListener("click", e), () => window.removeEventListener("click", e);
-	}, [A, Z]);
-	let At = u((e) => {
-		w(x ? s(e, x).roots : o(e)), D({});
-	}, [x]), jt = u(() => {
+	}, [j, Z]);
+	let jt = d((e) => {
+		T(S ? c(e, S).roots : s(e)), O({});
+	}, [S]), Mt = d(() => {
 		setTimeout(() => Q(), 100);
-	}, [Q]), Mt = u(() => {}, []), Nt = u((e) => {
+	}, [Q]), Nt = d(() => {}, []), Pt = d((e) => {
 		if (e.key !== "Tab") return;
 		e.preventDefault();
 		let t = e.currentTarget, { selectionStart: n, selectionEnd: r, value: i } = t;
@@ -478,7 +479,7 @@ var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme:
 				let a = i.slice(e, r), o = a.match(/^ {1,2}/);
 				if (!o) return;
 				let s = o[0].length;
-				P(i.slice(0, e) + a.slice(s) + i.slice(r)), requestAnimationFrame(() => {
+				N(i.slice(0, e) + a.slice(s) + i.slice(r)), requestAnimationFrame(() => {
 					t.selectionStart = t.selectionEnd = Math.max(e, n - s);
 				});
 			} else {
@@ -486,92 +487,86 @@ var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme:
 					let n = e.match(/^ {1,2}/), r = n ? n[0].length : 0;
 					return o += r, t === 0 && (s = r), e.slice(r);
 				}).join("\n");
-				P(i.slice(0, e) + c + i.slice(r)), requestAnimationFrame(() => {
+				N(i.slice(0, e) + c + i.slice(r)), requestAnimationFrame(() => {
 					t.selectionStart = n - s, t.selectionEnd = r - o;
 				});
 			}
-		} else if (n === r) P(i.slice(0, n) + "  " + i.slice(r)), requestAnimationFrame(() => {
+		} else if (n === r) N(i.slice(0, n) + "  " + i.slice(r)), requestAnimationFrame(() => {
 			t.selectionStart = t.selectionEnd = n + 2;
 		});
 		else {
 			let e = i.lastIndexOf("\n", n - 1) + 1, a = i.slice(e, r).split("\n"), o = a.map((e) => "  " + e).join("\n");
-			P(i.slice(0, e) + o + i.slice(r)), requestAnimationFrame(() => {
+			N(i.slice(0, e) + o + i.slice(r)), requestAnimationFrame(() => {
 				t.selectionStart = n + 2, t.selectionEnd = r + a.length * 2;
 			});
 		}
 	}, []);
-	return /* @__PURE__ */ g("div", {
+	return /* @__PURE__ */ _("div", {
 		ref: Ae,
 		className: "mindmap-container",
+		style: e(I),
 		children: [
-			Pe === "text" && /* @__PURE__ */ h("textarea", {
+			Fe === "text" && /* @__PURE__ */ g("textarea", {
 				className: "mindmap-text-editor",
-				value: N,
-				onChange: (e) => P(e.target.value),
-				onKeyDown: Nt,
-				readOnly: v,
-				style: {
-					background: L.canvas.bgColor,
-					color: L.node.textColor,
-					opacity: v ? .7 : 1
-				}
+				value: ze,
+				onChange: (e) => N(e.target.value),
+				onKeyDown: Pt,
+				readOnly: y,
+				style: y ? { opacity: .7 } : void 0
 			}),
-			/* @__PURE__ */ h("svg", {
-				ref: b,
-				className: `mindmap-svg ${rt ? "dragging-canvas" : ""} ${W ? "dragging-node" : ""}`,
-				style: {
-					background: L.canvas.bgColor,
-					display: Pe === "text" ? "none" : "block"
-				},
+			/* @__PURE__ */ g("svg", {
+				ref: x,
+				className: `mindmap-svg ${it ? "dragging-canvas" : ""} ${W ? "dragging-node" : ""}`,
+				style: Fe === "text" ? { display: "none" } : void 0,
 				tabIndex: 0,
-				onMouseDown: gt,
-				onMouseMove: ot,
-				onMouseUp: st,
-				onMouseLeave: st,
-				onClick: vt,
-				onKeyDown: kt,
-				onContextMenu: yt,
-				children: /* @__PURE__ */ g("g", {
-					className: "mindmap-canvas",
-					transform: `translate(${H.x}, ${H.y}) scale(${U})`,
+				onMouseDown: _t,
+				onMouseMove: st,
+				onMouseUp: ct,
+				onMouseLeave: ct,
+				onClick: yt,
+				onKeyDown: At,
+				onContextMenu: bt,
+				children: /* @__PURE__ */ _("g", {
+					className: `mindmap-canvas${X ? " mindmap-canvas-ready" : ""}`,
+					transform: `translate(${V.x}, ${V.y}) scale(${U})`,
 					opacity: X ? 1 : 0,
-					style: { transition: X ? "opacity 0.4s ease-out" : "none" },
 					children: [
-						/* @__PURE__ */ g("g", {
+						/* @__PURE__ */ _("g", {
 							className: "mindmap-edges",
-							children: [B.some((e) => e.isCrossLink) && /* @__PURE__ */ h("defs", { children: /* @__PURE__ */ h("marker", {
+							children: [z.some((e) => e.isCrossLink) && /* @__PURE__ */ g("defs", { children: /* @__PURE__ */ g("marker", {
 								id: "mindmap-arrowhead",
 								markerWidth: "8",
 								markerHeight: "6",
 								refX: "8",
 								refY: "3",
 								orient: "auto",
-								children: /* @__PURE__ */ h("path", {
+								children: /* @__PURE__ */ g("path", {
 									d: "M0,0 L8,3 L0,6",
 									fill: "none",
 									stroke: "currentColor",
 									strokeWidth: 1.5
 								})
-							}) }), B.map((e) => {
-								let t = Je[e.toId], n = t !== void 0;
-								return /* @__PURE__ */ g("g", { children: [/* @__PURE__ */ h("path", {
+							}) }), z.map((e) => {
+								let t = Xe[e.toId], n = t !== void 0;
+								return /* @__PURE__ */ _("g", { children: [/* @__PURE__ */ g("path", {
 									d: e.path,
 									stroke: e.color,
-									strokeWidth: L.connection.strokeWidth,
+									strokeWidth: I.connection.strokeWidth,
 									strokeLinecap: "round",
 									strokeDasharray: n ? void 0 : e.strokeDasharray,
 									markerEnd: e.isCrossLink ? "url(#mindmap-arrowhead)" : void 0,
 									opacity: e.isCrossLink ? .7 : 1,
 									fill: "none",
+									"data-branch-index": B[e.toId]?.branchIndex,
 									className: [
 										"mindmap-edge",
 										e.isCrossLink ? "mindmap-edge-cross-link" : "",
-										n ? "mindmap-edge-expanding" : rt || K.has(e.fromId) || K.has(e.toId) ? "" : "mindmap-edge-animated"
+										n ? "mindmap-edge-expanding" : it || K.has(e.fromId) || K.has(e.toId) ? "" : "mindmap-edge-animated"
 									].filter(Boolean).join(" "),
 									style: n ? { animationDelay: `${t}ms` } : void 0
 								}), e.label && (() => {
-									let t = V[e.fromId], n = V[e.toId];
-									return !t || !n ? null : /* @__PURE__ */ h("text", {
+									let t = B[e.fromId], n = B[e.toId];
+									return !t || !n ? null : /* @__PURE__ */ g("text", {
 										className: "mindmap-edge-label",
 										x: (t.x + n.x) / 2,
 										y: (t.y + n.y) / 2 - 6,
@@ -579,72 +574,69 @@ var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme:
 										fontSize: 11,
 										fill: e.color,
 										opacity: .8,
-										fontFamily: L.node.fontFamily,
-										style: { pointerEvents: "none" },
+										fontFamily: I.node.fontFamily,
 										children: e.label
 									});
 								})()] }, e.key);
 							})]
 						}),
-						/* @__PURE__ */ h("g", {
+						/* @__PURE__ */ g("g", {
 							className: "mindmap-nodes",
-							children: z.map((e) => {
-								let t = K.has(e.id), n = t || rt ? "" : "mindmap-node-animated";
-								return /* @__PURE__ */ h(me, {
+							children: R.map((e) => {
+								let t = K.has(e.id), n = t || it ? "" : "mindmap-node-animated";
+								return /* @__PURE__ */ g(me, {
 									node: e,
-									isEditing: lt === e.id,
+									isEditing: ut === e.id,
 									isPendingEdit: J === e.id,
-									isSelected: O === e.id,
-									isNew: mt.has(e.id),
+									isSelected: k === e.id,
+									isNew: ht.has(e.id),
 									isGhost: t,
 									animClass: n,
-									editText: ut,
-									theme: L,
-									direction: T,
-									onMouseDown: ct,
-									onClick: _t,
-									onDoubleClick: v ? () => {} : dt,
+									editText: dt,
+									theme: I,
+									direction: E,
+									onMouseDown: lt,
+									onClick: vt,
+									onDoubleClick: y ? () => {} : ft,
 									onEditChange: q,
-									onEditCommit: ft,
-									onEditCancel: pt,
-									onAddChild: xt,
-									onRemarkHover: bt,
-									onFoldToggle: x ? (e) => {
-										Be[e] || (Ue(e), setTimeout(() => Ue(null), 800)), Ve((t) => ({
+									onEditCommit: pt,
+									onEditCancel: mt,
+									onAddChild: St,
+									onRemarkHover: xt,
+									onFoldToggle: S ? (e) => {
+										He[e] || (Ge(e), setTimeout(() => Ge(null), 800)), Ue((t) => ({
 											...t,
 											[e]: !t[e]
 										}));
 									} : void 0,
-									expandDelay: Je[e.id],
-									readonly: v,
-									plugins: x
+									expandDelay: Xe[e.id],
+									readonly: y,
+									plugins: S
 								}, e.id);
 							})
 						}),
 						W && G && (() => {
-							let e = V[W];
+							let e = B[W];
 							if (!e) return null;
-							let n = G.x - e.x, r = G.y - e.y, i = e.parentId ? V[e.parentId] : null;
-							return /* @__PURE__ */ g(ye, { children: [i && /* @__PURE__ */ h("path", {
+							let t = G.x - e.x, r = G.y - e.y, i = e.parentId ? B[e.parentId] : null;
+							return /* @__PURE__ */ _(ye, { children: [i && /* @__PURE__ */ g("path", {
 								className: "mindmap-floating-edge",
-								d: t(i.x, i.y, i.width, G.x, G.y, e.width, e.side),
+								d: n(i.x, i.y, i.width, G.x, G.y, e.width, e.side),
 								stroke: e.color,
-								strokeWidth: L.connection.strokeWidth,
+								strokeWidth: I.connection.strokeWidth,
 								strokeLinecap: "round",
-								fill: "none",
-								style: { pointerEvents: "none" }
-							}), /* @__PURE__ */ g("g", {
+								fill: "none"
+							}), /* @__PURE__ */ _("g", {
 								className: "mindmap-floating",
-								transform: `translate(${n}, ${r})`,
-								style: { pointerEvents: "none" },
-								children: [B.filter((e) => K.has(e.fromId) && K.has(e.toId)).map((e) => /* @__PURE__ */ h("path", {
+								transform: `translate(${t}, ${r})`,
+								children: [z.filter((e) => K.has(e.fromId) && K.has(e.toId)).map((e) => /* @__PURE__ */ g("path", {
 									className: "mindmap-floating-edge",
 									d: e.path,
 									stroke: e.color,
-									strokeWidth: L.connection.strokeWidth,
+									strokeWidth: I.connection.strokeWidth,
 									strokeLinecap: "round",
 									fill: "none"
-								}, `fl-${e.key}`)), z.filter((e) => K.has(e.id)).map((e) => /* @__PURE__ */ h(me, {
+								}, `fl-${e.key}`)), R.filter((e) => K.has(e.id)).map((e) => /* @__PURE__ */ g(me, {
 									node: e,
 									isEditing: !1,
 									isPendingEdit: !1,
@@ -652,8 +644,8 @@ var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme:
 									isNew: !1,
 									animClass: "",
 									editText: "",
-									theme: L,
-									direction: T,
+									theme: I,
+									direction: E,
 									onMouseDown: () => {},
 									onClick: () => {},
 									onDoubleClick: () => {},
@@ -665,63 +657,59 @@ var _ = l(function({ data: l, markdown: _, defaultDirection: xe = "both", theme:
 								}, `fl-${e.id}`))]
 							})] });
 						})(),
-						x && e(x, z, B, L).map((e, t) => /* @__PURE__ */ h("g", {
+						S && t(S, R, z, I).map((e, t) => /* @__PURE__ */ g("g", {
 							className: "mindmap-plugin-overlay",
 							children: e
 						}, `plugin-overlay-${t}`))
 					]
 				})
 			}),
-			/* @__PURE__ */ h(he, {
+			/* @__PURE__ */ g(he, {
 				zoom: U,
-				theme: L,
-				messages: R,
-				showZoom: qe.zoom,
-				mode: Pe,
-				isFullscreen: Ie,
-				onZoomIn: $e,
-				onZoomOut: et,
+				theme: I,
+				messages: L,
+				showZoom: Ye.zoom,
+				mode: Fe,
+				isFullscreen: Le,
+				onZoomIn: et,
+				onZoomOut: tt,
 				onAutoFit: Q,
-				onModeToggle: Et,
-				onFullscreenToggle: Dt
+				onModeToggle: Dt,
+				onFullscreenToggle: Ot
 			}),
-			Te && /* @__PURE__ */ h(_e, {
+			Te && /* @__PURE__ */ g(_e, {
 				config: Te,
-				theme: L,
-				messages: R,
-				currentMarkdown: c(C, x),
-				onMarkdownStream: At,
-				onComplete: jt,
-				onError: Mt
+				theme: I,
+				messages: L,
+				currentMarkdown: l(w, S),
+				onMarkdownStream: jt,
+				onComplete: Mt,
+				onError: Nt
 			}),
-			A && /* @__PURE__ */ h(ge, {
-				position: A,
-				theme: L,
-				messages: R,
-				direction: T,
-				readonly: v,
-				onNewRootNode: St,
-				onExportSVG: Ct,
-				onExportPNG: wt,
-				onExportMarkdown: Tt,
+			j && /* @__PURE__ */ g(ge, {
+				position: j,
+				theme: I,
+				messages: L,
+				direction: E,
+				readonly: y,
+				onNewRootNode: Ct,
+				onExportSVG: wt,
+				onExportPNG: Tt,
+				onExportMarkdown: Et,
 				onDirectionChange: $,
 				onClose: Z
 			}),
-			Re && /* @__PURE__ */ h("div", {
+			Be && /* @__PURE__ */ g("div", {
 				className: "mindmap-remark-tooltip",
 				style: {
-					left: Re.x,
-					top: Re.y,
-					transform: "translateY(-100%)",
-					background: L.contextMenu.bgColor,
-					color: L.contextMenu.textColor,
-					borderColor: L.contextMenu.borderColor,
-					border: `1px solid ${L.contextMenu.borderColor}`
+					left: Be.x,
+					top: Be.y,
+					transform: "translateY(-100%)"
 				},
-				children: Re.text
+				children: Be.text
 			})
 		]
 	});
 });
 //#endregion
-export { _ as MindMap };
+export { v as MindMap };