@milaboratories/graph-maker 1.1.173 → 1.1.175

package/dist/node_modules/@milaboratories/miplots4/dist/heatmap/ChartRenderer.js

@@ -1,110 +1,110 @@
-import { j as $ } from "../node_modules/react/jsx-runtime.js";
-import it from "../node_modules/lodash/lodash.js";
-import { createRoot as ot } from "../node_modules/react-dom/client.js";
+import { j as O } from "../node_modules/react/jsx-runtime.js";
+import ot from "../node_modules/lodash/lodash.js";
+import { createRoot as it } from "../node_modules/react-dom/client.js";
 import { Error as at } from "../common/Error.js";
 import { DataFrameProvider as rt } from "../common/useDataFrame.js";
-import { TITLE_LINE_HEIGHT as nt, TITLE_MARGIN as lt, DEFAULT_HEIGHT as X, DEFAULT_WIDTH as Y } from "../constants.js";
+import { TITLE_LINE_HEIGHT as nt, TITLE_MARGIN as lt, DEFAULT_HEIGHT as U, DEFAULT_WIDTH as Y } from "../constants.js";
 import { arrangeLegendParts as ht } from "../utils/arrangeLegendParts.js";
 import { getChartEdgeSides as ct } from "../utils/getChartEdgeSides.js";
 import { getContinuousLegendTicks as q } from "../utils/getContinuousLegendTicks.js";
 import { TextMeasurer as ut } from "../utils/TextMeasurer/TextMeasurer.js";
 import { ChartsGroup as dt } from "./components/ChartsGroup.js";
-import { LEGEND_OFFSET as pt, DEFAULT_AES as Q, CHART_SIDE_ELEMENTS as mt, TITLE_LINE as J, MIN_MARGIN as j } from "./constants.js";
+import { LEGEND_OFFSET as pt, DEFAULT_AES as Q, CHART_SIDE_ELEMENTS as mt, TITLE_LINE as J, MIN_MARGIN as $ } from "./constants.js";
 import { calculateChartSideElementSizes as gt } from "./utils/calculateChartSideElementSizes.js";
 import { calculateSideElementsBBoxes as ft } from "./utils/calculateSideElementsBBoxes.js";
-import { createDiscreteColorScale as yt, createDiscreteRoundColorScale as St, createContinuousColorScale as xt } from "./utils/createColorScales.js";
+import { createDiscreteColorScale as yt, createDiscreteRoundColorScale as xt, createContinuousColorScale as St } from "./utils/createColorScales.js";
 import { calculateAnnotationTitleSizes as Ct } from "./utils/calculateAnnotationTitleSizes.js";
 import { calculateCaptionTails as bt } from "./utils/calculateCaptionTails.js";
 import W from "../node_modules/d3-scale/src/ordinal.js";
 import N from "../node_modules/d3-scale/src/linear.js";
 import At from "../node_modules/d3-array/src/extent.js";
 import Z from "../node_modules/d3-hierarchy/src/cluster.js";
