@milaboratories/miplots4 1.0.178 → 1.1.0

package/dist/scatterplot/ChartRenderer.js

@@ -1,26 +1,26 @@
 import { Error as e } from "../common/Error.js";
-import "../constants.js";
-import { DEFAULT_DOT_AES as t, PADDINGS as n } from "./constants.js";
-import { isContinuousAes as r } from "../types/common.js";
+import { BLACK as t } from "../constants.js";
+import { DEFAULT_DOT_AES as n, PADDINGS as r } from "./constants.js";
+import { isContinuousAes as i } from "../types/common.js";
 import "../types/index.js";
-import { getContinuousLegendTicks as i } from "../utils/getContinuousLegendTicks.js";
-import { TextMeasurer as a } from "../utils/TextMeasurer/TextMeasurer.js";
-import { getSizeLegendItem as o } from "../utils/getSizeLegendItem.js";
-import { DataFrameProvider as s } from "../common/useDataFrame.js";
-import { arrangeLegendParts as c } from "../utils/arrangeLegendParts.js";
-import { splitTextByWidth as l } from "../utils/splitTextByWidth.js";
+import { getContinuousLegendTicks as a } from "../utils/getContinuousLegendTicks.js";
+import { TextMeasurer as o } from "../utils/TextMeasurer/TextMeasurer.js";
+import { getSizeLegendItem as s } from "../utils/getSizeLegendItem.js";
+import { DataFrameProvider as c } from "../common/useDataFrame.js";
+import { arrangeLegendParts as l } from "../utils/arrangeLegendParts.js";
+import { splitTextByWidth as u } from "../utils/splitTextByWidth.js";
 import "../discrete/utils/index.js";
