@hybridcore/ui 1.6.6 → 1.6.8

package/dist/components/charts/line/logic.js

@@ -1,143 +1,241 @@
-import { R as E, a as M, A as z, T as A } from "../../../AnimatedTheme-jnasw6rT.js";
-import { useThemeProps as H, useTheme as N } from "@mui/material";
-import b from "lodash";
-import { useId as S, useRef as U, useEffect as Z } from "react";
-import { colorSetFromPalette as _, applyValueFormat as $ } from "../_common/utils.js";
-import { c as l, p as g, b as D } from "../../../ColorSet-C7vpNXhM.js";
-import { X as j, V as q } from "../../../AxisRenderer-DTyLLA6c.js";
-import { D as G } from "../../../DateAxis-YX3QNIB-.js";
-import { A as L, a as J } from "../../../AxisRendererY-C_ItLPNV.js";
-import { C as K } from "../../../CategoryAxis-CwnfaGc8.js";
-import { L as Q } from "../../../LineSeries-Uiv5o56b.js";
-import { D as ee } from "../../../DataProcessor-CHDO51q4.js";
-import { X as te } from "../../../XYCursor-C8WktvKM.js";
-import { L as re } from "../../../Legend-Dp_MKfS4.js";
-const xe = (Y) => {
-  const v = H({ props: Y, name: "HCLineChart" }), {
-    dimensions: t,
-    values: a,
-    data: m,
-    initDelay: R = 0,
-    baseInterval: I,
-    colors: x,
-    sx: O,
-    ...P
-  } = v, n = N(), w = `hc-line-chart-${S().replace(/:/g, "")}`, u = U(null);
-  let d = null;
-  t.length < 1 ? d = "Missing dimensions config!" : a.length < 1 && (d = "Missing values config!"), Z(() => {
-    if (d) return;
-    let h;
-    return h = setTimeout(() => {
-      var k, T, C, F;
-      const e = E.new(w);
-      u.current = e;
-      const W = M.new(e);
-      e.setThemes([z.new(e), W]), e.interfaceColors.setAll({
-        text: l(n.palette.text.primary),
-        grid: l(n.palette.divider),
-        stroke: l(n.palette.divider)
+import { R as Z, a as q, A as J, T as K } from "../../../AnimatedTheme-jnasw6rT.js";
+import { useThemeProps as Q, useTheme as ee } from "@mui/material";
+import _ from "lodash";
+import { useId as te, useRef as oe, useEffect as re } from "react";
+import { humanizeLabel as ae } from "../_common/format.js";
+import { colorSetFromPalette as se, applyValueFormat as ne } from "../_common/utils.js";
+import { c, p as k, b as U } from "../../../ColorSet-C7vpNXhM.js";
+import { X as ie, V as le } from "../../../AxisRenderer-DTyLLA6c.js";
+import { D as me } from "../../../DateAxis-YX3QNIB-.js";
+import { A as V, a as de } from "../../../AxisRendererY-C_ItLPNV.js";
+import { C as pe } from "../../../CategoryAxis-CwnfaGc8.js";
+import { L as ce } from "../../../LineSeries-Uiv5o56b.js";
+import { D as ue } from "../../../DataProcessor-CHDO51q4.js";
+import { B as ye } from "../../../Bullet-DVczI2TD.js";
+import { C as fe } from "../../../Circle-Cy5s-pVc.js";
+import { X as he } from "../../../XYCursor-C8WktvKM.js";
+import { L as ge } from "../../../Legend-Dp_MKfS4.js";
+const R = 1.1, Ae = {
+  millisecond: 1,
+  second: 1e3,
+  minute: 6e4,
+  hour: 36e5,
+  day: 864e5,
+  week: 6048e5,
+  month: 2592e6,
+  year: 31536e6
+}, xe = {
+  millisecond: "d MMM, yyyy HH:mm:ss.SSS",
+  second: "d MMM, yyyy HH:mm:ss",
+  minute: "d MMM, yyyy HH:mm",
+  hour: "d MMM, yyyy HH:mm",
+  day: "d MMM, yyyy",
+  week: "d MMM, yyyy",
+  month: "MMM yyyy",
+  year: "yyyy"
+}, Ue = (B) => {
+  const b = Q({ props: B, name: "HCLineChart" }), {
+    dimensions: r,
+    values: y,
+    data: w,
+    initDelay: E = 0,
+    baseInterval: l,
+    colors: X,
+    connectMissingData: T = !0,
+    sx: G,
+    ...I
+  } = b, m = ee(), H = `hc-line-chart-${te().replace(/:/g, "")}`, F = oe(null);
+  let v = null;
+  r.length < 1 ? v = "Missing dimensions config!" : y.length < 1 && (v = "Missing values config!"), re(() => {
+    if (v) return;
+    let C;
+    return C = setTimeout(() => {
+      var $, O, S, Y, P;
+      const e = Z.new(H);
+      F.current = e;
+      const j = q.new(e);
+      e.setThemes([J.new(e), j]), e.interfaceColors.setAll({
+        text: c(m.palette.text.primary),
+        grid: c(m.palette.divider),
+        stroke: c(m.palette.divider)
       });
-      const r = e.container.children.push(
-        j.new(e, {
+      const n = e.container.children.push(
+        ie.new(e, {
           panX: !0,
           panY: !0,
           wheelX: "none",
           wheelY: "none",
-          maxTooltipDistance: 0,
+          // -1 = show the tooltip from the cursor's x-position anywhere in the
+          // plot, not only when the pointer is on a data point / line.
+          maxTooltipDistance: -1,
           pinchZoomX: !0
         })
       );
-      r.set("colors", _(e, x));
-      let i, c = m;
-      t[0].type === "date" ? (i = r.xAxes.push(
-        G.new(e, {
+      n.set("colors", se(e, X));
+      let d, f = w;
+      r[0].type === "date" ? (d = n.xAxes.push(
+        me.new(e, {
           maxDeviation: 0.1,
           groupData: !1,
-          baseInterval: I || { timeUnit: "day", count: 1 },
-          renderer: L.new(e, {}),
-          tooltip: A.new(e, {})
+          baseInterval: l || { timeUnit: "day", count: 1 },
+          renderer: V.new(e, {})
         })
-      ), c = b.orderBy(m, [t[0].value])) : (i = r.xAxes.push(
-        K.new(e, {
-          categoryField: t[0].value,
-          renderer: L.new(e, {}),
-          tooltip: A.new(e, {})
+      ), f = _.orderBy(w, [r[0].value])) : (d = n.xAxes.push(
+        pe.new(e, {
+          categoryField: r[0].value,
+          renderer: V.new(e, {})
         })
       ), e.numberFormatter.setAll({
         numberFormat: "#",
         numericFields: ["valueX"]
-      }), c = b.orderBy(m, [t[0].value]), i.data.setAll(c));
-      const y = r.yAxes.push(
-        q.new(e, {
-          renderer: J.new(e, {})
+      }), f = _.orderBy(w, [r[0].value]), d.data.setAll(f));
+      const N = n.yAxes.push(
+        le.new(e, {
+          renderer: de.new(e, {})
         })
       );
-      (k = i.get("renderer")) == null || k.grid.template.setAll({
-        stroke: l(n.palette.divider),
+      ($ = d.get("renderer")) == null || $.grid.template.setAll({
+        stroke: c(m.palette.divider),
         strokeOpacity: 1
-      }), (T = i.get("renderer")) == null || T.labels.template.setAll({ paddingTop: 12 }), (C = y.get("renderer")) == null || C.grid.template.setAll({
-        stroke: l(n.palette.divider),
+      }), (O = d.get("renderer")) == null || O.labels.template.setAll({ paddingTop: 12 }), (S = N.get("renderer")) == null || S.grid.template.setAll({
+        stroke: c(m.palette.divider),
         strokeOpacity: 1
-      }), a.forEach((s) => {
-        const o = r.series.push(
-          Q.new(e, {
-            name: s.name,
-            xAxis: i,
-            yAxis: y,
-            valueYField: s.dataFieldName,
-            ...t[0].type === "date" ? { valueXField: t[0].value } : { categoryXField: t[0].value },
-            tooltip: A.new(e, {
-              pointerOrientation: "horizontal",
-              labelText: "{name}: {valueY}"
-            })
+      });
+      const M = K.new(e, {
+        getFillFromSprite: !1
+      });
+      (Y = M.get("background")) == null || Y.setAll({
+        fill: c(m.palette.background.paper),
+        stroke: c(m.palette.divider),
+        fillOpacity: 1
+      }), M.label.setAll({
+        fill: c(m.palette.text.primary),
+        textAlign: "left",
+        lineHeight: k(160)
+      });
+      const L = xe[(l == null ? void 0 : l.timeUnit) ?? "day"], z = c(m.palette.text.secondary).toCSSHex();
+      M.label.adapters.add("text", () => {
+        let t = "";
+        const a = [];
+        if (n.series.each((i) => {
+          const s = i.get("tooltipDataItem"), p = s == null ? void 0 : s.get("valueY");
+          if (s === void 0 || p === void 0 || p === null)
+            return;
+          if (!t)
+            if (r[0].type === "date") {
+              const o = s.get("valueX");
+              typeof o == "number" && (t = e.dateFormatter.format(
+                new Date(o),
+                L
+              ));
+            } else
+              t = `${s.get("categoryX") ?? ""}`;
+          const u = i.get("stroke"), g = u ? `[${u.toCSSHex()}]●[/] ` : "";
+          a.push(
+            `${g}${i.get("name")}: ${e.numberFormatter.format(
+              p
+            )}`
+          );
+        }), a.length === 0) {
+          if (r[0].type === "date") {
+            const s = d.positionToValue(
+              d.getPrivate("tooltipPosition", 0)
+            );
+            typeof s == "number" && !Number.isNaN(s) && (t = e.dateFormatter.format(new Date(s), L));
+          }
+          const i = `[${z}]No data[/]`;
+          return t ? `[bold]${t}[/]
+${i}` : i;
+        }
+        return t ? `[bold]${t}[/]
+${a.join(`
+`)}` : a.join(`
+`);
+      }), d.set("tooltip", M), y.forEach((t) => {
+        const a = n.series.push(
+          ce.new(e, {
+            // Legend/tooltip label: explicit override, else humanize the raw
+            // backend field (snake_case / lowercase → Title Case).
+            name: t.label ?? ae(t.name),
+            xAxis: d,
+            yAxis: N,
+            valueYField: t.dataFieldName,
+            // When false, the line breaks at missing points. On a date axis the
+            // break is auto-detected when adjacent points are spaced more than
+            // `autoGapCount` (default 1.1) base intervals apart, so absent dates
+            // surface as gaps instead of being bridged by a straight segment.
+            connect: T,
+            autoGapCount: R,
+            ...r[0].type === "date" ? { valueXField: r[0].value } : { categoryXField: r[0].value }
           })
         );
-        t[0].type === "date" && (o.data.processor = ee.new(e, {
+        if (r[0].type === "date" && (a.data.processor = ue.new(e, {
           dateFormat: "i",
-          dateFields: [t[0].value]
-        })), o.data.setAll(c), o.strokes.template.setAll({ strokeWidth: 2 }), o.appear();
-      }), r.set(
+          dateFields: [r[0].value]
+        })), r[0].type === "date") {
+          const i = r[0].value, s = Ae[(l == null ? void 0 : l.timeUnit) ?? "day"] * ((l == null ? void 0 : l.count) ?? 1), p = T ? 1 / 0 : s * R, u = f.map((o) => ({
+            t: new Date(o[i]).getTime(),
+            hasValue: o[t.dataFieldName] !== null && o[t.dataFieldName] !== void 0
+          })).filter((o) => o.hasValue && !Number.isNaN(o.t)), g = /* @__PURE__ */ new Set();
+          u.forEach((o, A) => {
+            const D = A > 0 ? o.t - u[A - 1].t : 1 / 0, x = A < u.length - 1 ? u[A + 1].t - o.t : 1 / 0;
+            D > p && x > p && g.add(o.t);
+          }), g.size > 0 && a.bullets.push((o, A, D) => {
+            const x = D.dataContext;
+            if (g.has(new Date(x == null ? void 0 : x[i]).getTime()))
+              return ye.new(o, {
+                sprite: fe.new(o, {
+                  radius: 3,
+                  fill: a.get("fill"),
+                  stroke: o.interfaceColors.get("background"),
+                  strokeWidth: 1
+                })
+              });
+          });
+        }
+        a.data.setAll(f), a.strokes.template.setAll({ strokeWidth: 2 }), a.appear();
+      }), n.set(
         "cursor",
-        te.new(e, { behavior: "none" })
+        he.new(e, { xAxis: d, behavior: "none" })
       ).lineY.set("visible", !1);
-      const p = r.bottomAxesContainer.children.push(
-        re.new(e, {
-          width: g(100),
+      const h = n.bottomAxesContainer.children.push(
+        ge.new(e, {
+          width: k(100),
           paddingTop: 10,
-          centerX: g(50),
-          x: g(50),
+          centerX: k(50),
+          x: k(50),
           layout: e.gridLayout
         })
       );
-      p.itemContainers.template.events.on("pointerover", function(s) {
-        var X;
-        const o = s.target, B = (X = o == null ? void 0 : o.dataItem) == null ? void 0 : X.dataContext;
-        r.series.each(function(f) {
-          f !== B ? f.strokes.template.setAll({
+      h.itemContainers.template.events.on("pointerover", function(t) {
+        var s;
+        const a = t.target, i = (s = a == null ? void 0 : a.dataItem) == null ? void 0 : s.dataContext;
+        n.series.each(function(p) {
+          p !== i ? p.strokes.template.setAll({
             strokeOpacity: 0.15,
-            stroke: l(0)
-          }) : f.strokes.template.setAll({ strokeWidth: 3 });
+            stroke: c(0)
+          }) : p.strokes.template.setAll({ strokeWidth: 3 });
         });
-      }), p.itemContainers.template.events.on("pointerout", function() {
-        r.series.each(function(s) {
-          s.strokes.template.setAll({
+      }), h.itemContainers.template.events.on("pointerout", function() {
+        n.series.each(function(t) {
+          t.strokes.template.setAll({
             strokeOpacity: 1,
             strokeWidth: 2,
-            stroke: s.get("fill")
+            stroke: t.get("fill")
           });
         });
-      }), p.itemContainers.template.set("width", D), p.valueLabels.template.setAll({
-        width: D,
+      }), h.itemContainers.template.set("width", U), h.valueLabels.template.setAll({
+        width: U,
         textAlign: "right"
-      }), p.data.setAll(r.series.values), $(e, (F = a == null ? void 0 : a[0]) == null ? void 0 : F.format), r.appear(1e3, 100);
-    }, R), () => {
+      }), h.data.setAll(n.series.values), ne(e, (P = y == null ? void 0 : y[0]) == null ? void 0 : P.format), n.appear(1e3, 100);
+    }, E), () => {
       var e;
-      h && clearTimeout(h), (e = u.current) == null || e.dispose(), u.current = null;
+      C && clearTimeout(C), (e = F.current) == null || e.dispose(), F.current = null;
     };
-  }, [m, t, a, n.palette.mode, x]);
-  const V = { ...v };
-  return { chartId: w, ownerState: V, sx: O, error: d, other: P };
+  }, [w, r, y, m.palette.mode, X, T]);
+  const W = { ...b };
+  return { chartId: H, ownerState: W, sx: G, error: v, other: I };
 };
 export {
-  xe as useLineChartLogic
+  Ue as useLineChartLogic
 };

package/dist/components/charts/multiple-value-axes/logic.js

@@ -1,20 +1,21 @@
-import { G as P, R as M, A as j, T, b as q } from "../../../AnimatedTheme-jnasw6rT.js";
-import { useThemeProps as z, useTheme as U } from "@mui/material";
+import { G as X, R as j, A as z, T, b as q } from "../../../AnimatedTheme-jnasw6rT.js";
+import { useThemeProps as U, useTheme as $ } from "@mui/material";
 import C from "lodash";
-import { useId as $, useRef as H, useEffect as J } from "react";
-import { colorSetFromPalette as K, applyValueFormat as Q } from "../_common/utils.js";
+import { useId as H, useRef as J, useEffect as K } from "react";
+import { humanizeLabel as F } from "../_common/format.js";
+import { colorSetFromPalette as Q, applyValueFormat as Z } from "../_common/utils.js";
 import { c as D, a as w } from "../../../ColorSet-C7vpNXhM.js";
-import { X as Z, V as ee } from "../../../AxisRenderer-DTyLLA6c.js";
-import { L as te } from "../../../Legend-Dp_MKfS4.js";
-import { D as re } from "../../../DateAxis-YX3QNIB-.js";
-import { A as F, a as se } from "../../../AxisRendererY-C_ItLPNV.js";
-import { C as ae } from "../../../CategoryAxis-CwnfaGc8.js";
-import { X as ie } from "../../../XYCursor-C8WktvKM.js";
-import { L as oe } from "../../../LineSeries-Uiv5o56b.js";
-import { D as le } from "../../../DataProcessor-CHDO51q4.js";
-import { C as ne } from "../../../Circle-Cy5s-pVc.js";
-import { B as ce } from "../../../Bullet-DVczI2TD.js";
-class x extends P {
+import { X as ee, V as te } from "../../../AxisRenderer-DTyLLA6c.js";
+import { L as re } from "../../../Legend-Dp_MKfS4.js";
+import { D as se } from "../../../DateAxis-YX3QNIB-.js";
+import { A as P, a as ae } from "../../../AxisRendererY-C_ItLPNV.js";
+import { C as ie } from "../../../CategoryAxis-CwnfaGc8.js";
+import { X as oe } from "../../../XYCursor-C8WktvKM.js";
+import { L as le } from "../../../LineSeries-Uiv5o56b.js";
+import { D as ne } from "../../../DataProcessor-CHDO51q4.js";
+import { C as ce } from "../../../Circle-Cy5s-pVc.js";
+import { B as ue } from "../../../Bullet-DVczI2TD.js";
+class x extends X {
   _beforeChanged() {
     super._beforeChanged(), (this.isDirty("width") || this.isDirty("height") || this.isPrivateDirty("width") || this.isPrivateDirty("height")) && (this._clear = !0);
   }
@@ -39,33 +40,33 @@ Object.defineProperty(x, "classNames", {
   enumerable: !0,
   configurable: !0,
   writable: !0,
-  value: P.classNames.concat([x.className])
+  value: X.classNames.concat([x.className])
 });
-const A = ["CIRCLE", "RECTANGLE", "TRIANGLE"], Re = (L) => {
-  const n = z({ props: L, name: "HCMultipleValueAxes" }), {
+const A = ["CIRCLE", "RECTANGLE", "TRIANGLE"], Ee = (L) => {
+  const n = U({ props: L, name: "HCMultipleValueAxes" }), {
     dimensions: s,
     values: t,
-    data: d,
-    initDelay: X = 0,
-    baseInterval: Y,
+    data: p,
+    initDelay: Y = 0,
+    baseInterval: I,
     colors: R,
-    sx: I,
-    ...O
-  } = n, m = U(), _ = `hc-multiple-value-axes-${$().replace(/:/g, "")}`, y = H(null);
+    sx: O,
+    ...V
+  } = n, d = $(), _ = `hc-multiple-value-axes-${H().replace(/:/g, "")}`, y = J(null);
   let h = null;
-  s.length < 1 ? h = "MultipleValueAxes requires at least 1 dimension" : t.length < 1 && (h = "MultipleValueAxes requires at least 1 value"), J(() => {
+  s.length < 1 ? h = "MultipleValueAxes requires at least 1 dimension" : t.length < 1 && (h = "MultipleValueAxes requires at least 1 value"), K(() => {
     if (h) return;
     let b;
     return b = setTimeout(() => {
       var N;
-      const e = M.new(_);
-      y.current = e, e.setThemes([j.new(e)]), e.interfaceColors.setAll({
-        text: D(m.palette.text.primary),
-        grid: D(m.palette.divider),
-        stroke: D(m.palette.divider)
+      const e = j.new(_);
+      y.current = e, e.setThemes([z.new(e)]), e.interfaceColors.setAll({
+        text: D(d.palette.text.primary),
+        grid: D(d.palette.divider),
+        stroke: D(d.palette.divider)
       });
       const r = e.container.children.push(
-        Z.new(e, {
+        ee.new(e, {
           panX: !1,
           panY: !1,
           wheelX: "none",
@@ -73,44 +74,44 @@ const A = ["CIRCLE", "RECTANGLE", "TRIANGLE"], Re = (L) => {
           layout: e.verticalLayout
         })
       );
-      r.set("colors", K(e, R)), r.get("colors", {}).set("step", 3);
-      const B = r.children.push(
-        te.new(e, { centerX: w, x: w })
-      ), o = s[0];
-      let u, p = d;
-      o.type === "date" ? (u = r.xAxes.push(
-        re.new(e, {
+      r.set("colors", Q(e, R)), r.get("colors", {}).set("step", 3);
+      const G = r.children.push(
+        re.new(e, { centerX: w, x: w })
+      ), l = s[0];
+      let u, m = p;
+      l.type === "date" ? (u = r.xAxes.push(
+        se.new(e, {
           maxDeviation: 0.1,
           groupData: !1,
-          baseInterval: Y || { timeUnit: "day", count: 1 },
-          renderer: F.new(e, {}),
+          baseInterval: I || { timeUnit: "day", count: 1 },
+          renderer: P.new(e, {}),
           tooltip: T.new(e, {})
         })
-      ), p = C.orderBy(d, [o.value])) : (u = r.xAxes.push(
-        ae.new(e, {
-          categoryField: o.value,
-          renderer: F.new(e, {}),
+      ), m = C.orderBy(p, [l.value])) : (u = r.xAxes.push(
+        ie.new(e, {
+          categoryField: l.value,
+          renderer: P.new(e, {}),
           tooltip: T.new(e, {})
         })
       ), e.numberFormatter.setAll({
         numberFormat: "#",
         numericFields: ["valueX"]
-      }), p = C.orderBy(d, [o.value]), u.data.setAll(p));
-      function E(l, i, c, G, S, v, W) {
-        const f = se.new(e, { opposite: S }), k = r.yAxes.push(
-          ee.new(e, { maxDeviation: 1, renderer: f })
+      }), m = C.orderBy(p, [l.value]), u.data.setAll(m));
+      function E(i, o, c, S, W, v, M) {
+        const f = ae.new(e, { opposite: W }), k = r.yAxes.push(
+          te.new(e, { maxDeviation: 1, renderer: f })
         );
         r.yAxes.indexOf(k) > 0 && k.set("syncWithAxis", r.yAxes.getIndex(0));
         const a = r.series.push(
-          oe.new(e, {
-            name: i,
+          le.new(e, {
+            name: o,
             xAxis: u,
             yAxis: k,
-            valueYField: G,
-            ...o.type === "date" ? { valueXField: c } : { categoryXField: c },
+            valueYField: S,
+            ...l.type === "date" ? { valueXField: c } : { categoryXField: c },
             tooltip: T.new(e, {
               pointerOrientation: "horizontal",
-              labelText: `${i}: {valueY}`
+              labelText: `${o}: {valueY}`
             })
           })
         );
@@ -118,7 +119,7 @@ const A = ["CIRCLE", "RECTANGLE", "TRIANGLE"], Re = (L) => {
           stroke: a.get("fill"),
           strokeOpacity: 1,
           opacity: 1
-        }), W === "date" && (a.data.processor = le.new(e, {
+        }), M === "date" && (a.data.processor = ne.new(e, {
           dateFormat: "i",
           dateFields: [c]
         })), v !== void 0 && a.bullets.push(function() {
@@ -137,23 +138,23 @@ const A = ["CIRCLE", "RECTANGLE", "TRIANGLE"], Re = (L) => {
             strokeWidth: 2,
             stroke: a.get("stroke"),
             fill: e.interfaceColors.get("background")
-          }) : g = ne.new(e, {
+          }) : g = ce.new(e, {
             strokeWidth: 2,
             radius: 4,
             stroke: a.get("stroke"),
             fill: e.interfaceColors.get("background")
-          }), ce.new(e, { sprite: g });
-        }), a.data.setAll(l);
+          }), ue.new(e, { sprite: g });
+        }), a.data.setAll(i);
       }
       if (r.set(
         "cursor",
-        ie.new(e, { xAxis: u, behavior: "none" })
+        oe.new(e, { xAxis: u, behavior: "none" })
       ).lineY.set("visible", !1), s.length > 1) {
-        const l = C.groupBy(p, s[1].value);
-        Object.keys(l).forEach((i, c) => {
+        const i = C.groupBy(m, s[1].value);
+        Object.keys(i).forEach((o, c) => {
           E(
-            l[i],
-            i,
+            i[o],
+            F(o),
             s[0].value,
             t[0].dataFieldName,
             c !== 0,
@@ -161,26 +162,26 @@ const A = ["CIRCLE", "RECTANGLE", "TRIANGLE"], Re = (L) => {
           );
         });
       } else
-        t.forEach((l, i) => {
+        t.forEach((i, o) => {
           E(
-            p,
-            l.name,
-            o.value,
-            l.dataFieldName,
-            i !== 0,
-            A[i % A.length],
-            o.type
+            m,
+            i.label ?? F(i.name),
+            l.value,
+            i.dataFieldName,
+            o !== 0,
+            A[o % A.length],
+            l.type
           );
         });
-      B.data.setAll(r.series.values), Q(e, (N = t == null ? void 0 : t[0]) == null ? void 0 : N.format), r.appear(1e3, 100);
-    }, X), () => {
+      G.data.setAll(r.series.values), Z(e, (N = t == null ? void 0 : t[0]) == null ? void 0 : N.format), r.appear(1e3, 100);
+    }, Y), () => {
       var e;
       b && clearTimeout(b), (e = y.current) == null || e.dispose(), y.current = null;
     };
-  }, [d, s, t, m.palette.mode, R]);
-  const V = { ...n };
-  return { chartId: _, ownerState: V, sx: I, error: h, other: O };
+  }, [p, s, t, d.palette.mode, R]);
+  const B = { ...n };
+  return { chartId: _, ownerState: B, sx: O, error: h, other: V };
 };
 export {
-  Re as useMultipleValueAxesLogic
+  Ee as useMultipleValueAxesLogic
 };