-var Gt = Object.defineProperty, zt = (m, s, e) => s in m ? Gt(m, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : m[s] = e, A = (m, s, e) => zt(m, typeof s != "symbol" ? s + "" : s, e);
-const Lt = Math.cos(Math.PI / 4), Tt = 5;
+var Gt = Object.defineProperty, zt = (m, s, e) => s in m ? Gt(m, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : m[s] = e, b = (m, s, e) => zt(m, typeof s != "symbol" ? s + "" : s, e);
+const Et = Math.cos(Math.PI / 4), vt = 5;
 function tt(m, s, e) {
-  function t(r) {
-    r[e] = s(r.data.height), r.children && r.children.forEach(t);
+  function t(a) {
+    a[e] = s(a.data.height), a.children && a.children.forEach(t);
   }
   t(m);
 }
 function et(m, s, e, t = e) {
-  function r(o) {
-    o[t] = o[e] + s, o.children && o.children.forEach(r);
+  function a(i) {
+    i[t] = i[e] + s, i.children && i.children.forEach(a);
   }
-  r(m);
+  a(m);
 }
-const Et = (m, s) => {
+const Lt = (m, s) => {
   const e = Math.min(...s), t = Math.max(...s);
   if (e === t) {
-    const n = m % 2 === 0 ? [] : [e];
-    for (let l = 1; l < m / 2 + 1; l++)
-      n.push(e + l), n.unshift(e - l);
-    return n;
+    const r = m % 2 === 0 ? [] : [e];
+    for (let n = 1; n < m / 2 + 1; n++)
+      r.push(e + n), r.unshift(e - n);
+    return r;
   }
   if (m < 2)
     return [e, t];
-  const r = (t - e) / (m - 1), o = [];
-  for (let n = 0; n < m - 1; n++)
-    o.push(e + r * n);
-  return o.push(t), o;
+  const a = (t - e) / (m - 1), i = [];
+  for (let r = 0; r < m - 1; r++)
+    i.push(e + a * r);
+  return i.push(t), i;
 };
 function st(m, s, e) {
   let t = e;
-  return m && (m.colorRange && (t = m.colorRange), m.method === "standardScaling" && (t = [-2, 2]), m.method === "meanNormalization" && (t = [-0.75, 0.75])), Et(s, t);
+  return m && (m.colorRange && (t = m.colorRange), m.method === "standardScaling" && (t = [-2, 2]), m.method === "meanNormalization" && (t = [-0.75, 0.75])), Lt(s, t);
 }
 function k(m, s, e) {
   let t = 0;
-  for (const r of m) {
-    if (s[r] === void 0) continue;
-    const o = e.getTextWidth(s[r]);
-    o > t && (t = o);
+  for (const a of m) {
+    if (s[a] === void 0) continue;
+    const i = e.getTextWidth(s[a]);
+    i > t && (t = i);
   }
   return t;
 }
 function F(m, s) {
-  return s === 90 ? m : s === 45 ? m * Lt + (m > 0 ? 2 * Tt : 0) : J;
+  return s === 90 ? m : s === 45 ? m * Et + (m > 0 ? 2 * vt : 0) : J;
 }
-class Ut {
+class Jt {
   constructor() {
-    A(this, "reactRoot", null), A(this, "parentNode", null), A(this, "rootNode", null), A(this, "component", /* @__PURE__ */ $.jsx($.Fragment, {})), A(this, "chartsDimensions", {}), A(this, "chartSizes", {
+    b(this, "reactRoot", null), b(this, "parentNode", null), b(this, "rootNode", null), b(this, "component", /* @__PURE__ */ O.jsx(O.Fragment, {})), b(this, "chartsDimensions", {}), b(this, "chartSizes", {
       chartWidth: Y,
       // width of single chart
-      chartHeight: X,
+      chartHeight: U,
       // height of single chart
       chartsWidth: Y,
       // width of all charts in charts row
-      chartsHeight: X,
+      chartsHeight: U,
       // width of all charts in charts column, without axes
       totalWidth: Y,
       // width of all charts in charts row, plus left axis, plus legend
-      totalHeight: X
+      totalHeight: U
       // width of all charts in charts height, plus bottom axis, plus top title
-    }), A(this, "margins", {
-      top: j,
-      bottom: j,
-      left: j,
-      right: j
-    }), A(this, "captionsSizes", {
+    }), b(this, "margins", {
+      top: $,
+      bottom: $,
+      left: $,
+      right: $
+    }), b(this, "captionsSizes", {
       xAxisCaptions: 100,
       yAxisCaptions: 100,
       xGroupCaptions: J,
       yGroupCaptions: J,
       xCaptionTail: 0,
       yCaptionTail: 0
-    }), A(this, "labelAngles", {
+    }), b(this, "labelAngles", {
       xAxisLabels: 0,
       yAxisLabels: 0,
       xGroupLabels: 0,
       yGroupLabels: 0
-    }), A(this, "columnsCount", 1), A(this, "rowsCount", 1), A(this, "scales", {
+    }), b(this, "columnsCount", 1), b(this, "rowsCount", 1), b(this, "scales", {
       // scales grouped by facet
       x: { null: W().domain(["null"]).range([1]) },
       y: { null: W().domain(["null"]).range([1]) }
-    }), A(this, "step", { x: {}, y: {} }), A(this, "colorScale", N().domain([0, 1]).range(["white", "black"])), A(this, "annotationColorScales", {}), A(this, "dendrogramAesScales", {}), A(this, "legend", {
+    }), b(this, "step", { x: {}, y: {} }), b(this, "colorScale", N().domain([0, 1]).range(["white", "black"])), b(this, "annotationColorScales", {}), b(this, "dendrogramAesScales", {}), b(this, "legend", {
       width: 0,
       height: 0,
       items: []
-    }), A(this, "dendrograms", {});
+    }), b(this, "dendrograms", {});
   }
   clear() {
     var s;
@@ -114,7 +114,7 @@ class Ut {
     });
   }
   init(s) {
-    this.parentNode === null && (this.parentNode = s, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = ot(this.rootNode));
+    this.parentNode === null && (this.parentNode = s, this.rootNode = document.createElement("div"), this.parentNode.appendChild(this.rootNode), this.reactRoot = it(this.rootNode));
   }
   updateMargins(s, e) {
     this.margins = {
@@ -124,222 +124,222 @@ class Ut {
       right: this.legend.width + e.outerOffset
     }, this.chartSizes.totalWidth = this.margins.left + this.chartSizes.chartsWidth + this.margins.right, this.chartSizes.totalHeight = this.margins.top + Math.max(this.chartSizes.chartsHeight + this.margins.bottom, this.legend.height);
   }
-  updateLegendSize(s, e, t, r, o) {
+  updateLegendSize(s, e, t, a, i) {
     if (!e.show) {
       this.legend = { width: 0, height: 0, items: [] };
       return;
     }
-    const n = this.chartSizes.chartHeight, l = [], u = { width: 0, height: 0, left: 0, top: 0 }, f = (c) => c.reduce((h, i) => (h[i] = String(i), h), {});
+    const r = this.chartSizes.chartHeight, n = [], d = { width: 0, height: 0, left: 0, top: 0 }, y = (l) => l.reduce((h, o) => (h[o] = String(o), h), {});
     if (s === "continuous") {
-      const c = this.colorScale, h = q(c, o), i = N([h[0], h[h.length - 1]], [n, 0]), a = r.label ?? r.value;
-      l.push({
-        ...u,
+      const l = this.colorScale, h = q(l, i), o = N([h[0], h[h.length - 1]], [r, 0]), c = a.label ?? a.value;
+      n.push({
+        ...d,
         type: "continuous",
         id: "heatmapValue",
-        scale: c,
+        scale: l,
         values: h,
-        title: a,
-        tickPositionScale: i
+        title: c,
+        tickPositionScale: o
       });
     } else if (s === "discrete") {
-      const c = this.colorScale, h = r.label ?? r.value, i = c.domain(), a = f(i);
-      l.push({ ...u, type: "discreteColor", id: "heatmapValue", title: h, scale: c, values: i, labels: a });
+      const l = this.colorScale, h = a.label ?? a.value, o = l.domain(), c = y(o);
+      n.push({ ...d, type: "discreteColor", id: "heatmapValue", title: h, scale: l, values: o, labels: c });
     }
-    if (t.forEach((c) => {
-      const h = c.valueColumn.label ?? c.valueColumn.value;
-      if (c.type === "continuous") {
-        const i = this.annotationColorScales[c.id].scale, a = q(i, o), y = N([a[0], a[a.length - 1]], [n, 0]);
-        l.push({ ...u, type: "continuous", id: c.id, tickPositionScale: y, title: h, scale: i, values: a });
+    if (t.forEach((l) => {
+      const h = l.valueColumn.label ?? l.valueColumn.value;
+      if (l.type === "continuous") {
+        const o = this.annotationColorScales[l.id].scale, c = q(o, i), f = N([c[0], c[c.length - 1]], [r, 0]);
+        n.push({ ...d, type: "continuous", id: l.id, tickPositionScale: f, title: h, scale: o, values: c });
       }
-      if (c.type === "discrete") {
-        const i = this.annotationColorScales[c.id].scale, a = i.domain(), y = f(a);
-        l.push({ ...u, type: "discreteColor", id: c.id, title: h, scale: i, values: a, labels: y });
+      if (l.type === "discrete") {
+        const o = this.annotationColorScales[l.id].scale, c = o.domain(), f = y(c);
+        n.push({ ...d, type: "discreteColor", id: l.id, title: h, scale: o, values: c, labels: f });
       }
-    }), !l.length) {
+    }), !n.length) {
       this.legend = { width: 0, height: 0, items: [] };
       return;
     }
-    const d = ht(l, this.chartSizes.chartHeight), p = d[d.length - 1], L = p.left + p.width + pt;
+    const p = ht(n, this.chartSizes.chartHeight), u = p[p.length - 1], A = u.left + u.width + pt;
     this.legend = {
-      width: L,
-      height: n,
-      items: d
+      width: A,
+      height: r,
+      items: p
     };
   }
-  updateCaptionsSize(s, e, t, r) {
-    const o = new ut("bold 16px Manrope"), { xGroupKeys: n, yGroupKeys: l, xGroupLabels: u, yGroupLabels: f, xKeysByGroups: d, yKeysByGroups: p, xLabels: L, yLabels: c } = s.meta;
+  updateCaptionsSize(s, e, t, a) {
+    const i = new ut("bold 16px Manrope"), { xGroupKeys: r, yGroupKeys: n, xGroupLabels: d, yGroupLabels: y, xKeysByGroups: p, yKeysByGroups: u, xLabels: A, yLabels: l } = s.meta;
     this.labelAngles = {
       xAxisLabels: e.axisLabelsAngle,
       yAxisLabels: t.axisLabelsAngle,
       xGroupLabels: e.groupLabelsAngle,
       yGroupLabels: t.groupLabelsAngle
     };
-    const h = n.reduce((C, g) => Math.max(C, k(d[g], L, o)), 0), i = l.reduce((C, g) => Math.max(C, k(p[g], c, o)), 0), a = k(n, u, o), y = k(l, f, o), { xCaptionTail: x, yCaptionTail: E } = bt(
+    const h = r.reduce((S, g) => Math.max(S, k(p[g], A, i)), 0), o = n.reduce((S, g) => Math.max(S, k(u[g], l, i)), 0), c = k(r, d, i), f = k(n, y, i), { xCaptionTail: E, yCaptionTail: K } = bt(
       this.labelAngles,
-      r,
+      a,
       this.scales,
       this.step,
       s,
-      o
+      i
     );
     this.captionsSizes = {
-      xCaptionTail: x,
-      yCaptionTail: E,
-      xGroupCaptions: F(a, this.labelAngles.xGroupLabels),
-      yGroupCaptions: F(y, this.labelAngles.yGroupLabels),
+      xCaptionTail: E,
+      yCaptionTail: K,
+      xGroupCaptions: F(c, this.labelAngles.xGroupLabels),
+      yGroupCaptions: F(f, this.labelAngles.yGroupLabels),
       xAxisCaptions: F(h, this.labelAngles.xAxisLabels),
-      yAxisCaptions: F(i, this.labelAngles.yAxisLabels)
+      yAxisCaptions: F(o, this.labelAngles.yAxisLabels)
     };
   }
-  updateChartDimensions(s, e, t, r, o, n, l, u, f, d) {
-    const p = e.length, L = Math.min(o.nRows ?? p, p), c = Math.min(o.nCols ?? p, p);
-    this.columnsCount = o.nRows ? Math.ceil(p / L) : c, this.rowsCount = Math.ceil(p / this.columnsCount);
-    const { sharedX: h, sharedY: i } = o;
+  updateChartDimensions(s, e, t, a, i, r, n, d, y, p) {
+    const u = e.length, A = Math.min(i.nRows ?? u, u), l = Math.min(i.nCols ?? u, u);
+    this.columnsCount = i.nRows ? Math.ceil(u / A) : l, this.rowsCount = Math.ceil(u / this.columnsCount);
+    const { sharedX: h, sharedY: o } = i;
     this.chartsDimensions = {};
-    let a = 0, y = 0;
-    e.forEach((C, g) => {
-      const b = g % this.columnsCount + 1, S = ct(g, e.length, this.columnsCount, this.rowsCount), G = this.step.x[C], M = this.step.y[C], w = gt(
+    let c = 0, f = 0;
+    e.forEach((S, g) => {
+      const C = g % this.columnsCount + 1, x = ct(g, e.length, this.columnsCount, this.rowsCount), G = this.step.x[S], w = this.step.y[S], M = gt(
+        r,
         n,
-        l,
         this.captionsSizes,
-        u,
-        f,
         d,
-        S,
+        y,
+        p,
+        x,
         h,
-        i,
+        o,
         e,
         t,
-        r,
+        a,
         G,
-        M
-      ), D = Ct(u, S, h, i);
-      function v(B) {
+        w
+      ), H = Ct(d, x, h, o);
+      function L(B) {
         return Math.max(
-          mt[B].reduce((O, _) => O + w[B][_], 0),
-          D[B],
+          mt[B].reduce((_, j) => _ + M[B][j], 0),
+          H[B],
           s.innerOffset
         );
       }
-      const T = {
-        left: v("left"),
-        right: v("right"),
-        top: v("top"),
-        bottom: v("bottom")
+      const v = {
+        left: L("left"),
+        right: L("right"),
+        top: L("top"),
+        bottom: L("bottom")
       };
-      T.left < this.captionsSizes.xCaptionTail && (T.left = this.captionsSizes.xCaptionTail), T.bottom < this.captionsSizes.yCaptionTail && (T.bottom = this.captionsSizes.yCaptionTail);
-      const H = ft(w, this.chartSizes.chartWidth, this.chartSizes.chartHeight), R = this.chartSizes.chartWidth + T.left + T.right, I = this.chartSizes.chartHeight + T.top + T.bottom;
-      this.chartsDimensions[C] = {
-        left: a,
-        top: y,
+      v.left < this.captionsSizes.xCaptionTail && (v.left = this.captionsSizes.xCaptionTail), v.bottom < this.captionsSizes.yCaptionTail && (v.bottom = this.captionsSizes.yCaptionTail);
+      const D = ft(M, this.chartSizes.chartWidth, this.chartSizes.chartHeight), R = this.chartSizes.chartWidth + v.left + v.right, I = this.chartSizes.chartHeight + v.top + v.bottom;
+      this.chartsDimensions[S] = {
+        left: c,
+        top: f,
         inner: { width: this.chartSizes.chartWidth, height: this.chartSizes.chartHeight },
         outer: { width: R, height: I },
-        padding: T,
-        sideElementBBoxes: H,
-        chartEdgeSides: S
-      }, a += R, b === this.columnsCount && (a = 0, y += I);
+        padding: v,
+        sideElementBBoxes: D,
+        chartEdgeSides: x
+      }, c += R, C === this.columnsCount && (c = 0, f += I);
     });
-    const x = e.slice(0, this.columnsCount).reduce((C, g) => C + this.chartsDimensions[g].outer.width, 0), E = e.filter((C, g) => g % this.columnsCount === 0).reduce((C, g) => C + this.chartsDimensions[g].outer.height, 0);
-    this.chartSizes.chartsWidth = x, this.chartSizes.chartsHeight = E;
+    const E = e.slice(0, this.columnsCount).reduce((S, g) => S + this.chartsDimensions[g].outer.width, 0), K = e.filter((S, g) => g % this.columnsCount === 0).reduce((S, g) => S + this.chartsDimensions[g].outer.height, 0);
+    this.chartSizes.chartsWidth = E, this.chartSizes.chartsHeight = K;
   }
-  updateChartsSizes(s, e, t, r) {
-    const { width: o, height: n, cellWidth: l, cellHeight: u } = s, f = t.meta.facetKeys[0];
-    if (l && e.sharedX && f) {
-      const d = t.facets[f].xKeys.length, p = t.meta.xGroupKeys.length;
-      this.chartSizes.chartWidth = d * l + r * (p - 1);
+  updateChartsSizes(s, e, t, a) {
+    const { width: i, height: r, cellWidth: n, cellHeight: d } = s, y = t.meta.facetKeys[0];
+    if (n && e.sharedX && y) {
+      const p = t.facets[y].xKeys.length, u = t.meta.xGroupKeys.length;
+      this.chartSizes.chartWidth = p * n + a * (u - 1);
     } else
-      this.chartSizes.chartWidth = o;
-    if (u && e.sharedY && f) {
-      const d = t.facets[f].yKeys.length, p = t.meta.yGroupKeys.length;
-      this.chartSizes.chartHeight = d * u + r * (p - 1);
+      this.chartSizes.chartWidth = i;
+    if (d && e.sharedY && y) {
+      const p = t.facets[y].yKeys.length, u = t.meta.yGroupKeys.length;
+      this.chartSizes.chartHeight = p * d + a * (u - 1);
     } else
-      this.chartSizes.chartHeight = n;
+      this.chartSizes.chartHeight = r;
   }
   // update scales for cell positions, x and y for each facet
-  updateScales(s, e, t, r, o, n, l, u, f, d) {
-    const { width: p, height: L, cellWidth: c, cellHeight: h } = o, { meta: i, facets: a } = e, { sharedX: y, sharedY: x } = r, E = (g, b = {}) => g.sort(
-      (S, G) => n.sorting === "asc" ? (b[S] ?? S).localeCompare(b[G] ?? G, "en", { numeric: !0 }) : (b[G] ?? G).localeCompare(b[S] ?? S, "en", { numeric: !0 })
-    ), C = (g, b = {}) => g.sort(
-      (S, G) => l.sorting === "asc" ? (b[S] ?? S).localeCompare(b[G] ?? G, "en", { numeric: !0 }) : (b[G] ?? G).localeCompare(b[S] ?? S, "en", { numeric: !0 })
+  updateScales(s, e, t, a, i, r, n, d, y, p) {
+    const { width: u, height: A, cellWidth: l, cellHeight: h } = i, { meta: o, facets: c } = e, { sharedX: f, sharedY: E } = a, K = (g, C = {}) => g.sort(
+      (x, G) => r.sorting === "asc" ? (C[x] ?? x).localeCompare(C[G] ?? G, "en", { numeric: !0 }) : (C[G] ?? G).localeCompare(C[x] ?? x, "en", { numeric: !0 })
+    ), S = (g, C = {}) => g.sort(
+      (x, G) => n.sorting === "asc" ? (C[x] ?? x).localeCompare(C[G] ?? G, "en", { numeric: !0 }) : (C[G] ?? G).localeCompare(C[x] ?? x, "en", { numeric: !0 })
     );
     s.forEach((g) => {
-      const b = a[g], S = d.xGroup ? i.xGroupKeys : E(i.xGroupKeys), G = d.yGroup ? i.yGroupKeys : C(i.yGroupKeys), { xKeysByGroups: M } = y ? i : b, { yKeysByGroups: w } = x ? i : b, D = S.map((z) => M[z].length), v = G.map((z) => w[z].length), T = D.reduce((z, K) => z + K, 0), H = v.reduce((z, K) => z + K, 0), R = y && c ? c : (p - (D.filter((z) => z > 0).length - 1) * t) / T, I = x && h ? h : (L - (v.filter((z) => z > 0).length - 1) * t) / H, B = [], O = [];
-      let _ = 0;
-      S.forEach((z) => {
-        const K = u || d.x ? M[z] : E(M[z], i.xLabels);
-        O.push(...K), K.forEach(() => {
-          B.push(_), _ += R;
-        }), K.length > 0 && (_ += t);
+      const C = c[g], x = p.xGroup ? o.xGroupKeys : K(o.xGroupKeys), G = p.yGroup ? o.yGroupKeys : S(o.yGroupKeys), { xKeysByGroups: w } = f ? o : C, { yKeysByGroups: M } = E ? o : C, H = x.map((z) => w[z].length), L = G.map((z) => M[z].length), v = H.reduce((z, T) => z + T, 0), D = L.reduce((z, T) => z + T, 0), R = f && l ? l : (u - (H.filter((z) => z > 0).length - 1) * t) / v, I = E && h ? h : (A - (L.filter((z) => z > 0).length - 1) * t) / D, B = [];
+      let _ = [], j = 0;
+      x.forEach((z) => {
+        const T = d || p.x ? w[z] : K(w[z], o.xLabels);
+        _ = _.concat(T), T.forEach(() => {
+          B.push(j), j += R;
+        }), T.length > 0 && (j += t);
       });
-      const U = [], V = [];
-      let P = 0;
+      const V = [];
+      let P = [], X = 0;
       G.forEach((z) => {
-        const K = f || d.y ? w[z] : C(w[z], i.yLabels);
-        V.push(...K), K.forEach(() => {
-          U.push(P), P += I;
-        }), K.length > 0 && (P += t);
-      }), this.scales.x[g] = W().domain(O).range(B), this.scales.y[g] = W().domain(V).range(U), this.step.x[g] = R, this.step.y[g] = I;
+        const T = y || p.y ? M[z] : S(M[z], o.yLabels);
+        P = P.concat(T), T.forEach(() => {
+          V.push(X), X += I;
+        }), T.length > 0 && (X += t);
+      }), this.scales.x[g] = W().domain(_).range(B), this.scales.y[g] = W().domain(P).range(V), this.step.x[g] = R, this.step.y[g] = I;
     });
   }
-  updateAesScale(s, e, t, r, o, n, l) {
+  updateAesScale(s, e, t, a, i, r, n) {
     if (s === "continuous")
-      t.valueColors ? this.colorScale = N().domain(t.valuesByColors ?? st(l, t.valueColors.length, e)).range(t.valueColors) : t.colorsList && (this.colorScale = N().domain(st(l, t.colorsList.length, e)).range(t.colorsList));
+      t.valueColors ? this.colorScale = N().domain(t.valuesByColors ?? st(n, t.valueColors.length, e)).range(t.valueColors) : t.colorsList && (this.colorScale = N().domain(st(n, t.colorsList.length, e)).range(t.colorsList));
     else if (t.colorsMap) {
-      const d = Object.entries(t.colorsMap);
-      this.colorScale = W().domain(d.map((p) => p[0])).range(d.map((p) => p[1])).unknown("#ccc");
-    } else t.colorsList && (this.colorScale = yt(t.colorsList, n.map(String)));
-    const { xDataByKeys: u, yDataByKeys: f } = o.meta;
-    r.forEach((d) => {
-      const { colors: p, type: L, axis: c, valueColumn: h } = d, i = (c === "x" ? u : f)[h.valueLabels ?? h.value];
-      if (L === "discrete") {
-        const a = it.uniq(Object.values(i).map(String)).sort();
-        this.annotationColorScales[d.id] = {
+      const p = Object.entries(t.colorsMap);
+      this.colorScale = W().domain(p.map((u) => u[0])).range(p.map((u) => u[1])).unknown("#ccc");
+    } else t.colorsList && (this.colorScale = yt(t.colorsList, r.map(String)));
+    const { xDataByKeys: d, yDataByKeys: y } = i.meta;
+    a.forEach((p) => {
+      const { colors: u, type: A, axis: l, valueColumn: h } = p, o = (l === "x" ? d : y)[h.valueLabels ?? h.value];
+      if (A === "discrete") {
+        const c = ot.uniq(Object.values(o).map(String)).sort();
+        this.annotationColorScales[p.id] = {
           type: "discrete",
-          scale: St(p, a)
+          scale: xt(u, c)
         };
       } else {
-        const a = Object.values(i).map(Number);
-        if (!a.length)
+        const c = Object.values(o).map(Number);
+        if (!c.length)
           return;
-        const [y = a[0], x = a[0]] = At(a);
-        this.annotationColorScales[d.id] = {
+        const [f = c[0], E = c[0]] = At(c);
+        this.annotationColorScales[p.id] = {
           type: "continuous",
-          scale: xt(p, y, x, 0, 0.5, 1)
+          scale: St(u, f, E, 0, 0.5, 1)
         };
       }
     });
   }
-  updateDendrogram(s, e, t, r, o, n, l) {
-    s.forEach((u) => {
-      this.dendrograms[u] = { x: { treesByGroupKey: {}, data: n }, y: { treesByGroupKey: {}, data: l } };
-      const { xKeysByGroups: f, yKeysByGroups: d } = r[u], { hierarchyByGroupX: p, hierarchyByGroupY: L } = o[u];
-      if (n) {
-        const c = e.reduce((h, i) => {
-          var a;
-          return Math.max(h, (a = p[i]) == null ? void 0 : a.data.height);
+  updateDendrogram(s, e, t, a, i, r, n) {
+    s.forEach((d) => {
+      this.dendrograms[d] = { x: { treesByGroupKey: {}, data: r }, y: { treesByGroupKey: {}, data: n } };
+      const { xKeysByGroups: y, yKeysByGroups: p } = a[d];
+      if (r) {
+        const { hierarchyByGroupX: u } = i[d], A = e.reduce((l, h) => {
+          var o;
+          return Math.max(l, (o = u[h]) == null ? void 0 : o.data.height);
         }, 0);
-        this.dendrograms[u].x.treesByGroupKey = e.reduce((h, i) => {
-          const a = p[i], y = f[i];
-          Z().separation(() => 1).size([y.length * this.step.x[u], n.size])(
-            a
+        this.dendrograms[d].x.treesByGroupKey = e.reduce((l, h) => {
+          const o = u[h], c = y[h];
+          Z().separation(() => 1).size([c.length * this.step.x[d], r.size])(
+            o
           );
-          const x = a, E = N().domain(n.position === "top" ? [0, c] : [c, 0]).range([n.size, 0]);
-          return tt(x, E, "y"), et(x, this.scales.x[u](y[0]), "x"), h[i] = x, h;
-        }, {}), this.dendrograms[u].x.data = n;
+          const f = o, E = N().domain(r.position === "top" ? [0, A] : [A, 0]).range([r.size, 0]);
+          return tt(f, E, "y"), et(f, this.scales.x[d](c[0]), "x"), l[h] = f, l;
+        }, {}), this.dendrograms[d].x.data = r;
       }
-      if (l) {
-        const c = t.reduce((h, i) => {
-          var a;
-          return Math.max(h, (a = L[i]) == null ? void 0 : a.data.height);
+      if (n) {
+        const { hierarchyByGroupY: u } = i[d], A = t.reduce((l, h) => {
+          var o;
+          return Math.max(l, (o = u[h]) == null ? void 0 : o.data.height);
         }, 0);
-        this.dendrograms[u].y.treesByGroupKey = t.reduce((h, i) => {
-          const a = L[i], y = d[i];
-          Z().separation(() => 1).size([y.length * this.step.y[u], l.size])(
-            a
+        this.dendrograms[d].y.treesByGroupKey = t.reduce((l, h) => {
+          const o = u[h], c = p[h];
+          Z().separation(() => 1).size([c.length * this.step.y[d], n.size])(
+            o
           );
-          const x = a, E = N().domain(l.position === "left" ? [0, c] : [c, 0]).range([l.size, 0]);
-          return et(x, this.scales.y[u](y[0]), "x", "y"), tt(x, E, "x"), h[i] = x, h;
-        }, {}), this.dendrograms[u].y.data = l;
+          const f = o, E = N().domain(n.position === "left" ? [0, A] : [A, 0]).range([n.size, 0]);
+          return et(f, this.scales.y[d](c[0]), "x", "y"), tt(f, E, "x"), l[h] = f, l;
+        }, {}), this.dendrograms[d].y.data = n;
       }
     });
   }
@@ -347,39 +347,39 @@ class Ut {
     if (!s)
       return;
     const e = Object.keys(s);
-    this.dendrogramAesScales = e.reduce((t, r) => {
-      const o = s[r], n = Object.keys(o);
-      return t[r] = W().domain(n).range(
-        n.map((l) => ({
+    this.dendrogramAesScales = e.reduce((t, a) => {
+      const i = s[a], r = Object.keys(i);
+      return t[a] = W().domain(r).range(
+        r.map((n) => ({
           ...Q,
-          ...o[l]
+          ...i[n]
         }))
       ).unknown(Q), t;
     }, {});
   }
-  render(s, e, t, r, o, n, l, u, f, d, p, L, c, h, i, a, y) {
-    var x;
-    const { meta: E, facets: C } = n, { facetKeys: g, xGroupKeys: b, yGroupKeys: S, valueExtent: G } = E, { xAxis: M, yAxis: w, title: D, size: v, valueType: T } = t;
-    this.updateChartsSizes(v, r, n, o.groupGap), this.updateAesScale(T, G.dataSource, o, l, n, c, h), this.updateScales(g, n, o.groupGap, r, v, t.xAxis, t.yAxis, f, d, a), this.updateCaptionsSize(n, M, w, r), this.updateChartDimensions(
-      v,
+  render(s, e, t, a, i, r, n, d, y, p, u, A, l, h, o, c, f) {
+    var E;
+    const { meta: K, facets: S } = r, { facetKeys: g, xGroupKeys: C, yGroupKeys: x, valueExtent: G } = K, { xAxis: w, yAxis: M, title: H, size: L, valueType: v } = t;
+    this.updateChartsSizes(L, a, r, i.groupGap), this.updateAesScale(v, G.dataSource, i, n, r, l, h), this.updateScales(g, r, i.groupGap, a, L, t.xAxis, t.yAxis, y, p, c), this.updateCaptionsSize(r, w, M, a), this.updateChartDimensions(
+      L,
       g,
-      b,
-      S,
-      r,
-      M,
+      C,
+      x,
+      a,
       w,
-      l,
-      f,
-      d
-    ), this.updateLegendSize(T, t.legend, l, u, G.dataSource), this.updateMargins(D, v), this.updateDendrogram(g, b, S, C, p, f, d), this.updateDendrogramAesScales(L);
-    const H = /* @__PURE__ */ $.jsx(rt, { dataFrame: s, children: /* @__PURE__ */ $.jsx(
+      M,
+      n,
+      y,
+      p
+    ), this.updateLegendSize(v, t.legend, n, d, G.dataSource), this.updateMargins(H, L), this.updateDendrogram(g, C, x, S, u, y, p), this.updateDendrogramAesScales(A);
+    const D = /* @__PURE__ */ O.jsx(rt, { dataFrame: s, children: /* @__PURE__ */ O.jsx(
       dt,
       {
-        aes: o,
-        annotations: l,
+        aes: i,
+        annotations: n,
         annotationColorScales: this.annotationColorScales,
         captionsSizes: this.captionsSizes,
-        cellsMeta: E,
+        cellsMeta: K,
         columnsCount: this.columnsCount,
         chartsDimensions: this.chartsDimensions,
         chartSettings: t,
@@ -388,28 +388,28 @@ class Ut {
         dendrogramAesScales: this.dendrogramAesScales,
         dendrograms: this.dendrograms,
         facetKeys: g,
-        facetSettings: r,
-        groupedCells: C,
+        facetSettings: a,
+        groupedCells: S,
         labelAngles: this.labelAngles,
         legend: this.legend,
         margins: this.margins,
         scales: this.scales,
         settingsId: e,
         step: this.step,
-        xGroupKeys: b,
-        yGroupKeys: S,
-        onTooltipHintSwitch: i,
-        cellsRenderingMode: y
+        xGroupKeys: C,
+        yGroupKeys: x,
+        onTooltipHintSwitch: o,
+        cellsRenderingMode: f
       }
     ) });
-    this.component = H, (x = this.reactRoot) == null || x.render(H);
+    this.component = D, (E = this.reactRoot) == null || E.render(D);
   }
   renderError(s) {
     var e;
-    (e = this.reactRoot) == null || e.render(/* @__PURE__ */ $.jsx(at, { message: s }));
+    (e = this.reactRoot) == null || e.render(/* @__PURE__ */ O.jsx(at, { message: s }));
   }
 }
 export {
-  Ut as default
+  Jt as default
 };
 //# sourceMappingURL=ChartRenderer.js.map