@milaboratories/miplots4 1.0.128 → 1.0.130

package/dist/scatterplot/ChartRenderer.js

@@ -1,98 +1,99 @@
-var P = Object.defineProperty;
-var V = (l, i, t) => i in l ? P(l, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : l[i] = t;
-var C = (l, i, t) => V(l, typeof i != "symbol" ? i + "" : i, t);
-import { j as W } from "../node_modules/react/jsx-runtime.js";
-import { Error as q } from "../common/Error.js";
-import { DEFAULT_HEIGHT as _, DEFAULT_WIDTH as R, TITLE_LINE_HEIGHT as Q, MAX_SHOWN_UNIQUE_VALUES_IN_LABELS as Z, BLACK as U, TITLE_MARGIN as $ } from "../constants.js";
-import { FACET_TITLE_LINE as J } from "../discrete/constants.js";
-import { splitTextByWidth as L } from "../discrete/utils/splitTextByWidth.js";
-import { MIN_MARGIN as A, PADDINGS as D, DEFAULT_DOT_AES as F, LEGEND_OFFSET as k, TICK_OFFSET as v, DEFAULT_TICKS_SIZE as X, MIN_PADDING as I, FACET_TITLE_OFFSET as K, FACET_AXIS_OFFSET as G, TITLE_LINE as B } from "./constants.js";
-import { createAesGetter as Y } from "./utils/createAesGetter.js";
-import { getTicksAndFormat as y } from "./utils/getTicksAndFormat.js";
-import { isContinuousAes as O } from "../types/common.js";
+var $ = Object.defineProperty;
+var J = (r, t, i) => t in r ? $(r, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : r[t] = i;
+var C = (r, t, i) => J(r, typeof t != "symbol" ? t + "" : t, i);
+import { j as F } from "../node_modules/react/jsx-runtime.js";
+import { createRoot as k } from "../node_modules/react-dom/client.js";
+import { Error as K } from "../common/Error.js";
+import { DataFrameProvider as y } from "../common/useDataFrame.js";
+import { DEFAULT_HEIGHT as X, DEFAULT_WIDTH as G, TITLE_LINE_HEIGHT as tt, MAX_SHOWN_UNIQUE_VALUES_IN_LABELS as it, BLACK as Z, TITLE_MARGIN as et } from "../constants.js";
+import { FACET_TITLE_LINE as st } from "../discrete/constants.js";
+import { splitTextByWidth as U } from "../discrete/utils/splitTextByWidth.js";
+import { isContinuousAes as j } from "../types/common.js";
 import "../types/discrete.js";
 import "../types/scatterplot.js";
 import "../types/heatmap.js";
 import "../types/dendro.js";
 import "../types/histogram.js";
 import "../types/bubble.js";
-import { getContinuousColorScale as tt } from "../utils/getContinuousColorScale.js";
-import { getContinuousLegendTicks as it } from "../utils/getContinuousLegendTicks.js";
-import { TextMeasurer as et } from "../utils/TextMeasurer.js";
-import { createRoot as st } from "../node_modules/react-dom/client.js";
-import { ChartsGroup as ot } from "./components/ChartsGroup.js";
-import { arrangeLegendParts as nt } from "../utils/arrangeLegendParts.js";
-import H from "../node_modules/d3-scale/src/linear.js";
-import j from "../node_modules/d3-scale/src/log.js";
-import ht from "../node_modules/d3-scale/src/ordinal.js";
-import at from "../node_modules/d3-scale/src/symlog.js";
-import { sqrt as rt } from "../node_modules/d3-scale/src/pow.js";
-function lt(l, i, t, e) {
-  const s = [];
-  return l % t === t - 1 && s.push("right"), l % t === 0 && s.push("left"), l < t && s.push("top"), (Math.ceil((l + 1) / t) === e || Math.ceil((l + 1) / t) === e - 1 && l % t > (i - 1) % t) && s.push("bottom"), s;
+import { arrangeLegendParts as ot } from "../utils/arrangeLegendParts.js";
+import { getContinuousColorScale as nt } from "../utils/getContinuousColorScale.js";
+import { getContinuousLegendTicks as at } from "../utils/getContinuousLegendTicks.js";
+import { TextMeasurer as ht } from "../utils/TextMeasurer/TextMeasurer.js";
+import { ChartsGroup as rt } from "./components/ChartsGroup.js";
+import { MIN_MARGIN as v, PADDINGS as B, DEFAULT_DOT_AES as D, LEGEND_OFFSET as lt, TICK_OFFSET as O, DEFAULT_TICKS_SIZE as P, MIN_PADDING as b, FACET_TITLE_OFFSET as ct, FACET_AXIS_OFFSET as V, TITLE_LINE as q } from "./constants.js";
+import { createAesGetter as _ } from "./utils/createAesGetter.js";
+import { getTicksAndFormat as mt } from "./utils/getTicksAndFormat.js";
+import L from "../node_modules/d3-scale/src/linear.js";
+import Q from "../node_modules/d3-scale/src/log.js";
+import dt from "../node_modules/d3-scale/src/ordinal.js";
+import pt from "../node_modules/d3-scale/src/symlog.js";
+import { sqrt as ut } from "../node_modules/d3-scale/src/pow.js";
+function gt(r, t, i, s) {
+  const e = [];
+  return r % i === i - 1 && e.push("right"), r % i === 0 && e.push("left"), r < i && e.push("top"), (Math.ceil((r + 1) / i) === s || Math.ceil((r + 1) / i) === s - 1 && r % i > (t - 1) % i) && e.push("bottom"), e;
 }
-function ct(l, i, t, e, s, r, u) {
-  const g = r.includes("left") || !(u != null && u.sharedY), M = r.includes("left") && i.title !== "", N = r.includes("bottom") || !(u != null && u.sharedX), z = r.includes("bottom") && l.title !== "", c = t.yAxisCaptionsWidth + 2 * v, a = (i.showTicks ? X : 0) + v, d = M ? B + I : 0, T = t.xAxisCaptionsWidth + 2 * v, E = l.showTicks ? X : 0, n = z ? B + I : 0, o = c + a + d + G, p = T + E + n + G, h = Math.max(...e.map((m) => s[m].length));
+function ft(r, t, i, s, e, o, c) {
+  const g = o.includes("left") || !(c != null && c.sharedY), N = o.includes("left") && t.title !== "", W = o.includes("bottom") || !(c != null && c.sharedX), w = o.includes("bottom") && r.title !== "", a = i.yAxisCaptionsWidth + 2 * O, n = (t.showTicks ? P : 0) + O, d = N ? q + b : 0, S = i.xAxisCaptionsWidth + 2 * O, E = r.showTicks ? P : 0, m = w ? q + b : 0, l = a + n + d + V, f = S + E + m + V, z = Math.max(...s.map((p) => e[p].length));
   return {
-    left: g ? o : I,
-    top: h === 0 ? 0 : K * 2 + h * J,
-    bottom: N ? p + 8 : I,
-    right: I
+    left: g ? l : b,
+    top: z === 0 ? 0 : ct * 2 + z * st,
+    bottom: W ? f + 8 : b,
+    right: b
   };
 }
-function mt(l, i, t) {
-  const e = [];
-  for (let s = 0; s < i; s++)
-    e.push(l.slice(s * t, s * t + t));
-  return e;
+function Tt(r, t, i) {
+  const s = [];
+  for (let e = 0; e < t; e++)
+    s.push(r.slice(e * i, e * i + i));
+  return s;
 }
-function dt(l, i) {
-  const t = Math.floor(l / i), e = l - t * i;
-  return [t, e];
+function St(r, t) {
+  const i = Math.floor(r / t), s = r - i * t;
+  return [i, s];
 }
-function pt(l, i, t) {
-  const e = i.find((r) => r.type === "dots"), s = i.find((r) => r.type === "curve");
+function xt(r, t, i, s) {
+  const e = i.find((c) => c.type === "dots"), o = i.find((c) => c.type === "curve");
   return {
-    dotShape: Y(l, (e == null ? void 0 : e.aes.dotShape) ?? F.shape, "dotShape"),
-    dotColor: Y(l, (e == null ? void 0 : e.aes.dotFill) ?? F.color, "dotFill"),
-    dotSize: Y(l, (e == null ? void 0 : e.aes.dotSize) ?? F.size, "dotSize"),
-    lineShape: Y(l, (s == null ? void 0 : s.aes.lineShape) ?? "solid", "lineShape"),
-    lineColor: Y(l, (s == null ? void 0 : s.aes.lineColor) ?? U, "lineColor"),
-    trendColor: Y(l, (t == null ? void 0 : t.color) ?? F.color, "fillColor")
+    dotShape: _(r, t, (e == null ? void 0 : e.aes.dotShape) ?? D.shape, "dotShape"),
+    dotColor: _(r, t, (e == null ? void 0 : e.aes.dotFill) ?? D.color, "dotFill"),
+    dotSize: _(r, t, (e == null ? void 0 : e.aes.dotSize) ?? D.size, "dotSize"),
+    lineShape: _(r, t, (o == null ? void 0 : o.aes.lineShape) ?? "solid", "lineShape"),
+    lineColor: _(r, t, (o == null ? void 0 : o.aes.lineColor) ?? Z, "lineColor"),
+    trendColor: _(r, t, (s == null ? void 0 : s.color) ?? D.color, "fillColor")
   };
 }
-class Ot {
+class Zt {
   constructor() {
     C(this, "reactRoot", null);
     C(this, "parentNode", null);
     C(this, "rootNode", null);
-    C(this, "component", /* @__PURE__ */ W.jsx(W.Fragment, {}));
+    C(this, "component", /* @__PURE__ */ F.jsx(F.Fragment, {}));
     C(this, "margins", {
-      top: A,
-      bottom: A,
-      left: A,
-      right: A
+      top: v,
+      bottom: v,
+      left: v,
+      right: v
     });
     C(this, "chartsDimensions", {});
     C(this, "chartSizes", {
-      chartWidth: R,
+      chartWidth: G,
       // width of single chart
-      chartHeight: _,
+      chartHeight: X,
       // height of single chart
-      chartsWidth: R,
+      chartsWidth: G,
       // width of all charts in charts row
-      chartsHeight: _,
+      chartsHeight: X,
       // width of all charts in charts column, without axes
-      totalWidth: R,
+      totalWidth: G,
       // width of all charts in charts row, plus left axis, plus legend
-      totalHeight: _
+      totalHeight: X
       // width of all charts in charts height, plus bottom axis, plus top title
     });
     C(this, "columnsCount", 1);
     C(this, "rowsCount", 1);
     C(this, "scales", {
-      x: { null: H().domain([0, 10]).range([0, R]) },
-      y: { null: H().domain([0, 10]).range([_, 0]) }
+      x: { null: L().domain([0, 10]).range([0, G]) },
+      y: { null: L().domain([0, 10]).range([X, 0]) }
     });
     C(this, "captionsSizes", {
       xAxisCaptionsWidth: 30,
@@ -105,206 +106,222 @@ class Ot {
     C(this, "legend", { width: 0, height: 0, items: [] });
   }
   clear() {
-    var i;
-    this.parentNode && this.rootNode && ((i = this.parentNode) == null || i.removeChild(this.rootNode), this.parentNode = null, this.rootNode = null), setTimeout(() => {
-      var t;
-      (t = this.reactRoot) == null || t.unmount(), this.reactRoot = null;
+    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(i) {
-    this.parentNode === null && (this.parentNode = i, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = st(this.rootNode));
+  init(t) {
+    this.parentNode === null && (this.parentNode = t, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = k(this.rootNode));
   }
-  updateChartSizes(i) {
-    this.chartSizes.chartWidth = i.width, this.chartSizes.chartHeight = i.height;
+  updateChartSizes(t) {
+    this.chartSizes.chartWidth = t.width, this.chartSizes.chartHeight = t.height;
   }
-  updateChartDimensions(i, t, e, s) {
-    const { chartWidth: r, chartHeight: u } = this.chartSizes;
-    let g = 0, M = 0;
-    this.chartsDimensions = i.reduce((c, a, d) => {
-      const [T, E] = dt(d, this.columnsCount), n = lt(d, i.length, this.columnsCount, this.rowsCount), o = ct(
-        e,
+  updateChartDimensions(t, i, s, e) {
+    const { chartWidth: o, chartHeight: c } = this.chartSizes;
+    let g = 0, N = 0;
+    this.chartsDimensions = t.reduce((a, n, d) => {
+      const [S, E] = St(d, this.columnsCount), m = gt(d, t.length, this.columnsCount, this.rowsCount), l = ft(
         s,
+        e,
         this.captionsSizes,
-        mt(i, this.rowsCount, this.columnsCount)[T],
+        Tt(t, this.rowsCount, this.columnsCount)[S],
         this.facetTitles,
-        n,
-        t
-      ), p = r + o.left + o.right, h = u + o.top + o.bottom;
-      return c[a] = {
+        m,
+        i
+      ), f = o + l.left + l.right, z = c + l.top + l.bottom;
+      return a[n] = {
         left: g,
-        top: M,
-        chartEdgeSides: n,
-        padding: o,
-        inner: { width: r, height: u },
-        outer: { width: p, height: h }
-      }, g += p, E === this.columnsCount - 1 && (g = 0, M += h), c;
+        top: N,
+        chartEdgeSides: m,
+        padding: l,
+        inner: { width: o, height: c },
+        outer: { width: f, height: z }
+      }, g += f, E === this.columnsCount - 1 && (g = 0, N += z), a;
     }, {});
-    const N = Math.max(
-      ...i.map((c) => this.chartsDimensions[c].outer.width + this.chartsDimensions[c].left)
-    ), z = Math.max(
-      ...i.map((c) => this.chartsDimensions[c].outer.height + this.chartsDimensions[c].top)
+    const W = Math.max(
+      ...t.map((a) => this.chartsDimensions[a].outer.width + this.chartsDimensions[a].left)
+    ), w = Math.max(
+      ...t.map((a) => this.chartsDimensions[a].outer.height + this.chartsDimensions[a].top)
     );
-    this.chartSizes.chartsWidth = N, this.chartSizes.chartsHeight = z;
+    this.chartSizes.chartsWidth = W, this.chartSizes.chartsHeight = w;
   }
-  updateViewport(i, t, e, s, r, u) {
-    const g = i.length, M = Math.min(t.nRows ?? g, g), N = Math.min(t.nCols ?? g, g);
-    this.columnsCount = t.nRows ? Math.ceil(g / M) : N, this.rowsCount = Math.ceil(g / this.columnsCount);
-    let [z, c] = [1 / 0, -1 / 0], [a, d] = [1 / 0, -1 / 0];
-    const T = i.reduce((n, o) => {
-      const p = r[o], { minX: h, minY: m, maxX: f, maxY: x } = p;
-      return z = Math.min(z, h), a = Math.min(a, m), c = Math.max(c, f), d = Math.max(d, x), n[o] = { minX: h, maxX: f, minY: m, maxY: x }, n;
-    }, {});
-    i.forEach((n) => {
-      const o = e.scale === "log" ? j() : H(), p = T[n];
-      let h = e.lowerValue ? Number(e.lowerValue) : t.sharedX ? z : p.minX, m = e.upperValue ? Number(e.upperValue) : t.sharedX ? c : p.maxX;
-      if (typeof e.symmetricRange < "u") {
-        const S = e.symmetricRange;
-        if (S >= h && S <= m) {
-          const w = Math.max(S - h, m - S);
-          h = S - w, m = S + w;
+  updateViewport(t, i, s, e, o, c) {
+    const g = t.length, N = Math.min(i.nRows ?? g, g), W = Math.min(i.nCols ?? g, g);
+    this.columnsCount = i.nRows ? Math.ceil(g / N) : W, this.rowsCount = Math.ceil(g / this.columnsCount);
+    let [w, a] = [1 / 0, -1 / 0], [n, d] = [1 / 0, -1 / 0];
+    const S = t.reduce((p, h) => {
+      const Y = o[h], { minX: u, minY: T, maxX: A, maxY: I } = Y;
+      return w = Math.min(w, u), n = Math.min(n, T), a = Math.max(a, A), d = Math.max(d, I), p[h] = { minX: u, maxX: A, minY: T, maxY: I }, p;
+    }, {}), E = {}, m = {};
+    let l = !1, f = !1;
+    t.forEach((p) => {
+      const h = s.scale === "log" ? Q() : L(), Y = S[p];
+      let u = s.lowerValue ? Number(s.lowerValue) : i.sharedX ? w : Y.minX, T = s.upperValue ? Number(s.upperValue) : i.sharedX ? a : Y.maxX;
+      if (typeof s.symmetricRange < "u") {
+        const M = s.symmetricRange;
+        if (M >= u && M <= T) {
+          const x = Math.max(M - u, T - M);
+          u = M - x, T = M + x;
         }
       }
-      const f = [0, this.chartSizes.chartWidth], x = o.copy().domain([h, m]).range([D.LEFT, this.chartSizes.chartWidth - D.RIGHT]);
-      o.domain([x.invert(0), x.invert(this.chartSizes.chartWidth)]).range(f).nice(), this.scales.x[n] = o;
+      const A = [0, this.chartSizes.chartWidth], I = h.copy().domain([u, T]).range([B.LEFT, this.chartSizes.chartWidth - B.RIGHT]);
+      h.domain([I.invert(0), I.invert(this.chartSizes.chartWidth)]).range(A).nice();
+      const H = this.scales.x[p];
+      if (H === void 0)
+        l = !0;
+      else if (!l) {
+        const M = H.domain(), x = H.range();
+        (M[0] !== h.domain()[0] || M[1] !== h.domain()[1] || x[0] !== h.range()[0] || x[1] !== h.range()[1]) && (l = !0);
+      }
+      E[p] = h;
     });
-    const E = i.reduce((n, o) => {
-      const p = u ? u[o] : [];
-      return n[o] = p.reduce(
-        (h, m) => {
-          const f = m.bounded ? m.xBounds : this.scales.x[o].domain(), x = m.getInterval(f[0]), S = m.getInterval(f[1]);
-          return h.minY = Math.min(h.minY, isNaN(x.left) ? h.minY : x.left, isNaN(S.left) ? h.minY : S.left), h.maxY = Math.max(h.maxY, isNaN(x.right) ? h.maxY : x.right, isNaN(S.right) ? h.maxY : S.right), h;
+    const z = t.reduce((p, h) => {
+      const Y = c ? c[h] : [];
+      return p[h] = Y.reduce(
+        (u, T) => {
+          const A = T.bounded ? T.xBounds : this.scales.x[h].domain(), I = T.getInterval(A[0]), H = T.getInterval(A[1]);
+          return u.minY = Math.min(u.minY, isNaN(I.left) ? u.minY : I.left, isNaN(H.left) ? u.minY : H.left), u.maxY = Math.max(u.maxY, isNaN(I.right) ? u.maxY : I.right, isNaN(H.right) ? u.maxY : H.right), u;
         },
         { minY: 1 / 0, maxY: -1 / 0 }
-      ), a = Math.min(a, n[o].minY), d = Math.max(d, n[o].maxY), n;
+      ), n = Math.min(n, p[h].minY), d = Math.max(d, p[h].maxY), p;
     }, {});
-    i.forEach((n) => {
-      const o = s.scale === "log" ? j() : H(), p = T[n], h = E[n];
-      let m = s.lowerValue ? Number(s.lowerValue) : t.sharedY ? a : Math.min(p.minY, h.minY), f = s.upperValue ? Number(s.upperValue) : t.sharedY ? d : Math.max(p.maxY, h.maxY);
-      if (typeof s.symmetricRange < "u") {
-        const w = s.symmetricRange;
-        if (w >= m && w <= f) {
-          const b = Math.max(w - m, f - w);
-          m = w - b, f = w + b;
+    t.forEach((p) => {
+      const h = e.scale === "log" ? Q() : L(), Y = S[p], u = z[p];
+      let T = e.lowerValue ? Number(e.lowerValue) : i.sharedY ? n : Math.min(Y.minY, u.minY), A = e.upperValue ? Number(e.upperValue) : i.sharedY ? d : Math.max(Y.maxY, u.maxY);
+      if (typeof e.symmetricRange < "u") {
+        const x = e.symmetricRange;
+        if (x >= T && x <= A) {
+          const R = Math.max(x - T, A - x);
+          T = x - R, A = x + R;
         }
       }
-      const x = [this.chartSizes.chartHeight, 0], S = o.copy().domain([m, f]).range([this.chartSizes.chartHeight - D.BOTTOM, D.TOP]);
-      o.domain([S.invert(this.chartSizes.chartHeight), S.invert(0)]).range(x).nice(), this.scales.y[n] = o;
-    });
+      const I = [this.chartSizes.chartHeight, 0], H = h.copy().domain([T, A]).range([this.chartSizes.chartHeight - B.BOTTOM, B.TOP]);
+      h.domain([H.invert(this.chartSizes.chartHeight), H.invert(0)]).range(I).nice();
+      const M = this.scales.y[p];
+      if (M === void 0)
+        f = !0;
+      else if (!f) {
+        const x = M.domain(), R = M.range();
+        (x[0] !== h.domain()[0] || x[1] !== h.domain()[1] || R[0] !== h.range()[0] || R[1] !== h.range()[1]) && (f = !0);
+      }
+      m[p] = h;
+    }), l && (this.scales.x = E), f && (this.scales.y = m);
   }
-  updateCaptionsSize(i) {
-    const t = new et("600 14px Arial");
-    let e = 0;
-    function s(r) {
-      return Math.max(...r.map((u) => t.getTextWidth(u)));
+  updateCaptionsSize(t) {
+    const i = new ht("600 14px Arial");
+    let s = 0;
+    function e(o) {
+      return Math.max(...o.map((c) => i.getTextWidth(c)));
     }
-    Object.values(this.scales.y).forEach((r) => {
-      const { ticks: u, format: g } = y(r, i);
-      e = Math.max(e, s(u.map(g)));
+    Object.values(this.scales.y).forEach((o) => {
+      const { ticks: c, format: g } = mt(o, t);
+      s = Math.max(s, e(c.map(g)));
     }), this.captionsSizes = {
       xAxisCaptionsWidth: 20,
-      yAxisCaptionsWidth: e
+      yAxisCaptionsWidth: s
     };
   }
-  createMainTitle(i, t) {
-    const e = this.chartsDimensions[i[0]], s = this.chartsDimensions[i[i.length - 1]];
-    this.mainTitle = L(
-      t.name,
-      this.chartSizes.chartsWidth - e.padding.left - s.padding.right,
+  createMainTitle(t, i) {
+    const s = this.chartsDimensions[t[0]], e = this.chartsDimensions[t[t.length - 1]];
+    this.mainTitle = U(
+      i.name,
+      this.chartSizes.chartsWidth - s.padding.left - e.padding.right,
       20
     );
   }
-  createFacetTitles(i, t) {
-    this.facetTitles = i.reduce((e, s, r) => (t[r].length === 1 && t[r][0] === "null" ? e[s] = [] : e[s] = L(t[r].join(", "), this.chartSizes.chartWidth, 14), e), {});
+  createFacetTitles(t, i) {
+    this.facetTitles = t.reduce((s, e, o) => (i[o].length === 1 && i[o][0] === "null" ? s[e] = [] : s[e] = U(i[o].join(", "), this.chartSizes.chartWidth, 14), s), {});
   }
   updateMargins() {
-    const i = Q * this.mainTitle.length, t = i > 0 ? i + $ * 2 : 0;
+    const t = tt * this.mainTitle.length, i = t > 0 ? t + et * 2 : 0;
     this.margins = {
-      top: Math.max(t, A),
-      bottom: A,
-      left: A,
-      right: this.legend.width + A
+      top: Math.max(i, v),
+      bottom: v,
+      left: v,
+      right: this.legend.width + v
     }, 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, e, s) {
-    if (!i.show) {
+  updateLegendSize(t, i, s, e) {
+    if (!t.show) {
       this.legend = { width: 0, height: 0, items: [] };
       return;
     }
-    const r = [], u = { width: 0, height: 0, left: 0, top: 0 };
-    if (e.forEach((c) => {
-      const a = t[c.value];
-      if (a.usedAes.length === 0 || !a.aesMap)
+    const o = [], c = { width: 0, height: 0, left: 0, top: 0 };
+    if (s.forEach((a) => {
+      const n = i[a.value];
+      if (n.usedAes.length === 0 || !n.aesMap)
         return;
-      if (a.values.length > Z) {
-        console.warn(`Too many values for discrete legend (${a.values.length})`);
+      if (n.values.length > it) {
+        console.warn(`Too many values for discrete legend (${n.values.length})`);
         return;
       }
       const d = {};
-      a.values.forEach((n) => {
-        d[n] || (d[n] = { ...F }), a.usedAes.forEach((o) => {
-          var p, h, m;
-          (o === "dotFill" || o === "lineColor") && (d[n].color = ((p = a.aesMap[n]) == null ? void 0 : p[o]) ?? U), o === "dotShape" && (d[n].shape = ((h = a.aesMap[n]) == null ? void 0 : h[o]) ?? "21"), o === "dotSize" && (d[n].size = ((m = a.aesMap[n]) == null ? void 0 : m[o]) ?? 3);
+      n.values.forEach((m) => {
+        d[m] || (d[m] = { ...D }), n.usedAes.forEach((l) => {
+          (l === "dotFill" || l === "lineColor") && (d[m].color = n.aesMap(m, l) ?? Z), l === "dotShape" && (d[m].shape = n.aesMap(m, l) ?? "21"), l === "dotSize" && (d[m].size = n.aesMap(m, l) ?? 3);
         });
       });
-      const T = c.label ?? c.value, E = ht().domain(a.values).range(a.values.map((n) => d[n])).unknown(F);
-      r.push({ ...u, id: c.value, type: "dots", title: T, scale: E, values: a.values, labels: a.labels });
-    }), s.forEach((c) => {
-      if (c.type === "dots" && O(c.aes.dotFill)) {
-        const { domain: a, range: d, columnName: T, type: E = "linear" } = c.aes.dotFill, n = T.label ?? T.value, o = tt(d, a, "linear"), p = (E === "log" ? at() : H()).domain(a).range([this.chartSizes.chartHeight, 0]), h = it(p, a);
-        r.push({ ...u, id: "dotFill", type: "continuous", title: n, scale: o, tickPositionScale: p, values: h });
+      const S = a.label ?? a.value, E = dt().domain(n.values).range(n.values.map((m) => d[m])).unknown(D);
+      o.push({ ...c, id: a.value, type: "dots", title: S, scale: E, values: n.values, labels: n.labels });
+    }), e.forEach((a) => {
+      if (a.type === "dots" && j(a.aes.dotFill)) {
+        const { domain: n, range: d, columnName: S, type: E = "linear" } = a.aes.dotFill, m = S.label ?? S.value, l = nt(d, n, "linear"), f = (E === "log" ? pt() : L()).domain(n).range([this.chartSizes.chartHeight, 0]), z = at(f, n);
+        o.push({ ...c, id: "dotFill", type: "continuous", title: m, scale: l, tickPositionScale: f, values: z });
       }
-      if (c.type === "dots" && O(c.aes.dotSize)) {
-        const { columnName: a, domain: d, range: T } = c.aes.dotSize, E = a.label ?? a.value, n = rt(d, T), o = n.ticks(3), p = n.tickFormat(3), h = o.reduce((m, f) => (m[String(f)] = p(f), m), {});
-        r.push({ ...u, id: a.value, type: "size", title: E, scale: n, values: o, labels: h });
+      if (a.type === "dots" && j(a.aes.dotSize)) {
+        const { columnName: n, domain: d, range: S } = a.aes.dotSize, E = n.label ?? n.value, m = ut(d, S), l = m.ticks(3), f = m.tickFormat(3), z = l.reduce((p, h) => (p[String(h)] = f(h), p), {});
+        o.push({ ...c, id: n.value, type: "size", title: E, scale: m, values: l, labels: z });
       }
-    }), !r.length) {
+    }), !o.length) {
       this.legend = { width: 0, height: 0, items: [] };
       return;
     }
-    const g = nt(r, this.chartSizes.chartHeight), M = g[g.length - 1], N = M.left + M.width + k, z = this.chartSizes.chartHeight;
+    const g = ot(o, this.chartSizes.chartHeight), N = g[g.length - 1], W = N.left + N.width + lt, w = this.chartSizes.chartHeight;
     this.legend = {
-      width: N,
-      height: z,
+      width: W,
+      height: w,
       items: g
     };
   }
-  render(i, t, e, s, r, u, g, M, N, z, c, a, d, T, E) {
-    var x;
-    const { xAxis: n, yAxis: o, size: p, title: h, legend: m } = t;
-    this.updateChartSizes(p), this.updateViewport(s, e, n, o, u, g), this.updateCaptionsSize(N.y), this.createFacetTitles(s, r), this.updateChartDimensions(s, e, n, o), this.updateLegendSize(m, z, a, d), this.createMainTitle(s, h), this.updateMargins();
-    const f = /* @__PURE__ */ W.jsx(
-      ot,
+  render(t, i, s, e, o, c, g, N, W, w, a, n, d, S, E, m) {
+    var u;
+    const { xAxis: l, yAxis: f, size: z, title: p, legend: h } = s;
+    this.updateChartSizes(z), this.updateViewport(o, e, l, f, g, N), this.updateCaptionsSize(w.y), this.createFacetTitles(o, c), this.updateChartDimensions(o, e, l, f), this.updateLegendSize(h, a, d, S), this.createMainTitle(o, p), this.updateMargins();
+    const Y = /* @__PURE__ */ F.jsx(y, { dataFrame: t, children: /* @__PURE__ */ F.jsx(
+      rt,
       {
         settingsId: i,
-        chartSettings: t,
-        facetKeys: s,
+        chartSettings: s,
+        facetKeys: o,
         facetSettings: e,
         chartSizes: this.chartSizes,
         chartsDimensions: this.chartsDimensions,
         scales: this.scales,
-        groupedDots: u,
-        trendsData: g,
+        groupedDots: g,
+        trendsData: N,
         legendData: this.legend,
         columnsCount: this.columnsCount,
         margins: this.margins,
-        keyColumn: M,
+        keyColumn: W,
         mainTitle: this.mainTitle,
         facetTitles: this.facetTitles,
         captionsSizes: this.captionsSizes,
-        onlyPositive: N,
-        layersData: c,
-        aesGetters: pt(z, d, T),
-        onTooltipHintSwitch: E
+        onlyPositive: w,
+        layersData: n,
+        aesGetters: xt(t, a, S, E),
+        onTooltipHintSwitch: m
       }
-    );
-    this.component = f, (x = this.reactRoot) == null || x.render(f);
+    ) });
+    this.component = Y, (u = this.reactRoot) == null || u.render(Y);
   }
-  renderError(i) {
-    var t;
-    (t = this.reactRoot) == null || t.render(/* @__PURE__ */ W.jsx(q, { message: i }));
+  renderError(t) {
+    var i;
+    (i = this.reactRoot) == null || i.render(/* @__PURE__ */ F.jsx(K, { message: t }));
   }
 }
 export {
-  Ot as default
+  Zt as default
 };
 //# sourceMappingURL=ChartRenderer.js.map