@hybridcore/ui 1.6.14 → 1.6.16

package/dist/components/charts/xy-chart/logic.js

@@ -1,46 +1,46 @@
-import { R as P, A as V } from "../../../AnimatedTheme-ktdO3Bel.js";
-import { useThemeProps as W, useTheme as z } from "@mui/material";
-import k from "lodash";
-import { useId as N, useRef as j, useEffect as H } from "react";
-import { humanizeLabel as F } from "../_common/format.js";
-import { attachCombinedAxisTooltip as M } from "../_common/tooltip.js";
-import { colorSetFromPalette as U, applyValueFormat as _ } from "../_common/utils.js";
-import { c, a as x, p as $ } from "../../../Entity-BJCuhdq_.js";
-import { X as q, V as J } from "../../../AxisRenderer-BCQoUJw6.js";
-import { L as K } from "../../../Legend-CFvQiIfn.js";
-import { A as L, a as Q } from "../../../AxisRendererY-AXWvGU6r.js";
-import { C as Z } from "../../../CategoryAxis-B6NqW8qd.js";
-import { T as ee, R as te, L as re } from "../../../Tooltip-vyZRZWih.js";
-import { X as oe } from "../../../XYCursor-CVUSpqb9.js";
-import { G as ae, D as se } from "../../../GaplessDateAxis-B2g2jgSG.js";
-import { D as ie } from "../../../DateAxis-DEXKps1S.js";
-import { C as ne } from "../../../ColumnSeries-CtRTsn-E.js";
-import { B as le } from "../../../Bullet-Djj7Vs9T.js";
-const Fe = (R) => {
-  const A = W({ props: R, name: "HCXYChart" }), {
-    dimensions: p,
-    values: n,
-    data: d,
-    initDelay: O = 0,
-    baseInterval: y,
-    colors: g,
-    skipEmptyDates: w = !1,
-    sx: B,
-    ...E
-  } = A, i = z(), b = `hc-xy-chart-${N().replace(/:/g, "")}`, u = j(null), v = p.length < 1 ? "Missing dimensions config!" : null;
-  H(() => {
-    if (v) return;
-    let f;
-    return f = setTimeout(() => {
-      var T, X, Y;
-      const e = P.new(b);
-      u.current = e, e.setThemes([V.new(e)]), e.interfaceColors.setAll({
-        text: c(i.palette.text.primary),
-        grid: c(i.palette.divider),
-        stroke: c(i.palette.divider)
+import { R as K, A as Q } from "../../../AnimatedTheme-ktdO3Bel.js";
+import { useThemeProps as Z, useTheme as ee } from "@mui/material";
+import y from "lodash";
+import { useId as te, useRef as re, useEffect as oe } from "react";
+import { humanizeLabel as E } from "../_common/format.js";
+import { attachCombinedAxisTooltip as ae } from "../_common/tooltip.js";
+import { colorSetFromPalette as se, applyValueFormat as ie } from "../_common/utils.js";
+import { c as p, a as S, p as z } from "../../../Entity-BJCuhdq_.js";
+import { X as ne, V as le } from "../../../AxisRenderer-BCQoUJw6.js";
+import { L as ce } from "../../../Legend-CFvQiIfn.js";
+import { C as me } from "../../../CategoryAxis-B6NqW8qd.js";
+import { T as pe, R as de } from "../../../Tooltip-vyZRZWih.js";
+import { X as ue } from "../../../XYCursor-CVUSpqb9.js";
+import { a as B, A as G } from "../../../AxisRendererY-AXWvGU6r.js";
+import { G as fe, D as he } from "../../../GaplessDateAxis-B2g2jgSG.js";
+import { D as xe } from "../../../DateAxis-DEXKps1S.js";
+import { C as Ae } from "../../../ColumnSeries-CtRTsn-E.js";
+const ze = (I) => {
+  const g = Z({ props: I, name: "HCXYChart" }), {
+    dimensions: l,
+    values: c,
+    data: f,
+    initDelay: V = 0,
+    baseInterval: v,
+    colors: w,
+    skipEmptyDates: b = !1,
+    orientation: D = "vertical",
+    sx: W,
+    ...N
+  } = g, n = ee(), X = `hc-xy-chart-${te().replace(/:/g, "")}`, h = re(null), C = l.length < 1 ? "Missing dimensions config!" : null;
+  oe(() => {
+    if (C) return;
+    let x;
+    return x = setTimeout(() => {
+      var k, L, O;
+      const t = D === "horizontal", e = K.new(X);
+      h.current = e, e.setThemes([Q.new(e)]), e.interfaceColors.setAll({
+        text: p(n.palette.text.primary),
+        grid: p(n.palette.divider),
+        stroke: p(n.palette.divider)
       });
-      const r = e.container.children.push(
-        q.new(e, {
+      const a = e.container.children.push(
+        ne.new(e, {
           panX: !1,
           panY: !1,
           wheelX: "none",
@@ -50,137 +50,138 @@ const Fe = (R) => {
           layout: e.verticalLayout
         })
       );
-      r.set("colors", U(e, g));
-      const G = r.children.push(
-        K.new(e, {
-          centerX: x,
-          x
+      a.set("colors", se(e, w));
+      const q = a.children.push(
+        ce.new(e, {
+          centerX: S,
+          x: S
         })
-      ), a = p[0];
-      let o, m = d;
-      if (a.type === "date") {
-        const t = w ? ae : ie;
-        o = r.xAxes.push(
-          t.new(e, {
+      ), s = l[0], R = t ? B : G, H = t ? G : B, Y = t ? a.yAxes : a.xAxes, M = t ? a.xAxes : a.yAxes;
+      let o, d = f;
+      if (s.type === "date") {
+        const r = b ? fe : xe;
+        o = Y.push(
+          r.new(e, {
             maxDeviation: 0,
-            baseInterval: y || { timeUnit: "day", count: 1 },
-            renderer: L.new(e, { minGridDistance: 60 })
+            baseInterval: v || { timeUnit: "day", count: 1 },
+            renderer: R.new(e, { minGridDistance: 60 })
           })
-        ), m = k.orderBy(d, [a.value]);
+        ), d = y.orderBy(f, [s.value]);
       } else {
-        const t = L.new(e, {
+        const r = R.new(e, {
           cellStartLocation: 0.1,
           cellEndLocation: 0.9,
           minGridDistance: 30
         });
-        o = r.xAxes.push(
-          Z.new(e, {
-            categoryField: a.value,
-            renderer: t
+        o = Y.push(
+          me.new(e, {
+            categoryField: s.value,
+            renderer: r
           })
-        ), t.grid.template.setAll({ location: 1 }), o.labelsContainer.set(
+        ), r.grid.template.setAll({ location: 1 }), o.labelsContainer.set(
           "tooltip",
-          ee.new(e, { pointerOrientation: "down" })
-        ), t.labels.template.setAll({
+          pe.new(e, {
+            pointerOrientation: t ? "right" : "down"
+          })
+        ), r.labels.template.setAll({
           oversizedBehavior: "truncate",
           maxWidth: 150,
           tooltipText: "{category}"
-        }), t.labels.template.setup = function(s) {
-          s.set(
+        }), r.labels.template.setup = function(i) {
+          i.set(
             "background",
-            te.new(e, {
-              fill: c(0),
+            de.new(e, {
+              fill: p(0),
               fillOpacity: 0
             })
           );
-        }, o.onPrivate("cellWidth", function(s) {
-          t.labels.template.set("maxWidth", s);
+        }, t || o.onPrivate("cellWidth", function(i) {
+          r.labels.template.set("maxWidth", i);
         }), e.numberFormatter.setAll({
           numberFormat: "#",
-          numericFields: ["valueX"]
-        }), o.data.setAll(m);
+          numericFields: [t ? "valueY" : "valueX"]
+        });
+        const m = l.length > 1 ? y.uniqBy(d, s.value) : d;
+        o.data.setAll(m);
       }
-      const D = r.yAxes.push(
-        J.new(e, {
-          renderer: Q.new(e, { strokeOpacity: 0.1 })
+      const A = M.push(
+        le.new(e, {
+          renderer: H.new(e, { strokeOpacity: 0.1 }),
+          // Horizontal bars must grow from a zero baseline; otherwise the auto
+          // min crops the axis (e.g. starting at 100) and distorts bar lengths.
+          ...t ? { min: 0 } : {}
         })
-      );
-      (T = o.get("renderer")) == null || T.grid.template.setAll({
-        stroke: c(i.palette.divider),
+      ), U = t ? A : o, _ = t ? o : A;
+      (k = o.get("renderer")) == null || k.grid.template.setAll({
+        stroke: p(n.palette.divider),
         strokeOpacity: 1
-      }), (X = D.get("renderer")) == null || X.grid.template.setAll({
-        stroke: c(i.palette.divider),
+      }), (L = A.get("renderer")) == null || L.grid.template.setAll({
+        stroke: p(n.palette.divider),
         strokeOpacity: 1
       });
-      function C(t, s, h, I) {
-        const l = r.series.push(
-          ne.new(e, {
-            name: t,
-            xAxis: o,
-            yAxis: D,
-            valueYField: I,
-            ...a.type === "date" ? { valueXField: h } : { categoryXField: h }
+      function F(r, m, i, P) {
+        const $ = t ? { valueXField: P } : { valueYField: P }, J = s.type === "date" ? t ? { valueYField: i } : { valueXField: i } : t ? { categoryYField: i } : { categoryXField: i }, u = a.series.push(
+          Ae.new(e, {
+            name: r,
+            xAxis: U,
+            yAxis: _,
+            ...$,
+            ...J
           })
         );
-        l.columns.template.setAll({
-          width: $(90),
+        u.columns.template.setAll({
+          ...t ? { height: z(90) } : { width: z(90) },
           strokeOpacity: 0
-        }), a.type === "date" && (l.data.processor = se.new(e, {
+        }), s.type === "date" && (u.data.processor = he.new(e, {
           dateFormat: "i",
-          dateFields: [h]
-        })), l.data.setAll(s), l.appear(), l.bullets.push(function() {
-          return le.new(e, {
-            locationY: 0,
-            sprite: re.new(e, {
-              text: "{valueY}",
-              fill: e.interfaceColors.get("alternativeText"),
-              centerY: 0,
-              centerX: x,
-              populateText: !0
-            })
-          });
-        }), G.data.push(l);
+          dateFields: [i]
+        })), u.data.setAll(m), u.appear(), q.data.push(u);
       }
-      if (p.length === 1)
-        n.forEach((t) => {
-          C(
-            t.label ?? F(t.name),
-            m,
-            a.value,
-            t.dataFieldName
+      if (l.length === 1)
+        c.forEach((r) => {
+          F(
+            r.label ?? E(r.name),
+            d,
+            s.value,
+            r.dataFieldName
           );
         });
       else {
-        const t = k.groupBy(m, p[1].value);
-        Object.keys(t).forEach((s) => {
-          C(
-            F(s),
-            t[s],
-            a.value,
-            n[0].dataFieldName
+        const r = y.groupBy(d, l[1].value);
+        Object.keys(r).forEach((m) => {
+          F(
+            E(m),
+            r[m],
+            s.value,
+            c[0].dataFieldName
           );
         });
       }
-      r.set(
+      const T = a.set(
         "cursor",
-        oe.new(e, { xAxis: o, behavior: "none" })
-      ).lineY.set("visible", !1), M({
+        ue.new(
+          e,
+          t ? { yAxis: o, behavior: "none" } : { xAxis: o, behavior: "none" }
+        )
+      );
+      t ? T.lineX.set("visible", !1) : T.lineY.set("visible", !1), ae({
         root: e,
-        chart: r,
+        chart: a,
         xAxis: o,
-        theme: i,
-        isDateAxis: a.type === "date",
-        baseInterval: y,
-        follow: !0
-      }), _(e, (Y = n == null ? void 0 : n[0]) == null ? void 0 : Y.format), r.appear(1e3, 100);
-    }, O), () => {
-      var e;
-      f && clearTimeout(f), (e = u.current) == null || e.dispose(), u.current = null;
+        theme: n,
+        isDateAxis: s.type === "date",
+        baseInterval: v,
+        follow: !0,
+        horizontal: t
+      }), ie(e, (O = c == null ? void 0 : c[0]) == null ? void 0 : O.format), a.appear(1e3, 100);
+    }, V), () => {
+      var t;
+      x && clearTimeout(x), (t = h.current) == null || t.dispose(), h.current = null;
     };
-  }, [d, p, n, i.palette.mode, g, w]);
-  const S = { ...A };
-  return { chartId: b, ownerState: S, sx: B, error: v, other: E };
+  }, [f, l, c, n.palette.mode, w, b, D]);
+  const j = { ...g };
+  return { chartId: X, ownerState: j, sx: W, error: C, other: N };
 };
 export {
-  Fe as useXYChartLogic
+  ze as useXYChartLogic
 };