@yuneta/gobj-ui 7.23.154 → 7.23.156

package/dist/gobj-ui.es.js

@@ -6,7 +6,7 @@ import { createJSONEditor } from "vanilla-jsoneditor";
 import { TabulatorFull } from "tabulator-tables";
 import * as maplibregl from "maplibre-gl";
 import uPlot from "uplot";
-import { BaseLayout, BrushSelect, CanvasEvent, Circle, CommonEvent, DragCanvas, EdgeEvent, ExtensionCategory, Graph, HTML, HistoryEvent, NodeEvent, Polyline, Toolbar, ZoomCanvas, register } from "@antv/g6";
+import { BaseLayout, BrushSelect, CanvasEvent, Circle, CommonEvent, Cubic, CubicHorizontal, DragCanvas, EdgeEvent, ExtensionCategory, Graph, HTML, HistoryEvent, NodeEvent, Polyline, Toolbar, ZoomCanvas, register } from "@antv/g6";
 //#region \0rolldown/runtime.js
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -29418,6 +29418,56 @@ function stack_trunk_width(k) {
 	let lanes = Math.max(0, k - 2);
 	return Math.max(36, 20 + Math.max(0, lanes - 1) * 6);
 }
+/************************************************************
+*  The children of every node, with each run of STACK_MIN_RUN or
+*  more consecutive LEAF children replaced by one STACK. Runs, not
+*  all the leaves of a parent: the children keep their order. A
+*  stack's key is an OBJECT, so it can never be taken for a node id,
+*  which is a string. Shared by the compact tree and the radial.
+*
+*  Returns {kids_of: Map<id, [id | stack]>, stacks: Map<stack, {ids, depth}>}
+************************************************************/
+function leaf_runs(t) {
+	let kids_of = /* @__PURE__ */ new Map();
+	let stacks = /* @__PURE__ */ new Map();
+	for (let [id, kids] of t.children) {
+		let out = [];
+		let run = [];
+		let flush = () => {
+			if (run.length >= 3) {
+				let key = { stack: stacks.size };
+				stacks.set(key, {
+					ids: run,
+					depth: t.depth.get(run[0])
+				});
+				out.push(key);
+			} else out.push(...run);
+			run = [];
+		};
+		for (let kid of kids) if ((t.children.get(kid) || []).length === 0) run.push(kid);
+		else {
+			flush();
+			out.push(kid);
+		}
+		flush();
+		kids_of.set(id, out);
+	}
+	return {
+		kids_of,
+		stacks
+	};
+}
+function stacked_order(t, kids_of) {
+	let order = [];
+	let todo = t.roots.slice().reverse();
+	while (todo.length) {
+		let id = todo.pop();
+		order.push(id);
+		let kids = kids_of.get(id) || [];
+		for (let i = kids.length - 1; i >= 0; i--) todo.push(kids[i]);
+	}
+	return order;
+}
 function stack_geometry(t, st, col_x, col_w) {
 	let d = st.depth;
 	let k = st.ids.length;
@@ -29457,38 +29507,8 @@ function place_stack(t, st, g, top, pos) {
 function compact_tree_lr(nodes, edges, o) {
 	let t = spanning_tree(nodes, edges);
 	let pos = /* @__PURE__ */ new Map();
-	let kids_of = /* @__PURE__ */ new Map();
-	let stacks = /* @__PURE__ */ new Map();
-	for (let [id, kids] of t.children) {
-		let out = [];
-		let run = [];
-		let flush = () => {
-			if (run.length >= 3) {
-				let key = { stack: stacks.size };
-				stacks.set(key, {
-					ids: run,
-					depth: t.depth.get(run[0])
-				});
-				out.push(key);
-			} else out.push(...run);
-			run = [];
-		};
-		for (let kid of kids) if ((t.children.get(kid) || []).length === 0) run.push(kid);
-		else {
-			flush();
-			out.push(kid);
-		}
-		flush();
-		kids_of.set(id, out);
-	}
-	let order = [];
-	let todo = t.roots.slice().reverse();
-	while (todo.length) {
-		let id = todo.pop();
-		order.push(id);
-		let kids = kids_of.get(id) || [];
-		for (let i = kids.length - 1; i >= 0; i--) todo.push(kids[i]);
-	}
+	let { kids_of, stacks } = leaf_runs(t);
+	let order = stacked_order(t, kids_of);
 	let col_w = [];
 	for (let [id, d] of t.depth) col_w[d] = Math.max(col_w[d] || 0, t.by_id.get(id).w);
 	let col_x = [];
@@ -29625,56 +29645,103 @@ function extent_at(n, a) {
 *
 *      ranksep   the step between rings
 *      nodesep   the gap between neighbours on a ring
+*      stack     (default true) a run of three or more LEAF children
+*                is a STACK, as in the compact tree: it asks its
+*                ring for one row of about the square root of its
+*                cards, not for every leaf -- a hall with a hundred
+*                devices no longer blows the ring up -- and lays
+*                them in rows going OUTWARD, each row as full as
+*                the room it has: rings round the parent when it is
+*                alone, a fan inside its sector when it is not.
+*                false keeps every leaf on the ring.
 ************************************************************/
 function layout_radial(nodes, edges, opts) {
-	let o = Object.assign({}, DEFAULTS, opts || {});
+	let o = Object.assign({}, DEFAULTS, { stack: true }, opts || {});
 	let t = spanning_tree(nodes, edges);
 	let pos = /* @__PURE__ */ new Map();
 	if (!t.roots.length) return pos;
-	let order = walk_order(t);
-	let leaves = /* @__PURE__ */ new Map();
+	let runs = o.stack ? leaf_runs(t) : {
+		kids_of: t.children,
+		stacks: /* @__PURE__ */ new Map()
+	};
+	let kids_of = runs.kids_of;
+	let stacks = runs.stacks;
+	let order = stacked_order(t, kids_of);
+	for (let st of stacks.values()) {
+		st.per_row = Math.ceil(Math.sqrt(st.ids.length));
+		st.cards = st.ids.map((id) => t.by_id.get(id));
+	}
+	let stack_across = (st, a) => {
+		let w = 0;
+		for (let c of st.cards) w = Math.max(w, extent_at(c, a + Math.PI / 2));
+		return {
+			card: w,
+			row: st.per_row * w + (st.per_row - 1) * o.nodesep
+		};
+	};
+	let widest_along = (cards, a, half) => {
+		let e = 0;
+		for (let k = 0; k <= 16; k++) {
+			let th = a - half + 2 * half * k / 16;
+			for (let c of cards) e = Math.max(e, extent_at(c, th));
+		}
+		return e;
+	};
+	let depth_of = (id) => stacks.has(id) ? stacks.get(id).depth : t.depth.get(id);
+	let circ = (a, b) => {
+		let d = Math.abs(a - b) % (2 * Math.PI);
+		return d > Math.PI ? 2 * Math.PI - d : d;
+	};
+	let weight = /* @__PURE__ */ new Map();
 	for (let i = order.length - 1; i >= 0; i--) {
 		let id = order[i];
-		let kids = t.children.get(id) || [];
+		let st = stacks.get(id);
+		if (st) {
+			weight.set(id, st.per_row);
+			continue;
+		}
+		let kids = kids_of.get(id) || [];
 		if (!kids.length) {
-			leaves.set(id, 1);
+			weight.set(id, 1);
 			continue;
 		}
 		let n = 0;
-		for (let kid of kids) n += leaves.get(kid);
-		leaves.set(id, n);
+		for (let kid of kids) n += weight.get(kid);
+		weight.set(id, n);
 	}
 	let total = 0;
-	for (let root of t.roots) total += leaves.get(root);
+	for (let root of t.roots) total += weight.get(root);
 	let single = t.roots.length === 1;
-	let ring_of = (id) => t.depth.get(id) + (single ? 0 : 1);
+	let ring_of = (id) => depth_of(id) + (single ? 0 : 1);
 	let angle = /* @__PURE__ */ new Map();
 	let rings = [];
 	let sector = (root_id, root_from, root_span, root_parent) => {
-		let stack = [{
+		let todo = [{
 			id: root_id,
 			from: root_from,
 			span: root_span,
 			parent: root_parent
 		}];
-		while (stack.length) {
-			let { id, from, span, parent } = stack.pop();
+		while (todo.length) {
+			let { id, from, span, parent } = todo.pop();
 			let a = from + span / 2;
 			angle.set(id, a);
 			let ring = ring_of(id);
 			if (!rings[ring]) rings[ring] = [];
-			let n = t.by_id.get(id);
+			let st = stacks.get(id);
+			let n = st ? null : t.by_id.get(id);
 			rings[ring].push({
 				id,
 				angle: a,
-				diag: Math.hypot(n.w, n.h),
-				ext: extent_at(n, a),
-				parent_ext: parent ? extent_at(t.by_id.get(parent), a) : 0
+				span,
+				diag: st ? stack_across(st, a).row : Math.hypot(n.w, n.h),
+				ext: st ? widest_along(st.cards, a, Math.min(span / 2, Math.PI)) : extent_at(n, a),
+				parent_ext: !parent ? 0 : st ? widest_along([t.by_id.get(parent)], a, Math.min(span / 2, Math.PI)) : extent_at(t.by_id.get(parent), a)
 			});
 			let cursor = from;
-			for (let kid of t.children.get(id) || []) {
-				let part = span * leaves.get(kid) / leaves.get(id);
-				stack.push({
+			for (let kid of kids_of.get(id) || []) {
+				let part = span * weight.get(kid) / weight.get(id);
+				todo.push({
 					id: kid,
 					from: cursor,
 					span: part,
@@ -29688,38 +29755,120 @@ function layout_radial(nodes, edges, opts) {
 		let root = t.roots[0];
 		angle.set(root, 0);
 		let cursor = -Math.PI / 2;
-		for (let kid of t.children.get(root) || []) {
-			let part = 2 * Math.PI * leaves.get(kid) / leaves.get(root);
+		for (let kid of kids_of.get(root) || []) {
+			let part = 2 * Math.PI * weight.get(kid) / weight.get(root);
 			sector(kid, cursor, part, root);
 			cursor += part;
 		}
 	} else {
 		let cursor = -Math.PI / 2;
 		for (let root of t.roots) {
-			let part = 2 * Math.PI * leaves.get(root) / total;
+			let part = 2 * Math.PI * weight.get(root) / total;
 			sector(root, cursor, part, null);
 			cursor += part;
 		}
 	}
+	let fit = (list, r0) => {
+		let r = r0;
+		let sorted = list.slice().sort((a, b) => a.angle - b.angle);
+		for (let i = 0; i < sorted.length && sorted.length > 1; i++) {
+			let a = sorted[i];
+			let b = sorted[(i + 1) % sorted.length];
+			let gap = i + 1 < sorted.length ? b.angle - a.angle : b.angle + 2 * Math.PI - a.angle;
+			if (gap > 1e-9) r = Math.max(r, (a.diag / 2 + b.diag / 2 + o.nodesep) / gap);
+		}
+		return r;
+	};
 	let radius = [0];
+	let reaching = [];
 	for (let ring = 1; ring < rings.length; ring++) {
+		let members = rings[ring] || [];
 		let r = radius[ring - 1] + o.ranksep;
-		for (let n of rings[ring] || []) r = Math.max(r, radius[ring - 1] + (n.parent_ext + n.ext) / 2 + o.nodesep);
-		let list = (rings[ring] || []).slice().sort((a, b) => a.angle - b.angle);
-		for (let i = 0; i < list.length && list.length > 1; i++) {
-			let a = list[i];
-			let b = list[(i + 1) % list.length];
-			let gap = i + 1 < list.length ? b.angle - a.angle : b.angle + 2 * Math.PI - a.angle;
-			if (gap > 1e-9) r = Math.max(r, (a.diag / 2 + b.diag / 2 + o.nodesep) / gap);
+		let band = 0;
+		for (let n of members) {
+			r = Math.max(r, radius[ring - 1] + (n.parent_ext + n.ext) / 2 + o.nodesep);
+			band = Math.max(band, n.ext);
+		}
+		r = fit(members, r);
+		for (let pass = 0; pass < 2; pass++) for (let g of reaching) {
+			if (g.reach < r - band / 2 - o.nodesep) continue;
+			for (let m of members) {
+				let d = circ(g.angle, m.angle);
+				if (d > g.half + 1e-9) r = Math.max(r, (m.diag / 2 + o.nodesep) / (d - g.half));
+				else r = Math.max(r, g.reach + m.ext / 2 + o.nodesep);
+			}
 		}
 		radius[ring] = r;
+		let sorted = members.slice().sort((a, b) => a.angle - b.angle);
+		for (let i = 0; i < sorted.length; i++) {
+			let m = sorted[i];
+			let st = stacks.get(m.id);
+			if (!st) continue;
+			let room = m.span / 2;
+			if (sorted.length > 1) {
+				let left = sorted[(i - 1 + sorted.length) % sorted.length];
+				let right = sorted[(i + 1) % sorted.length];
+				room = Math.min(room, circ(m.angle, left.angle) - (left.diag / 2 + o.nodesep) / r, circ(m.angle, right.angle) - (right.diag / 2 + o.nodesep) / r);
+			}
+			room = Math.min(room, Math.PI);
+			let across = 0;
+			let along = 0;
+			for (let k = 0; k <= 16; k++) {
+				let th = m.angle - room + 2 * room * k / 16;
+				for (let c of st.cards) {
+					across = Math.max(across, extent_at(c, th + Math.PI / 2));
+					along = Math.max(along, extent_at(c, th));
+				}
+			}
+			let rows = [];
+			let left_to_place = st.ids.length;
+			let rr = r;
+			let half = 0;
+			while (left_to_place > 0) {
+				let fits = Math.floor(2 * room * rr / (across + o.nodesep));
+				let cnt = Math.max(1, Math.min(left_to_place, fits));
+				rows.push({
+					rr,
+					cnt
+				});
+				half = Math.max(half, (cnt * (across + o.nodesep) - o.nodesep) / 2 / rr);
+				left_to_place -= cnt;
+				rr += along + 40;
+			}
+			st.plan = {
+				angle: m.angle,
+				across,
+				rows
+			};
+			reaching.push({
+				angle: m.angle,
+				half,
+				reach: rows[rows.length - 1].rr + along / 2
+			});
+		}
 	}
 	for (let [id, a] of angle) {
-		let r = radius[ring_of(id)] || 0;
-		pos.set(id, {
-			x: r * Math.cos(a),
-			y: r * Math.sin(a)
-		});
+		let st = stacks.get(id);
+		if (!st) {
+			let r0 = radius[ring_of(id)] || 0;
+			pos.set(id, {
+				x: r0 * Math.cos(a),
+				y: r0 * Math.sin(a)
+			});
+			continue;
+		}
+		let i = 0;
+		for (let row of st.plan.rows) {
+			let step = (st.plan.across + o.nodesep) / row.rr;
+			for (let j = 0; j < row.cnt; j++) {
+				let th = a + (j - (row.cnt - 1) / 2) * step;
+				pos.set(st.ids[i], {
+					x: row.rr * Math.cos(th),
+					y: row.rr * Math.sin(th)
+				});
+				i++;
+			}
+		}
 	}
 	return pos;
 }
@@ -30163,6 +30312,112 @@ function elbow_route(s, t, box_s, box_t, lane, vertical, boxes, stagger) {
 	if (!route && near.length < others.length) route = orth_search(a, z, others.map((b) => box_expand(b, m)));
 	return route || simple;
 }
+function path_points(path) {
+	let pts = [];
+	let cur = null;
+	for (let c of path) if (c[0] === "M" || c[0] === "L") {
+		cur = [c[1], c[2]];
+		pts.push(cur);
+	} else if (c[0] === "C" && cur) {
+		let [x0, y0] = cur;
+		for (let k = 1; k <= 16; k++) {
+			let u = k / 16;
+			let v = 1 - u;
+			pts.push([v * v * v * x0 + 3 * v * v * u * c[1] + 3 * v * u * u * c[3] + u * u * u * c[5], v * v * v * y0 + 3 * v * v * u * c[2] + 3 * v * u * u * c[4] + u * u * u * c[6]]);
+		}
+		cur = [c[5], c[6]];
+	} else if (c[0] === "Q" && cur) {
+		let [x0, y0] = cur;
+		for (let k = 1; k <= 16; k++) {
+			let u = k / 16;
+			let v = 1 - u;
+			pts.push([v * v * x0 + 2 * v * u * c[1] + u * u * c[3], v * v * y0 + 2 * v * u * c[2] + u * u * c[4]]);
+		}
+		cur = [c[3], c[4]];
+	}
+	return pts;
+}
+/************************************************************
+*  Does the G6 path `path` of a curved edge cross a card other than
+*  its own two? Measured on the curve itself -- the path G6 would
+*  draw, sampled -- and not on the rectangle round it, which took
+*  every card the curve merely passed near: the ports of a row
+*  stick well into the space above it. Its own two cards are left
+*  out: the curve starts and ends on their ports.
+************************************************************/
+function curve_hits(path, boxes, box_s, box_t) {
+	let pts = path_points(path);
+	if (pts.length < 2) return false;
+	let bb = {
+		x1: Infinity,
+		y1: Infinity,
+		x2: -Infinity,
+		y2: -Infinity
+	};
+	for (let p of pts) {
+		bb.x1 = Math.min(bb.x1, p[0]);
+		bb.y1 = Math.min(bb.y1, p[1]);
+		bb.x2 = Math.max(bb.x2, p[0]);
+		bb.y2 = Math.max(bb.y2, p[1]);
+	}
+	for (let b of boxes || []) {
+		if (same_box(b, box_s) || same_box(b, box_t) || !box_overlaps(b, box_expand(bb, 1))) continue;
+		let inner = box_expand(b, -1);
+		for (let k = 0; k + 1 < pts.length; k++) if (segment_hits(pts[k], pts[k + 1], inner)) return true;
+	}
+	return false;
+}
+/************************************************************
+*  A G6 path (['M'|'L'|'Q', ...]) along `points` with every corner
+*  rounded -- by `radius`, or by half the shorter of its two
+*  segments, so a short run is never overshot. The rounding is the
+*  quadratic G6's own polyline uses.
+************************************************************/
+function rounded_path(points, radius) {
+	let path = [[
+		"M",
+		points[0][0],
+		points[0][1]
+	]];
+	for (let i = 1; i + 1 < points.length; i++) {
+		let a = points[i - 1];
+		let m = points[i];
+		let b = points[i + 1];
+		let len_in = Math.hypot(m[0] - a[0], m[1] - a[1]);
+		let len_out = Math.hypot(b[0] - m[0], b[1] - m[1]);
+		let r = Math.min(radius, len_in / 2, len_out / 2);
+		let collinear = Math.abs((m[0] - a[0]) * (b[1] - m[1]) - (m[1] - a[1]) * (b[0] - m[0])) < 1e-9;
+		if (r <= 0 || collinear) {
+			path.push([
+				"L",
+				m[0],
+				m[1]
+			]);
+			continue;
+		}
+		let p1 = [m[0] - (m[0] - a[0]) / len_in * r, m[1] - (m[1] - a[1]) / len_in * r];
+		let p2 = [m[0] + (b[0] - m[0]) / len_out * r, m[1] + (b[1] - m[1]) / len_out * r];
+		path.push([
+			"L",
+			p1[0],
+			p1[1]
+		]);
+		path.push([
+			"Q",
+			m[0],
+			m[1],
+			p2[0],
+			p2[1]
+		]);
+	}
+	let last = points[points.length - 1];
+	path.push([
+		"L",
+		last[0],
+		last[1]
+	]);
+	return path;
+}
 //#endregion
 //#region node_modules/@babel/runtime/helpers/esm/typeof.js
 function _typeof(o) {
@@ -55050,7 +55305,7 @@ Easing Functions from anime.js, they are tried and true, so, its better to use t
 var Quad = function Quad(t) {
 	return Math.pow(t, 2);
 };
-var Cubic = function Cubic(t) {
+var Cubic$1 = function Cubic(t) {
 	return Math.pow(t, 3);
 };
 var Quart = function Quart(t) {
@@ -55187,10 +55442,10 @@ var EasingFunctions = {
 	"out-quad": EaseOut(Quad),
 	"in-out-quad": EaseInOut(Quad),
 	"out-in-quad": EaseOutIn(Quad),
-	"in-cubic": Cubic,
-	"out-cubic": EaseOut(Cubic),
-	"in-out-cubic": EaseInOut(Cubic),
-	"out-in-cubic": EaseOutIn(Cubic),
+	"in-cubic": Cubic$1,
+	"out-cubic": EaseOut(Cubic$1),
+	"in-out-cubic": EaseInOut(Cubic$1),
+	"out-in-cubic": EaseOutIn(Cubic$1),
 	"in-quart": Quart,
 	"out-quart": EaseOut(Quart),
 	"in-out-quart": EaseInOut(Quart),
@@ -57363,6 +57618,8 @@ function register_layouts(gobj) {
 		register(ExtensionCategory.LAYOUT, "treedb-compact", TreedbCompactLayout);
 		register(ExtensionCategory.EDGE, "treedb-elbow-v", TreedbElbowV);
 		register(ExtensionCategory.EDGE, "treedb-elbow-h", TreedbElbowH);
+		register(ExtensionCategory.EDGE, "treedb-curve-v", TreedbCurveV);
+		register(ExtensionCategory.EDGE, "treedb-curve-h", TreedbCurveH);
 		register(ExtensionCategory.LAYOUT, "treedb-radial", TreedbRadialLayout);
 		register(ExtensionCategory.NODE, "light", LightNode);
 		register(ExtensionCategory.NODE, "treedb-card", TreedbCard);
@@ -58057,7 +58314,9 @@ function layout_direction(gobj) {
 function edge_type_for(gobj) {
 	let lr = layout_direction(gobj) === "LR";
 	let rowless = gobj_read_attr(gobj, "rowless_layouts") || [];
-	if (gobj_read_str_attr(gobj, "edge_shape") === "elbow" && !str_in_list(rowless, gobj.priv.layout)) return lr ? "treedb-elbow-h" : "treedb-elbow-v";
+	let rows = !str_in_list(rowless, gobj.priv.layout);
+	if (rows && gobj_read_str_attr(gobj, "edge_shape") === "elbow") return lr ? "treedb-elbow-h" : "treedb-elbow-v";
+	if (rows) return lr ? "treedb-curve-h" : "treedb-curve-v";
 	return lr ? "cubic-horizontal" : "cubic";
 }
 /************************************************************
@@ -59661,6 +59920,40 @@ var TreedbElbowH = class extends Polyline {
 		return super.getKeyPath(Object.assign({}, attributes, { radius: attributes.radius || ELBOW_RADIUS }));
 	}
 };
+/************************************************************
+*  A CURVED edge that keeps off the cards. G6's cubic, as before,
+*  unless that very curve -- sampled, not guessed from the
+*  rectangle round it -- would cross a card other than its own two,
+*  or when it does not run forward and so would cross its own:
+*  the card above a lower row of a stack, a row between a parent
+*  and a far child. Then it goes the way an elbow would (the comb,
+*  the detour, the route: the same lanes and staggered turns) with
+*  round corners, so it still reads as a curve. `-v` for rows
+*  stacked top to bottom, `-h` for columns.
+************************************************************/
+function curve_key_path(edge, attributes, vertical, plain) {
+	let [s, t] = edge.getEndpoints(attributes, false);
+	let along = vertical ? 1 : 0;
+	let box_s = elbow_box(edge.sourceNode);
+	let box_t = elbow_box(edge.targetNode);
+	let boxes = elbow_obstacles(edge);
+	if (t[along] - s[along] > 20 && !curve_hits(plain, boxes, box_s, box_t)) return plain;
+	return rounded_path([
+		s,
+		...elbow_route(s, t, box_s, box_t, elbow_lane_of(edge), vertical, boxes, elbow_stagger_of(edge, vertical)),
+		t
+	], 24);
+}
+var TreedbCurveV = class extends Cubic {
+	getKeyPath(attributes) {
+		return curve_key_path(this, attributes, true, super.getKeyPath(attributes));
+	}
+};
+var TreedbCurveH = class extends CubicHorizontal {
+	getKeyPath(attributes) {
+		return curve_key_path(this, attributes, false, super.getKeyPath(attributes));
+	}
+};
 var TreedbCompactLayout = class extends BaseLayout {
 	async execute(data, options) {
 		let input = treedb_layout_input(data);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuneta/gobj-ui",
-  "version": "7.23.154",
+  "version": "7.23.156",
   "type": "module",
   "main": "dist/gobj-ui.cjs.js",
   "module": "dist/gobj-ui.es.js",

package/src/c_g6_nodes_tree.js

@@ -133,7 +133,10 @@ import {
     fold_root_group_key,
 } from "./treedb_fold_model.js";
 import {layout_tree, layout_radial, layout_compact} from "./treedb_layout.js";
-import {elbow_lane, elbow_rank, elbow_route, elbow_combs} from "./treedb_elbow.js";
+import {
+    elbow_lane, elbow_rank, elbow_route, elbow_combs, curve_hits, rounded_path, CURVE_RADIUS,
+    ELBOW_STEP,
+} from "./treedb_elbow.js";
 
 import {
     BaseLayout,
@@ -148,6 +151,8 @@ import {
     Toolbar,
     register,
     Polyline,
+    Cubic,
+    CubicHorizontal,
 } from '@antv/g6';
 
 import {Circle as CircleGeometry, Rect as RectGeometry} from '@antv/g';
@@ -942,6 +947,8 @@ function register_layouts(gobj)
         register(ExtensionCategory.LAYOUT, 'treedb-compact', TreedbCompactLayout);
         register(ExtensionCategory.EDGE, 'treedb-elbow-v', TreedbElbowV);
         register(ExtensionCategory.EDGE, 'treedb-elbow-h', TreedbElbowH);
+        register(ExtensionCategory.EDGE, 'treedb-curve-v', TreedbCurveV);
+        register(ExtensionCategory.EDGE, 'treedb-curve-h', TreedbCurveH);
         register(ExtensionCategory.LAYOUT, 'treedb-radial', TreedbRadialLayout);
         register(ExtensionCategory.NODE, 'light', LightNode);
         register(ExtensionCategory.NODE, 'treedb-card', TreedbCard);
@@ -2042,16 +2049,20 @@ function layout_direction(gobj)
     return str_in_list(LR_LAYOUTS, gobj.priv.layout)? "LR" : "TB";
 }
 
-/*  A curve, or an elbow when the reader asked for one and the layout
- *  has rows to run it between.  */
+/*  An elbow when the reader asked for one, a curve otherwise -- ours
+ *  where the layout has rows, which keeps off the cards; G6's plain
+ *  cubic on a layout with no rows to go round by.  */
 function edge_type_for(gobj)
 {
     let lr = (layout_direction(gobj) === "LR");
     let rowless = gobj_read_attr(gobj, "rowless_layouts") || [];
-    if(gobj_read_str_attr(gobj, "edge_shape") === "elbow" &&
-       !str_in_list(rowless, gobj.priv.layout)) {
+    let rows = !str_in_list(rowless, gobj.priv.layout);
+    if(rows && gobj_read_str_attr(gobj, "edge_shape") === "elbow") {
         return lr? "treedb-elbow-h" : "treedb-elbow-v";
     }
+    if(rows) {
+        return lr? "treedb-curve-h" : "treedb-curve-v";
+    }
     return lr? "cubic-horizontal" : "cubic";
 }
 
@@ -4388,6 +4399,51 @@ class TreedbElbowH extends Polyline
     }
 }
 
+/************************************************************
+ *  A CURVED edge that keeps off the cards. G6's cubic, as before,
+ *  unless that very curve -- sampled, not guessed from the
+ *  rectangle round it -- would cross a card other than its own two,
+ *  or when it does not run forward and so would cross its own:
+ *  the card above a lower row of a stack, a row between a parent
+ *  and a far child. Then it goes the way an elbow would (the comb,
+ *  the detour, the route: the same lanes and staggered turns) with
+ *  round corners, so it still reads as a curve. `-v` for rows
+ *  stacked top to bottom, `-h` for columns.
+ ************************************************************/
+function curve_key_path(edge, attributes, vertical, plain)
+{
+    let [s, t] = edge.getEndpoints(attributes, false);
+    let along = vertical? 1 : 0;
+    let box_s = elbow_box(edge.sourceNode);
+    let box_t = elbow_box(edge.targetNode);
+    let boxes = elbow_obstacles(edge);
+    /*  An edge that does not run forward -- one of every reciprocal
+     *  pair, an edge within one row -- runs through its OWN two cards
+     *  as a cubic, which curve_hits does not look at: it goes round
+     *  them, as its elbow does.  */
+    let forward = (t[along] - s[along] > 2 * ELBOW_STEP);
+    if(forward && !curve_hits(plain, boxes, box_s, box_t)) {
+        return plain;
+    }
+    let pts = elbow_route(s, t, box_s, box_t, elbow_lane_of(edge), vertical, boxes,
+                          elbow_stagger_of(edge, vertical));
+    return rounded_path([s, ...pts, t], CURVE_RADIUS);
+}
+
+class TreedbCurveV extends Cubic
+{
+    getKeyPath(attributes) {
+        return curve_key_path(this, attributes, true, super.getKeyPath(attributes));
+    }
+}
+
+class TreedbCurveH extends CubicHorizontal
+{
+    getKeyPath(attributes) {
+        return curve_key_path(this, attributes, false, super.getKeyPath(attributes));
+    }
+}
+
 class TreedbCompactLayout extends BaseLayout
 {
     async execute(data, options) {