@green-on-grey/ui-kit 1.13.0 → 1.14.0

package/dist/index.js

@@ -1,30 +1,30 @@
 import { a as e, c as t, d as n, f as r, i, l as a, n as o, o as s, r as c, s as l, t as u, u as d } from "./ui-BrAaLui6.js";
 import { n as f, t as p } from "./i18n-BJ8rsBp6.js";
-import { jsx as m, jsxs as h } from "react/jsx-runtime";
-import { useCallback as g, useEffect as _, useId as v, useMemo as y, useRef as b, useState as x } from "react";
-import { forceCenter as S, forceCollide as C, forceLink as w, forceManyBody as T, forceSimulation as E } from "d3-force";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+import { useCallback as _, useEffect as v, useId as y, useMemo as b, useRef as x, useState as S } from "react";
+import { forceCenter as C, forceCollide as w, forceLink as T, forceManyBody as E, forceSimulation as D } from "d3-force";
 //#region src/components/Button.tsx
-function D({ variant: e, size: t, className: n, type: r = "button", ...i }) {
+function O({ variant: e, size: t, className: n, type: r = "button", ...i }) {
 	let a = [
 		"btn",
 		e,
 		t,
 		n
 	].filter(Boolean).join(" ");
-	return /* @__PURE__ */ m("button", {
+	return /* @__PURE__ */ h("button", {
 		type: r,
 		className: a,
 		...i
 	});
 }
-function O({ label: e, fill: t, on: n, className: r, type: i = "button", ...a }) {
+function k({ label: e, fill: t, on: n, className: r, type: i = "button", ...a }) {
 	let o = [
 		"iconbtn",
 		t && "fill",
 		n && "on",
 		r
 	].filter(Boolean).join(" ");
-	return /* @__PURE__ */ m("button", {
+	return /* @__PURE__ */ h("button", {
 		type: i,
 		className: o,
 		"aria-label": e,
@@ -33,12 +33,12 @@ function O({ label: e, fill: t, on: n, className: r, type: i = "button", ...a })
 }
 //#endregion
 //#region src/components/Menu.tsx
-function k({ onClose: e, label: t, className: n, children: r }) {
+function A({ onClose: e, label: t, className: n, children: r }) {
 	let i = l(!0, e);
-	return _(() => {
+	return v(() => {
 		let e = document.activeElement;
 		return () => e?.focus?.();
-	}, []), /* @__PURE__ */ m("div", {
+	}, []), /* @__PURE__ */ h("div", {
 		className: `menu${n ? ` ${n}` : ""}`,
 		role: "dialog",
 		"aria-label": t,
@@ -48,52 +48,52 @@ function k({ onClose: e, label: t, className: n, children: r }) {
 }
 //#endregion
 //#region src/components/TopBar.tsx
-function A({ logo: e, name: t, home: n = "/", sections: i, Link: a, center: o, actions: s, avatar: c, profileMenu: u, menu: d }) {
-	let p = f(), [_, v] = x(!1), [y, b] = x(!1), S = g(() => b(!1), []), C = g(() => v(!1), []), w = l(y, S), T = i.map((e) => /* @__PURE__ */ m(a, {
+function j({ logo: e, name: t, home: n = "/", sections: i, Link: a, center: o, actions: s, avatar: c, profileMenu: u, menu: d }) {
+	let p = f(), [m, v] = S(!1), [y, b] = S(!1), x = _(() => b(!1), []), C = _(() => v(!1), []), w = l(y, x), T = i.map((e) => /* @__PURE__ */ h(a, {
 		href: e.href,
 		className: e.active ? "on" : void 0,
 		"aria-current": e.active ? "page" : void 0,
-		onClick: S,
+		onClick: x,
 		children: e.label
 	}, e.key));
-	return /* @__PURE__ */ h("div", {
+	return /* @__PURE__ */ g("div", {
 		className: "topbar",
 		children: [
-			/* @__PURE__ */ h(a, {
+			/* @__PURE__ */ g(a, {
 				href: n,
 				className: "brand",
-				children: [/* @__PURE__ */ m("img", {
+				children: [/* @__PURE__ */ h("img", {
 					src: e,
 					alt: ""
-				}), /* @__PURE__ */ m("span", {
+				}), /* @__PURE__ */ h("span", {
 					className: "hide-m",
 					children: t
 				})]
 			}),
-			/* @__PURE__ */ m("nav", {
+			/* @__PURE__ */ h("nav", {
 				className: "nav hide-m",
 				"aria-label": p("topbar.sections"),
 				children: T
 			}),
 			o,
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ g("div", {
 				className: "top-actions",
 				children: [
 					s,
-					/* @__PURE__ */ m("button", {
+					/* @__PURE__ */ h("button", {
 						className: "avatar",
-						style: _ ? { boxShadow: "0 0 0 2px var(--violet)" } : void 0,
+						style: m ? { boxShadow: "0 0 0 2px var(--violet)" } : void 0,
 						onClick: () => {
 							b(!1), v((e) => !e);
 						},
 						"aria-label": p("topbar.profile"),
-						"aria-expanded": _,
+						"aria-expanded": m,
 						children: c
 					}),
-					/* @__PURE__ */ h("div", {
+					/* @__PURE__ */ g("div", {
 						className: "burger",
 						ref: w,
-						children: [/* @__PURE__ */ m("button", {
+						children: [/* @__PURE__ */ h("button", {
 							className: `iconbtn${y ? " on" : ""}`,
 							onClick: () => {
 								v(!1), b((e) => !e);
@@ -101,12 +101,12 @@ function A({ logo: e, name: t, home: n = "/", sections: i, Link: a, center: o, a
 							"aria-label": d?.label ?? p("topbar.sections"),
 							"aria-expanded": y,
 							"aria-controls": "nav-sections",
-							children: /* @__PURE__ */ m(r, { name: y ? "x" : "menu" })
-						}), y && (d ? /* @__PURE__ */ m("div", {
+							children: /* @__PURE__ */ h(r, { name: y ? "x" : "menu" })
+						}), y && (d ? /* @__PURE__ */ h("div", {
 							id: "nav-sections",
 							className: "navmenu",
-							children: d.render(S)
-						}) : /* @__PURE__ */ m("nav", {
+							children: d.render(x)
+						}) : /* @__PURE__ */ h("nav", {
 							id: "nav-sections",
 							className: "navmenu",
 							"aria-label": p("topbar.sections"),
@@ -115,21 +115,21 @@ function A({ logo: e, name: t, home: n = "/", sections: i, Link: a, center: o, a
 					})
 				]
 			}),
-			_ && u(C)
+			m && u(C)
 		]
 	});
 }
 //#endregion
 //#region src/components/Graph.tsx
-var j = 760, M = 500, N = (e = 1) => 7 + Math.sqrt(e) * 3.2, P = (e, t) => {
-	let n = Math.max(.5, Math.min(4, e.k * t));
+var M = 760, N = 500, P = (e = 1) => 7 + Math.sqrt(e) * 3.2, F = (e, t, n) => {
+	let r = Math.max(.5, Math.min(4, e.k * t));
 	return {
-		k: n,
-		x: j / 2 - (j / 2 - e.x) / e.k * n,
-		y: M / 2 - (M / 2 - e.y) / e.k * n
+		k: r,
+		x: n.w / 2 - (n.w / 2 - e.x) / e.k * r,
+		y: n.h / 2 - (n.h / 2 - e.y) / e.k * r
 	};
 };
-function F(e, t, n) {
+function I(e, t, n) {
 	let r = /* @__PURE__ */ new Set([t]), i = [t];
 	for (let t = 0; t < n; t++) {
 		let t = [];
@@ -141,194 +141,333 @@ function F(e, t, n) {
 	}
 	return r;
 }
-function I(e, t) {
+function L(e, t) {
 	let n = e.map((e) => ({
 		...e,
-		r: N(e.size)
+		r: P(e.size)
 	})), r = new Set(n.map((e) => e.id)), i = t.filter((e) => r.has(e.source) && r.has(e.target)).map((e) => ({
 		source: e.source,
 		target: e.target,
 		weight: e.weight ?? 1
-	})), a = E(n).force("link", w(i).id((e) => e.id).distance(90).strength((e) => Math.min(1, .2 + e.weight * .08))).force("charge", T().strength(-260)).force("center", S(j / 2, M / 2)).force("collide", C().radius((e) => e.r + 14)).stop();
+	})), a = D(n).force("link", T(i).id((e) => e.id).distance(90).strength((e) => Math.min(1, .2 + e.weight * .08))).force("charge", E().strength(-260)).force("center", C(M / 2, N / 2)).force("collide", w().radius((e) => e.r + 14)).stop();
 	for (let e = 0; e < 260; e++) a.tick();
-	for (let e of n) e.x = Math.max(e.r + 30, Math.min(j - e.r - 30, e.x ?? j / 2)), e.y = Math.max(e.r + 10, Math.min(M - e.r - 24, e.y ?? M / 2));
+	for (let e of n) e.x = Math.max(e.r + 30, Math.min(M - e.r - 30, e.x ?? M / 2)), e.y = Math.max(e.r + 10, Math.min(N - e.r - 24, e.y ?? N / 2));
 	return n;
 }
-function L({ nodes: e, edges: t, ariaLabel: n, selected: r, onSelect: i, focus: a, depth: o = 1, onOpen: s, legend: c, nodeLabel: l }) {
-	let u = f(), d = `g-arrow-${v().replace(/:/g, "")}`, [p, g] = x(null), [S, C] = x({
+var R = 130, z = 104, B = 76;
+function V(e, t) {
+	let n = new Map(t.map((e, t) => [e.id, t])), r = /* @__PURE__ */ new Map(), i = e.map((e) => ({
+		...e,
+		r: P(e.size)
+	}));
+	for (let e of i) {
+		let i = n.get(e.row ?? "") ?? t.length;
+		r.set(i, [...r.get(i) ?? [], e]);
+	}
+	let a = [...r.keys()].toSorted((e, t) => e - t), o = R + Math.max(1, ...a.map((e) => r.get(e).length)) * z, s = a.length * B, c = {
+		w: Math.max(M, o + 40),
+		h: Math.max(N, s + 40)
+	}, l = (c.w - o) / 2, u = (c.h - s) / 2;
+	return {
+		placed: i,
+		field: c,
+		rows: a.map((e, n) => {
+			let i = u + B * (n + .5) - 8;
+			return r.get(e).toSorted((e, t) => (e.order ?? Infinity) - (t.order ?? Infinity) || (e.id < t.id ? -1 : +(e.id > t.id))).forEach((e, t) => {
+				e.x = l + R + z * (t + .5), e.y = i;
+			}), {
+				id: t[e]?.id ?? "",
+				label: t[e]?.label ?? "",
+				y: i,
+				x: l + 8,
+				x2: l + o
+			};
+		})
+	};
+}
+function H(e, t, n, r) {
+	let i = e.x ?? 0, a = e.y ?? 0, o = t.x ?? 0, s = t.y ?? 0, c = o, l = s, u = r && Math.abs(l - a) < 1 && i !== c, d = (i + c) / 2, f = a - Math.sign(c - i) * Math.min(B * .8, 14 + Math.abs(c - i) * .25);
+	if (n) {
+		let e = u ? d : i, n = u ? f : a, r = c - e, o = l - n, s = Math.hypot(r, o) || 1;
+		c -= r / s * (t.r + 2), l -= o / s * (t.r + 2);
+	}
+	return u ? {
+		d: `M${i},${a} Q${d},${f} ${c},${l}`,
+		hit: `M${i},${a} Q${d},${f} ${o},${s}`,
+		x1: i,
+		y1: a,
+		x2: c,
+		y2: l
+	} : {
+		x1: i,
+		y1: a,
+		x2: c,
+		y2: l
+	};
+}
+function U({ nodes: e, edges: t, ariaLabel: n, selected: i, onSelect: a, focus: o, depth: s = 1, onOpen: c, legend: l, nodeLabel: u, rows: d, draggable: p }) {
+	let _ = f(), C = `g-arrow-${y().replace(/:/g, "")}`, [w, T] = S(null), [E, D] = S({
 		k: 1,
 		x: 0,
 		y: 0
-	}), w = b(null), T = b(null), { placed: E, byId: D } = y(() => {
-		let n = I(e, t);
+	}), O = x(null), k = x(null), A = x(-Infinity), j = x(null), P = d ? void 0 : t, R = b(() => d ? V(e, d) : {
+		placed: L(e, P ?? []),
+		field: {
+			w: M,
+			h: N
+		}
+	}, [
+		e,
+		P,
+		d
+	]), { field: z } = R, [U, W] = S(null), G = U?.of === R ? U.at : void 0, { placed: K, byId: q } = b(() => {
+		let e = G ? R.placed.map((e) => G.has(e.id) ? {
+			...e,
+			...G.get(e.id)
+		} : e) : R.placed;
 		return {
-			placed: n,
-			byId: new Map(n.map((e) => [e.id, e]))
+			placed: e,
+			byId: new Map(e.map((e) => [e.id, e]))
 		};
-	}, [e, t]), O = a !== void 0 && D.has(a) ? a : void 0, k = p ?? (r?.kind === "node" ? r.id : null), A = y(() => r?.kind === "edge" && !p ? /* @__PURE__ */ new Set([r.source, r.target]) : k ? F(t, k, 1) : O ? F(t, O, o) : /* @__PURE__ */ new Set(), [
-		k,
-		r,
-		p,
-		O,
-		o,
+	}, [R, G]), J = o !== void 0 && q.has(o) ? o : void 0, Y = w ?? (i?.kind === "node" ? i.id : null), X = b(() => i?.kind === "edge" && !w ? /* @__PURE__ */ new Set([i.source, i.target]) : Y ? I(t, Y, 1) : J ? I(t, J, s) : /* @__PURE__ */ new Set(), [
+		Y,
+		i,
+		w,
+		J,
+		s,
 		t
-	]), N = A.size > 0, L = (e) => r?.kind === "edge" && !p ? r.source === e.source && r.target === e.target : k ? e.source === k || e.target === k : O !== void 0 && A.has(e.source) && A.has(e.target), R = (e) => C((t) => P(t, e)), z = (e, t) => i(t ? null : {
+	]), ee = X.size > 0, te = (e) => i?.kind === "edge" && !w ? i.source === e.source && i.target === e.target : Y ? e.source === Y || e.target === Y : J !== void 0 && X.has(e.source) && X.has(e.target), Z = (e) => D((t) => F(t, e, z)), Q = (e, t) => a(t ? null : {
 		kind: "node",
 		id: e
-	});
-	return _(() => {
-		let e = T.current;
+	}), $ = (e) => {
+		let t = e.getBoundingClientRect();
+		return 1 / (Math.min(t.width / z.w, t.height / z.h) || 1);
+	};
+	return v(() => {
+		let e = j.current;
 		if (!e) return;
 		let t = (e) => {
-			e.preventDefault(), C((t) => P(t, e.deltaY < 0 ? 1.15 : 1 / 1.15));
+			e.preventDefault(), D((t) => F(t, e.deltaY < 0 ? 1.15 : 1 / 1.15, z));
 		};
 		return e.addEventListener("wheel", t, { passive: !1 }), () => e.removeEventListener("wheel", t);
-	}, []), /* @__PURE__ */ h("div", {
+	}, [z]), /* @__PURE__ */ g("div", {
 		className: "gwrap",
 		children: [
-			/* @__PURE__ */ h("svg", {
-				ref: T,
-				viewBox: `0 0 ${j} ${M}`,
+			/* @__PURE__ */ g("svg", {
+				ref: j,
+				viewBox: `0 0 ${z.w} ${z.h}`,
 				role: "group",
 				"aria-label": n,
-				className: N ? "dimmed" : void 0,
+				className: ee ? "dimmed" : void 0,
 				onPointerDown: (e) => {
-					e.target === e.currentTarget && (w.current = {
+					e.target === e.currentTarget && (O.current = {
 						x: e.clientX,
 						y: e.clientY,
 						moved: !1
 					}, e.currentTarget.setPointerCapture(e.pointerId));
 				},
 				onPointerMove: (e) => {
-					if (!w.current) return;
-					let t = e.currentTarget.getBoundingClientRect(), n = (e.clientX - w.current.x) / t.width * j, r = (e.clientY - w.current.y) / t.height * M;
-					w.current = {
+					if (!O.current) return;
+					let t = $(e.currentTarget), n = (e.clientX - O.current.x) * t, r = (e.clientY - O.current.y) * t;
+					O.current = {
 						x: e.clientX,
 						y: e.clientY,
-						moved: w.current.moved || n !== 0 || r !== 0
-					}, C((e) => ({
+						moved: O.current.moved || n !== 0 || r !== 0
+					}, D((e) => ({
 						...e,
 						x: e.x + n,
 						y: e.y + r
 					}));
 				},
 				onPointerUp: () => {
-					w.current?.moved || (w.current = null);
+					O.current?.moved || (O.current = null);
 				},
 				onClick: (e) => {
-					let t = w.current?.moved;
-					w.current = null, !t && e.target === e.currentTarget && i(null);
+					let t = O.current?.moved;
+					O.current = null, !t && e.target === e.currentTarget && a(null);
 				},
-				children: [t.some((e) => e.directed) && /* @__PURE__ */ m("defs", { children: /* @__PURE__ */ m("marker", {
-					id: d,
+				children: [t.some((e) => e.directed) && /* @__PURE__ */ h("defs", { children: /* @__PURE__ */ h("marker", {
+					id: C,
 					viewBox: "0 0 10 10",
 					refX: "10",
 					refY: "5",
 					markerWidth: "7",
 					markerHeight: "7",
 					orient: "auto-start-reverse",
-					children: /* @__PURE__ */ m("path", { d: "M0,0 L10,5 L0,10 z" })
-				}) }), /* @__PURE__ */ h("g", {
-					transform: `translate(${S.x} ${S.y}) scale(${S.k})`,
-					children: [t.map((e, t) => {
-						let n = D.get(e.source), r = D.get(e.target);
-						if (!n || !r) return null;
-						let a = r.x ?? 0, o = r.y ?? 0;
-						if (e.directed) {
-							let e = a - (n.x ?? 0), t = o - (n.y ?? 0), i = Math.hypot(e, t) || 1;
-							a -= e / i * (r.r + 2), o -= t / i * (r.r + 2);
-						}
-						return /* @__PURE__ */ h("g", {
-							className: `g-e${e.dashed ? " dashed" : ""}${L(e) ? " hl" : ""}`,
-							onClick: () => i({
-								kind: "edge",
-								source: e.source,
-								target: e.target
-							}),
-							children: [
-								/* @__PURE__ */ m("line", {
-									x1: n.x,
-									y1: n.y,
-									x2: a,
-									y2: o,
-									strokeWidth: 1 + (e.weight ?? 1) * .5,
-									markerEnd: e.directed ? `url(#${d})` : void 0
+					children: /* @__PURE__ */ h("path", { d: "M0,0 L10,5 L0,10 z" })
+				}) }), /* @__PURE__ */ g("g", {
+					transform: `translate(${E.x} ${E.y}) scale(${E.k})`,
+					children: [
+						R.rows?.map((e, t) => /* @__PURE__ */ g("g", {
+							className: "g-row",
+							children: [t > 0 && /* @__PURE__ */ h("line", {
+								x1: e.x,
+								x2: e.x2,
+								y1: e.y - B / 2 + 8,
+								y2: e.y - B / 2 + 8
+							}), /* @__PURE__ */ h("text", {
+								x: e.x,
+								y: e.y,
+								children: e.label
+							})]
+						}, `${e.id}\u0000${t}`)),
+						t.map((e, t) => {
+							let n = q.get(e.source), r = q.get(e.target);
+							if (!n || !r) return null;
+							let i = H(n, r, !!e.directed, !!d), o = e.directed ? `url(#${C})` : void 0;
+							return /* @__PURE__ */ g("g", {
+								className: `g-e${e.dashed ? " dashed" : ""}${te(e) ? " hl" : ""}`,
+								onClick: () => a({
+									kind: "edge",
+									source: e.source,
+									target: e.target
 								}),
-								/* @__PURE__ */ m("line", {
+								children: [i.d ? /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h("path", {
+									d: i.d,
+									strokeWidth: 1 + (e.weight ?? 1) * .5,
+									markerEnd: o
+								}), /* @__PURE__ */ h("path", {
+									className: "hit",
+									d: i.hit
+								})] }) : /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h("line", {
+									x1: i.x1,
+									y1: i.y1,
+									x2: i.x2,
+									y2: i.y2,
+									strokeWidth: 1 + (e.weight ?? 1) * .5,
+									markerEnd: o
+								}), /* @__PURE__ */ h("line", {
 									className: "hit",
 									x1: n.x,
 									y1: n.y,
 									x2: r.x,
 									y2: r.y
-								}),
-								e.title && /* @__PURE__ */ m("title", { children: e.title })
-							]
-						}, `${e.source}\u0000${e.target}\u0000${t}`);
-					}), E.map((e) => {
-						let t = r?.kind === "node" && r.id === e.id, n = [
-							"g-n",
-							`g-c${e.group ?? 1}`,
-							e.hideLabel && "small",
-							e.dashed && "dashed",
-							e.muted && "muted",
-							A.has(e.id) && "hl",
-							t && "pin",
-							O === e.id && "focus"
-						].filter(Boolean).join(" ");
-						return /* @__PURE__ */ h("g", {
-							className: n,
-							tabIndex: 0,
-							role: "button",
-							"aria-pressed": t,
-							"aria-label": l ? l(e) : e.label,
-							onMouseEnter: () => g(e.id),
-							onMouseLeave: () => g(null),
-							onFocus: () => g(e.id),
-							onBlur: () => g(null),
-							onClick: () => z(e.id, t),
-							onDoubleClick: () => s?.(e.id),
-							onKeyDown: (n) => {
-								n.key === "Enter" && s ? (n.preventDefault(), s(e.id)) : (n.key === "Enter" || n.key === " ") && (n.preventDefault(), z(e.id, t));
-							},
-							children: [
-								/* @__PURE__ */ m("circle", {
-									cx: e.x,
-									cy: e.y,
-									r: e.r
-								}),
-								/* @__PURE__ */ m("text", {
-									x: e.x,
-									y: (e.y ?? 0) + e.r + 14,
-									children: e.label
-								}),
-								e.title && /* @__PURE__ */ m("title", { children: e.title })
-							]
-						}, e.id);
-					})]
+								})] }), e.title && /* @__PURE__ */ h("title", { children: e.title })]
+							}, `${e.source}\u0000${e.target}\u0000${t}`);
+						}),
+						K.map((e) => {
+							let t = i?.kind === "node" && i.id === e.id, n = [
+								"g-n",
+								`g-c${e.group ?? 1}`,
+								e.hideLabel && "small",
+								e.dashed && "dashed",
+								e.muted && "muted",
+								X.has(e.id) && "hl",
+								t && "pin",
+								J === e.id && "focus"
+							].filter(Boolean).join(" ");
+							return /* @__PURE__ */ g("g", {
+								className: n,
+								tabIndex: 0,
+								role: "button",
+								"aria-pressed": t,
+								"aria-label": u ? u(e) : e.label,
+								onMouseEnter: () => T(e.id),
+								onMouseLeave: () => T(null),
+								onFocus: () => T(e.id),
+								onBlur: () => T(null),
+								onPointerDown: p ? (t) => {
+									t.button === 0 && (k.current = {
+										id: e.id,
+										x: t.clientX,
+										y: t.clientY,
+										moved: !1
+									}, t.currentTarget.setPointerCapture(t.pointerId));
+								} : void 0,
+								onPointerMove: p ? (t) => {
+									let n = k.current;
+									if (!n || n.id !== e.id || !n.moved && Math.hypot(t.clientX - n.x, t.clientY - n.y) < 4) return;
+									let r = j.current ? $(j.current) / E.k : 1, i = (t.clientX - n.x) * r, a = (t.clientY - n.y) * r;
+									k.current = {
+										id: e.id,
+										x: t.clientX,
+										y: t.clientY,
+										moved: !0
+									}, W((t) => {
+										let n = new Map(t?.of === R ? t.at : []), r = n.get(e.id) ?? {
+											x: e.x ?? 0,
+											y: e.y ?? 0
+										};
+										return n.set(e.id, {
+											x: r.x + i,
+											y: r.y + a
+										}), {
+											of: R,
+											at: n
+										};
+									});
+								} : void 0,
+								onPointerUp: p ? (e) => {
+									k.current?.moved && (A.current = e.timeStamp, setTimeout(() => {
+										k.current = null;
+									}, 0));
+								} : void 0,
+								onPointerCancel: p ? () => {
+									k.current = null;
+								} : void 0,
+								onClick: () => {
+									let n = k.current?.moved;
+									k.current = null, n || Q(e.id, t);
+								},
+								onDoubleClick: (t) => {
+									t.timeStamp - A.current > 600 && c?.(e.id);
+								},
+								onKeyDown: (n) => {
+									n.key === "Enter" && c ? (n.preventDefault(), c(e.id)) : (n.key === "Enter" || n.key === " ") && (n.preventDefault(), Q(e.id, t));
+								},
+								children: [
+									/* @__PURE__ */ h("circle", {
+										cx: e.x,
+										cy: e.y,
+										r: e.r
+									}),
+									/* @__PURE__ */ h("text", {
+										x: e.x,
+										y: (e.y ?? 0) + e.r + 14,
+										children: e.label
+									}),
+									e.title && /* @__PURE__ */ h("title", { children: e.title })
+								]
+							}, e.id);
+						})
+					]
 				})]
 			}),
-			c && c.length > 0 && /* @__PURE__ */ m("div", {
+			l && l.length > 0 && /* @__PURE__ */ h("div", {
 				className: "gleg",
-				children: c.map((e) => /* @__PURE__ */ h("span", { children: [/* @__PURE__ */ m("i", { className: `g-c${e.group}` }), e.label] }, e.group))
+				children: l.map((e) => /* @__PURE__ */ g("span", { children: [/* @__PURE__ */ h("i", { className: `g-c${e.group}` }), e.label] }, e.group))
 			}),
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ g("div", {
 				className: "gzoom",
-				children: [/* @__PURE__ */ m("button", {
-					type: "button",
-					onClick: () => R(1.3),
-					"aria-label": u("graph.zoomIn"),
-					children: "+"
-				}), /* @__PURE__ */ m("button", {
-					type: "button",
-					onClick: () => R(1 / 1.3),
-					"aria-label": u("graph.zoomOut"),
-					children: "−"
-				})]
+				children: [
+					/* @__PURE__ */ h("button", {
+						type: "button",
+						onClick: () => Z(1.3),
+						"aria-label": _("graph.zoomIn"),
+						children: "+"
+					}),
+					/* @__PURE__ */ h("button", {
+						type: "button",
+						onClick: () => Z(1 / 1.3),
+						"aria-label": _("graph.zoomOut"),
+						children: "−"
+					}),
+					G && G.size > 0 && /* @__PURE__ */ h("button", {
+						type: "button",
+						onClick: () => W(null),
+						"aria-label": _("graph.resetLayout"),
+						title: _("graph.resetLayout"),
+						children: /* @__PURE__ */ h(r, {
+							name: "reset",
+							size: 14
+						})
+					})
+				]
 			})
 		]
 	});
 }
 //#endregion
-export { u as Avatar, D as Button, o as Empty, n as GitHubIcon, L as Graph, r as Icon, O as IconButton, c as Loading, d as Markdown, k as Menu, i as Modal, e as Switch, a as Tabs, s as ToastProvider, A as TopBar, p as UIKIT_NS, F as neighbours, l as useOutside, t as useToast };
+export { u as Avatar, O as Button, o as Empty, n as GitHubIcon, U as Graph, r as Icon, k as IconButton, c as Loading, d as Markdown, A as Menu, i as Modal, e as Switch, a as Tabs, s as ToastProvider, j as TopBar, p as UIKIT_NS, I as neighbours, l as useOutside, t as useToast };
 
 //# sourceMappingURL=index.js.map