-import { createMultilineDiscreteLabels as u } from "../utils/createMultilineDiscreteLabels.js";
-import { measureMultilineDiscreteLabels as d } from "../utils/measureMultilineDiscreteLabels.js";
-import { getTicksAndFormat as f } from "./utils/getTicksAndFormat.js";
-import { getContinuousColorScale as p } from "../utils/getContinuousColorScale.js";
-import { isContinuousAxis as m } from "./utils/isNumericScale.js";
-import { ChartsGroup as h } from "./components/ChartsGroup.js";
-import { createAesGetter as g } from "./utils/createAesGetter.js";
-import { scaleLinear as _, scaleLog as v, scaleOrdinal as y, scalePoint as b, scaleSymlog as x } from "d3-scale";
-import { createRoot as S } from "react-dom/client";
-import { Fragment as C, jsx as w } from "react/jsx-runtime";
-function T(e, t) {
+import { createMultilineDiscreteLabels as d } from "../utils/createMultilineDiscreteLabels.js";
+import { measureMultilineDiscreteLabels as f } from "../utils/measureMultilineDiscreteLabels.js";
+import { getTicksAndFormat as p } from "./utils/getTicksAndFormat.js";
+import { getContinuousColorScale as m } from "../utils/getContinuousColorScale.js";
+import { isContinuousAxis as h } from "./utils/isNumericScale.js";
+import { ChartsGroup as g } from "./components/ChartsGroup.js";
+import { createAesGetter as _ } from "./utils/createAesGetter.js";
+import { scaleLinear as v, scaleLog as y, scaleOrdinal as b, scalePoint as x, scaleSymlog as S } from "d3-scale";
+import { createRoot as C } from "react-dom/client";
+import { Fragment as w, jsx as T } from "react/jsx-runtime";
+function E(e, t) {
 	if (e === void 0) return !0;
 	{
 		let n = e.domain(), r = e.range(), i = t.domain(), a = t.range();
@@ -28,11 +28,11 @@ function T(e, t) {
 	}
 	return !1;
 }
-function E(e, t, n, r) {
+function D(e, t, n, r) {
 	let i = [];
 	return e % n === n - 1 && i.push("right"), e % n === 0 && i.push("left"), e < n && i.push("top"), (Math.ceil((e + 1) / n) === r || Math.ceil((e + 1) / n) === r - 1 && e % n > (t - 1) % n) && i.push("bottom"), i;
 }
-function D(e, t, n, r, i, a, o, s, c, l) {
+function O(e, t, n, r, i, a, o, s, c, l) {
 	let u = e.scale === "discrete", d = t.scale === "discrete", f = a.includes("left") || !l?.sharedY, p = a.includes("left") && t.title !== "", m = a.includes("bottom") || !l?.sharedX, h = a.includes("bottom") && e.title !== "", g = t.hiddenLabels ? 0 : d ? n.leftAxisCaptionsWidthByColumns[s] + 12 : n.yAxisCaptionsWidth + 12, _ = (t.showTicks ? 4 : 0) + 6, v = p ? 20 : 0, y = e.hiddenLabels ? 0 : u ? n.bottomAxisCaptionsWidthByRows[o] + 12 : n.xAxisCaptionsWidth + 12, b = e.showTicks ? 4 : 0, x = h ? 20 : 0, S = g + _ + v + 8, C = y + b + x + 8, w = Math.max(...r.map((e) => i[e].length));
 	return {
 		left: f ? S : 12,
@@ -41,35 +41,37 @@ function D(e, t, n, r, i, a, o, s, c, l) {
 		right: c ? 0 : 12
 	};
 }
-function O(e, t, n) {
+function k(e, t, n) {
 	let r = [];
 	for (let i = 0; i < t; i++) r.push(e.slice(i * n, i * n + n));
 	return r;
 }
-function k(e, t) {
+function A(e, t) {
 	let n = Math.floor(e / t);
 	return [n, e - n * t];
 }
-function A(e, n, r, i) {
-	let a = r.find((e) => e.type === "dots"), o = r.find((e) => e.type === "curve");
+function j(e, t, r, i, a) {
+	let o = r.find((e) => e.type === "dots"), s = r.find((e) => e.type === "curve");
 	return {
-		dotShape: g(e, n, a?.aes.dotShape ?? t.shape, "dotShape"),
-		dotColor: g(e, n, a?.aes.dotFill ?? t.color, "dotFill"),
-		dotSize: g(e, n, a?.aes.dotSize ?? t.size, "dotSize"),
-		lineShape: g(e, n, o?.aes.lineShape ?? "solid", "lineShape"),
-		lineColor: g(e, n, o?.aes.lineColor ?? "#110529", "lineColor"),
-		trendColor: g(e, n, i?.color ?? t.color, "fillColor")
+		dotShape: _(e, t, o?.aes.dotShape ?? n.shape, "dotShape"),
+		dotColor: _(e, t, o?.aes.dotFill ?? n.color, "dotFill"),
+		dotSize: _(e, t, o?.aes.dotSize ?? n.size, "dotSize"),
+		lineShape: _(e, t, s?.aes.lineShape ?? "solid", "lineShape"),
+		lineColor: _(e, t, s?.aes.lineColor ?? "#110529", "lineColor"),
+		trendColor: _(e, t, i?.color ?? n.color, "fillColor"),
+		additionalCurveLineColor: (a?.curves ?? []).map((n) => _(e, t, n.lineColor, "lineColor")),
+		additionalCurveTrendColor: (a?.curves ?? []).map((n) => _(e, t, n.trend?.color ?? n.lineColor, "lineColor"))
 	};
 }
-var j = Math.cos(Math.PI / 4), M = 5;
-function N(e, t) {
-	return t.scale === "discrete" ? t.labelsPosition === "90deg" ? e : t.labelsPosition === "45deg" ? e * j + (e > 0 ? 2 * M : 0) : 20 : Math.max(e, 20);
+var M = Math.cos(Math.PI / 4), N = 5;
+function P(e, t) {
+	return t.scale === "discrete" ? t.labelsPosition === "90deg" ? e : t.labelsPosition === "45deg" ? e * M + (e > 0 ? 2 * N : 0) : 20 : Math.max(e, 20);
 }
-var P = class {
+var F = class {
 	reactRoot = null;
 	parentNode = null;
 	rootNode = null;
-	component = /* @__PURE__ */ w(C, {});
+	component = /* @__PURE__ */ T(w, {});
 	margins = {
 		top: 24,
 		bottom: 24,
@@ -88,8 +90,8 @@ var P = class {
 	columnsCount = 1;
 	rowsCount = 1;
 	scales = {
-		x: { null: _().domain([0, 1]).range([0, 600]) },
-		y: { null: _().domain([0, 1]).range([350, 0]) }
+		x: { null: v().domain([0, 1]).range([0, 600]) },
+		y: { null: v().domain([0, 1]).range([350, 0]) }
 	};
 	captionsSizes = {
 		xAxisCaptionsWidth: 30,
@@ -116,15 +118,15 @@ var P = class {
 		});
 	}
 	init(e) {
-		this.parentNode === null && (this.parentNode = e, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = S(this.rootNode));
+		this.parentNode === null && (this.parentNode = e, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = C(this.rootNode));
 	}
 	updateChartSizes(e) {
 		this.chartSizes.chartWidth = e.width, this.chartSizes.chartHeight = e.height;
 	}
 	updateChartDimensions(e, t, n, r) {
-		let { chartWidth: i, chartHeight: a } = this.chartSizes, o = 0, s = 0, c = O(e, this.rowsCount, this.columnsCount);
+		let { chartWidth: i, chartHeight: a } = this.chartSizes, o = 0, s = 0, c = k(e, this.rowsCount, this.columnsCount);
 		this.chartsDimensions = e.reduce((l, u, d) => {
-			let [f, p] = k(d, this.columnsCount), m = E(d, e.length, this.columnsCount, this.rowsCount), h = D(n, r, this.captionsSizes, c[f], this.facetTitles, m, f, p, p === this.columnsCount - 1, t), g = i + h.left + h.right, _ = a + h.top + h.bottom;
+			let [f, p] = A(d, this.columnsCount), m = D(d, e.length, this.columnsCount, this.rowsCount), h = O(n, r, this.captionsSizes, c[f], this.facetTitles, m, f, p, p === this.columnsCount - 1, t), g = i + h.left + h.right, _ = a + h.top + h.bottom;
 			return l[u] = {
 				left: o,
 				top: s,
@@ -143,50 +145,50 @@ var P = class {
 		let l = Math.max(...e.map((e) => this.chartsDimensions[e].outer.width + this.chartsDimensions[e].left)), u = Math.max(...e.map((e) => this.chartsDimensions[e].outer.height + this.chartsDimensions[e].top));
 		this.chartSizes.chartsWidth = l, this.chartSizes.chartsHeight = u;
 	}
-	updateViewport(e, t, r, i, a, o, s, c) {
+	updateViewport(e, t, n, i, a, o, s, c) {
 		let l = e.length, u = Math.min(t.nRows ?? l, l), d = Math.min(t.nCols ?? l, l);
 		this.columnsCount = t.nRows ? Math.ceil(l / u) : d, this.rowsCount = Math.ceil(l / this.columnsCount);
-		let [f, p] = [Infinity, -Infinity], [h, g] = [Infinity, -Infinity], y = e.reduce((e, t) => {
+		let [f, p] = [Infinity, -Infinity], [m, g] = [Infinity, -Infinity], _ = e.reduce((e, t) => {
 			let { minX: n, minY: r, maxX: i, maxY: a } = s[t];
-			return f = Math.min(f, n), h = Math.min(h, r), p = Math.max(p, i), g = Math.max(g, a), e[t] = {
+			return f = Math.min(f, n), m = Math.min(m, r), p = Math.max(p, i), g = Math.max(g, a), e[t] = {
 				minX: n,
 				maxX: i,
 				minY: r,
 				maxY: a
 			}, e;
-		}, {}), x = {}, S = {}, C = !1, w = !1;
+		}, {}), b = {}, S = {}, C = !1, w = !1;
 		e.forEach((e) => {
 			let i;
-			if (!m(r)) i = b().range([0, this.chartSizes.chartWidth]).domain(a.keys ?? []).padding(.5);
+			if (!h(n)) i = x().range([0, this.chartSizes.chartWidth]).domain(a.keys ?? []).padding(.5);
 			else {
-				i = r.scale === "log" ? v() : _();
-				let a = y[e], o = r.lowerValue ? Number(r.lowerValue) : t.sharedX ? f : a.minX, s = r.upperValue ? Number(r.upperValue) : t.sharedX ? p : a.maxX;
-				if (r.symmetricRange !== void 0) {
-					let e = r.symmetricRange;
+				i = n.scale === "log" ? y() : v();
+				let a = _[e], o = n.lowerValue ? Number(n.lowerValue) : t.sharedX ? f : a.minX, s = n.upperValue ? Number(n.upperValue) : t.sharedX ? p : a.maxX;
+				if (n.symmetricRange !== void 0) {
+					let e = n.symmetricRange;
 					if (e >= o && e <= s) {
 						let t = Math.max(e - o, s - e);
 						o = e - t, s = e + t;
 					}
 				}
-				let c = [0, this.chartSizes.chartWidth], l = i.copy().domain([o, s]).range([n.LEFT, this.chartSizes.chartWidth - n.RIGHT]);
+				let c = [0, this.chartSizes.chartWidth], l = i.copy().domain([o, s]).range([r.LEFT, this.chartSizes.chartWidth - r.RIGHT]);
 				i.domain([l.invert(0), l.invert(this.chartSizes.chartWidth)]).range(c).nice();
 			}
 			let o = this.scales.x[e];
-			x[e] = i, C ||= T(o, i);
+			b[e] = i, C ||= E(o, i);
 		});
-		let E = e.reduce((e, t) => (e[t] = (c ? c[t] : []).reduce((e, n) => {
+		let T = e.reduce((e, t) => (e[t] = (c ? c[t] : []).reduce((e, n) => {
 			let r = n.bounded ? n.xBounds : this.scales.x[t].domain(), i = n.getInterval(r[0]), a = n.getInterval(r[1]);
 			return e.minY = Math.min(e.minY, isNaN(i.left) ? e.minY : i.left, isNaN(a.left) ? e.minY : a.left), e.maxY = Math.max(e.maxY, isNaN(i.right) ? e.maxY : i.right, isNaN(a.right) ? e.maxY : a.right), e;
 		}, {
 			minY: Infinity,
 			maxY: -Infinity
-		}), h = Math.min(h, e[t].minY), g = Math.max(g, e[t].maxY), e), {});
+		}), m = Math.min(m, e[t].minY), g = Math.max(g, e[t].maxY), e), {});
 		e.forEach((e) => {
-			let r;
-			if (!m(i)) r = b().range([this.chartSizes.chartHeight, 0]).domain(o.keys ?? []).padding(.5);
+			let n;
+			if (!h(i)) n = x().range([this.chartSizes.chartHeight, 0]).domain(o.keys ?? []).padding(.5);
 			else {
-				r = i.scale === "log" ? v() : _();
-				let a = y[e], o = E[e], s = i.lowerValue ? Number(i.lowerValue) : t.sharedY ? h : Math.min(a.minY, o.minY), c = i.upperValue ? Number(i.upperValue) : t.sharedY ? g : Math.max(a.maxY, o.maxY);
+				n = i.scale === "log" ? y() : v();
+				let a = _[e], o = T[e], s = i.lowerValue ? Number(i.lowerValue) : t.sharedY ? m : Math.min(a.minY, o.minY), c = i.upperValue ? Number(i.upperValue) : t.sharedY ? g : Math.max(a.maxY, o.maxY);
 				if (i.symmetricRange !== void 0) {
 					let e = i.symmetricRange;
 					if (e >= s && e <= c) {
@@ -194,33 +196,33 @@ var P = class {
 						s = e - t, c = e + t;
 					}
 				}
-				let l = [this.chartSizes.chartHeight, 0], u = r.copy().domain([s, c]).range([this.chartSizes.chartHeight - n.BOTTOM, n.TOP]);
-				r.domain([u.invert(this.chartSizes.chartHeight), u.invert(0)]).range(l).nice();
+				let l = [this.chartSizes.chartHeight, 0], u = n.copy().domain([s, c]).range([this.chartSizes.chartHeight - r.BOTTOM, r.TOP]);
+				n.domain([u.invert(this.chartSizes.chartHeight), u.invert(0)]).range(l).nice();
 			}
 			let a = this.scales.y[e];
-			S[e] = r, w ||= T(a, r);
-		}), C && (this.scales.x = x), w && (this.scales.y = S);
+			S[e] = n, w ||= E(a, n);
+		}), C && (this.scales.x = b), w && (this.scales.y = S);
 	}
 	updateCaptionsSize(e, t, n, r) {
-		let i = new a("600 14px Manrope");
-		function o(e) {
+		let i = new o("600 14px Manrope");
+		function a(e) {
 			return Math.max(...e.map((e) => i.getTextWidth(e)));
 		}
-		let s = 0, c = 0, l = [], u = [], p = 0, m = 0;
+		let s = 0, c = 0, l = [], u = [], d = 0, m = 0;
 		if (t.scale === "discrete") {
-			let n = d(e, this.rowsCount, this.columnsCount, t.labelsPosition ?? "center", this.discreteAxesLabels.x, "vertical", this.scales.x);
+			let n = f(e, this.rowsCount, this.columnsCount, t.labelsPosition ?? "center", this.discreteAxesLabels.x, "vertical", this.scales.x);
 			s = n.xTail, l = n.axisCaptionsWidthByRows;
-		} else p = 20;
+		} else d = 20;
 		if (n.scale === "discrete") {
-			let t = d(e, this.rowsCount, this.columnsCount, n.labelsPosition ?? "center", this.discreteAxesLabels.y, "horizontal", this.scales.y);
+			let t = f(e, this.rowsCount, this.columnsCount, n.labelsPosition ?? "center", this.discreteAxesLabels.y, "horizontal", this.scales.y);
 			c = t.yTail, u = t.axisCaptionsWidthByColumns;
 		} else Object.values(this.scales.y).forEach((e) => {
-			let { ticks: t, format: n } = f(e, r);
-			m = Math.max(m, o(t.map(n)));
+			let { ticks: t, format: n } = p(e, r);
+			m = Math.max(m, a(t.map(n)));
 		});
 		this.captionsSizes = {
-			xAxisCaptionsWidth: t.hiddenLabels ? 0 : N(p, t),
-			yAxisCaptionsWidth: n.hiddenLabels ? 0 : N(m, n),
+			xAxisCaptionsWidth: t.hiddenLabels ? 0 : P(d, t),
+			yAxisCaptionsWidth: n.hiddenLabels ? 0 : P(m, n),
 			bottomAxisCaptionsWidthByRows: l,
 			leftAxisCaptionsWidthByColumns: u,
 			bottomCaptionsTail: s,
@@ -229,15 +231,15 @@ var P = class {
 	}
 	createMainTitle(e, t) {
 		let n = this.chartsDimensions[e[0]], r = this.chartsDimensions[e[e.length - 1]];
-		this.mainTitle = l(t.name, this.chartSizes.chartsWidth - n.padding.left - r.padding.right, 20);
+		this.mainTitle = u(t.name, this.chartSizes.chartsWidth - n.padding.left - r.padding.right, 20);
 	}
 	createFacetTitles(e, t) {
-		this.facetTitles = e.reduce((e, n, r) => (t[r].length === 1 && t[r][0] === "null" ? e[n] = [] : e[n] = l(t[r].join(", "), this.chartSizes.chartWidth, 14), e), {});
+		this.facetTitles = e.reduce((e, n, r) => (t[r].length === 1 && t[r][0] === "null" ? e[n] = [] : e[n] = u(t[r].join(", "), this.chartSizes.chartWidth, 14), e), {});
 	}
 	createAxisLabels(e, t, n, r, i) {
 		this.discreteAxesLabels = {
-			x: t.scale === "discrete" ? u(e, t?.labelsPosition ?? "center", r.labels, !1, "vertical", this.scales.x) : {},
-			y: n.scale === "discrete" ? u(e, n.labelsPosition ?? "center", i.labels, !1, "horizontal", this.scales.y) : {}
+			x: t.scale === "discrete" ? d(e, t?.labelsPosition ?? "center", r.labels, !1, "vertical", this.scales.x) : {},
+			y: n.scale === "discrete" ? d(e, n.labelsPosition ?? "center", i.labels, !1, "horizontal", this.scales.y) : {}
 		};
 	}
 	updateMargins(e) {
@@ -249,7 +251,7 @@ var P = class {
 			right: this.legend.width + 24
 		}, this.chartSizes.totalWidth = this.margins.left + this.chartSizes.chartsWidth + this.margins.right, this.chartSizes.totalHeight = this.margins.top + Math.max(this.chartSizes.chartsHeight, this.legend.height) + this.margins.bottom;
 	}
-	updateLegendSize(e, n, a, s) {
+	updateLegendSize(e, r, o, c, u, d) {
 		if (!e.show) {
 			this.legend = {
 				width: 0,
@@ -258,50 +260,88 @@ var P = class {
 			};
 			return;
 		}
-		let l = [], u = {
+		let f = [], p = {
 			width: 0,
 			height: 0,
 			left: 0,
 			top: 0
-		}, d = Math.min(Math.max(this.chartSizes.chartHeight, 250), 400), f = Math.max(this.chartSizes.chartHeight, d);
-		if (a.forEach((e) => {
-			let r = n[e.value];
-			if (r.usedAes.length === 0 || !r.aesMap) return;
-			if (r.values.length > 100) {
-				console.warn(`Too many values for discrete legend (${r.values.length})`);
+		}, h = Math.min(Math.max(this.chartSizes.chartHeight, 250), 400), g = Math.max(this.chartSizes.chartHeight, h);
+		if (o.forEach((e) => {
+			let t = r[e.value];
+			if (t.usedAes.length === 0 || !t.aesMap) return;
+			if (t.values.length > 100) {
+				console.warn(`Too many values for discrete legend (${t.values.length})`);
 				return;
 			}
 			let i = {};
-			r.values.forEach((e) => {
-				i[e] || (i[e] = { ...t }), r.usedAes.forEach((t) => {
-					(t === "dotFill" || t === "lineColor") && (i[e].color = r.aesMap(e, t) ?? "#110529"), t === "dotShape" && (i[e].shape = r.aesMap(e, t) ?? "21"), t === "dotSize" && (i[e].size = r.aesMap(e, t) ?? 3);
+			t.values.forEach((e) => {
+				i[e] || (i[e] = { ...n }), t.usedAes.forEach((n) => {
+					(n === "dotFill" || n === "lineColor") && (i[e].color = t.aesMap(e, n) ?? "#110529"), n === "dotShape" && (i[e].shape = t.aesMap(e, n) ?? "21"), n === "dotSize" && (i[e].size = t.aesMap(e, n) ?? 3);
 				});
 			});
-			let a = e.label ?? e.value, o = y().domain(r.values).range(r.values.map((e) => i[e])).unknown(t);
-			l.push({
-				...u,
+			let a = e.label ?? e.value, o = b().domain(t.values).range(t.values.map((e) => i[e])).unknown(n);
+			f.push({
+				...p,
 				id: e.value,
 				type: "dots",
 				title: a,
 				scale: o,
-				values: r.values,
-				labels: r.labels
+				values: t.values,
+				labels: t.labels
 			});
-		}), s.forEach((e) => {
-			if (e.type === "dots" && r(e.aes.dotFill)) {
-				let { domain: t, range: n, columnName: r, type: a = "linear" } = e.aes.dotFill, o = r.label ?? r.value, s = p(n, t, "linear"), c = (a === "log" ? x() : _()).domain(t).range([d, 0]), f = i(c, t);
-				l.push({
-					...u,
+		}), c.forEach((e) => {
+			if (e.type === "dots" && i(e.aes.dotFill)) {
+				let { domain: t, range: n, columnName: r, type: i = "linear" } = e.aes.dotFill, o = r.label ?? r.value, s = m(n, t, "linear"), c = (i === "log" ? S() : v()).domain(t).range([h, 0]), l = a(c, t);
+				f.push({
+					...p,
 					id: "dotFill",
 					type: "continuous",
 					title: o,
 					scale: s,
 					tickPositionScale: c,
-					values: f
+					values: l
 				});
 			}
-			e.type === "dots" && r(e.aes.dotSize) && l.push(o(e.aes.dotSize));
-		}), !l.length) {
+			e.type === "dots" && i(e.aes.dotSize) && f.push(s(e.aes.dotSize));
+		}), u && u.curves.length > 0) {
+			let e = t, n = [], r = {}, i = {}, a = c.find((e) => e.type === "curve");
+			if (a) {
+				let t = d.label ?? d.value, o = typeof a.aes.lineColor == "string" ? a.aes.lineColor : e;
+				n.push(t), r[t] = t, i[t] = {
+					lineShape: a.aes.lineShape,
+					lineColor: o
+				};
+			}
+			for (let t of u.curves) {
+				let a = t.label, o = 1;
+				for (; n.includes(a);) a = `${t.label} (${++o})`;
+				let s = typeof t.lineColor == "string" ? t.lineColor : e;
+				n.push(a), r[a] = a, i[a] = {
+					lineShape: t.lineShape,
+					lineColor: s
+				};
+			}
+			if (n.length > 0) {
+				let e = b().domain(n).range(n.map((e) => i[e])).unknown({});
+				f.push({
+					...p,
+					id: "additionalCurves",
+					type: "discreteMulti",
+					title: "Curves",
+					scale: e,
+					values: n,
+					labels: r,
+					usedAes: {
+						lineShape: !0,
+						lineColor: !0,
+						dotFill: !1,
+						dotShape: !1,
+						fillColor: !1
+					}
+				});
+			}
+		}
+		if (!f.length) {
 			this.legend = {
 				width: 0,
 				height: 0,
@@ -309,19 +349,19 @@ var P = class {
 			};
 			return;
 		}
-		let m = c(l, f, d);
+		let _ = l(f, g, h);
 		this.legend = {
-			width: m.reduce((e, t) => Math.max(e, t.left + t.width), 0) + 20,
-			height: f,
-			items: m
+			width: _.reduce((e, t) => Math.max(e, t.left + t.width), 0) + 20,
+			height: g,
+			items: _
 		};
 	}
-	render(e, t, n, r, i, a, o, c, l, u, d, f, p, m, g, _, v, y) {
-		let { xAxis: b, yAxis: x, size: S, title: C, legend: T } = n;
-		this.updateChartSizes(S), this.updateViewport(i, r, b, x, _, v, o, c), this.createAxisLabels(i, b, x, _, v), this.updateCaptionsSize(i, b, x, u.y), this.createFacetTitles(i, a), this.updateChartDimensions(i, r, b, x), this.updateLegendSize(T, d, p, m), this.createMainTitle(i, C), this.updateMargins(i);
-		let E = /* @__PURE__ */ w(s, {
+	render(e, t, n, r, i, a, o, s, l, u, d, f, p, m, h, _, v, y, b, x) {
+		let { xAxis: S, yAxis: C, size: w, title: E, legend: D } = n;
+		this.updateChartSizes(w), this.updateViewport(i, r, S, C, _, v, o, s), this.createAxisLabels(i, S, C, _, v), this.updateCaptionsSize(i, S, C, u.y), this.createFacetTitles(i, a), this.updateChartDimensions(i, r, S, C), this.updateLegendSize(D, d, p, m, b, x), this.createMainTitle(i, E), this.updateMargins(i);
+		let O = /* @__PURE__ */ T(c, {
 			dataFrame: e,
-			children: /* @__PURE__ */ w(h, {
+			children: /* @__PURE__ */ T(g, {
 				settingsId: t,
 				chartSettings: n,
 				facetKeys: i,
@@ -330,7 +370,7 @@ var P = class {
 				chartsDimensions: this.chartsDimensions,
 				scales: this.scales,
 				groupedDots: o,
-				trendsData: c,
+				trendsData: s,
 				legendData: this.legend,
 				columnsCount: this.columnsCount,
 				margins: this.margins,
@@ -340,17 +380,17 @@ var P = class {
 				captionsSizes: this.captionsSizes,
 				onlyPositive: u,
 				layersData: f,
-				aesGetters: A(e, d, m, g),
+				aesGetters: j(e, d, m, h, b),
 				onTooltipHintSwitch: y,
 				discreteAxesLabels: this.discreteAxesLabels
 			})
 		});
-		this.component = E, this.reactRoot?.render(E);
+		this.component = O, this.reactRoot?.render(O);
 	}
 	renderError(t) {
-		this.reactRoot?.render(/* @__PURE__ */ w(e, { message: t }));
+		this.reactRoot?.render(/* @__PURE__ */ T(e, { message: t }));
 	}
 };
-export { P as default };
+export { F as default };
 
 //# sourceMappingURL=ChartRenderer.js.map