@hybridcore/ui 1.5.79 → 1.5.82

package/dist/components/metric-card/MetricChart.js

@@ -0,0 +1,525 @@
+import { jsx as k } from "react/jsx-runtime";
+import { h as S, m as F, i as p, j as v, k as L, l as X, V as z, b as Y, A as j, X as E, c as G, g as O, d as Z, f as w } from "../../AxisRendererY-kADUad00.js";
+import { useRef as q, useLayoutEffect as V } from "react";
+import { C as B } from "../../ColumnSeries-BTcqshjB.js";
+import { L as W } from "../../LineSeries-CfcpoYla.js";
+class P extends S {
+  constructor() {
+    super(...arguments), Object.defineProperty(this, "_frequency", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: 1
+    }), Object.defineProperty(this, "_itemMap", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: {}
+    });
+  }
+  _afterNew() {
+    this._settings.themeTags = F(this._settings.themeTags, ["axis"]), this.fields.push("category", "id", "cellSize"), this.setPrivateRaw("name", "category"), this.addTag("category"), super._afterNew();
+  }
+  _afterDataChange() {
+    super._afterDataChange();
+    const t = this.dataItems.length;
+    t > 0 && this.setPrivateRaw("maxZoomFactor", t), this.setPrivateRaw("startIndex", Math.min(this.getPrivate("startIndex", 0), t)), this.setPrivateRaw("endIndex", Math.min(this.getPrivate("endIndex", t), 1));
+  }
+  _prepareChildren() {
+    super._prepareChildren();
+    const t = this.dataItems.length;
+    let e = 0;
+    this._valuesDirty && (this._itemMap = {}, p(this.dataItems, (r) => {
+      r.setRaw("index", e), this._itemMap[r.get("category")] = r, e++;
+    }), this.setPrivateRaw("maxZoomFactor", t));
+    let a = this.get("start", 0), i = this.get("end", 1), s = this._getIndices(a, i);
+    this.setPrivateRaw("startIndex", s.startIndex), this.setPrivateRaw("endIndex", s.endIndex), (this._sizeDirty || this._valuesDirty || this.isDirty("start") || this.isDirty("end") || this.isPrivateDirty("endIndex") || this.isPrivateDirty("startIndex") || this.isPrivateDirty("width") || this.isPrivateDirty("height")) && this.dataItems.length > 0 && (this._handleRangeChange(), this._prepareAxisItems(), this._updateAxisRanges());
+  }
+  /**
+   * @ignore
+   */
+  adjustZoom() {
+    const t = this.dataItems.length;
+    if (t > 1) {
+      let e = this.get("maxZoomCount", this.dataItems.length), a = this.get("minZoomCount", 1), i = 0, s = this.getPrivate("startIndex", 0), r = this.getPrivate("endIndex", 0);
+      const d = this._sAnimation, o = this._eAnimation;
+      let l = this.get("start", 0), n = !1;
+      d && !d.stopped && (l = Number(d.to), n = !0);
+      let m = this.get("end", 1);
+      if (o && !o.stopped && (m = Number(o.to), n = !0), n) {
+        const h = this._getIndices(l, m);
+        s = h.startIndex, r = h.endIndex;
+      }
+      for (let h = s; h < r; h++) {
+        const g = this.dataItems[h];
+        i += g.get("finalCellSize", 1);
+      }
+      if (i <= a) {
+        let h = 0;
+        for (let g = s; g < t; g++) {
+          const f = this.dataItems[g];
+          if (h += f.get("finalCellSize", 1), r = g + 1, h >= a)
+            break;
+        }
+        if (h < a)
+          for (let g = s - 1; g >= 0; g--) {
+            const f = this.dataItems[g];
+            if (h += f.get("finalCellSize", 1), s = g, h >= a)
+              break;
+          }
+        this.zoomToIndexes(s, r);
+      } else if (i >= e) {
+        let h = i;
+        for (let g = r - 1; g >= s; g--) {
+          const f = this.dataItems[g];
+          if (h -= f.get("finalCellSize", 1), h <= e) {
+            r = g + 1;
+            break;
+          }
+        }
+        this.zoomToIndexes(s, r);
+      }
+    }
+  }
+  _handleRangeChange() {
+    p(this.series, (t) => {
+      let e = this.dataItems[this.startIndex()].get("category"), a = this.dataItems[this.endIndex() - 1].get("category"), i = t.get("baseAxis"), s = t.get("xAxis"), r = t.get("yAxis");
+      if (s instanceof P && r instanceof P)
+        t._markDirtyAxes();
+      else if (i === this) {
+        let d, o, l = r;
+        if (s === i ? (t.get("categoryXField") && (d = "categoryX"), t.get("openCategoryXField") && (o = "openCategoryX")) : r === i && (t.get("categoryYField") && (d = "categoryY"), t.get("openCategoryYField") && (o = "openCategoryY"), l = s), l instanceof z && (d || o)) {
+          let h = function(u, y, c, _, N, R) {
+            let x, C = y.categoryToIndex(N);
+            for (; !x && C >= 0 && C < y.dataItems.length; ) {
+              let D = y.dataItems[C].get("category");
+              if (R == "previous")
+                for (let I = u.dataItems.length - 1; I >= 0; I--) {
+                  let b = u.dataItems[I];
+                  if (c && b.get(c) === D) {
+                    x = b;
+                    break;
+                  }
+                  if (_ && b.get(_) === D) {
+                    x = b;
+                    break;
+                  }
+                }
+              else
+                for (let I = 0, b = u.dataItems.length; I < b; I++) {
+                  let M = u.dataItems[I];
+                  if (c && M.get(c) === D) {
+                    x = M;
+                    break;
+                  }
+                  if (_ && M.get(_) === D) {
+                    x = M;
+                    break;
+                  }
+                }
+              x || (C += R === "previous" ? -1 : 1);
+            }
+            return x;
+          }, n, m;
+          n = h(t, this, d, o, e, "next"), m = h(t, this, d, o, a, "previous");
+          let g = 0, f = t.dataItems.length;
+          n && (g = t.dataItems.indexOf(n)), m && (f = t.dataItems.indexOf(m) + 1), t.setPrivate("startIndex", g), t.setPrivate("endIndex", f);
+          let T = !1;
+          for (let u = g; u < f; u++) {
+            const y = t.dataItems[u];
+            if (p(t.__valueXShowFields, (c) => {
+              y.get(c) != null && (T = !0);
+            }), p(t.__valueYShowFields, (c) => {
+              y.get(c) != null && (T = !0);
+            }), T)
+              break;
+          }
+          t.setPrivate("outOfSelection", !T);
+        }
+        t._markDirtyAxes();
+      }
+    });
+  }
+  _prepareAxisItems() {
+    var t;
+    const e = this.get("renderer"), a = this.dataItems.length;
+    let i = this.startIndex();
+    i > 0 && i--;
+    let s = this.endIndex();
+    s < a && s++;
+    const r = e.get("minorLabelsEnabled"), d = e.get("minorGridEnabled", r);
+    let o = e.axisLength() / Math.max(e.get("minGridDistance"), 1), l = Math.max(1, Math.min(a, Math.ceil((s - i) / o)));
+    i = Math.floor(i / l) * l, this._frequency = l;
+    for (let m = 0; m < a; m++)
+      this._toggleDataItem(this.dataItems[m], !1);
+    let n = this.dataItems[i].get("index", 0);
+    for (let m = i; m < s; m = m + l) {
+      let h = this.dataItems[m];
+      this._createAssets(h, []), this._toggleDataItem(h, !0);
+      let g = l;
+      d && (g = 1), this._prepareDataItem(h, n, g), n++;
+    }
+    if (e.get("minorGridEnabled"))
+      for (let m = i; m < s; m++) {
+        let h = this.dataItems[m];
+        m % l != 0 && (this._createAssets(h, ["minor"], !0), this._toggleDataItem(h, !0), this._prepareDataItem(h, 0, 1), r || (t = h.get("label")) === null || t === void 0 || t.setPrivate("visible", !1));
+      }
+    this._updateGhost();
+  }
+  _prepareDataItem(t, e, a) {
+    let i = this.get("renderer"), s = t.get("categoryLocation", 0), r = t.get("endCategoryLocation", 1), d = t.get("index");
+    v(d) || (d = this.categoryToIndex(t.get("category")));
+    let o = this.indexToPosition(d, s), l = t.get("endCategory"), n;
+    l ? (n = this.categoryToIndex(l), v(n) || (n = d)) : n = d;
+    let m = this.indexToPosition(n, r), h, g;
+    if (t.get("isRange")) {
+      if (h = n, !v(d)) {
+        this._toggleDataItem(t, !1);
+        return;
+      }
+    } else
+      h = d + this._frequency - 1;
+    g = this.indexToPosition(h, r), i.updateLabel(t.get("label"), o, m, a), i.updateGrid(t.get("grid"), o, m), i.updateTick(t.get("tick"), o, m, a), i.updateFill(t.get("axisFill"), o, g), this._processBullet(t), i.updateBullet(t.get("bullet"), o, m);
+    const f = this.get("fillRule");
+    f && f(t, e);
+  }
+  startIndex() {
+    let t = this.dataItems.length;
+    return Math.min(Math.max(this.getPrivate("startIndex", 0), 0), t - 1);
+  }
+  endIndex() {
+    let t = this.dataItems.length;
+    return Math.max(1, Math.min(this.getPrivate("endIndex", t), t));
+  }
+  /**
+   * @ignore
+   */
+  baseValue() {
+  }
+  /**
+   * @ignore
+   */
+  basePosition() {
+    return 0;
+  }
+  /**
+   * Returns X coordinate in pixels corresponding to specific category index.
+   *
+   * @param   value  Index
+   * @return         X coordinate
+   */
+  getX(t) {
+    let e = this._itemMap[t];
+    return e ? this._settings.renderer.positionToCoordinate(this.indexToPosition(e.get("index", 0))) : NaN;
+  }
+  /**
+   * Returns Y coordinate in pixels corresponding to specific category index.
+   *
+   * @param   value  Index
+   * @return         Y coordinate
+   */
+  getY(t) {
+    let e = this._itemMap[t];
+    return e ? this._settings.renderer.positionToCoordinate(this.indexToPosition(e.get("index", 0))) : NaN;
+  }
+  /**
+   * @ignore
+   */
+  getDataItemPositionX(t, e, a, i) {
+    const s = t.get(e), r = this._itemMap[s];
+    return r ? this.indexToPosition(r.get("index", 0), a) : NaN;
+  }
+  /**
+   * @ignore
+   */
+  getDataItemCoordinateX(t, e, a, i) {
+    return this._settings.renderer.positionToCoordinate(this.getDataItemPositionX(t, e, a, i));
+  }
+  /**
+   * @ignore
+   */
+  getDataItemPositionY(t, e, a, i) {
+    const s = t.get(e), r = this._itemMap[s];
+    return r ? this.indexToPosition(r.get("index", 0), a) : NaN;
+  }
+  /**
+   * @ignore
+   */
+  getDataItemCoordinateY(t, e, a, i) {
+    return this._settings.renderer.positionToCoordinate(this.getDataItemPositionY(t, e, a, i));
+  }
+  /**
+   * Converts category index to a relative position.
+   *
+   * `location` indicates relative position within category: 0 - start, 1 - end.
+   *
+   * If not set, will use middle (0.5) of the category.
+   *
+   * @param   index     Index
+   * @param   location  Location
+   * @return            Index
+   */
+  indexToPosition(t, e, a) {
+    let i = this.dataItems.length, s = 0;
+    if (i == 0 || (t >= i && (t = i - 1, e = 1), v(e) || (e = 0.5), !v(t)))
+      return 0;
+    let r = this.get("startLocation", 0), d = this.get("endLocation", 1);
+    if (!this.get("cellSizeField"))
+      i -= r, i -= 1 - d, s = (t + e - r) / i;
+    else {
+      let o = a ? "finalCellSize" : "cellSize";
+      const l = this.dataItems;
+      let n = 0;
+      p(this.dataItems, (g) => {
+        n += g.get(o, 1);
+      }), n -= r * l[0].get(o, 1), n -= (1 - d) * l[l.length - 1].get(o, 1);
+      let m = 0;
+      for (let g = 0; g < t; g++)
+        m += l[g].get(o, 1);
+      let h = l[t].get(o, 1);
+      s = (m + e * h - r * l[0].get(o, 1)) / n;
+    }
+    if (!a) {
+      let o = this.dataItems[t];
+      o && (s += o.get("deltaPosition", 0));
+    }
+    return s;
+  }
+  /**
+   * Returns a position of a category.
+   *
+   * @param   category  Category to look up
+   * @return            Position
+   */
+  categoryToPosition(t) {
+    let e = this._itemMap[t];
+    return e ? this.indexToPosition(e.get("index")) : NaN;
+  }
+  /**
+   * Returns an index of a category.
+   *
+   * @param   category  Category to look up
+   * @return            Index
+   */
+  categoryToIndex(t) {
+    let e = this._itemMap[t];
+    return e ? e.get("index") : NaN;
+  }
+  /**
+   * @ignore
+   */
+  dataItemToPosition(t) {
+    return this.indexToPosition(t.get("index"));
+  }
+  /**
+   * @ignore
+   */
+  roundAxisPosition(t, e) {
+    return t += (0.5 - e) / this.dataItems.length, this.indexToPosition(this.axisPositionToIndex(t), e);
+  }
+  /**
+   * Returns an index of the category that corresponds to specific pixel
+   * position within axis.
+   *
+   * @param position  Position (px)
+   * @return Category index
+   */
+  axisPositionToIndex(t) {
+    let e = this.dataItems.length;
+    if (e === 0)
+      return 0;
+    if (this.get("cellSizeField")) {
+      let a = 0, i = [];
+      p(this.dataItems, (l) => {
+        const n = l.get("cellSize", 1);
+        i.push(n), a += n;
+      });
+      let s = this.get("startLocation", 0), r = this.get("endLocation", 1);
+      a -= s, a -= 1 - r;
+      let d = t * a + s, o = 0;
+      for (let l = 0; l < e; l++) {
+        const n = i[l];
+        if (d < o + n)
+          return l;
+        o += n;
+      }
+      return e - 1;
+    } else
+      return L(Math.floor(t * e), 0, e - 1);
+  }
+  /**
+   * Returns text to be used in an axis tooltip for specific relative position.
+   *
+   * @param   position  Position
+   * @return            Tooltip text
+   */
+  getTooltipText(t, e) {
+    const a = this.dataItems[this.axisPositionToIndex(t)];
+    if (a) {
+      const i = a.get("label");
+      if (i)
+        return X(i, this.get("tooltipText", ""));
+    }
+  }
+  _updateTooltipText(t, e) {
+    t._setDataItem(this.dataItems[this.axisPositionToIndex(e)]), t.label.text.markDirtyText();
+  }
+  /**
+   * Returns a data item from series that is closest to the `position`.
+   *
+   * @param   series    Series
+   * @param   position  Relative position
+   * @return            Data item
+   */
+  getSeriesItem(t, e) {
+    if (this.dataItems.length > 0) {
+      let a = this.getPrivate("name") + this.get("renderer").getPrivate("letter"), i = this.axisPositionToIndex(e), s = t.dataItems[i], r = this.dataItems[i], d = r.get("category");
+      if (s && r && s.get(a) === d)
+        return s;
+      for (let o = 0, l = t.dataItems.length; o < l; o++) {
+        let n = t.dataItems[o];
+        if (n.get(a) === d)
+          return n;
+      }
+    }
+  }
+  _getIndices(t, e) {
+    let a = this.dataItems.length, i = 0, s = a, r = "cellSize";
+    if (this.get("cellSizeField")) {
+      let d = 0;
+      const o = this.dataItems;
+      if (o.length == 0)
+        return { startIndex: 0, endIndex: 0 };
+      p(o, (n) => {
+        d += n.get(r, 1);
+      }), d -= this.get("startLocation", 0) * o[0].get(r, 1), d -= (1 - this.get("endLocation", 1)) * o[o.length - 1].get(r, 1);
+      let l = 0;
+      for (let n = 0; n < a; n++)
+        if (l += this.dataItems[n].get(r, 1), Math.round(l) > Math.round(t * d)) {
+          i = n;
+          break;
+        }
+      for (let n = i + 1; n < a; n++)
+        if (l += this.dataItems[n].get(r, 1), Math.round(l) >= Math.round(e * d)) {
+          s = n + 1;
+          break;
+        }
+      i = Math.max(i, 0), s = Math.min(s, a);
+    } else
+      i = Math.max(Math.round(this.get("start", 0) * a), 0), s = Math.min(Math.round(this.get("end", 1) * a), a);
+    return { startIndex: i, endIndex: s };
+  }
+  /**
+   * Zooms the axis to specific `start` and `end` indexes.
+   *
+   * Optional `duration` specifies duration of zoom animation in milliseconds.
+   *
+   * @param  start     Start index
+   * @param  end       End index
+   * @param  duration  Duration in milliseconds
+   */
+  zoomToIndexes(t, e, a) {
+    let i = this.dataItems.length;
+    this.get("cellSizeField") ? (t = Math.min(Math.max(t, 0), i), e = Math.max(Math.min(e, i), 1), this.setPrivateRaw("startIndex", t), this.setPrivateRaw("endIndex", e), this.zoom(this.indexToPosition(t, 0, !0), this.indexToPosition(e, 0, !0), a)) : this.zoom(t / i, e / i, a);
+  }
+  zoomToCategories(t, e, a) {
+    this.zoomToIndexes(this.categoryToIndex(t), this.categoryToIndex(e) + 1, a);
+  }
+  /**
+   * Returns position span between start and end of a single cell in axis.
+   *
+   * @since 5.2.30
+   * @return Position
+   */
+  getCellWidthPosition() {
+    return this._frequency / this.dataItems.length / (this.get("end", 1) - this.get("start", 0));
+  }
+  /**
+   * @ignore
+   */
+  nextPosition(t) {
+    t == null && (t = 1), this.get("renderer").getPrivate("letter") == "Y" && (t *= -1);
+    const e = this.getPrivate("tooltipPosition", 0), a = L(this.axisPositionToIndex(e) + t, 0, this.dataItems.length - 1);
+    return this.toGlobalPosition(this.indexToPosition(a));
+  }
+}
+Object.defineProperty(P, "className", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: "CategoryAxis"
+});
+Object.defineProperty(P, "classNames", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: S.classNames.concat([P.className])
+});
+const $ = ({ data: A, type: t, color: e }) => {
+  const a = q(null);
+  return V(() => {
+    if (!a.current) return;
+    const i = Y.new(a.current);
+    i.setThemes([j.new(i)]);
+    const s = i.container.children.push(
+      E.new(i, {
+        panX: !1,
+        panY: !1,
+        wheelX: "none",
+        wheelY: "none",
+        paddingLeft: 0,
+        paddingRight: 0,
+        paddingTop: 0,
+        paddingBottom: 0
+      })
+    ), r = s.xAxes.push(
+      P.new(i, {
+        categoryField: "t",
+        renderer: G.new(i, {
+          minGridDistance: 10
+        }),
+        tooltip: O.new(i, {})
+      })
+    ), d = r.get("renderer");
+    d.grid.template.set("visible", !1), d.labels.template.set("visible", !1), r.data.setAll(A);
+    const o = s.yAxes.push(
+      z.new(i, {
+        renderer: Z.new(i, {})
+      })
+    ), l = o.get("renderer");
+    l.grid.template.set("visible", !1), l.labels.template.set("visible", !1);
+    let n;
+    return t === "column" ? (n = s.series.push(
+      B.new(i, {
+        name: "Series",
+        xAxis: r,
+        yAxis: o,
+        valueYField: "v",
+        categoryXField: "t",
+        fill: w(e),
+        stroke: w(e)
+      })
+    ), n.columns.template.setAll({
+      cornerRadiusTL: 2,
+      cornerRadiusTR: 2,
+      strokeOpacity: 0
+    })) : (n = s.series.push(
+      W.new(i, {
+        name: "Series",
+        xAxis: r,
+        yAxis: o,
+        valueYField: "v",
+        categoryXField: "t",
+        fill: w(e),
+        stroke: w(e)
+      })
+    ), n.strokes.template.setAll({
+      strokeWidth: 2
+    })), n.data.setAll(A), n.appear(1e3), s.appear(1e3, 100), () => {
+      i.dispose();
+    };
+  }, [A, t, e]), /* @__PURE__ */ k("div", { ref: a, style: { width: "100%", height: "100%" } });
+};
+export {
+  $ as MetricChart
+};