@milaboratories/miplots4 1.0.129 → 1.0.131

package/dist/discrete/ChartRenderer.js

@@ -1,103 +1,104 @@
 var Y = Object.defineProperty;
-var k = (p, i, t) => i in p ? Y(p, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : p[i] = t;
-var f = (p, i, t) => k(p, typeof i != "symbol" ? i + "" : i, t);
-import { j as N } from "../node_modules/react/jsx-runtime.js";
-import { Error as V } from "../common/Error.js";
-import { DEFAULT_HEIGHT as _, DEFAULT_WIDTH as w, TITLE_LINE_HEIGHT as Z, TITLE_MARGIN as $ } from "../constants.js";
-import { DEFAULT_AES as D, CAPTION_LINE_HEIGHT as F, LEGEND_OFFSET as q, TICK_OFFSET as O, TITLE_LINE as z, MIN_PADDING as H, FACET_TITLE_OFFSET as J, FACET_TITLE_LINE as Q } from "./constants.js";
-import { DEFAULT_COMMON_AES as v, DEFAULT_TICKS_SIZE as B } from "../scatterplot/constants.js";
-import { TextMeasurer as y } from "../utils/TextMeasurer.js";
-import G from "../node_modules/lodash/lodash.js";
-import { createRoot as K } from "../node_modules/react-dom/client.js";
-import { ChartsGroup as tt } from "./components/ChartsGroup.js";
+var k = (x, i, t) => i in x ? Y(x, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : x[i] = t;
+var C = (x, i, t) => k(x, typeof i != "symbol" ? i + "" : i, t);
+import { j as w } from "../node_modules/react/jsx-runtime.js";
+import V from "../node_modules/lodash/lodash.js";
+import { createRoot as Z } from "../node_modules/react-dom/client.js";
+import { Error as $ } from "../common/Error.js";
+import { DataFrameProvider as q } from "../common/useDataFrame.js";
+import { DEFAULT_HEIGHT as P, DEFAULT_WIDTH as I, TITLE_LINE_HEIGHT as J, TITLE_MARGIN as Q } from "../constants.js";
+import { DEFAULT_COMMON_AES as R, DEFAULT_TICKS_SIZE as v } from "../scatterplot/constants.js";
+import { arrangeLegendParts as y } from "../utils/arrangeLegendParts.js";
+import { TextMeasurer as G } from "../utils/TextMeasurer/TextMeasurer.js";
+import { ChartsGroup as K } from "./components/ChartsGroup.js";
+import { DEFAULT_AES as O, CAPTION_LINE_HEIGHT as W, LEGEND_OFFSET as tt, TICK_OFFSET as B, TITLE_LINE as z, MIN_PADDING as H, FACET_TITLE_OFFSET as it, FACET_TITLE_LINE as st } from "./constants.js";
 import { getChartStatsPadding as X } from "./utils/getChartStatsPadding.js";
-import { splitTextByWidth as R } from "./utils/splitTextByWidth.js";
-import { arrangeLegendParts as it } from "../utils/arrangeLegendParts.js";
+import { splitTextByWidth as D } from "./utils/splitTextByWidth.js";
 import S from "../node_modules/d3-scale/src/ordinal.js";
 import j from "../node_modules/d3-scale/src/linear.js";
-import P from "../node_modules/d3-scale/src/band.js";
-import st from "../node_modules/d3-scale/src/log.js";
-function et(p, i, t, s) {
+import _ from "../node_modules/d3-scale/src/band.js";
+import et from "../node_modules/d3-scale/src/log.js";
+function ot(x, i, t, s) {
   const e = [];
-  return p % t === t - 1 && e.push("right"), p % t === 0 && e.push("left"), p < t && e.push("top"), (Math.ceil((p + 1) / t) === s || Math.ceil((p + 1) / t) === s - 1 && p % t > (i - 1) % t) && e.push("bottom"), e;
+  return x % t === t - 1 && e.push("right"), x % t === 0 && e.push("left"), x < t && e.push("top"), (Math.ceil((x + 1) / t) === s || Math.ceil((x + 1) / t) === s - 1 && x % t > (i - 1) % t) && e.push("bottom"), e;
 }
-function ot(p, i, t, s, e, a, c, r, l, u, x) {
-  const T = p === "vertical", m = c.includes("left") || T && !(r != null && r.sharedY) || !T && !(r != null && r.sharedX), C = c.includes("left") && t.title !== "", g = c.includes("bottom") || T && !(r != null && r.sharedX) || !T && !(r != null && r.sharedY), d = c.includes("bottom") && i.title !== "", h = s.yAxisCaptionsWidth, o = (t.showTicks ? B : 0) + (t.hiddenLabels ? 0 : O), n = C ? z : 0, M = s.xAxisCaptionsWidthByRows[T ? l : u], A = (i.showTicks ? B : 0) + (i.hiddenLabels ? 0 : O), L = d ? z : 0, I = T ? h + o + n : M + A + L, W = T ? A + M + L : o + 2 * z, b = Math.max(...e.map((E) => a[E].length));
+function nt(x, i, t, s, e, r, p, o, c, d, u) {
+  const T = x === "vertical", m = p.includes("left") || T && !(o != null && o.sharedY) || !T && !(o != null && o.sharedX), M = p.includes("left") && t.title !== "", f = p.includes("bottom") || T && !(o != null && o.sharedX) || !T && !(o != null && o.sharedY), l = p.includes("bottom") && i.title !== "", h = s.yAxisCaptionsWidth, n = (t.showTicks ? v : 0) + (t.hiddenLabels ? 0 : B), a = M ? z : 0, g = s.xAxisCaptionsWidthByRows[T ? c : d], A = (i.showTicks ? v : 0) + (i.hiddenLabels ? 0 : B), L = l ? z : 0, N = T ? h + n + a : g + A + L, F = T ? A + g + L : n + 2 * z, b = Math.max(...e.map((E) => r[E].length));
   return {
-    left: m ? I : H,
-    top: b === 0 ? 0 : J * 2 + b * Q,
-    bottom: g ? W : H,
-    right: x ? 0 : H
+    left: m ? N : H,
+    top: b === 0 ? 0 : it * 2 + b * st,
+    bottom: f ? F : H,
+    right: u ? 0 : H
   };
 }
-function nt(p, i, t) {
+function at(x, i, t) {
   const s = new Array(t).fill(null).map(() => []);
   for (let e = 0; e < t; e++)
-    for (let a = 0; a < i; a++)
-      a * t + e < p.length && s[e].push(p[a * t + e]);
+    for (let r = 0; r < i; r++)
+      r * t + e < x.length && s[e].push(x[r * t + e]);
   return s;
 }
-function U(p, i, t) {
+function U(x, i, t) {
   const s = [];
   for (let e = 0; e < i; e++)
-    s.push(p.slice(e * t, e * t + t));
+    s.push(x.slice(e * t, e * t + t));
   return s;
 }
-function ht(p, i) {
-  const t = Math.floor(p / i), s = p - t * i;
+function ht(x, i) {
+  const t = Math.floor(x / i), s = x - t * i;
   return [t, s];
 }
-function at(p) {
-  return typeof p == "object" && "type" in p;
+function rt(x) {
+  return typeof x == "object" && "type" in x;
 }
-class wt {
+class Nt {
   constructor() {
-    f(this, "reactRoot", null);
-    f(this, "parentNode", null);
-    f(this, "rootNode", null);
-    f(this, "component", /* @__PURE__ */ N.jsx(N.Fragment, {}));
-    f(this, "chartsDimensions", {});
-    f(this, "chartSizes", {
-      chartWidth: w,
+    C(this, "reactRoot", null);
+    C(this, "parentNode", null);
+    C(this, "rootNode", null);
+    C(this, "component", /* @__PURE__ */ w.jsx(w.Fragment, {}));
+    C(this, "chartsDimensions", {});
+    C(this, "chartSizes", {
+      chartWidth: I,
       // width of single chart
-      chartHeight: _,
+      chartHeight: P,
       // height of single chart
-      chartsWidth: w,
+      chartsWidth: I,
       // width of all charts in charts row
-      chartsHeight: _,
+      chartsHeight: P,
       // width of all charts in charts column, without axes
-      totalWidth: w,
+      totalWidth: I,
       // width of all charts in charts row, plus left axis, plus legend
-      totalHeight: _
+      totalHeight: P
       // width of all charts in charts height, plus bottom axis, plus top title
     });
-    f(this, "columnsCount", 1);
-    f(this, "rowsCount", 1);
-    f(this, "scales", {
+    C(this, "columnsCount", 1);
+    C(this, "rowsCount", 1);
+    C(this, "scales", {
       // Scale from primary grouping categories to every category x coordinate
-      xPrimary: { null: P().range([0, w]).domain(["1"]) },
+      xPrimary: { null: _().range([0, I]).domain(["1"]) },
       // Scale from secondary grouping categories to x shift inside corresponding primary group
-      xSecondary: { null: P().range([0, w]).domain(["1"]) },
+      xSecondary: { null: _().range([0, I]).domain(["1"]) },
       // Scale from y value to y coordinate, by facet
-      y: { null: j().domain([0, 10]).range([_, 0]).nice() },
+      y: { null: j().domain([0, 10]).range([P, 0]).nice() },
       // Scale for link primary grouping category and aesthetics
-      xPrimaryAes: S().unknown(D),
+      xPrimaryAes: S().unknown(O),
       // Scale for link secondary grouping category and aesthetics
-      xSecondaryAes: S().unknown(D)
+      xSecondaryAes: S().unknown(O)
     });
-    f(this, "facetTitles", {});
+    C(this, "facetTitles", {});
     // can be multiline
-    f(this, "mainTitle", []);
+    C(this, "mainTitle", []);
     // can be multiline
-    f(this, "axisLabelsX", {});
+    C(this, "axisLabelsX", {});
     // can be multiline
-    f(this, "captionsSizes", {
+    C(this, "captionsSizes", {
       xAxisCaptionsWidthByRows: [],
       xCaptionsTail: 0,
       yAxisCaptionsWidth: 100
     });
-    f(this, "legend", { width: 0, height: 0, items: [] });
-    f(this, "margins", { left: 0, right: 0, top: 0, bottom: 0 });
+    C(this, "legend", { width: 0, height: 0, items: [] });
+    C(this, "margins", { left: 0, right: 0, top: 0, bottom: 0 });
   }
   clear() {
     var i;
@@ -107,185 +108,185 @@ class wt {
     });
   }
   init(i) {
-    this.parentNode === null && (this.parentNode = i, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = K(this.rootNode));
+    this.parentNode === null && (this.parentNode = i, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = Z(this.rootNode));
   }
-  updateChartSize(i, t, s, e, a, c) {
-    const r = i.innerOffset, l = i.innerOffset, u = X(c, e, i.innerOffset), x = t.length, T = Math.min((s == null ? void 0 : s.nRows) ?? x, x), m = Math.min((s == null ? void 0 : s.nCols) ?? x, x);
-    this.columnsCount = s != null && s.nRows ? Math.ceil(x / T) : m, this.rowsCount = Math.ceil(x / this.columnsCount);
-    let { width: C, height: g } = i;
-    a === "vertical" && u > r && (g += u), a === "horizontal" && u > l && (C += u), this.chartSizes.chartWidth = C, this.chartSizes.chartHeight = g;
+  updateChartSize(i, t, s, e, r, p) {
+    const o = i.innerOffset, c = i.innerOffset, d = X(p, e, i.innerOffset), u = t.length, T = Math.min((s == null ? void 0 : s.nRows) ?? u, u), m = Math.min((s == null ? void 0 : s.nCols) ?? u, u);
+    this.columnsCount = s != null && s.nRows ? Math.ceil(u / T) : m, this.rowsCount = Math.ceil(u / this.columnsCount);
+    let { width: M, height: f } = i;
+    r === "vertical" && d > o && (f += d), r === "horizontal" && d > c && (M += d), this.chartSizes.chartWidth = M, this.chartSizes.chartHeight = f;
   }
-  updateChartDimensions(i, t, s, e, a) {
-    const { chartWidth: c, chartHeight: r } = this.chartSizes;
-    let l = 0, u = 0;
-    this.chartsDimensions = i.reduce((m, C, g) => {
-      const [d, h] = ht(g, this.columnsCount), o = et(g, i.length, this.columnsCount, this.rowsCount), n = ot(
+  updateChartDimensions(i, t, s, e, r) {
+    const { chartWidth: p, chartHeight: o } = this.chartSizes;
+    let c = 0, d = 0;
+    this.chartsDimensions = i.reduce((m, M, f) => {
+      const [l, h] = ht(f, this.columnsCount), n = ot(f, i.length, this.columnsCount, this.rowsCount), a = nt(
         s,
         e,
-        a,
+        r,
         this.captionsSizes,
-        U(i, this.rowsCount, this.columnsCount)[d],
+        U(i, this.rowsCount, this.columnsCount)[l],
         this.facetTitles,
-        o,
+        n,
         t,
-        d,
+        l,
         h,
         h === this.columnsCount - 1
-      ), M = c + n.left + n.right, A = r + n.top + n.bottom;
-      return m[C] = {
-        left: l,
-        top: u,
-        chartEdgeSides: o,
-        padding: n,
-        inner: { width: c, height: r },
-        outer: { width: M, height: A }
-      }, l += M, h === this.columnsCount - 1 && (l = 0, u += A), m;
+      ), g = p + a.left + a.right, A = o + a.top + a.bottom;
+      return m[M] = {
+        left: c,
+        top: d,
+        chartEdgeSides: n,
+        padding: a,
+        inner: { width: p, height: o },
+        outer: { width: g, height: A }
+      }, c += g, h === this.columnsCount - 1 && (c = 0, d += A), m;
     }, {});
-    const x = Math.max(
+    const u = Math.max(
       ...i.map((m) => this.chartsDimensions[m].outer.width + this.chartsDimensions[m].left)
     ), T = Math.max(
       ...i.map((m) => this.chartsDimensions[m].outer.height + this.chartsDimensions[m].top)
     );
-    this.chartSizes.chartsWidth = x, this.chartSizes.chartsHeight = T;
+    this.chartSizes.chartsWidth = u, this.chartSizes.chartsHeight = T;
   }
-  updateViewport(i, t, s, e, a, c, r, l, u, x) {
-    const T = u.innerOffset, m = i === "vertical", C = X(l, t, u.innerOffset), g = a === null || a.sharedX, d = a === null || a.sharedY, { chartHeight: h, chartWidth: o } = this.chartSizes;
-    e.forEach((n) => {
-      const M = c.scale === "log" ? st() : j(), A = Math.min(...d ? r.map(({ meta: b }) => b.minY) : r.map(({ geoms: b }) => Math.min(...b[n].map(({ boundsY: E }) => E.min)))), L = Math.max(...d ? r.map(({ meta: b }) => b.maxY) : r.map(({ geoms: b }) => Math.max(...b[n].map(({ boundsY: E }) => E.max)))), I = M.copy().domain([A, L]).range(
-        m ? [h - T, C] : [T, o - C]
+  updateViewport(i, t, s, e, r, p, o, c, d, u) {
+    const T = d.innerOffset, m = i === "vertical", M = X(c, t, d.innerOffset), f = r === null || r.sharedX, l = r === null || r.sharedY, { chartHeight: h, chartWidth: n } = this.chartSizes;
+    e.forEach((a) => {
+      const g = p.scale === "log" ? et() : j(), A = Math.min(...l ? o.map(({ meta: b }) => b.minY) : o.map(({ geoms: b }) => Math.min(...b[a].map(({ boundsY: E }) => E.min)))), L = Math.max(...l ? o.map(({ meta: b }) => b.maxY) : o.map(({ geoms: b }) => Math.max(...b[a].map(({ boundsY: E }) => E.max)))), N = g.copy().domain([A, L]).range(
+        m ? [h - T, M] : [T, n - M]
       );
-      M.domain([I.invert(m ? h : 0), I.invert(m ? 0 : o)]).range(m ? [h, 0] : [0, o]), this.scales.y[n] = M;
-      const W = g ? t : x[n];
-      this.scales.xPrimary[n] = P().domain(W).range(m ? [0, o] : [h, 0]), this.scales.xSecondary[n] = P().domain(s).range([0, this.scales.xPrimary[n].bandwidth()]);
+      g.domain([N.invert(m ? h : 0), N.invert(m ? 0 : n)]).range(m ? [h, 0] : [0, n]), this.scales.y[a] = g;
+      const F = f ? t : u[a];
+      this.scales.xPrimary[a] = _().domain(F).range(m ? [0, n] : [h, 0]), this.scales.xSecondary[a] = _().domain(s).range([0, this.scales.xPrimary[a].bandwidth()]);
     });
   }
   createFacetTitles(i, t) {
-    this.facetTitles = i.reduce((s, e, a) => (t[a].length === 1 && t[a][0] === "null" ? s[e] = [] : s[e] = R(t[a].join(", "), this.chartSizes.chartWidth, 14), s), {});
+    this.facetTitles = i.reduce((s, e, r) => (t[r].length === 1 && t[r][0] === "null" ? s[e] = [] : s[e] = D(t[r].join(", "), this.chartSizes.chartWidth, 14), s), {});
   }
   createMainTitle(i, t) {
     const s = this.chartsDimensions[i[0]], e = this.chartsDimensions[i[i.length - 1]];
-    this.mainTitle = R(
+    this.mainTitle = D(
       t.name,
       this.chartSizes.chartsWidth - s.padding.left - e.padding.right,
       20
     );
   }
   createAxisLabels(i, t, s, e) {
-    const a = {
+    const r = {
       center: 120,
       "45deg": 256,
       "90deg": 320
-    }, c = e === "vertical";
-    function r(l, u) {
-      return l === "center" ? 1 / 0 : Math.floor(l === "45deg" ? u * Math.sin(Math.PI / 4) / F : u / F);
+    }, p = e === "vertical";
+    function o(c, d) {
+      return c === "center" ? 1 / 0 : Math.floor(c === "45deg" ? d * Math.sin(Math.PI / 4) / W : d / W);
     }
-    this.axisLabelsX = i.reduce((l, u) => {
-      const x = this.scales.xPrimary[u], T = x.bandwidth(), m = a[t.labelsPosition], C = t.labelsPosition === "center" ? Math.min(m, T) : m, g = s.valueLabels;
-      return l[u] = x.domain().reduce((d, h) => {
+    this.axisLabelsX = i.reduce((c, d) => {
+      const u = this.scales.xPrimary[d], T = u.bandwidth(), m = r[t.labelsPosition], M = t.labelsPosition === "center" ? Math.min(m, T) : m, f = s.valueLabels;
+      return c[d] = u.domain().reduce((l, h) => {
         if (t.hiddenLabels)
-          return d[h] = [], d;
-        const o = g[h];
-        if (!c)
-          d[h] = [o];
+          return l[h] = [], l;
+        const n = f[h];
+        if (!p)
+          l[h] = [n];
         else {
-          const n = r(t.labelsPosition, T), M = R(o, C, 14);
-          d[h] = M.length > n ? [o] : M;
+          const a = o(t.labelsPosition, T), g = D(n, M, 14);
+          l[h] = g.length > a ? [n] : g;
         }
-        return d;
-      }, {}), l;
+        return l;
+      }, {}), c;
     }, {});
   }
   updateAesScales(i, t) {
     if (i.inheritedAes) {
       const { inheritedAes: s, keys: e } = i;
-      this.scales.xPrimaryAes.domain(e).range(e.map((a) => s[a] ?? v));
+      this.scales.xPrimaryAes.domain(e).range(e.map((r) => s[r] ?? R));
     } else
       this.scales.xPrimaryAes.domain([]).range([]);
     if (t.inheritedAes) {
       const { inheritedAes: s, keys: e } = t;
-      this.scales.xSecondaryAes.domain(e).range(e.map((a) => s[a] ?? v));
+      this.scales.xSecondaryAes.domain(e).range(e.map((r) => s[r] ?? R));
     } else
       this.scales.xSecondaryAes.domain([]).range([]);
   }
   updateCaptionsSize(i, t, s, e) {
-    const c = new y("600 14px Manrope"), r = i === "vertical";
-    function l(h) {
-      return h.length ? Math.max(...h.map((o) => c.getTextWidth(o))) : 0;
+    const p = new G("600 14px Manrope"), o = i === "vertical";
+    function c(h) {
+      return h.length ? Math.max(...h.map((n) => p.getTextWidth(n))) : 0;
     }
-    function u(h) {
-      return h.length ? Math.max(...h.map(l)) : 0;
+    function d(h) {
+      return h.length ? Math.max(...h.map(c)) : 0;
     }
-    let x = [], T = 0;
-    const m = U(t, this.rowsCount, this.columnsCount), C = nt(t, this.rowsCount, this.columnsCount);
-    if (!r)
-      x = C.map(
+    let u = [], T = 0;
+    const m = U(t, this.rowsCount, this.columnsCount), M = at(t, this.rowsCount, this.columnsCount);
+    if (!o)
+      u = M.map(
         (h) => Math.max(
           ...h.map(
-            (o) => u(
-              this.scales.xPrimary[o].domain().map((n) => this.axisLabelsX[o][n])
+            (n) => d(
+              this.scales.xPrimary[n].domain().map((a) => this.axisLabelsX[n][a])
             )
           )
         )
       );
     else {
-      if (s.labelsPosition === "center" && (x = m.map(
+      if (s.labelsPosition === "center" && (u = m.map(
         (h) => Math.max(
           ...h.map(
-            (o) => Math.max(
-              ...this.scales.xPrimary[o].domain().map(
-                (n) => n ? this.axisLabelsX[o][n].length * F : 0
+            (n) => Math.max(
+              ...this.scales.xPrimary[n].domain().map(
+                (a) => a ? this.axisLabelsX[n][a].length * W : 0
               )
             )
           )
         )
       )), s.labelsPosition === "45deg") {
         const h = Math.sin(Math.PI / 4);
-        x = m.map((o) => Math.max(
-          ...o.map((n) => {
-            const M = this.scales.xPrimary[n].domain().map((L) => this.axisLabelsX[n][L]), A = u(M);
+        u = m.map((n) => Math.max(
+          ...n.map((a) => {
+            const g = this.scales.xPrimary[a].domain().map((L) => this.axisLabelsX[a][L]), A = d(g);
             return A > 0 ? A * h + 14 : 0;
           })
         )), T = Math.max(
-          ...C[0].map((o) => {
-            const n = this.scales.xPrimary[o].domain(), M = this.axisLabelsX[o][n[0]];
+          ...M[0].map((n) => {
+            const a = this.scales.xPrimary[n].domain(), g = this.axisLabelsX[n][a[0]];
             return Math.max(
-              l(M) * h - this.scales.xPrimary[o].bandwidth() / 2 + 14,
+              c(g) * h - this.scales.xPrimary[n].bandwidth() / 2 + 14,
               0
             );
           })
         );
       }
-      s.labelsPosition === "90deg" && (x = m.map(
+      s.labelsPosition === "90deg" && (u = m.map(
         (h) => Math.max(
           ...h.map(
-            (o) => u(
-              this.scales.xPrimary[o].domain().map((n) => this.axisLabelsX[o][n])
+            (n) => d(
+              this.scales.xPrimary[n].domain().map((a) => this.axisLabelsX[n][a])
             )
           )
         )
       ));
     }
-    const g = G.flatten(
+    const f = V.flatten(
       t.map((h) => {
         if (e.hiddenLabels)
           return [];
-        const o = this.scales.y[h], n = o.ticks(), M = n.some((L) => Math.abs(L) < 1e-4 && L !== 0 || L > 1e4) ? ",e" : ",f", A = o.tickFormat(10, M);
-        return n.map(A);
+        const n = this.scales.y[h], a = n.ticks(), g = a.some((L) => Math.abs(L) < 1e-4 && L !== 0 || L > 1e4) ? ",e" : ",f", A = n.tickFormat(10, g);
+        return a.map(A);
       })
-    ), d = l(g);
+    ), l = c(f);
     this.captionsSizes = {
       xCaptionsTail: T,
-      xAxisCaptionsWidthByRows: x,
-      yAxisCaptionsWidth: d
+      xAxisCaptionsWidthByRows: u,
+      yAxisCaptionsWidth: l
     };
   }
   updateMargins(i, t, s) {
-    const e = this.chartsDimensions[t[0]], a = this.chartsDimensions[t[t.length - 1]], c = i === "vertical", r = this.mainTitle.length ? Z * this.mainTitle.length + $ * 2 : 0, l = s.outerOffset;
+    const e = this.chartsDimensions[t[0]], r = this.chartsDimensions[t[t.length - 1]], p = i === "vertical", o = this.mainTitle.length ? J * this.mainTitle.length + Q * 2 : 0, c = s.outerOffset;
     this.margins = {
-      left: Math.max(l, c ? this.captionsSizes.xCaptionsTail - e.padding.left : 0),
-      right: this.legend.width + l,
-      top: Math.max(r, l),
-      bottom: Math.max(l, c ? 0 : this.captionsSizes.xCaptionsTail - a.padding.bottom)
+      left: Math.max(c, p ? this.captionsSizes.xCaptionsTail - e.padding.left : 0),
+      right: this.legend.width + c,
+      top: Math.max(o, c),
+      bottom: Math.max(c, p ? 0 : this.captionsSizes.xCaptionsTail - r.padding.bottom)
     }, 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(i, t, s, e) {
@@ -293,33 +294,33 @@ class wt {
       this.legend = { width: 0, height: 0, items: [] };
       return;
     }
-    const a = this.chartSizes.chartHeight, c = { width: 0, height: 0, left: 0, top: 0 }, r = [];
-    function l(d, h) {
-      return e.some((o) => {
-        const n = o.aes[h];
-        return n && at(n) && n.type === d;
+    const r = this.chartSizes.chartHeight, p = { width: 0, height: 0, left: 0, top: 0 }, o = [];
+    function c(l, h) {
+      return e.some((n) => {
+        const a = n.aes[h];
+        return a && rt(a) && a.type === l;
       });
     }
-    function u(d) {
+    function d(l) {
       return {
-        dotFill: l(d, "dotFill"),
-        fillColor: l(d, "fillColor"),
-        lineColor: l(d, "lineColor"),
-        dotShape: l(d, "dotShape"),
-        lineShape: l(d, "lineShape")
+        dotFill: c(l, "dotFill"),
+        fillColor: c(l, "fillColor"),
+        lineColor: c(l, "lineColor"),
+        dotShape: c(l, "dotShape"),
+        lineShape: c(l, "lineShape")
       };
     }
-    const x = u("primaryGrouping"), T = u("secondaryGrouping");
-    if (Object.values(x).some((d) => d) && t.inheritedAes && r.push({
+    const u = d("primaryGrouping"), T = d("secondaryGrouping");
+    if (Object.values(u).some((l) => l) && t.inheritedAes && o.push({
       type: "discreteMulti",
       id: "primary",
       title: t.label,
       scale: this.scales.xPrimaryAes,
       values: t.keys,
       labels: t.valueLabels,
-      usedAes: x,
-      ...c
-    }), Object.values(T).some((d) => d) && s.inheritedAes && r.push({
+      usedAes: u,
+      ...p
+    }), Object.values(T).some((l) => l) && s.inheritedAes && o.push({
       type: "discreteMulti",
       id: "secondary",
       title: s.label,
@@ -327,65 +328,65 @@ class wt {
       values: s.keys,
       labels: s.valueLabels,
       usedAes: T,
-      ...c
-    }), !r.length) {
+      ...p
+    }), !o.length) {
       this.legend = { width: 0, height: 0, items: [] };
       return;
     }
-    const m = it(r, this.chartSizes.chartHeight), C = m[m.length - 1], g = C.left + C.width + q;
+    const m = y(o, this.chartSizes.chartHeight), M = m[m.length - 1], f = M.left + M.width + tt;
     this.legend = {
-      width: g,
-      height: a,
+      width: f,
+      height: r,
       items: m
     };
   }
-  render(i, t, s, e, a, c, r, l, u, x, T, m, C) {
-    var M;
-    const { orientation: g, xAxis: d, yAxis: h, size: o } = t;
-    this.updateChartSize(o, c, a, s.keys, g, u), this.updateViewport(
-      g,
-      s.keys,
-      e.keys,
-      c,
-      a,
-      h,
+  render(i, t, s, e, r, p, o, c, d, u, T, m, M, f) {
+    var A;
+    const { orientation: l, xAxis: h, yAxis: n, size: a } = s;
+    this.updateChartSize(a, o, p, e.keys, l, u), this.updateViewport(
       l,
-      u,
+      e.keys,
+      r.keys,
       o,
-      T
-    ), this.createAxisLabels(c, d, s, g), this.createFacetTitles(c, r), this.updateCaptionsSize(g, c, d, h), this.updateChartDimensions(c, a, g, d, h), this.updateLegendSize(t.legend, s, e, l), this.createMainTitle(c, t.title), this.updateMargins(g, c, o), this.updateAesScales(s, e);
-    const n = /* @__PURE__ */ N.jsx(
-      tt,
+      p,
+      n,
+      d,
+      u,
+      a,
+      m
+    ), this.createAxisLabels(o, h, e, l), this.createFacetTitles(o, c), this.updateCaptionsSize(l, o, h, n), this.updateChartDimensions(o, p, l, h, n), this.updateLegendSize(s.legend, e, r, d), this.createMainTitle(o, s.title), this.updateMargins(l, o, a), this.updateAesScales(e, r);
+    const g = /* @__PURE__ */ w.jsx(q, { dataFrame: i, children: /* @__PURE__ */ w.jsx(
+      K,
       {
-        settingsId: i,
-        chartSettings: t,
-        facetKeys: c,
-        facetSettings: a,
+        settingsId: t,
+        chartSettings: s,
+        facetKeys: o,
+        facetSettings: p,
         facetTitles: this.facetTitles,
         chartSizes: this.chartSizes,
         chartsDimensions: this.chartsDimensions,
         scales: this.scales,
-        layersData: l,
+        layersData: d,
         statsData: u,
         legendData: this.legend,
         margins: this.margins,
         columnsCount: this.columnsCount,
-        keyColumn: x,
+        keyColumn: T,
         xLabels: this.axisLabelsX,
         chartTitle: this.mainTitle,
-        onlyPositive: m,
-        secondaryGrouping: e,
-        onTooltipHintSwitch: C
+        onlyPositive: M,
+        secondaryGrouping: r,
+        onTooltipHintSwitch: f
       }
-    );
-    this.component = n, (M = this.reactRoot) == null || M.render(n);
+    ) });
+    this.component = g, (A = this.reactRoot) == null || A.render(g);
   }
   renderError(i) {
     var t;
-    (t = this.reactRoot) == null || t.render(/* @__PURE__ */ N.jsx(V, { message: i }));
+    (t = this.reactRoot) == null || t.render(/* @__PURE__ */ w.jsx($, { message: i }));
   }
 }
 export {
-  wt as default
+  Nt as default
 };
 //# sourceMappingURL=ChartRenderer.js.map