@milaboratories/miplots4 1.0.176 → 1.0.178

package/dist/dendro/components/Legend.js

@@ -1,98 +1,156 @@
-import { j as n } from "../../_virtual/jsx-runtime.js";
-import { BLACK as h } from "../../constants.js";
-import { getPointShape as p } from "../../utils/getPointShape.js";
-const f = 14, c = 12, a = 12, x = -12;
-function j({ aes: o, label: d }) {
-  const i = p(o.shape, o.size, o.color);
-  return /* @__PURE__ */ n.jsxs("g", { children: [
-    /* @__PURE__ */ n.jsx("g", { transform: `translate(${a / 2},${a / 2})`, children: i }),
-    /* @__PURE__ */ n.jsx("text", { x: a + 8, y: a / 2, dominantBaseline: "central", fontWeight: 500, children: d })
-  ] });
+import { BLACK as e } from "../../constants.js";
+import { getPointShape as t } from "../../utils/getPointShape.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+var i = 14, a = 12, o = 12, s = -12;
+function c({ aes: e, label: i }) {
+	let a = t(e.shape, e.size, e.color);
+	return /* @__PURE__ */ r("g", { children: [/* @__PURE__ */ n("g", {
+		transform: `translate(${o / 2},${o / 2})`,
+		children: a
+	}), /* @__PURE__ */ n("text", {
+		x: o + 8,
+		y: o / 2,
+		dominantBaseline: "central",
+		fontWeight: 500,
+		children: i
+	})] });
 }
-function I({ legendData: o }) {
-  const i = o.items.filter((t) => t.type === "continuous");
-  return /* @__PURE__ */ n.jsxs("g", { children: [
-    /* @__PURE__ */ n.jsx("defs", { children: i.map((t) => /* @__PURE__ */ n.jsx("linearGradient", { id: t.id, gradientTransform: "rotate(90)", children: t.scale.domain().map((s) => {
-      const r = t.scale.domain(), e = r[r.length - 1] - r[0], l = e > 0 ? (s - r[0]) / e * 100 : 0;
-      return /* @__PURE__ */ n.jsx(
-        "stop",
-        {
-          offset: `${l}%`,
-          stopColor: t.scale(s)
-        },
-        s
-      );
-    }) }, t.id)) }),
-    o.items.map((t) => {
-      if (t.type === "continuous") {
-        const s = Math.min(...t.values), r = Math.max(...t.values);
-        return /* @__PURE__ */ n.jsxs("g", { transform: `translate(${t.left},${t.top})`, children: [
-          /* @__PURE__ */ n.jsx("text", { fontWeight: 500, fontSize: "14px", y: x, children: t.title }),
-          /* @__PURE__ */ n.jsx(
-            "rect",
-            {
-              x: "0",
-              y: "0",
-              width: f,
-              height: t.height,
-              stroke: h,
-              fill: `url(#${t.id})`
-            }
-          ),
-          /* @__PURE__ */ n.jsx("g", { transform: `translate(${f},0)`, children: t.values.map((e) => {
-            const l = r - s, g = l > 0 ? t.height * (e - s) / l : 0;
-            return /* @__PURE__ */ n.jsxs("g", { transform: `translate(0,${g})`, children: [
-              /* @__PURE__ */ n.jsx("line", { x1: "0", x2: -4, stroke: h }),
-              /* @__PURE__ */ n.jsx("text", { x: 8, y: 4, children: e })
-            ] }, e);
-          }) }),
-          !1
-        ] }, t.id);
-      }
-      if (t.type === "discrete")
-        return /* @__PURE__ */ n.jsxs("g", { transform: `translate(${t.left},${t.top})`, children: [
-          /* @__PURE__ */ n.jsx("text", { fontWeight: 500, fontSize: "14px", y: x, children: t.title }),
-          t.values.map((s, r) => /* @__PURE__ */ n.jsxs("g", { transform: `translate(0, ${r * (c + 4)})`, children: [
-            /* @__PURE__ */ n.jsx(
-              "rect",
-              {
-                x: "0",
-                y: "0",
-                width: c,
-                height: c,
-                fill: t.scale(s),
-                rx: "1",
-                ry: "1"
-              }
-            ),
-            /* @__PURE__ */ n.jsx("text", { x: c + 8, y: 10, children: s })
-          ] }, s)),
-          !1
-        ] }, t.id);
-      if (t.type === "nodes")
-        return /* @__PURE__ */ n.jsxs("g", { transform: `translate(${t.left},${t.top})`, fontSize: "14px", fontWeight: 500, children: [
-          /* @__PURE__ */ n.jsx("text", { fontWeight: 500, y: x, children: t.title }),
-          t.values.map((s, r) => /* @__PURE__ */ n.jsx("g", { transform: `translate(0, ${r * (a + 4)})`, children: /* @__PURE__ */ n.jsx(j, { aes: t.scale(s), label: t.labels[s] }) }, s)),
-          !1
-        ] }, t.id);
-      if (t.type === "size") {
-        const s = t.height / t.values.length;
-        return /* @__PURE__ */ n.jsxs("g", { transform: `translate(${t.left},${t.top})`, fontSize: "14px", fontWeight: 500, children: [
-          /* @__PURE__ */ n.jsx("text", { fontWeight: 500, y: x, children: t.title }),
-          t.values.map((r, e) => {
-            const l = t.scale(r);
-            return /* @__PURE__ */ n.jsxs("g", { transform: `translate(0, ${e * s})`, children: [
-              /* @__PURE__ */ n.jsx("circle", { r: l, cx: s / 2, cy: s / 2, fill: h }),
-              /* @__PURE__ */ n.jsx("text", { x: s + 4, y: s / 2, alignmentBaseline: "central", children: t.labels[r] })
-            ] }, r);
-          }),
-          !1
-        ] }, t.id);
-      }
-    })
-  ] });
+function l({ legendData: t }) {
+	return /* @__PURE__ */ r("g", { children: [/* @__PURE__ */ n("defs", { children: t.items.filter((e) => e.type === "continuous").map((e) => /* @__PURE__ */ n("linearGradient", {
+		id: e.id,
+		gradientTransform: "rotate(90)",
+		children: e.scale.domain().map((t) => {
+			let r = e.scale.domain(), i = r[r.length - 1] - r[0];
+			return /* @__PURE__ */ n("stop", {
+				offset: `${i > 0 ? (t - r[0]) / i * 100 : 0}%`,
+				stopColor: e.scale(t)
+			}, t);
+		})
+	}, e.id)) }), t.items.map((t) => {
+		if (t.type === "continuous") {
+			let a = Math.min(...t.values), o = Math.max(...t.values);
+			return /* @__PURE__ */ r("g", {
+				transform: `translate(${t.left},${t.top})`,
+				children: [
+					/* @__PURE__ */ n("text", {
+						fontWeight: 500,
+						fontSize: "14px",
+						y: s,
+						children: t.title
+					}),
+					/* @__PURE__ */ n("rect", {
+						x: "0",
+						y: "0",
+						width: i,
+						height: t.height,
+						stroke: e,
+						fill: `url(#${t.id})`
+					}),
+					/* @__PURE__ */ n("g", {
+						transform: `translate(${i},0)`,
+						children: t.values.map((i) => {
+							let s = o - a;
+							return /* @__PURE__ */ r("g", {
+								transform: `translate(0,${s > 0 ? t.height * (i - a) / s : 0})`,
+								children: [/* @__PURE__ */ n("line", {
+									x1: "0",
+									x2: -4,
+									stroke: e
+								}), /* @__PURE__ */ n("text", {
+									x: 8,
+									y: 4,
+									children: i
+								})]
+							}, i);
+						})
+					}),
+					!1
+				]
+			}, t.id);
+		}
+		if (t.type === "discrete") return /* @__PURE__ */ r("g", {
+			transform: `translate(${t.left},${t.top})`,
+			children: [
+				/* @__PURE__ */ n("text", {
+					fontWeight: 500,
+					fontSize: "14px",
+					y: s,
+					children: t.title
+				}),
+				t.values.map((e, i) => /* @__PURE__ */ r("g", {
+					transform: `translate(0, ${i * (a + 4)})`,
+					children: [/* @__PURE__ */ n("rect", {
+						x: "0",
+						y: "0",
+						width: a,
+						height: a,
+						fill: t.scale(e),
+						rx: "1",
+						ry: "1"
+					}), /* @__PURE__ */ n("text", {
+						x: a + 8,
+						y: 10,
+						children: e
+					})]
+				}, e)),
+				!1
+			]
+		}, t.id);
+		if (t.type === "nodes") return /* @__PURE__ */ r("g", {
+			transform: `translate(${t.left},${t.top})`,
+			fontSize: "14px",
+			fontWeight: 500,
+			children: [
+				/* @__PURE__ */ n("text", {
+					fontWeight: 500,
+					y: s,
+					children: t.title
+				}),
+				t.values.map((e, r) => /* @__PURE__ */ n("g", {
+					transform: `translate(0, ${r * (o + 4)})`,
+					children: /* @__PURE__ */ n(c, {
+						aes: t.scale(e),
+						label: t.labels[e]
+					})
+				}, e)),
+				!1
+			]
+		}, t.id);
+		if (t.type === "size") {
+			let i = t.height / t.values.length;
+			return /* @__PURE__ */ r("g", {
+				transform: `translate(${t.left},${t.top})`,
+				fontSize: "14px",
+				fontWeight: 500,
+				children: [
+					/* @__PURE__ */ n("text", {
+						fontWeight: 500,
+						y: s,
+						children: t.title
+					}),
+					t.values.map((a, o) => {
+						let s = t.scale(a);
+						return /* @__PURE__ */ r("g", {
+							transform: `translate(0, ${o * i})`,
+							children: [/* @__PURE__ */ n("circle", {
+								r: s,
+								cx: i / 2,
+								cy: i / 2,
+								fill: e
+							}), /* @__PURE__ */ n("text", {
+								x: i + 4,
+								y: i / 2,
+								alignmentBaseline: "central",
+								children: t.labels[a]
+							})]
+						}, a);
+					}),
+					!1
+				]
+			}, t.id);
+		}
+	})] });
 }
-export {
-  I as Legend
-};
-//# sourceMappingURL=Legend.js.map
+export { l as Legend };
+
+//# sourceMappingURL=Legend.js.map

package/dist/dendro/components/Legend.js.map

@@ -1 +1 @@
-{"version":3,"file":"Legend.js","sources":["../../../src/dendro/components/Legend.tsx"],"sourcesContent":["import { BLACK } from '../../constants';\nimport { getPointShape } from '../../utils/getPointShape';\nimport type { DotAesItem, LegendData, LegendItemContinuous } from './types';\n\nconst COLOR_ITEM_WIDTH_C = 14;\nconst COLOR_ITEM_SIZE_D = 12;\nconst LEGEND_ITEM_SIZE = 12;\nconst TITLE_POSITION = -12;\n\ninterface LegendProps {\n    legendData: LegendData;\n}\n\nfunction AesItem({aes, label}: {aes: DotAesItem; label: string}) {\n    const shape = getPointShape(aes.shape, aes.size, aes.color);\n\n    return (\n        <g>\n            <g transform={`translate(${LEGEND_ITEM_SIZE / 2},${LEGEND_ITEM_SIZE / 2})`}>{shape}</g>\n            <text x={LEGEND_ITEM_SIZE + 8} y={LEGEND_ITEM_SIZE / 2} dominantBaseline=\"central\" fontWeight={500}>\n                {label}\n            </text>\n        </g>\n    );\n}\n\nexport function Legend({legendData}: LegendProps) {\n    const debug = false;\n    const continuousItems= legendData.items.filter((item) => item.type === 'continuous') as LegendItemContinuous[];\n    return (\n        <g>\n            <defs>\n                {continuousItems.map(item => (\n                    <linearGradient key={item.id} id={item.id} gradientTransform=\"rotate(90)\">\n                        {item.scale.domain().map(value => {\n                            const domain = item.scale.domain();\n                            const range = domain[domain.length - 1] - domain[0];\n                            const percent = range > 0 ? (value - domain[0]) / range * 100 : 0;\n                            return (\n                                <stop\n                                    key={value}\n                                    offset={`${percent}%`}\n                                    stopColor={item.scale(value)}\n                                />\n                            );\n                        })}\n                    </linearGradient>\n                ))}\n            </defs>\n            {legendData.items.map(item => {\n                if (item.type === 'continuous') {\n                    const min = Math.min(...item.values);\n                    const max = Math.max(...item.values);\n                    return (\n                        <g key={item.id} transform={`translate(${item.left},${item.top})`}>\n                            <text fontWeight={500} fontSize=\"14px\" y={TITLE_POSITION}>{item.title}</text>\n                            <rect\n                                x=\"0\"\n                                y=\"0\"\n                                width={COLOR_ITEM_WIDTH_C}\n                                height={item.height}\n                                stroke={BLACK}\n                                fill={`url(#${item.id})`}\n                            />\n                            <g transform={`translate(${COLOR_ITEM_WIDTH_C},0)`}>\n                                {item.values.map(value => {\n                                    const range = max - min;\n                                    const y = range > 0 ? (item.height * (value - min)) / range : 0;\n                                    return (\n                                        <g key={value} transform={`translate(0,${y})`}>\n                                            <line x1=\"0\" x2={-4} stroke={BLACK} />\n                                            <text x={8} y={4}>{value}</text>\n                                        </g>\n                                    );\n                                })}\n                            </g>\n                            {debug && <rect width={item.width} height={item.height} fill=\"none\" stroke=\"black\"/>}\n                        </g>\n                    );\n                }\n                if (item.type === 'discrete') {\n                    return (\n                        <g key={item.id} transform={`translate(${item.left},${item.top})`}>\n                            <text fontWeight={500} fontSize=\"14px\" y={TITLE_POSITION}>{item.title}</text>\n                            {item.values.map((value, idx) => {\n                                return <g key={value} transform={`translate(0, ${idx * (COLOR_ITEM_SIZE_D + 4)})`}>\n                                    <rect\n                                        x=\"0\"\n                                        y=\"0\"\n                                        width={COLOR_ITEM_SIZE_D}\n                                        height={COLOR_ITEM_SIZE_D}\n                                        fill={item.scale(value)}\n                                        rx=\"1\"\n                                        ry=\"1\"\n                                    />\n                                    <text x={COLOR_ITEM_SIZE_D + 8} y={10}>{value}</text>\n                                </g>;\n                            })}\n                            {debug && <rect width={item.width} height={item.height} fill=\"none\" stroke=\"black\"/>}\n                        </g>\n                    );\n                }\n                if (item.type === 'nodes') {\n                    return (\n                        <g key={item.id} transform={`translate(${item.left},${item.top})`} fontSize=\"14px\" fontWeight={500}>\n                            <text fontWeight={500} y={TITLE_POSITION}>\n                                {item.title}\n                            </text>\n                            {item.values.map((value, idx) => {\n                                return (\n                                    <g key={value} transform={`translate(0, ${idx * (LEGEND_ITEM_SIZE + 4)})`}>\n                                        <AesItem aes={item.scale(value)} label={item.labels[value]} />\n                                    </g>\n                                );\n                            })}\n                            {debug && <rect width={item.width} height={item.height} fill=\"none\" stroke=\"black\" />}\n                        </g>\n                    );\n                }\n                if (item.type === 'size') {\n                    const size = item.height / item.values.length;\n                    return (\n                        <g key={item.id} transform={`translate(${item.left},${item.top})`} fontSize=\"14px\" fontWeight={500}>\n                            <text fontWeight={500} y={TITLE_POSITION}>\n                                {item.title}\n                            </text>\n                            {item.values.map((value, idx) => {\n                                const r = item.scale(value);\n                                return (\n                                    <g key={value} transform={`translate(0, ${idx * size})`}>\n                                        <circle r={r} cx={size / 2} cy={size / 2} fill={BLACK}/>\n                                        <text x={size + 4} y={size / 2} alignmentBaseline=\"central\">{item.labels[value]}</text>\n                                    </g>\n                                );\n                            })}\n                            {debug && <rect width={item.width} height={item.height} fill=\"none\" stroke=\"black\" />}\n                        </g>\n                    );\n                }\n            })}\n        </g>\n    );\n}\n"],"names":["COLOR_ITEM_WIDTH_C","COLOR_ITEM_SIZE_D","LEGEND_ITEM_SIZE","TITLE_POSITION","AesItem","aes","label","shape","getPointShape","jsx","Legend","legendData","continuousItems","item","value","domain","range","percent","min","max","jsxs","BLACK","y","idx","size","r"],"mappings":"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"}
+{"version":3,"file":"Legend.js","names":[],"sources":["../../../src/dendro/components/Legend.tsx"],"sourcesContent":["import { BLACK } from '../../constants';\nimport { getPointShape } from '../../utils/getPointShape';\nimport type { DotAesItem, LegendData, LegendItemContinuous } from './types';\n\nconst COLOR_ITEM_WIDTH_C = 14;\nconst COLOR_ITEM_SIZE_D = 12;\nconst LEGEND_ITEM_SIZE = 12;\nconst TITLE_POSITION = -12;\n\ninterface LegendProps {\n    legendData: LegendData;\n}\n\nfunction AesItem({aes, label}: {aes: DotAesItem; label: string}) {\n    const shape = getPointShape(aes.shape, aes.size, aes.color);\n\n    return (\n        <g>\n            <g transform={`translate(${LEGEND_ITEM_SIZE / 2},${LEGEND_ITEM_SIZE / 2})`}>{shape}</g>\n            <text x={LEGEND_ITEM_SIZE + 8} y={LEGEND_ITEM_SIZE / 2} dominantBaseline=\"central\" fontWeight={500}>\n                {label}\n            </text>\n        </g>\n    );\n}\n\nexport function Legend({legendData}: LegendProps) {\n    const debug = false;\n    const continuousItems= legendData.items.filter((item) => item.type === 'continuous') as LegendItemContinuous[];\n    return (\n        <g>\n            <defs>\n                {continuousItems.map(item => (\n                    <linearGradient key={item.id} id={item.id} gradientTransform=\"rotate(90)\">\n                        {item.scale.domain().map(value => {\n                            const domain = item.scale.domain();\n                            const range = domain[domain.length - 1] - domain[0];\n                            const percent = range > 0 ? (value - domain[0]) / range * 100 : 0;\n                            return (\n                                <stop\n                                    key={value}\n                                    offset={`${percent}%`}\n                                    stopColor={item.scale(value)}\n                                />\n                            );\n                        })}\n                    </linearGradient>\n                ))}\n            </defs>\n            {legendData.items.map(item => {\n                if (item.type === 'continuous') {\n                    const min = Math.min(...item.values);\n                    const max = Math.max(...item.values);\n                    return (\n                        <g key={item.id} transform={`translate(${item.left},${item.top})`}>\n                            <text fontWeight={500} fontSize=\"14px\" y={TITLE_POSITION}>{item.title}</text>\n                            <rect\n                                x=\"0\"\n                                y=\"0\"\n                                width={COLOR_ITEM_WIDTH_C}\n                                height={item.height}\n                                stroke={BLACK}\n                                fill={`url(#${item.id})`}\n                            />\n                            <g transform={`translate(${COLOR_ITEM_WIDTH_C},0)`}>\n                                {item.values.map(value => {\n                                    const range = max - min;\n                                    const y = range > 0 ? (item.height * (value - min)) / range : 0;\n                                    return (\n                                        <g key={value} transform={`translate(0,${y})`}>\n                                            <line x1=\"0\" x2={-4} stroke={BLACK} />\n                                            <text x={8} y={4}>{value}</text>\n                                        </g>\n                                    );\n                                })}\n                            </g>\n                            {debug && <rect width={item.width} height={item.height} fill=\"none\" stroke=\"black\"/>}\n                        </g>\n                    );\n                }\n                if (item.type === 'discrete') {\n                    return (\n                        <g key={item.id} transform={`translate(${item.left},${item.top})`}>\n                            <text fontWeight={500} fontSize=\"14px\" y={TITLE_POSITION}>{item.title}</text>\n                            {item.values.map((value, idx) => {\n                                return <g key={value} transform={`translate(0, ${idx * (COLOR_ITEM_SIZE_D + 4)})`}>\n                                    <rect\n                                        x=\"0\"\n                                        y=\"0\"\n                                        width={COLOR_ITEM_SIZE_D}\n                                        height={COLOR_ITEM_SIZE_D}\n                                        fill={item.scale(value)}\n                                        rx=\"1\"\n                                        ry=\"1\"\n                                    />\n                                    <text x={COLOR_ITEM_SIZE_D + 8} y={10}>{value}</text>\n                                </g>;\n                            })}\n                            {debug && <rect width={item.width} height={item.height} fill=\"none\" stroke=\"black\"/>}\n                        </g>\n                    );\n                }\n                if (item.type === 'nodes') {\n                    return (\n                        <g key={item.id} transform={`translate(${item.left},${item.top})`} fontSize=\"14px\" fontWeight={500}>\n                            <text fontWeight={500} y={TITLE_POSITION}>\n                                {item.title}\n                            </text>\n                            {item.values.map((value, idx) => {\n                                return (\n                                    <g key={value} transform={`translate(0, ${idx * (LEGEND_ITEM_SIZE + 4)})`}>\n                                        <AesItem aes={item.scale(value)} label={item.labels[value]} />\n                                    </g>\n                                );\n                            })}\n                            {debug && <rect width={item.width} height={item.height} fill=\"none\" stroke=\"black\" />}\n                        </g>\n                    );\n                }\n                if (item.type === 'size') {\n                    const size = item.height / item.values.length;\n                    return (\n                        <g key={item.id} transform={`translate(${item.left},${item.top})`} fontSize=\"14px\" fontWeight={500}>\n                            <text fontWeight={500} y={TITLE_POSITION}>\n                                {item.title}\n                            </text>\n                            {item.values.map((value, idx) => {\n                                const r = item.scale(value);\n                                return (\n                                    <g key={value} transform={`translate(0, ${idx * size})`}>\n                                        <circle r={r} cx={size / 2} cy={size / 2} fill={BLACK}/>\n                                        <text x={size + 4} y={size / 2} alignmentBaseline=\"central\">{item.labels[value]}</text>\n                                    </g>\n                                );\n                            })}\n                            {debug && <rect width={item.width} height={item.height} fill=\"none\" stroke=\"black\" />}\n                        </g>\n                    );\n                }\n            })}\n        </g>\n    );\n}\n"],"mappings":"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"}

package/dist/dendro/components/LinksGroup.js

@@ -1,36 +1,21 @@
-import { j as n } from "../../_virtual/jsx-runtime.js";
-import { SELECTED_PATH_COLOR as c } from "../constants.js";
-import { link as m } from "../../node_modules/.pnpm/d3-shape@3.2.0/node_modules/d3-shape/src/link.js";
-import { bumpY as p, bumpX as y } from "../../node_modules/.pnpm/d3-shape@3.2.0/node_modules/d3-shape/src/curve/bump.js";
-function L(s, $, x) {
-  const { source: t, target: e } = s, o = x === "top";
-  return $ === "rectangle" ? o ? `M ${t.x},${t.y} L ${e.x},${t.y} L${e.x},${e.y}` : `M ${t.y},${t.x} L ${t.y},${e.x} L${e.y},${e.x}` : $ === "curve" ? m(
-    o ? p : y
-  ).x((r) => o ? r.x : r.y).y((r) => o ? r.y : r.x).source((r) => r.target).target((r) => r.source)(s) ?? "" : o ? `M ${t.x},${t.y} L${e.x},${e.y}` : `M ${t.y},${t.x} L${e.y},${e.x}`;
+import { SELECTED_PATH_COLOR as e } from "../constants.js";
+import { Fragment as t, jsx as n } from "react/jsx-runtime";
+import { curveBumpX as r, curveBumpY as i, link as a } from "d3-shape";
+function o(e, t, n) {
+	let { source: o, target: s } = e, c = n === "top";
+	return t === "rectangle" ? c ? `M ${o.x},${o.y} L ${s.x},${o.y} L${s.x},${s.y}` : `M ${o.y},${o.x} L ${o.y},${s.x} L${s.y},${s.x}` : t === "curve" ? a(c ? i : r).x((e) => c ? e.x : e.y).y((e) => c ? e.y : e.x).source((e) => e.target).target((e) => e.source)(e) ?? "" : c ? `M ${o.x},${o.y} L${s.x},${s.y}` : `M ${o.y},${o.x} L${s.y},${s.x}`;
 }
-function E({
-  links: s,
-  connectionType: $,
-  rootPosition: x,
-  edgeInheritance: t,
-  aesGetters: e,
-  selected: o
-}) {
-  return /* @__PURE__ */ n.jsx(n.Fragment, { children: s.map((r) => {
-    const { source: u, target: a } = r, i = (t === "up" ? u : a).data.rawIndexes[0];
-    return /* @__PURE__ */ n.jsx(
-      "path",
-      {
-        d: L(r, $, x),
-        stroke: o ? c : e.lineColor(i),
-        strokeWidth: o ? 2 : 1,
-        fill: "none"
-      },
-      `${r.source.id},${r.target.id}`
-    );
-  }) });
+function s({ links: r, connectionType: i, rootPosition: a, edgeInheritance: s, aesGetters: c, selected: l }) {
+	return /* @__PURE__ */ n(t, { children: r.map((t) => {
+		let { source: r, target: u } = t, d = (s === "up" ? r : u).data.rawIndexes[0];
+		return /* @__PURE__ */ n("path", {
+			d: o(t, i, a),
+			stroke: l ? e : c.lineColor(d),
+			strokeWidth: l ? 2 : 1,
+			fill: "none"
+		}, `${t.source.id},${t.target.id}`);
+	}) });
 }
-export {
-  E as LinksGroup
-};
-//# sourceMappingURL=LinksGroup.js.map
+export { s as LinksGroup };
+
+//# sourceMappingURL=LinksGroup.js.map

package/dist/dendro/components/LinksGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinksGroup.js","sources":["../../../src/dendro/components/LinksGroup.tsx"],"sourcesContent":["import type { HierarchyPointLink, HierarchyPointNode } from 'd3-hierarchy';\nimport { curveBumpX, curveBumpY, link as d3link } from 'd3-shape';\nimport { SELECTED_PATH_COLOR } from '../constants';\nimport type { DendroSettingsImpl } from '../DendroSettingsImpl';\nimport type { TreeNodeData } from '../getHierarchyData';\n\ninterface LinksGroupProps {\n    links: HierarchyPointLink<TreeNodeData>[];\n    connectionType: DendroSettingsImpl['connectionType'];\n    rootPosition: DendroSettingsImpl['rootPosition'];\n    edgeInheritance: DendroSettingsImpl['edgeInheritance'];\n    aesGetters: {\n        nodeShape: (idx: number) => string;\n        nodeColor: (idx: number) => string;\n        nodeSize: (idx: number) => number;\n        lineShape: (idx: number) => string;\n        lineColor: (idx: number) => string;\n    };\n    selected: boolean;\n}\n\nfunction getLinkPath(\n    link: HierarchyPointLink<TreeNodeData>,\n    connectionType: DendroSettingsImpl['connectionType'],\n    rootPosition: DendroSettingsImpl['rootPosition']\n): string {\n    const {source, target} = link;\n    const isVertical = rootPosition === 'top';\n    if (connectionType === 'rectangle') {\n        return isVertical\n            ? `M ${source.x},${source.y} L ${target.x},${source.y} L${target.x},${target.y}`\n            : `M ${source.y},${source.x} L ${source.y},${target.x} L${target.y},${target.x}`;\n    }\n    if (connectionType === 'curve') {\n        return (\n            d3link<HierarchyPointLink<TreeNodeData>, HierarchyPointNode<TreeNodeData>>(\n                isVertical ? curveBumpY : curveBumpX\n            )\n                .x(d => (isVertical ? d.x : d.y))\n                .y(d => (isVertical ? d.y : d.x))\n                .source(d => d.target)\n                .target(d => d.source)(link) ?? ''\n        );\n    }\n    return isVertical\n        ? `M ${source.x},${source.y} L${target.x},${target.y}`\n        : `M ${source.y},${source.x} L${target.y},${target.x}`;\n}\n\nexport function LinksGroup({\n    links,\n    connectionType,\n    rootPosition,\n    edgeInheritance,\n    aesGetters,\n    selected,\n}: LinksGroupProps) {\n    return (\n        <>\n            {links.map(link => {\n                const {source, target} = link;\n                const aesNode = edgeInheritance === 'up' ? source : target;\n                const idx = aesNode.data.rawIndexes[0];\n                return (\n                    <path\n                        key={`${link.source.id},${link.target.id}`}\n                        d={getLinkPath(link, connectionType, rootPosition)}\n                        stroke={selected ? SELECTED_PATH_COLOR : aesGetters.lineColor(idx)}\n                        strokeWidth={selected ? 2 : 1}\n                        fill=\"none\"\n                    />\n                );\n            })}\n        </>\n    );\n}\n"],"names":["getLinkPath","link","connectionType","rootPosition","source","target","isVertical","d3link","curveBumpY","curveBumpX","d","LinksGroup","links","edgeInheritance","aesGetters","selected","jsx","Fragment","idx","SELECTED_PATH_COLOR"],"mappings":";;;;AAqBA,SAASA,EACLC,GACAC,GACAC,GACM;AACN,QAAM,EAAC,QAAAC,GAAQ,QAAAC,EAAA,IAAUJ,GACnBK,IAAaH,MAAiB;AACpC,SAAID,MAAmB,cACZI,IACD,KAAKF,EAAO,CAAC,IAAIA,EAAO,CAAC,MAAMC,EAAO,CAAC,IAAID,EAAO,CAAC,KAAKC,EAAO,CAAC,IAAIA,EAAO,CAAC,KAC5E,KAAKD,EAAO,CAAC,IAAIA,EAAO,CAAC,MAAMA,EAAO,CAAC,IAAIC,EAAO,CAAC,KAAKA,EAAO,CAAC,IAAIA,EAAO,CAAC,KAElFH,MAAmB,UAEfK;AAAAA,IACID,IAAaE,IAAaC;AAAAA,EAAA,EAEzB,EAAE,CAAAC,MAAMJ,IAAaI,EAAE,IAAIA,EAAE,CAAE,EAC/B,EAAE,CAAAA,MAAMJ,IAAaI,EAAE,IAAIA,EAAE,CAAE,EAC/B,OAAO,CAAAA,MAAKA,EAAE,MAAM,EACpB,OAAO,CAAAA,MAAKA,EAAE,MAAM,EAAET,CAAI,KAAK,KAGrCK,IACD,KAAKF,EAAO,CAAC,IAAIA,EAAO,CAAC,KAAKC,EAAO,CAAC,IAAIA,EAAO,CAAC,KAClD,KAAKD,EAAO,CAAC,IAAIA,EAAO,CAAC,KAAKC,EAAO,CAAC,IAAIA,EAAO,CAAC;AAC5D;AAEO,SAASM,EAAW;AAAA,EACvB,OAAAC;AAAA,EACA,gBAAAV;AAAA,EACA,cAAAC;AAAA,EACA,iBAAAU;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AACJ,GAAoB;AAChB,SACIC,gBAAAA,EAAAA,IAAAC,EAAAA,UAAA,EACK,UAAAL,EAAM,IAAI,CAAAX,MAAQ;AACf,UAAM,EAAC,QAAAG,GAAQ,QAAAC,EAAA,IAAUJ,GAEnBiB,KADUL,MAAoB,OAAOT,IAASC,GAChC,KAAK,WAAW,CAAC;AACrC,WACIW,gBAAAA,EAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QAEG,GAAGhB,EAAYC,GAAMC,GAAgBC,CAAY;AAAA,QACjD,QAAQY,IAAWI,IAAsBL,EAAW,UAAUI,CAAG;AAAA,QACjE,aAAaH,IAAW,IAAI;AAAA,QAC5B,MAAK;AAAA,MAAA;AAAA,MAJA,GAAGd,EAAK,OAAO,EAAE,IAAIA,EAAK,OAAO,EAAE;AAAA,IAAA;AAAA,EAOpD,CAAC,EAAA,CACL;AAER;"}
+{"version":3,"file":"LinksGroup.js","names":[],"sources":["../../../src/dendro/components/LinksGroup.tsx"],"sourcesContent":["import type { HierarchyPointLink, HierarchyPointNode } from 'd3-hierarchy';\nimport { curveBumpX, curveBumpY, link as d3link } from 'd3-shape';\nimport { SELECTED_PATH_COLOR } from '../constants';\nimport type { DendroSettingsImpl } from '../DendroSettingsImpl';\nimport type { TreeNodeData } from '../getHierarchyData';\n\ninterface LinksGroupProps {\n    links: HierarchyPointLink<TreeNodeData>[];\n    connectionType: DendroSettingsImpl['connectionType'];\n    rootPosition: DendroSettingsImpl['rootPosition'];\n    edgeInheritance: DendroSettingsImpl['edgeInheritance'];\n    aesGetters: {\n        nodeShape: (idx: number) => string;\n        nodeColor: (idx: number) => string;\n        nodeSize: (idx: number) => number;\n        lineShape: (idx: number) => string;\n        lineColor: (idx: number) => string;\n    };\n    selected: boolean;\n}\n\nfunction getLinkPath(\n    link: HierarchyPointLink<TreeNodeData>,\n    connectionType: DendroSettingsImpl['connectionType'],\n    rootPosition: DendroSettingsImpl['rootPosition']\n): string {\n    const {source, target} = link;\n    const isVertical = rootPosition === 'top';\n    if (connectionType === 'rectangle') {\n        return isVertical\n            ? `M ${source.x},${source.y} L ${target.x},${source.y} L${target.x},${target.y}`\n            : `M ${source.y},${source.x} L ${source.y},${target.x} L${target.y},${target.x}`;\n    }\n    if (connectionType === 'curve') {\n        return (\n            d3link<HierarchyPointLink<TreeNodeData>, HierarchyPointNode<TreeNodeData>>(\n                isVertical ? curveBumpY : curveBumpX\n            )\n                .x(d => (isVertical ? d.x : d.y))\n                .y(d => (isVertical ? d.y : d.x))\n                .source(d => d.target)\n                .target(d => d.source)(link) ?? ''\n        );\n    }\n    return isVertical\n        ? `M ${source.x},${source.y} L${target.x},${target.y}`\n        : `M ${source.y},${source.x} L${target.y},${target.x}`;\n}\n\nexport function LinksGroup({\n    links,\n    connectionType,\n    rootPosition,\n    edgeInheritance,\n    aesGetters,\n    selected,\n}: LinksGroupProps) {\n    return (\n        <>\n            {links.map(link => {\n                const {source, target} = link;\n                const aesNode = edgeInheritance === 'up' ? source : target;\n                const idx = aesNode.data.rawIndexes[0];\n                return (\n                    <path\n                        key={`${link.source.id},${link.target.id}`}\n                        d={getLinkPath(link, connectionType, rootPosition)}\n                        stroke={selected ? SELECTED_PATH_COLOR : aesGetters.lineColor(idx)}\n                        strokeWidth={selected ? 2 : 1}\n                        fill=\"none\"\n                    />\n                );\n            })}\n        </>\n    );\n}\n"],"mappings":";;;AAqBA,SAAS,EACL,GACA,GACA,GACM;CACN,IAAM,EAAC,WAAQ,cAAU,GACnB,IAAa,MAAiB;AAiBpC,QAhBI,MAAmB,cACZ,IACD,KAAK,EAAO,EAAE,GAAG,EAAO,EAAE,KAAK,EAAO,EAAE,GAAG,EAAO,EAAE,IAAI,EAAO,EAAE,GAAG,EAAO,MAC3E,KAAK,EAAO,EAAE,GAAG,EAAO,EAAE,KAAK,EAAO,EAAE,GAAG,EAAO,EAAE,IAAI,EAAO,EAAE,GAAG,EAAO,MAEjF,MAAmB,UAEf,EACI,IAAa,IAAa,EAC7B,CACI,GAAE,MAAM,IAAa,EAAE,IAAI,EAAE,EAAG,CAChC,GAAE,MAAM,IAAa,EAAE,IAAI,EAAE,EAAG,CAChC,QAAO,MAAK,EAAE,OAAO,CACrB,QAAO,MAAK,EAAE,OAAO,CAAC,EAAK,IAAI,KAGrC,IACD,KAAK,EAAO,EAAE,GAAG,EAAO,EAAE,IAAI,EAAO,EAAE,GAAG,EAAO,MACjD,KAAK,EAAO,EAAE,GAAG,EAAO,EAAE,IAAI,EAAO,EAAE,GAAG,EAAO;;AAG3D,SAAgB,EAAW,EACvB,UACA,mBACA,iBACA,oBACA,eACA,eACgB;AAChB,QACI,kBAAA,GAAA,EAAA,UACK,EAAM,KAAI,MAAQ;EACf,IAAM,EAAC,WAAQ,cAAU,GAEnB,KADU,MAAoB,OAAO,IAAS,GAChC,KAAK,WAAW;AACpC,SACI,kBAAC,QAAD;GAEI,GAAG,EAAY,GAAM,GAAgB,EAAa;GAClD,QAAQ,IAAW,IAAsB,EAAW,UAAU,EAAI;GAClE,aAAa,IAAW,IAAI;GAC5B,MAAK;GACP,EALO,GAAG,EAAK,OAAO,GAAG,GAAG,EAAK,OAAO,KAKxC;GAER,EACH,CAAA"}

package/dist/dendro/components/NodesGroup.js

@@ -1,95 +1,72 @@
-import { j as t } from "../../_virtual/jsx-runtime.js";
-import { r as E } from "../../_virtual/index.js";
-import { getPointShape as T } from "../../utils/getPointShape.js";
-import { DIMMED_OPACITY as L, SELECTED_NODE_COLOR as f, MARGIN as p } from "../constants.js";
-const v = 12;
-function w({
-  nodes: u,
-  rootPosition: j,
-  showLeavesLabels: d,
-  showNodesLabels: g,
-  aesGetters: i,
-  selectedNodeId: h,
-  onClick: y,
-  onSelectedUpdate: m
-}) {
-  const n = j === "top", [I, a] = E.useState(null);
-  return E.useEffect(() => {
-    a(null);
-  }, [h]), /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    /* @__PURE__ */ t.jsx("g", { children: u.map((r) => {
-      const s = r.data.rawIndexes[0], c = i.nodeSize(s), l = i.nodeColor(s), o = n ? r.x : r.y, x = n ? r.y : r.x;
-      return /* @__PURE__ */ t.jsx(
-        "g",
-        {
-          transform: `translate(${o},${x})`,
-          style: { cursor: "pointer" },
-          onClick: (e) => {
-            e.stopPropagation(), y({ x: o + p.LEFT, y: x + p.TOP, info: r.data.rawIndexes }), m(r);
-          },
-          children: /* @__PURE__ */ t.jsx("g", { children: /* @__PURE__ */ t.jsx(
-            "circle",
-            {
-              cx: 0,
-              cy: 0,
-              r: c + v,
-              fill: h === r.id ? f : I === r.id ? l : "transparent",
-              opacity: L,
-              onMouseOver: () => a(r.id ?? null),
-              onMouseLeave: () => a(null)
-            }
-          ) })
-        },
-        r.id
-      );
-    }) }),
-    /* @__PURE__ */ t.jsx("g", { children: u.map((r) => {
-      const s = r.data.rawIndexes[0], c = i.nodeShape(s), l = i.nodeSize(s), o = i.nodeColor(s), x = n ? r.x : r.y, e = n ? r.y : r.x;
-      return /* @__PURE__ */ t.jsx(
-        "g",
-        {
-          transform: `translate(${x},${e})`,
-          style: { cursor: "pointer" },
-          onClick: (O) => {
-            O.stopPropagation(), y({ x: x + p.LEFT, y: e + p.TOP, info: r.data.rawIndexes }), m(r);
-          },
-          children: /* @__PURE__ */ t.jsx(
-            "g",
-            {
-              onMouseOver: () => a(r.id ?? null),
-              onMouseLeave: () => a(null),
-              children: T(c, l, h === r.id ? f : o)
-            }
-          )
-        },
-        r.id
-      );
-    }) }),
-    /* @__PURE__ */ t.jsx("g", { children: u.map((r) => {
-      const s = r.data.rawIndexes[0], c = i.nodeSize(s), l = n ? r.x : r.y, o = n ? r.y : r.x;
-      return /* @__PURE__ */ t.jsx(
-        "g",
-        {
-          transform: `translate(${l},${o})`,
-          style: { pointerEvents: "none" },
-          children: (g && r.children || d && !r.children) && /* @__PURE__ */ t.jsx(
-            "text",
-            {
-              x: c + 4,
-              y: "4",
-              paintOrder: "stroke",
-              stroke: "white",
-              strokeWidth: "3",
-              children: r.data.label
-            }
-          )
-        },
-        r.id
-      );
-    }) })
-  ] });
+import { DIMMED_OPACITY as e, MARGIN as t, SELECTED_NODE_COLOR as n } from "../constants.js";
+import { getPointShape as r } from "../../utils/getPointShape.js";
+import { useEffect as i, useState as a } from "react";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+var l = 12;
+function u({ nodes: u, rootPosition: d, showLeavesLabels: f, showNodesLabels: p, aesGetters: m, selectedNodeId: h, onClick: g, onSelectedUpdate: _ }) {
+	let v = d === "top", [y, b] = a(null);
+	return i(() => {
+		b(null);
+	}, [h]), /* @__PURE__ */ c(o, { children: [
+		/* @__PURE__ */ s("g", { children: u.map((r) => {
+			let i = r.data.rawIndexes[0], a = m.nodeSize(i), o = m.nodeColor(i), c = v ? r.x : r.y, u = v ? r.y : r.x;
+			return /* @__PURE__ */ s("g", {
+				transform: `translate(${c},${u})`,
+				style: { cursor: "pointer" },
+				onClick: (e) => {
+					e.stopPropagation(), g({
+						x: c + t.LEFT,
+						y: u + t.TOP,
+						info: r.data.rawIndexes
+					}), _(r);
+				},
+				children: /* @__PURE__ */ s("g", { children: /* @__PURE__ */ s("circle", {
+					cx: 0,
+					cy: 0,
+					r: a + l,
+					fill: h === r.id ? n : y === r.id ? o : "transparent",
+					opacity: e,
+					onMouseOver: () => b(r.id ?? null),
+					onMouseLeave: () => b(null)
+				}) })
+			}, r.id);
+		}) }),
+		/* @__PURE__ */ s("g", { children: u.map((e) => {
+			let i = e.data.rawIndexes[0], a = m.nodeShape(i), o = m.nodeSize(i), c = m.nodeColor(i), l = v ? e.x : e.y, u = v ? e.y : e.x;
+			return /* @__PURE__ */ s("g", {
+				transform: `translate(${l},${u})`,
+				style: { cursor: "pointer" },
+				onClick: (n) => {
+					n.stopPropagation(), g({
+						x: l + t.LEFT,
+						y: u + t.TOP,
+						info: e.data.rawIndexes
+					}), _(e);
+				},
+				children: /* @__PURE__ */ s("g", {
+					onMouseOver: () => b(e.id ?? null),
+					onMouseLeave: () => b(null),
+					children: r(a, o, h === e.id ? n : c)
+				})
+			}, e.id);
+		}) }),
+		/* @__PURE__ */ s("g", { children: u.map((e) => {
+			let t = e.data.rawIndexes[0], n = m.nodeSize(t);
+			return /* @__PURE__ */ s("g", {
+				transform: `translate(${v ? e.x : e.y},${v ? e.y : e.x})`,
+				style: { pointerEvents: "none" },
+				children: (p && e.children || f && !e.children) && /* @__PURE__ */ s("text", {
+					x: n + 4,
+					y: "4",
+					paintOrder: "stroke",
+					stroke: "white",
+					strokeWidth: "3",
+					children: e.data.label
+				})
+			}, e.id);
+		}) })
+	] });
 }
-export {
-  w as NodesGroup
-};
-//# sourceMappingURL=NodesGroup.js.map
+export { u as NodesGroup };
+
+//# sourceMappingURL=NodesGroup.js.map