@milaboratories/miplots4 1.0.176 → 1.0.178

package/dist/histogram/ChartRenderer.js

@@ -1,272 +1,252 @@
-var j = Object.defineProperty;
-var G = (e, t, i) => t in e ? j(e, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : e[t] = i;
-var f = (e, t, i) => G(e, typeof t != "symbol" ? t + "" : t, i);
-import { j as A } from "../_virtual/jsx-runtime.js";
-import { c as Y } from "../_virtual/client.js";
-import { Error as O } from "../common/Error.js";
-import { DataFrameProvider as P } from "../common/useDataFrame.js";
-import { DEFAULT_HEIGHT as w, DEFAULT_WIDTH as N, TITLE_LINE_HEIGHT as U, TITLE_MARGIN as V } from "../constants.js";
-import { splitTextByWidth as R } from "../utils/splitTextByWidth.js";
-import { DEFAULT_COMMON_AES as X, LEGEND_OFFSET as B } from "../scatterplot/constants.js";
-import { getTicksAndFormat as Z } from "../scatterplot/utils/getTicksAndFormat.js";
-import { arrangeLegendParts as k } from "../utils/arrangeLegendParts.js";
-import { getContinuousColorScale as q } from "../utils/getContinuousColorScale.js";
-import { TextMeasurer as J } from "../utils/TextMeasurer/TextMeasurer.js";
-import { ChartsGroup as Q } from "./components/ChartsGroup.js";
-import { MIN_MARGIN as H, TICK_OFFSET as W, DEFAULT_TICKS_SIZE as _, MIN_PADDING as b, FACET_TITLE_OFFSET as $, FACET_TITLE_LINE as y, TITLE_LINE as K } from "./constants.js";
-import I from "../node_modules/.pnpm/d3-scale@4.0.2/node_modules/d3-scale/src/linear.js";
-import F from "../node_modules/.pnpm/d3-scale@4.0.2/node_modules/d3-scale/src/symlog.js";
-import tt from "../node_modules/.pnpm/d3-scale@4.0.2/node_modules/d3-scale/src/ordinal.js";
-function it(e, t, i, o) {
-  const s = [];
-  return e % i === i - 1 && s.push("right"), e % i === 0 && s.push("left"), e < i && s.push("top"), (Math.ceil((e + 1) / i) === o || Math.ceil((e + 1) / i) === o - 1 && e % i > (t - 1) % i) && s.push("bottom"), s;
+import { Error as e } from "../common/Error.js";
+import { DEFAULT_COMMON_AES as t } from "../scatterplot/constants.js";
+import { TextMeasurer as n } from "../utils/TextMeasurer/TextMeasurer.js";
+import { DataFrameProvider as r } from "../common/useDataFrame.js";
+import { arrangeLegendParts as i } from "../utils/arrangeLegendParts.js";
+import { splitTextByWidth as a } from "../utils/splitTextByWidth.js";
+import "../discrete/utils/index.js";
+import { getTicksAndFormat as o } from "../scatterplot/utils/getTicksAndFormat.js";
+import { getContinuousColorScale as s } from "../utils/getContinuousColorScale.js";
+import { ChartsGroup as c } from "./components/ChartsGroup.js";
+import { scaleLinear as l, scaleOrdinal as u, scaleSymlog as d } from "d3-scale";
+import { createRoot as f } from "react-dom/client";
+import { Fragment as p, jsx as m } from "react/jsx-runtime";
+function h(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 st(e, t, i, o, s, n, d, h) {
-  const a = n.includes("left") || !(h != null && h.sharedY), u = n.includes("bottom") || !(h != null && h.sharedX), C = n.includes("bottom") && e.title !== "", r = i.yAxisCaptionsWidth + 2 * W, g = (t.showTicks ? _ : 0) + (t.hiddenLabels ? 0 : W), p = i.xAxisCaptionsWidth + 2 * W, E = (e.showTicks ? _ : 0) + (e.hiddenLabels ? 0 : W), m = C ? K : 0, c = r + g, l = E + p + m, x = Math.max(...o.map((T) => s[T].length));
-  return {
-    left: a ? c : b,
-    top: x === 0 ? 0 : $ * 2 + x * y,
-    bottom: u ? l + 8 : b,
-    right: d ? 0 : b
-  };
+function g(e, t, n, r, i, a, o, s) {
+	let c = a.includes("left") || !s?.sharedY, l = a.includes("bottom") || !s?.sharedX, u = a.includes("bottom") && e.title !== "", d = n.yAxisCaptionsWidth + 12, f = (t.showTicks ? 4 : 0) + (t.hiddenLabels ? 0 : 6), p = n.xAxisCaptionsWidth + 12, m = (e.showTicks ? 4 : 0) + (e.hiddenLabels ? 0 : 6), h = u ? 20 : 0, g = d + f, _ = m + p + h, v = Math.max(...r.map((e) => i[e].length));
+	return {
+		left: c ? g : 12,
+		top: v === 0 ? 0 : 12 + v * 20,
+		bottom: l ? _ + 8 : 12,
+		right: o ? 0 : 12
+	};
 }
-function et(e, t, i) {
-  const o = [];
-  for (let s = 0; s < t; s++)
-    o.push(e.slice(s * i, s * i + i));
-  return o;
+function _(e, t, n) {
+	let r = [];
+	for (let i = 0; i < t; i++) r.push(e.slice(i * n, i * n + n));
+	return r;
 }
-function ot(e, t) {
-  const i = Math.floor(e / t), o = e - i * t;
-  return [i, o];
+function v(e, t) {
+	let n = Math.floor(e / t);
+	return [n, e - n * t];
 }
-function v(e) {
-  return typeof e == "object" && e !== null && "type" in e && "value" in e && e.type === "grouping";
+function y(e) {
+	return typeof e == "object" && !!e && "type" in e && "value" in e && e.type === "grouping";
 }
-function nt(e) {
-  return typeof e == "object" && e !== null && "range" in e;
+function b(e) {
+	return typeof e == "object" && !!e && "range" in e;
 }
-function ht(e, t, i, o) {
-  return function(s, n, d) {
-    var h;
-    if (nt(s)) {
-      const { domain: a = o, range: u, type: C = "linear" } = s, r = q(u, a, C);
-      return r.clamp(!0), r(d);
-    }
-    if (v(s)) {
-      const a = s.value, u = t[a];
-      return (h = (u == null ? void 0 : u[String(e.getColumnValue(a, n))]) ?? X) == null ? void 0 : h[i];
-    }
-    return s;
-  };
+function x(e, n, r, i) {
+	return function(a, o, c) {
+		if (b(a)) {
+			let { domain: e = i, range: t, type: n = "linear" } = a, r = s(t, e, n);
+			return r.clamp(!0), r(c);
+		}
+		if (y(a)) {
+			let i = a.value;
+			return (n[i]?.[String(e.getColumnValue(i, o))] ?? t)?.[r];
+		}
+		return a;
+	};
 }
-class wt {
-  constructor() {
-    f(this, "reactRoot", null);
-    f(this, "parentNode", null);
-    f(this, "rootNode", null);
-    f(this, "component", /* @__PURE__ */ A.jsx(A.Fragment, {}));
-    f(this, "margins", {
-      top: H,
-      bottom: H,
-      left: H,
-      right: H
-    });
-    f(this, "chartsDimensions", {});
-    f(this, "chartSizes", {
-      chartWidth: N,
-      // width of single chart
-      chartHeight: w,
-      // height of single chart
-      chartsWidth: N,
-      // width of all charts in charts row
-      chartsHeight: w,
-      // width of all charts in charts column, without axes
-      totalWidth: N,
-      // width of all charts in charts row, plus left axis, plus legend
-      totalHeight: w
-      // width of all charts in charts height, plus bottom axis, plus top title
-    });
-    f(this, "columnsCount", 1);
-    f(this, "rowsCount", 1);
-    f(this, "scales", {
-      x: { null: I().domain([0, 10]).range([0, N]) },
-      y: { null: I().domain([0, 10]).range([w, 0]) }
-    });
-    f(this, "captionsSizes", {
-      xAxisCaptionsWidth: 30,
-      yAxisCaptionsWidth: 100
-    });
-    f(this, "facetTitles", {});
-    // can be multiline
-    f(this, "mainTitle", []);
-    // can be multiline
-    f(this, "legend", {
-      width: 0,
-      height: 0,
-      items: []
-    });
-  }
-  clear() {
-    var t;
-    this.parentNode && this.rootNode && ((t = this.parentNode) == null || t.removeChild(this.rootNode), this.parentNode = null, this.rootNode = null), setTimeout(() => {
-      var i;
-      (i = this.reactRoot) == null || i.unmount(), this.reactRoot = null;
-    });
-  }
-  init(t) {
-    this.parentNode === null && (this.parentNode = t, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = Y.createRoot(this.rootNode));
-  }
-  updateChartSizes(t) {
-    this.chartSizes.chartWidth = t.width, this.chartSizes.chartHeight = t.height;
-  }
-  updateChartDimensions(t, i, o, s) {
-    const { chartWidth: n, chartHeight: d } = this.chartSizes;
-    let h = 0, a = 0;
-    this.chartsDimensions = t.reduce((r, g, p) => {
-      const [E, m] = ot(p, this.columnsCount), c = it(p, t.length, this.columnsCount, this.rowsCount), l = st(
-        o,
-        s,
-        this.captionsSizes,
-        et(t, this.rowsCount, this.columnsCount)[E],
-        this.facetTitles,
-        c,
-        m === this.columnsCount - 1,
-        i
-      ), x = n + l.left + l.right, T = d + l.top + l.bottom;
-      return r[g] = {
-        left: h,
-        top: a,
-        chartEdgeSides: c,
-        padding: l,
-        inner: { width: n, height: d },
-        outer: { width: x, height: T }
-      }, h += x, m === this.columnsCount - 1 && (h = 0, a += T), r;
-    }, {});
-    const u = Math.max(
-      ...t.map((r) => this.chartsDimensions[r].outer.width + this.chartsDimensions[r].left)
-    ), C = Math.max(
-      ...t.map((r) => this.chartsDimensions[r].outer.height + this.chartsDimensions[r].top)
-    );
-    this.chartSizes.chartsWidth = u, this.chartSizes.chartsHeight = C;
-  }
-  updateViewport(t, i, o, s, n, d, h) {
-    const a = t.length, u = Math.min(i.nRows ?? a, a), C = Math.min(i.nCols ?? a, a);
-    this.columnsCount = i.nRows ? Math.ceil(a / u) : C, this.rowsCount = Math.ceil(a / this.columnsCount);
-    let [r, g] = [1 / 0, -1 / 0], p = -1 / 0;
-    const E = t.reduce((m, c) => {
-      const l = n[c], { minX: x, maxX: T, maxCount: z, maxCountFromGroups: M } = l;
-      return r = Math.min(r, x), g = Math.max(g, T), p = Math.max(p, h === "vertical" ? z : M), m[c] = { minX: x, maxX: T, maxY: h === "vertical" ? z : M }, m;
-    }, {});
-    t.forEach((m) => {
-      const c = o.scale === "log" ? F() : I(), l = E[m], x = i.sharedX ? r : l.minX, T = i.sharedX ? g : l.maxX;
-      c.domain([x, T]).range([0, this.chartSizes.chartWidth]), this.scales.x[m] = c;
-    }), t.forEach((m) => {
-      const c = s.scale === "log" ? F() : I(), l = E[m], x = 0, T = i.sharedY ? p : l.maxY, z = [this.chartSizes.chartHeight, 0], M = c.copy().domain([x, T]).range([
-        this.chartSizes.chartHeight,
-        d.innerOffset
-      ]);
-      c.domain([M.invert(this.chartSizes.chartHeight), M.invert(0)]).range(
-        z
-      ), this.scales.y[m] = c;
-    });
-  }
-  updateCaptionsSize(t, i) {
-    const o = new J("600 14px Arial");
-    let s = 0;
-    function n(d) {
-      return Math.max(...d.map((h) => o.getTextWidth(h)));
-    }
-    i.hiddenLabels || Object.values(this.scales.y).forEach((d) => {
-      const { ticks: h, format: a } = Z(d, !1);
-      s = Math.max(s, n(h.map(a)));
-    }), this.captionsSizes = {
-      xAxisCaptionsWidth: t.hiddenLabels ? 0 : 20,
-      yAxisCaptionsWidth: s
-    };
-  }
-  createMainTitle(t, i) {
-    const o = this.chartsDimensions[t[0]], s = this.chartsDimensions[t[t.length - 1]];
-    this.mainTitle = R(
-      i.name,
-      this.chartSizes.chartsWidth - o.padding.left - s.padding.right,
-      20
-    );
-  }
-  createFacetTitles(t, i) {
-    this.facetTitles = t.reduce((o, s, n) => (i[n].length === 1 && i[n][0] === "null" ? o[s] = [] : o[s] = R(i[n].join(", "), this.chartSizes.chartWidth, 14), o), {});
-  }
-  updateLegendSize(t, i, o, s) {
-    if (!t.show) {
-      this.legend = { width: 0, height: 0, items: [] };
-      return;
-    }
-    const n = [], d = { width: 0, height: 0, left: 0, top: 0 };
-    if (s.forEach((r) => {
-      if (v(r.aes.fillColor) && o) {
-        const g = r.aes.fillColor.value, p = i[o.value], E = o.label ?? o.value, m = tt().domain(p.values).range(p.values.map((c) => {
-          var l;
-          return ((l = p.aesMap[c]) == null ? void 0 : l.fillColor) ?? X.fillColor;
-        }));
-        n.push({ ...d, id: g, type: "discreteColor", title: E, scale: m, values: p.values, labels: p.labels });
-      }
-    }), !n.length) {
-      this.legend = { width: 0, height: 0, items: [] };
-      return;
-    }
-    const h = k(n, this.chartSizes.chartHeight), u = h.reduce((r, g) => Math.max(r, g.left + g.width), 0) + B, C = this.chartSizes.chartHeight;
-    this.legend = {
-      width: u,
-      height: C,
-      items: h
-    };
-  }
-  updateMargins(t) {
-    const i = U * this.mainTitle.length, o = i > 0 ? i + V * 2 : 0, s = t.outerOffset;
-    this.margins = {
-      top: Math.max(o, s),
-      bottom: s,
-      left: s,
-      right: this.legend.width + s
-    }, this.chartSizes.totalWidth = this.margins.left + this.chartSizes.chartsWidth + this.margins.right, this.chartSizes.totalHeight = this.margins.top + this.chartSizes.chartsHeight + this.margins.bottom;
-  }
-  render(t, i, o, s, n, d, h, a, u, C, r, g, p, E) {
-    var D;
-    const { xAxis: m, yAxis: c, size: l, title: x } = o;
-    this.updateChartSizes(l), this.updateViewport(n, s, m, c, h, l, g), this.updateCaptionsSize(m, c), this.createFacetTitles(n, d), this.updateChartDimensions(n, s, m, c), this.createMainTitle(n, x), this.updateLegendSize(o.legend, a, r, u), this.updateMargins(l);
-    const T = n.reduce((L, S) => Math.min(L, h[S].minX), 1 / 0), z = n.reduce((L, S) => Math.max(L, h[S].maxX), -1 / 0), M = /* @__PURE__ */ A.jsx(P, { dataFrame: t, children: /* @__PURE__ */ A.jsx(
-      Q,
-      {
-        settingsId: i,
-        chartSettings: o,
-        facetKeys: n,
-        facetSettings: s,
-        chartSizes: this.chartSizes,
-        chartsDimensions: this.chartsDimensions,
-        scales: this.scales,
-        columnsCount: this.columnsCount,
-        margins: this.margins,
-        mainTitle: this.mainTitle,
-        facetTitles: this.facetTitles,
-        captionsSizes: this.captionsSizes,
-        histogramDataByFacets: h,
-        layers: u,
-        aesColorGetter: ht(t, C, "fillColor", [T, z]),
-        groupingDirection: p,
-        groupingStack: g,
-        groupingLabels: r ? a[r.value].labels : {},
-        legend: this.legend,
-        onTooltipHintSwitch: E
-      }
-    ) });
-    this.component = M, (D = this.reactRoot) == null || D.render(M);
-  }
-  renderError(t) {
-    var i;
-    (i = this.reactRoot) == null || i.render(/* @__PURE__ */ A.jsx(O, { message: t }));
-  }
-}
-export {
-  wt as default
+var S = class {
+	reactRoot = null;
+	parentNode = null;
+	rootNode = null;
+	component = /* @__PURE__ */ m(p, {});
+	margins = {
+		top: 24,
+		bottom: 24,
+		left: 24,
+		right: 24
+	};
+	chartsDimensions = {};
+	chartSizes = {
+		chartWidth: 600,
+		chartHeight: 350,
+		chartsWidth: 600,
+		chartsHeight: 350,
+		totalWidth: 600,
+		totalHeight: 350
+	};
+	columnsCount = 1;
+	rowsCount = 1;
+	scales = {
+		x: { null: l().domain([0, 10]).range([0, 600]) },
+		y: { null: l().domain([0, 10]).range([350, 0]) }
+	};
+	captionsSizes = {
+		xAxisCaptionsWidth: 30,
+		yAxisCaptionsWidth: 100
+	};
+	facetTitles = {};
+	mainTitle = [];
+	legend = {
+		width: 0,
+		height: 0,
+		items: []
+	};
+	clear() {
+		this.parentNode && this.rootNode && (this.parentNode?.removeChild(this.rootNode), this.parentNode = null, this.rootNode = null), setTimeout(() => {
+			this.reactRoot?.unmount(), this.reactRoot = null;
+		});
+	}
+	init(e) {
+		this.parentNode === null && (this.parentNode = e, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = f(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;
+		this.chartsDimensions = e.reduce((c, l, u) => {
+			let [d, f] = v(u, this.columnsCount), p = h(u, e.length, this.columnsCount, this.rowsCount), m = g(n, r, this.captionsSizes, _(e, this.rowsCount, this.columnsCount)[d], this.facetTitles, p, f === this.columnsCount - 1, t), y = i + m.left + m.right, b = a + m.top + m.bottom;
+			return c[l] = {
+				left: o,
+				top: s,
+				chartEdgeSides: p,
+				padding: m,
+				inner: {
+					width: i,
+					height: a
+				},
+				outer: {
+					width: y,
+					height: b
+				}
+			}, o += y, f === this.columnsCount - 1 && (o = 0, s += b), c;
+		}, {});
+		let c = Math.max(...e.map((e) => this.chartsDimensions[e].outer.width + this.chartsDimensions[e].left)), l = Math.max(...e.map((e) => this.chartsDimensions[e].outer.height + this.chartsDimensions[e].top));
+		this.chartSizes.chartsWidth = c, this.chartSizes.chartsHeight = l;
+	}
+	updateViewport(e, t, n, r, i, a, o) {
+		let s = e.length, c = Math.min(t.nRows ?? s, s), u = Math.min(t.nCols ?? s, s);
+		this.columnsCount = t.nRows ? Math.ceil(s / c) : u, this.rowsCount = Math.ceil(s / this.columnsCount);
+		let [f, p] = [Infinity, -Infinity], m = -Infinity, h = e.reduce((e, t) => {
+			let { minX: n, maxX: r, maxCount: a, maxCountFromGroups: s } = i[t];
+			return f = Math.min(f, n), p = Math.max(p, r), m = Math.max(m, o === "vertical" ? a : s), e[t] = {
+				minX: n,
+				maxX: r,
+				maxY: o === "vertical" ? a : s
+			}, e;
+		}, {});
+		e.forEach((e) => {
+			let r = n.scale === "log" ? d() : l(), i = h[e], a = t.sharedX ? f : i.minX, o = t.sharedX ? p : i.maxX;
+			r.domain([a, o]).range([0, this.chartSizes.chartWidth]), this.scales.x[e] = r;
+		}), e.forEach((e) => {
+			let n = r.scale === "log" ? d() : l(), i = h[e], o = t.sharedY ? m : i.maxY, s = [this.chartSizes.chartHeight, 0], c = n.copy().domain([0, o]).range([this.chartSizes.chartHeight, a.innerOffset]);
+			n.domain([c.invert(this.chartSizes.chartHeight), c.invert(0)]).range(s), this.scales.y[e] = n;
+		});
+	}
+	updateCaptionsSize(e, t) {
+		let r = new n("600 14px Arial"), i = 0;
+		function a(e) {
+			return Math.max(...e.map((e) => r.getTextWidth(e)));
+		}
+		t.hiddenLabels || Object.values(this.scales.y).forEach((e) => {
+			let { ticks: t, format: n } = o(e, !1);
+			i = Math.max(i, a(t.map(n)));
+		}), this.captionsSizes = {
+			xAxisCaptionsWidth: e.hiddenLabels ? 0 : 20,
+			yAxisCaptionsWidth: i
+		};
+	}
+	createMainTitle(e, t) {
+		let n = this.chartsDimensions[e[0]], r = this.chartsDimensions[e[e.length - 1]];
+		this.mainTitle = a(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] = a(t[r].join(", "), this.chartSizes.chartWidth, 14), e), {});
+	}
+	updateLegendSize(e, n, r, a) {
+		if (!e.show) {
+			this.legend = {
+				width: 0,
+				height: 0,
+				items: []
+			};
+			return;
+		}
+		let o = [], s = {
+			width: 0,
+			height: 0,
+			left: 0,
+			top: 0
+		};
+		if (a.forEach((e) => {
+			if (y(e.aes.fillColor) && r) {
+				let i = e.aes.fillColor.value, a = n[r.value], c = r.label ?? r.value, l = u().domain(a.values).range(a.values.map((e) => a.aesMap[e]?.fillColor ?? t.fillColor));
+				o.push({
+					...s,
+					id: i,
+					type: "discreteColor",
+					title: c,
+					scale: l,
+					values: a.values,
+					labels: a.labels
+				});
+			}
+		}), !o.length) {
+			this.legend = {
+				width: 0,
+				height: 0,
+				items: []
+			};
+			return;
+		}
+		let c = i(o, this.chartSizes.chartHeight);
+		this.legend = {
+			width: c.reduce((e, t) => Math.max(e, t.left + t.width), 0) + 20,
+			height: this.chartSizes.chartHeight,
+			items: c
+		};
+	}
+	updateMargins(e) {
+		let t = 24 * this.mainTitle.length, n = t > 0 ? t + 48 : 0, r = e.outerOffset;
+		this.margins = {
+			top: Math.max(n, r),
+			bottom: r,
+			left: r,
+			right: this.legend.width + r
+		}, this.chartSizes.totalWidth = this.margins.left + this.chartSizes.chartsWidth + this.margins.right, this.chartSizes.totalHeight = this.margins.top + this.chartSizes.chartsHeight + this.margins.bottom;
+	}
+	render(e, t, n, i, a, o, s, l, u, d, f, p, h, g) {
+		let { xAxis: _, yAxis: v, size: y, title: b } = n;
+		this.updateChartSizes(y), this.updateViewport(a, i, _, v, s, y, p), this.updateCaptionsSize(_, v), this.createFacetTitles(a, o), this.updateChartDimensions(a, i, _, v), this.createMainTitle(a, b), this.updateLegendSize(n.legend, l, f, u), this.updateMargins(y);
+		let S = a.reduce((e, t) => Math.min(e, s[t].minX), Infinity), C = a.reduce((e, t) => Math.max(e, s[t].maxX), -Infinity), w = /* @__PURE__ */ m(r, {
+			dataFrame: e,
+			children: /* @__PURE__ */ m(c, {
+				settingsId: t,
+				chartSettings: n,
+				facetKeys: a,
+				facetSettings: i,
+				chartSizes: this.chartSizes,
+				chartsDimensions: this.chartsDimensions,
+				scales: this.scales,
+				columnsCount: this.columnsCount,
+				margins: this.margins,
+				mainTitle: this.mainTitle,
+				facetTitles: this.facetTitles,
+				captionsSizes: this.captionsSizes,
+				histogramDataByFacets: s,
+				layers: u,
+				aesColorGetter: x(e, d, "fillColor", [S, C]),
+				groupingDirection: h,
+				groupingStack: p,
+				groupingLabels: f ? l[f.value].labels : {},
+				legend: this.legend,
+				onTooltipHintSwitch: g
+			})
+		});
+		this.component = w, this.reactRoot?.render(w);
+	}
+	renderError(t) {
+		this.reactRoot?.render(/* @__PURE__ */ m(e, { message: t }));
+	}
 };
-//# sourceMappingURL=ChartRenderer.js.map
+export { S as default };
+
+//# sourceMappingURL=ChartRenderer.js.map