@hybridcore/ui 1.6.6 → 1.6.8

package/dist/components/charts/_common/format.js

@@ -1,20 +1,20 @@
-const s = "—", o = (n) => new Intl.NumberFormat(
+const s = "—", l = (n) => new Intl.NumberFormat(
   "en-US",
   n === void 0 ? { maximumFractionDigits: 2 } : { minimumFractionDigits: n, maximumFractionDigits: n }
-), l = (n, e, i = s) => {
-  if (n == null || n === "") return i;
-  const t = Number(n);
-  if (Number.isNaN(t)) return String(n);
-  const r = o(e == null ? void 0 : e.decimals).format(t);
+), a = (n, e, c = s) => {
+  if (n == null || n === "") return c;
+  const i = Number(n);
+  if (Number.isNaN(i)) return String(n);
+  const r = l(e == null ? void 0 : e.decimals).format(i);
   return `${(e == null ? void 0 : e.prefix) ?? ""}${r}${(e == null ? void 0 : e.suffix) ?? ""}`;
-}, d = (n) => {
+}, b = (n) => {
   if (!n) return;
-  const { prefix: e, suffix: i, decimals: t } = n;
-  if (e === void 0 && i === void 0 && t === void 0)
+  const { prefix: e, suffix: c, decimals: i } = n;
+  if (e === void 0 && c === void 0 && i === void 0)
     return;
-  const r = t === void 0 ? "#,###.##" : t <= 0 ? "#,##0" : `#,##0.${"0".repeat(t)}`, c = (u) => u ? `'${u.replace(/'/g, "")}'` : "";
-  return `${c(e)}${r}${c(i)}`;
-}, v = (n) => n && n.replace(/[_-]+/g, " ").replace(/([a-z0-9])([A-Z])/g, "$1 $2").replace(/\s+/g, " ").trim().replace(/\b\w/g, (e) => e.toUpperCase()), a = (n, e) => {
+  const r = i === void 0 ? "#,###.##" : i <= 0 ? "#,##0" : `#,##0.${"0".repeat(i)}`, u = (o) => o ? `'${o.replace(/'/g, "")}'` : "";
+  return `${u(e)}${r}${u(c)}`;
+}, g = (n) => n && n.replace(/[_-]+/g, " ").replace(/([a-z0-9])([A-Z])/g, "$1 $2").replace(/\s+/g, " ").trim().replace(/\b\w/g, (e) => e.toUpperCase()), d = (n, e) => {
   switch (e.op) {
     case "lt":
       return n < e.value;
@@ -33,17 +33,23 @@ const s = "—", o = (n) => new Intl.NumberFormat(
     default:
       return !1;
   }
-}, b = (n, e) => {
-  const i = e == null ? void 0 : e.conditionalRules;
-  if (!(i != null && i.length)) return {};
-  const t = Number(n);
-  if (Number.isNaN(t)) return {};
-  const r = i.find((c) => a(t, c));
-  return r ? { color: r.color, backgroundColor: r.backgroundColor } : {};
+}, t = (n) => n || void 0, v = (n, e) => {
+  const c = {
+    color: t(e == null ? void 0 : e.color),
+    backgroundColor: t(e == null ? void 0 : e.backgroundColor)
+  }, i = e == null ? void 0 : e.conditionalRules;
+  if (!(i != null && i.length)) return c;
+  const r = Number(n);
+  if (Number.isNaN(r)) return c;
+  const u = i.find((o) => d(r, o));
+  return u ? {
+    color: t(u.color) ?? c.color,
+    backgroundColor: t(u.backgroundColor) ?? c.backgroundColor
+  } : c;
 };
 export {
-  d as buildAmNumberFormat,
-  l as formatValue,
-  v as humanizeLabel,
-  b as resolveConditionalStyle
+  b as buildAmNumberFormat,
+  a as formatValue,
+  g as humanizeLabel,
+  v as resolveConditionalStyle
 };

package/dist/components/charts/chart-wrapper/helpers.js

@@ -1,27 +1,52 @@
-import { camelCase as d, uniqBy as f } from "lodash";
-const D = (i) => {
-  const t = /* @__PURE__ */ new Map(), s = [], r = [];
-  return i.forEach((a, n) => {
-    const m = a.label, o = (a.propertyId ?? d(a.label)) + n, c = [{ type: "date", value: "t" }];
-    s.push({
-      dataFieldName: o,
-      fieldName: o,
-      name: m,
+import { camelCase as d, uniqBy as y } from "lodash";
+const u = 864e5, M = [
+  { maxMs: 1.5 * 1e3, unit: "second" },
+  { maxMs: 1.5 * 6e4, unit: "minute" },
+  { maxMs: 1.5 * 36e5, unit: "hour" },
+  { maxMs: 1.5 * u, unit: "day" },
+  { maxMs: 10.5 * u, unit: "week" },
+  { maxMs: 45 * u, unit: "month" }
+], h = (s) => {
+  const a = [...s].filter((e) => typeof e == "number" && !Number.isNaN(e)).sort((e, t) => e - t);
+  let n = 1 / 0;
+  for (let e = 1; e < a.length; e++) {
+    const t = a[e] - a[e - 1];
+    t > 0 && t < n && (n = t);
+  }
+  if (!Number.isFinite(n)) return;
+  const o = M.find((e) => n <= e.maxMs);
+  return { timeUnit: o ? o.unit : "year", count: 1 };
+}, v = (s) => {
+  const a = /* @__PURE__ */ new Map(), n = [], o = [];
+  s.forEach((t, r) => {
+    const l = t.label, m = (t.propertyId ?? d(t.label)) + r, p = [{ type: "date", value: "t" }];
+    n.push({
+      dataFieldName: m,
+      fieldName: m,
+      name: l,
       operator: "count"
-    }), r.push(...c), a.type === "TIMESERIES" && Array.isArray(a.points) && a.points.forEach((l) => {
-      const e = l.t;
-      t.has(e) || t.set(e, { t: e });
-      const p = t.get(e);
-      p[o] = l.v;
+    }), o.push(...p), t.type === "TIMESERIES" && Array.isArray(t.points) && t.points.forEach((c) => {
+      const i = c.t;
+      a.has(i) || a.set(i, { t: i });
+      const f = a.get(i);
+      f[m] = c.v;
     });
-  }), {
-    data: Array.from(t.values()).sort(
-      (a, n) => new Date(a.t).getTime() - new Date(n.t).getTime()
-    ),
-    values: s,
-    dimensions: f(r, "value")
+  });
+  const e = Array.from(a.values()).sort(
+    (t, r) => new Date(t.t).getTime() - new Date(r.t).getTime()
+  );
+  return {
+    data: e,
+    values: n,
+    dimensions: y(o, "value"),
+    // SQL-query series carry no grain metadata, so infer it from the points'
+    // spacing — otherwise the axis falls back to a daily grain for monthly data.
+    baseInterval: h(
+      e.map((t) => new Date(t.t).getTime())
+    )
   };
 };
 export {
-  D as adaptTemporalData
+  v as adaptTemporalData,
+  h as inferBaseInterval
 };

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

@@ -1,49 +1,66 @@
-import { useThemeProps as v } from "@mui/material";
-import { useMemo as P } from "react";
-import { adaptTemporalData as C } from "./helpers.js";
-const M = (l) => {
-  const n = v({ props: l, name: "HCChartWrapper" }), {
-    title: m,
-    description: d,
-    type: c,
-    interval: i,
-    data: a = [],
+import { useThemeProps as P } from "@mui/material";
+import { useMemo as U } from "react";
+import { inferBaseInterval as w, adaptTemporalData as C } from "./helpers.js";
+const m = {
+  "1M": "month",
+  "1W": "week",
+  "1D": "day",
+  "1Y": "year"
+}, k = (c) => {
+  const p = P({ props: c, name: "HCChartWrapper" }), {
+    title: d,
+    description: f,
+    type: u,
+    interval: t,
+    data: r = [],
     dimensions: s = [],
-    values: p = [],
-    series: r = [],
-    loading: f = !1,
-    sx: u,
-    ...h
-  } = n, y = {
-    ...P(() => {
-      let t = { data: a, dimensions: s, values: p };
+    values: l = [],
+    series: a = [],
+    loading: h = !1,
+    sx: v,
+    ...T
+  } = p, g = {
+    ...U(() => {
+      let e = { data: r, dimensions: s, values: l };
       if (s.length > 0) {
-        const o = s.find((e) => e.type === "date");
-        if (o) {
-          let e = o.value.split("/")[1] || i || "day";
-          e === "1M" ? e = "month" : e === "1W" ? e = "week" : e === "1D" ? e = "day" : e === "1Y" && (e = "year"), t = {
-            ...t,
-            baseInterval: { timeUnit: e, count: 1 }
-          };
+        const n = s.find((o) => o.type === "date");
+        if (n) {
+          const o = n.value.split("/")[1] || t;
+          let i;
+          if (o)
+            i = {
+              timeUnit: m[o] ?? o,
+              count: 1
+            };
+          else {
+            const I = n.value;
+            i = w(
+              r.map((D) => new Date(D[I]).getTime())
+            ) ?? { timeUnit: "day", count: 1 };
+          }
+          e = { ...e, baseInterval: i };
         }
-      } else if (r.length > 0) {
-        const o = C(r);
-        t = { ...t, ...o };
+      } else if (a.length > 0) {
+        const n = C(a);
+        e = { ...e, ...n }, t && (e.baseInterval = {
+          timeUnit: m[t] ?? t,
+          count: 1
+        });
       }
-      return t;
-    }, [i, a, s, p, r]),
-    ...h
-  }, g = { ...n };
+      return e;
+    }, [t, r, s, l, a]),
+    ...T
+  }, y = { ...p };
   return {
-    title: m,
-    description: d,
-    type: c,
-    chartProps: y,
-    loading: f,
-    ownerState: g,
-    sx: u
+    title: d,
+    description: f,
+    type: u,
+    chartProps: g,
+    loading: h,
+    ownerState: y,
+    sx: v
   };
 };
 export {
-  M as useChartWrapperLogic
+  k as useChartWrapperLogic
 };

package/dist/components/charts/column-line-mix/logic.js

@@ -1,45 +1,46 @@
 import { R as B, A as I, T as d } from "../../../AnimatedTheme-jnasw6rT.js";
-import { useThemeProps as M, useTheme as z } from "@mui/material";
+import { useThemeProps as M, useTheme as P } from "@mui/material";
 import X from "lodash";
-import { useId as P, useRef as V, useEffect as E } from "react";
-import { colorSetFromPalette as N, applyValueFormat as W } from "../_common/utils.js";
-import { c as i, p as q, a as k } from "../../../ColorSet-C7vpNXhM.js";
-import { X as H, V as U } from "../../../AxisRenderer-DTyLLA6c.js";
-import { S as _ } from "../../../Scrollbar-D86MJyr2.js";
-import { D as $ } from "../../../DateAxis-YX3QNIB-.js";
-import { A as C, a as j } from "../../../AxisRendererY-C_ItLPNV.js";
-import { C as G } from "../../../CategoryAxis-CwnfaGc8.js";
-import { C as J } from "../../../ColumnSeries-CjgdJ2QL.js";
-import { D as b } from "../../../DataProcessor-CHDO51q4.js";
-import { L as K } from "../../../LineSeries-Uiv5o56b.js";
-import { B as Q } from "../../../Bullet-DVczI2TD.js";
-import { C as Z } from "../../../Circle-Cy5s-pVc.js";
-import { X as ee } from "../../../XYCursor-C8WktvKM.js";
-import { L as te } from "../../../Legend-Dp_MKfS4.js";
-const Fe = (L) => {
-  const h = M({ props: L, name: "HCColumnLineMix" }), {
+import { useId as V, useRef as E, useEffect as N } from "react";
+import { humanizeLabel as k } from "../_common/format.js";
+import { colorSetFromPalette as W, applyValueFormat as q } from "../_common/utils.js";
+import { c as l, p as H, a as C } from "../../../ColorSet-C7vpNXhM.js";
+import { X as U, V as _ } from "../../../AxisRenderer-DTyLLA6c.js";
+import { S as $ } from "../../../Scrollbar-D86MJyr2.js";
+import { D as j } from "../../../DateAxis-YX3QNIB-.js";
+import { A as b, a as G } from "../../../AxisRendererY-C_ItLPNV.js";
+import { C as J } from "../../../CategoryAxis-CwnfaGc8.js";
+import { C as K } from "../../../ColumnSeries-CjgdJ2QL.js";
+import { D as L } from "../../../DataProcessor-CHDO51q4.js";
+import { L as Q } from "../../../LineSeries-Uiv5o56b.js";
+import { B as Z } from "../../../Bullet-DVczI2TD.js";
+import { C as ee } from "../../../Circle-Cy5s-pVc.js";
+import { X as te } from "../../../XYCursor-C8WktvKM.js";
+import { L as re } from "../../../Legend-Dp_MKfS4.js";
+const ke = (T) => {
+  const h = M({ props: T, name: "HCColumnLineMix" }), {
     dimensions: t,
-    values: l,
-    data: m,
-    initDelay: T = 0,
-    baseInterval: Y,
+    values: n,
+    data: p,
+    initDelay: Y = 0,
+    baseInterval: D,
     colors: g,
-    sx: D,
-    ...S
-  } = h, a = z(), x = `hc-column-line-mix-${P().replace(/:/g, "")}`, c = V(null), w = t.length < 1 ? "ColumnLineMix requires at least 1 dimension" : null;
-  E(() => {
+    sx: S,
+    ...O
+  } = h, a = P(), x = `hc-column-line-mix-${V().replace(/:/g, "")}`, c = E(null), w = t.length < 1 ? "ColumnLineMix requires at least 1 dimension" : null;
+  N(() => {
     if (w) return;
     let u;
     return u = setTimeout(() => {
       var y, A, v, F;
       const e = B.new(x);
       c.current = e, e.setThemes([I.new(e)]), e.interfaceColors.setAll({
-        text: i(a.palette.text.primary),
-        grid: i(a.palette.divider),
-        stroke: i(a.palette.divider)
+        text: l(a.palette.text.primary),
+        grid: l(a.palette.divider),
+        stroke: l(a.palette.divider)
       });
       const r = e.container.children.push(
-        H.new(e, {
+        U.new(e, {
           panX: !1,
           panY: !1,
           wheelX: "none",
@@ -48,53 +49,53 @@ const Fe = (L) => {
           layout: e.verticalLayout
         })
       );
-      r.set("colors", N(e, g)), r.get("colors", {}).set("step", 3), r.set(
+      r.set("colors", W(e, g)), r.get("colors", {}).set("step", 3), r.set(
         "scrollbarX",
-        _.new(e, { orientation: "horizontal" })
+        $.new(e, { orientation: "horizontal" })
       );
-      let s, n = m;
-      t[0].type === "date" ? (n = X.orderBy(m, [t[0].value]), s = r.xAxes.push(
-        $.new(e, {
+      let s, m = p;
+      t[0].type === "date" ? (m = X.orderBy(p, [t[0].value]), s = r.xAxes.push(
+        j.new(e, {
           maxDeviation: 0.1,
           groupData: !1,
-          baseInterval: Y || { timeUnit: "day", count: 1 },
-          renderer: C.new(e, {}),
+          baseInterval: D || { timeUnit: "day", count: 1 },
+          renderer: b.new(e, {}),
           tooltip: d.new(e, {})
         })
       ), (y = s.get("renderer")) == null || y.grid.template.setAll({
-        stroke: i(a.palette.divider),
+        stroke: l(a.palette.divider),
         strokeOpacity: 1
       })) : (s = r.xAxes.push(
-        G.new(e, {
+        J.new(e, {
           categoryField: t[0].value,
-          renderer: C.new(e, {}),
+          renderer: b.new(e, {}),
           tooltip: d.new(e, {})
         })
       ), (A = s.get("renderer")) == null || A.grid.template.setAll({
-        stroke: i(a.palette.divider),
+        stroke: l(a.palette.divider),
         strokeOpacity: 1
       }), e.numberFormatter.setAll({
         numberFormat: "#",
         numericFields: ["valueX"]
-      }), n = X.orderBy(m, [t[0].value]), s.data.setAll(n));
+      }), m = X.orderBy(p, [t[0].value]), s.data.setAll(m));
       const f = r.yAxes.push(
-        U.new(e, {
+        _.new(e, {
           min: 0,
           extraMax: 0.1,
-          renderer: j.new(e, { strokeOpacity: 0.1 })
+          renderer: G.new(e, { strokeOpacity: 0.1 })
         })
       );
       (v = f.get("renderer")) == null || v.grid.template.setAll({
-        stroke: i(a.palette.divider),
+        stroke: l(a.palette.divider),
         strokeOpacity: 1
-      }), l.forEach((p, R) => {
-        if (R === 0) {
+      }), n.forEach((i, z) => {
+        if (z === 0) {
           const o = r.series.push(
-            J.new(e, {
-              name: p.name,
+            K.new(e, {
+              name: i.label ?? k(i.name),
               xAxis: s,
               yAxis: f,
-              valueYField: p.dataFieldName,
+              valueYField: i.dataFieldName,
               ...t[0].type === "date" ? { valueXField: t[0].value } : { categoryXField: t[0].value },
               tooltip: d.new(e, {
                 pointerOrientation: "horizontal",
@@ -103,19 +104,19 @@ const Fe = (L) => {
             })
           );
           o.columns.template.setAll({
-            tooltipY: q(10),
+            tooltipY: H(10),
             templateField: "columnSettings"
-          }), t[0].type === "date" && (o.data.processor = b.new(e, {
+          }), t[0].type === "date" && (o.data.processor = L.new(e, {
             dateFormat: "i",
             dateFields: [t[0].value]
-          })), o.data.setAll(n), o.appear();
+          })), o.data.setAll(m), o.appear();
         } else {
           const o = r.series.push(
-            K.new(e, {
-              name: p.name,
+            Q.new(e, {
+              name: i.label ?? k(i.name),
               xAxis: s,
               yAxis: f,
-              valueYField: p.dataFieldName,
+              valueYField: i.dataFieldName,
               ...t[0].type === "date" ? { valueXField: t[0].value } : { categoryXField: t[0].value },
               tooltip: d.new(e, {
                 pointerOrientation: "horizontal",
@@ -126,12 +127,12 @@ const Fe = (L) => {
           o.strokes.template.setAll({
             strokeWidth: 3,
             templateField: "strokeSettings"
-          }), t[0].type === "date" && (o.data.processor = b.new(e, {
+          }), t[0].type === "date" && (o.data.processor = L.new(e, {
             dateFormat: "i",
             dateFields: [t[0].value]
-          })), o.data.setAll(n), o.bullets.push(function() {
-            return Q.new(e, {
-              sprite: Z.new(e, {
+          })), o.data.setAll(m), o.bullets.push(function() {
+            return Z.new(e, {
+              sprite: ee.new(e, {
                 strokeWidth: 3,
                 stroke: o.get("stroke"),
                 radius: 5,
@@ -140,20 +141,20 @@ const Fe = (L) => {
             });
           });
         }
-      }), r.set("cursor", ee.new(e, {})), r.children.push(
-        te.new(e, {
-          centerX: k,
-          x: k
+      }), r.set("cursor", te.new(e, {})), r.children.push(
+        re.new(e, {
+          centerX: C,
+          x: C
         })
-      ).data.setAll(r.series.values), W(e, (F = l == null ? void 0 : l[0]) == null ? void 0 : F.format), r.appear(1e3, 100);
-    }, T), () => {
+      ).data.setAll(r.series.values), q(e, (F = n == null ? void 0 : n[0]) == null ? void 0 : F.format), r.appear(1e3, 100);
+    }, Y), () => {
       var e;
       u && clearTimeout(u), (e = c.current) == null || e.dispose(), c.current = null;
     };
-  }, [m, t, l, a.palette.mode, g]);
-  const O = { ...h };
-  return { chartId: x, ownerState: O, sx: D, error: w, other: S };
+  }, [p, t, n, a.palette.mode, g]);
+  const R = { ...h };
+  return { chartId: x, ownerState: R, sx: S, error: w, other: O };
 };
 export {
-  Fe as useColumnLineMixLogic
+  ke as useColumnLineMixLogic
 };