evui 3.5.0-rc.1 → 3.5.0

package/dist/components/chart/chartZoom.core.js

@@ -0,0 +1,221 @@
+class C {
+  constructor(t, e, s, o, n, h, i) {
+    this.isExecuteZoom = n, this.evChartProps = t.props, this.evChartCloneData = e.data, this.brushIdx = h;
+    const a = s.zoom;
+    this.setEvChartZoomOptions(a), this.setIcon(o);
+    const l = e.data[0].labels.length - 1;
+    this.cloneLabelsLastIdx = l, this.isAnimationFinish = !0, this.zoomAreaMemory = {
+      previous: [],
+      current: [[0, l]],
+      latest: []
+    }, i && (this.emitFunc = i, i.updateZoomStartIdx(0), i.updateZoomEndIdx(l)), a.useWheelMove && (this.wrapWheelMoveZoomArea = this.wheelMoveZoomArea.bind(this)), this.evChartDomContainers = a.useAnimation ? this.drawAnimationCanvas(t.dom) : t.dom;
+  }
+  setEvChartZoomOptions(t) {
+    this.evChartZoomOptions = t;
+  }
+  setIcon(t) {
+    if (!t)
+      return;
+    const e = t.querySelector(".dragZoom");
+    this.resetIcon = t.querySelector(".reset"), this.previousIcon = t.querySelector(".previous"), this.latestIcon = t.querySelector(".latest"), this.dragZoomIcon = e, this.iconStyle(e, "enable");
+  }
+  drawAnimationCanvas(t) {
+    return t.forEach((e) => {
+      const s = document.createElement("canvas");
+      s.setAttribute("style", "display: block;"), s.setAttribute("class", "animation-canvas"), s.style.position = "absolute", e.appendChild(s);
+    }), t;
+  }
+  setEventListener(t) {
+    const e = t ? "addEventListener" : "removeEventListener";
+    this.isUseZoomMode = t, this.evChartDomContainers.forEach((s) => {
+      s[e]("wheel", this.wrapWheelMoveZoomArea);
+    });
+  }
+  wheelMoveZoomArea(t) {
+    t.preventDefault();
+    const [e, s] = this.zoomAreaMemory.current[0];
+    if (e === s)
+      return;
+    let o, n;
+    if (t.deltaY > 0) {
+      if (!e)
+        return;
+      o = e - 1, n = s - 1;
+    } else {
+      if (s === this.cloneLabelsLastIdx)
+        return;
+      o = e + 1, n = s + 1;
+    }
+    this.isUseToolbar = !0, this.executeZoom(o, n), this.zoomAreaMemory.current[0] = [o, n];
+  }
+  clickMoveZoomArea(t) {
+    if (!this.zoomAreaMemory[t].length)
+      return;
+    const [e, s] = this.zoomAreaMemory[t].pop();
+    this.isUseToolbar = !0, this.executeZoom(e, s), this.setZoomAreaMemory(
+      e,
+      s,
+      t === "previous" ? "latest" : "previous"
+    );
+  }
+  dragZoom({ data: t, range: { dragSelectionInfo: e } }) {
+    const { dragXsp: s, dragXep: o, exceptAxesYChartWidth: n, chartTitle: h } = e, { options: i, data: a } = this.evChartProps, l = i.length > 1 ? i.findIndex((r) => {
+      var c;
+      return (((c = r == null ? void 0 : r.title) == null ? void 0 : c.text) ?? "") === h;
+    }) : 0;
+    if (i[l].axesX[0].type === "time") {
+      const r = t[0].items, c = r[0].x, u = r[r.length - 1].x, m = a[l].labels, I = this.evChartCloneData[l].labels, [x, g] = this.zoomAreaMemory.current[0];
+      let d = I.findIndex(
+        (y) => +y.$d == +c.$d
+      ), p = I.findLastIndex(
+        (y) => +y.$d == +u.$d
+      );
+      const v = (y) => n / (m.length - 1) * (y - x);
+      let Z = v(d);
+      if (d === p && (Z - s >= o - Z ? d -= 1 : p += 1), d === x && p === g)
+        return;
+      d - p === -1 && (Z = v(d));
+      const f = v(p);
+      this.evChartZoomOptions.useAnimation ? this.dragZoomAnimation(
+        e,
+        d,
+        p,
+        Z,
+        f
+      ) : (this.executeZoom(d, p), this.setZoomAreaMemory(d, p));
+    }
+  }
+  dragZoomAnimation(t, e, s, o, n) {
+    const { chartRange: h, exceptAxesYChartWidth: i, exceptAxesXChartHeight: a } = t, l = window.devicePixelRatio || 1, r = Array.from(this.evChartDomContainers).map((c) => {
+      const u = c.querySelector(".animation-canvas");
+      return [c.children[0], u];
+    });
+    for (let c = 0; c < r.length; c++) {
+      const [u, m] = r[c], I = m.getContext("2d");
+      m.style.top = `${h.y1}px`, m.style.left = `${h.x1}px`, m.width = i * l, m.style.width = `${i}px`, m.height = a * l, m.style.height = `${a}px`, m.style.display === "none" && (m.style.display = "block"), this.isAnimationFinish = !1, this.isUseToolbar = !0, this.executeDragZoomAnimation(
+        u,
+        I,
+        t,
+        o,
+        n
+      ).then((x) => {
+        m.style.display = "none", x && c === r.length - 1 && (this.isAnimationFinish = x, this.executeZoom(e, s), this.setZoomAreaMemory(e, s));
+      });
+    }
+  }
+  executeZoom(t, e) {
+    this.isExecuteZoom && (this.isExecuteZoom.value = !0);
+    for (let s = 0; s < this.evChartCloneData.length; s++) {
+      const {
+        data: o,
+        labels: n,
+        series: h
+      } = this.evChartCloneData[s], i = this.evChartProps.data[s], a = Object.keys(h);
+      for (let l = 0; l < a.length; l++) {
+        const r = a[l];
+        i.data[r] = o[r].filter(
+          (c, u) => t <= u && e >= u
+        );
+      }
+      i.labels = n.filter(
+        (l, r) => t <= r && e >= r
+      );
+    }
+    !this.brushIdx.isUseButton && !this.brushIdx.isUseScroll && (this.brushIdx.start = t, this.brushIdx.end = e), this.emitFunc && (this.emitFunc.updateZoomStartIdx(t), this.emitFunc.updateZoomEndIdx(e));
+  }
+  setBrushIdx(t, e) {
+    this.brushIdx.end = -1;
+    for (let s = 0; s < e.value.length; s++) {
+      const o = t.data[e.value[s]];
+      o.labels.length && (this.brushIdx.start = 0, this.brushIdx.end = o.labels.length - 1);
+    }
+  }
+  updateEvChartCloneData(t, e, s, o) {
+    const n = t.data[0].labels.length - 1;
+    if (this.cloneLabelsLastIdx = n, this.evChartCloneData = t.data, o) {
+      const h = this.zoomAreaMemory.current[0];
+      let i = h[0], a = h[1];
+      i === 0 && a === -1 && (i = 0, a = n, this.zoomAreaMemory = {
+        previous: [],
+        current: [[i, a]],
+        latest: []
+      }), this.emitFunc && (this.emitFunc.updateZoomStartIdx(i), this.emitFunc.updateZoomEndIdx(a)), this.executeZoom(i, a);
+    } else
+      this.dragZoomIcon && this.dragZoomIcon.classList.remove("active"), this.zoomAreaMemory = {
+        previous: [],
+        current: [[0, n]],
+        latest: []
+      }, this.emitFunc && (this.emitFunc.updateZoomStartIdx(0), this.emitFunc.updateZoomEndIdx(n)), this.setIconStyle(s), this.setBrushIdx(t, e);
+  }
+  setZoomAreaMemory(t, e, s) {
+    if (t < 0 || e <= 0)
+      return;
+    const { previous: o, current: n, latest: h } = this.zoomAreaMemory, i = n.pop(), { bufferMemoryCnt: a } = this.evChartZoomOptions;
+    s ? (o.length >= a && o.splice(0, o.length - a + 1), this.zoomAreaMemory[s].push(i)) : (t !== i[0] || e !== i[1]) && (i[0] === 0 && i[1] === -1 ? o.push([0, this.cloneLabelsLastIdx]) : o.push(i), h.length = 0), n.push([t, e]), this.setIconStyle(this.isUseZoomMode);
+  }
+  executeDragZoomAnimation(t, e, s, o, n) {
+    const { chartRange: h, exceptAxesYChartWidth: i, exceptAxesXChartHeight: a } = s;
+    let l = 0, r = o, c = n - o, u = n, m = 1;
+    const I = 15e-4;
+    let x = 0.5;
+    const g = 0.1, d = 0.05, p = 50, v = Math.ceil(p * (o / i)), Z = Math.ceil(
+      p * ((i - n) / i)
+    ), f = (y) => (e.clearRect(0, 0, i, a), r <= 0 && c >= i ? (t.style.opacity = "initial", y(!0)) : (x >= g && (t.style.opacity = x, x -= d), e.globalAlpha = m, e.drawImage(
+      t,
+      h.x1,
+      h.y1,
+      o,
+      a,
+      l,
+      0,
+      o,
+      a
+    ), e.drawImage(
+      t,
+      h.x1 + o,
+      h.y1,
+      n - o,
+      a,
+      r,
+      0,
+      c,
+      a
+    ), e.drawImage(
+      t,
+      h.x1 + n,
+      h.y1,
+      i,
+      a,
+      u,
+      0,
+      i,
+      a
+    ), m -= I, l -= v, r -= v, c += v + Z, u += Z, requestAnimationFrame(() => f(y))));
+    return new Promise((y) => f(y));
+  }
+  setIconStyle(t) {
+    const e = (s, o) => {
+      o ? this.iconStyle(s, "enable") : this.iconStyle(s, "disable");
+    };
+    if (t && this.dragZoomIcon.classList.contains("active")) {
+      const { previous: s, latest: o } = this.zoomAreaMemory;
+      e(this.previousIcon, s.length), e(this.latestIcon, o.length), this.iconStyle(this.resetIcon, "enable");
+    } else
+      e(this.resetIcon), e(this.previousIcon), e(this.latestIcon);
+  }
+  iconStyle(t, e) {
+    if (!t)
+      return;
+    const [s, o] = e === "enable" ? [1, "initial"] : [0.5, "none"];
+    t.style.opacity = s, t.style.pointerEvents = o;
+  }
+  initZoom() {
+    if (!this.isAnimationFinish)
+      return;
+    const [t, e] = this.zoomAreaMemory.current[0], s = this.cloneLabelsLastIdx;
+    (t !== 0 || e !== s) && (this.isUseToolbar = !0, this.executeZoom(0, s), this.setZoomAreaMemory(0, s));
+  }
+}
+export {
+  C as default
+};

package/dist/components/chart/element/element.bar.js

@@ -0,0 +1,358 @@
+import { defaultsDeep as ht } from "lodash-es";
+import { truthyNumber as E, truthy as at } from "../../../common/utils.js";
+import { BAR_OPTION as ct, COLOR as nt } from "../helpers/helpers.constant.js";
+import H from "../helpers/helpers.canvas.js";
+import F from "../helpers/helpers.util.js";
+class yt {
+  constructor(t, o, h, c) {
+    const r = ht({}, o, ct);
+    Object.keys(r).forEach((l) => {
+      this[l] = r[l];
+    }), this.name === void 0 && (this.name = `series-${h}`), this.color === void 0 && (this.color = nt[h % nt.length]), this.type = "bar", this.sId = t, this.data = [], this.isHorizontal = c, this.size = {
+      cat: 0,
+      bar: 0,
+      cPad: 0,
+      bPad: 0,
+      w: 0,
+      h: 0,
+      ix: 0
+    };
+  }
+  /**
+   * Draw series data
+   * @param {object} param     object for drawing series data
+   *
+   * @returns {undefined}
+   */
+  draw(t) {
+    var K, Q, tt, et, st;
+    if (!this.show)
+      return;
+    const { isHorizontal: o, showValue: h } = this, c = t.ctx, r = t.chartRect, l = t.labelOffset, e = t.axesSteps, i = t.showIndex, a = t.thickness, n = t.showSeriesCount;
+    let s, g;
+    const d = e.x[this.xAxisIndex], x = e.y[this.yAxisIndex];
+    let p = this.data.length;
+    const [M, f] = o ? [x.minIndex, x.maxIndex] : [d.minIndex, d.maxIndex];
+    E(M) && E(f) && (p = f - M + 1);
+    const C = r.chartWidth - (l.left + l.right), z = r.chartHeight - (l.top + l.bottom), w = r.x1 + l.left, I = r.y2 - l.bottom, S = H.calculateX(0, d.graphMin, d.graphMax, C), G = H.calculateY(0, x.graphMin, x.graphMax, z), b = o ? w + S : w, v = o ? I : I + G, Y = o ? z : C, R = Y / (p || 1);
+    let m;
+    t.cPadRatio >= 1 || t.cPadRatio <= 0 ? m = 2 : m = Math.max(Y * (t.cPadRatio / 2) / p, 2);
+    let P, u, T;
+    P = R > m * 2 ? R - m * 2 : R, P = this.isExistGrp ? P : P / n;
+    const O = this.calculateBarSize(a, P);
+    u = o ? null : O, T = o ? O : null;
+    const L = o ? (P - T) / 2 : (P - u) / 2, _ = this.isExistGrp ? 1 : i + 1;
+    this.size.cat = R, this.size.bar = P, this.size.cPad = m, this.size.bPad = L, this.size.w = u, this.size.h = T, this.size.ix = _, this.chartRect = r, this.labelOffset = l, this.borderRadius = t.borderRadius, this.filteredCount = p;
+    const J = E(M) ? M : 0, lt = E(f) ? f : this.data.length - 1;
+    for (let B = J; B <= lt; B++) {
+      const U = B - J, y = this.data[B];
+      if (y) {
+        const it = o ? v - R * U - m : b + R * U + m;
+        if (o ? (s = b, g = Math.round(it - (P * _ - (T + L)))) : (s = Math.round(it + (P * _ - (u + L))), g = v), o) {
+          const V = y.b ? y.o : y.x, N = Math.min(
+            Math.max(V, d.graphMin),
+            d.graphMax
+          );
+          if (u = H.calculateX(
+            N,
+            d.graphMin,
+            d.graphMax,
+            C,
+            -S
+          ), y.b) {
+            const q = Math.min(
+              Math.max(y.b, d.graphMin),
+              d.graphMax
+            );
+            s = H.calculateX(
+              q,
+              d.graphMin,
+              d.graphMax,
+              C,
+              b - S
+            );
+          }
+          const j = V > 0 ? -1 : 1;
+          u = V && Math.abs(u) === 0 ? j : u;
+        } else {
+          const V = y.b ? y.o : y.y, N = Math.min(
+            Math.max(V, x.graphMin),
+            x.graphMax
+          );
+          if (T = H.calculateY(
+            N,
+            x.graphMin,
+            x.graphMax,
+            z,
+            -G
+          ), y.b) {
+            const q = Math.min(
+              Math.max(y.b, x.graphMin),
+              x.graphMax
+            );
+            g = H.calculateY(
+              q,
+              x.graphMin,
+              x.graphMax,
+              z,
+              v - G
+            );
+          }
+          const j = V > 0 ? -1 : 1;
+          T = V && Math.abs(T) === 0 ? j : T;
+        }
+        const D = y.dataColor || this.color, k = t == null ? void 0 : t.legendHitInfo, X = (K = t == null ? void 0 : t.selectLabel) == null ? void 0 : K.option, Z = (Q = t == null ? void 0 : t.selectItem) == null ? void 0 : Q.option, ot = ((et = (tt = t == null ? void 0 : t.selectLabel) == null ? void 0 : tt.selected) == null ? void 0 : et.dataIndex) ?? [], { dataIndex: $, seriesID: rt } = ((st = t == null ? void 0 : t.selectItem) == null ? void 0 : st.selected) ?? {};
+        let A = !1;
+        if (k ? A = (k == null ? void 0 : k.sId) !== this.sId : X != null && X.use && (X != null && X.useSeriesOpacity) ? A = ot.length && !ot.includes(B) : at($) && (Z != null && Z.useSeriesOpacity) && (this.isExistGrp ? A = $ !== B : A = $ !== B || rt !== this.sId), typeof D != "string")
+          c.fillStyle = H.createGradient(
+            c,
+            o,
+            { x: s, y: g, w: u, h: T },
+            D,
+            A,
+            t.unSelectedOpacity
+          );
+        else {
+          const V = D.includes("rgba") ? F.getOpacity(D) : 1, N = A ? t.unSelectedOpacity : V;
+          c.fillStyle = F.colorStringToRgba(D, N);
+        }
+        this.drawBar({
+          ctx: c,
+          positions: { x: s, y: g, w: u, h: T }
+        }), h.use && this.drawValueLabels({
+          context: c,
+          data: y,
+          positions: {
+            x: s,
+            y: g,
+            h: T,
+            w: u
+          },
+          isHighlight: !1,
+          textColor: y.dataTextColor,
+          index: B
+        }), y.xp = s, y.yp = g, y.w = u, y.h = o ? -T : T, y.index = B, this.data[U] = y;
+      }
+    }
+  }
+  /**
+   * Draw item highlight
+   * @param {object}  item       object for drawing series data
+   * @param {CanvasRenderingContext2D}  context    canvas context
+   * @param {number}  index      label index
+   * @param {number}  unSelectedOpacity - opacity when not selected (0-1)
+   *
+   * @returns {undefined}
+   */
+  itemHighlight(t, o, h, c) {
+    const r = this.showValue, l = t.data, e = o, i = l.xp, a = l.yp, n = l.w, s = l.h;
+    e.save(), e.shadowOffsetX = 0, e.shadowOffsetY = 0, e.shadowBlur = 4;
+    const g = t.data.dataColor || this.color;
+    if (typeof g != "string") {
+      const d = H.createGradient(
+        e,
+        this.isHorizontal,
+        { x: i, y: a, w: n, h: s },
+        g,
+        !1,
+        c
+      );
+      e.fillStyle = d, e.shadowColor = g[g.length - 1][1];
+    } else
+      e.fillStyle = g, e.shadowColor = g;
+    e.beginPath(), this.drawBar({
+      ctx: e,
+      positions: { x: i, y: a, w: n, h: this.isHorizontal ? -s : s }
+    }), r.use && this.drawValueLabels({
+      context: e,
+      data: l,
+      positions: {
+        x: i,
+        y: a,
+        h: s,
+        w: n
+      },
+      isHighlight: !0,
+      textColor: t.data.dataTextColor || t.dataTextColor,
+      index: h
+    }), e.restore();
+  }
+  /**
+   * Find graph item
+   * @param {array}    offset          mouse position
+   * @param {boolean}  isHorizontal    determines if a horizontal option's value
+   * @param {number}   dataIndex       selected label data index
+   * @param {boolean}  useIndicatorOnLabel
+   *
+   * @returns {object} graph item
+   */
+  findGraphData(t, o, h, c) {
+    if (typeof h == "number" && this.show && c) {
+      const r = this.data, l = { data: null, hit: !1, color: this.color };
+      return r[h] && (l.data = r[h], l.index = h, l.hit = this.isPointInBar(t, r[h])), l;
+    }
+    return o ? this.findGraphRangeCount(t) : this.findGraphRange(t);
+  }
+  /**
+   * Find graph item
+   * @param {array}    offset          mouse position
+   *
+   * @returns {object} graph item
+   */
+  /**
+   * Binary search for finding graph item
+   * @private
+   * @param {array} offset - mouse position
+   * @param {boolean} isHorizontal - search orientation
+   * @returns {object} graph item
+   */
+  binarySearchBar(t, o) {
+    const [h, c] = t, r = { data: null, hit: !1, color: this.color }, l = this.data, e = this.filteredCount ?? l.length;
+    let i = 0, a = e - 1;
+    for (; i <= a; ) {
+      const n = Math.floor((i + a) / 2), s = l[n], { xp: g, yp: d, w: x, h: p } = s, M = g + x, f = d + p;
+      if (o ? f <= c && c <= d : g <= h && h <= M)
+        return r.data = s, r.index = s.index, r.hit = this.isPointInBar(t, s), r;
+      (o ? !(f < c) : g + 4 < h) ? i = n + 1 : a = n - 1;
+    }
+    return r;
+  }
+  findGraphRange(t) {
+    return this.binarySearchBar(t, !1);
+  }
+  /**
+   * Find graph item (horizontal)
+   * @param {array}    offset          mouse position
+   *
+   * @returns {object} graph item
+   */
+  findGraphRangeCount(t) {
+    return this.binarySearchBar(t, !0);
+  }
+  /**
+   * Draw value label if series 'use' of showValue option is true
+   *
+   * @param context           canvas context
+   * @param data              series value data (model.store.js addData return value)
+   * @param positions         series value positions
+   * @param isHighlight       draw label with highlight effect
+   * @param textColor         data text color
+   * @param index             label index
+   */
+  drawValueLabels({ context: t, data: o, positions: h, isHighlight: c, textColor: r, index: l }) {
+    const e = this.isHorizontal, { fontSize: i, textColor: a, align: n, formatter: s, decimalPoint: g } = this.showValue, { x: d, y: x, w: p, h: M } = h, f = t;
+    f.save(), f.beginPath(), f.font = `normal normal normal ${i}px Roboto`, f.fillStyle = r || a, f.lineWidth = 1, f.textBaseline = "middle", f.textAlign = e && n !== "center" ? "left" : "center";
+    let C;
+    const z = at(this.stackIndex);
+    z ? C = o.o : C = (e ? o.x : o.y) ?? "";
+    let w;
+    s && (w = s(C, {
+      label: e ? o.y : o.x,
+      index: l
+    })), (!s || typeof w != "string") && (w = F.labelSignFormat(C, g) ?? "");
+    const I = C < 0, S = Math.round(f.measureText(w).width), G = i, b = 10, v = I ? d - b : d + b, Y = I ? x + b : x - b, R = d + p / 2, m = c ? x + M / 2 : x - M / 2, W = Math.abs(p) - b, P = Math.abs(M) - b;
+    switch (n) {
+      case "start": {
+        if (e && S < W) {
+          const u = I ? v - S : v;
+          f.fillText(w, u, m);
+        } else if (!e && G < P) {
+          const u = I ? x + b : x - b;
+          f.fillText(w, R, u);
+        }
+        break;
+      }
+      case "center": {
+        e && S < W ? f.fillText(w, R, m) : !e && G < P && f.fillText(w, R, x + M / 2);
+        break;
+      }
+      case "out": {
+        if (z) {
+          console.warn(
+            "[EVUI][Bar Chart] In case of Stack Bar Chart, 'out' of 'showValue''s align is not supported."
+          );
+          return;
+        }
+        if (e) {
+          const u = this.chartRect.x1 + this.labelOffset.left, T = this.chartRect.x2 - this.labelOffset.right;
+          if (I) {
+            const O = d - b + p - S;
+            O > u && f.fillText(w, O, m);
+          } else {
+            const O = d + b + p;
+            O + S < T && f.fillText(w, O, m);
+          }
+        } else {
+          const u = I ? x + M + b : x + M - b;
+          f.fillText(w, R, u);
+        }
+        break;
+      }
+      default:
+      case "end": {
+        if (e && S < W) {
+          const u = I ? d + p + b : d + p - S - b;
+          f.fillText(w, u, m);
+        } else if (!e) {
+          if (I) {
+            const u = x + M - b;
+            u > Y && f.fillText(w, R, u);
+          } else if (G < P) {
+            const u = x + M + b;
+            f.fillText(w, R, u);
+          }
+        }
+        break;
+      }
+    }
+    f.restore();
+  }
+  /**
+   * Calculate bar size based on thickness
+   * @private
+   * @param {string|number} thickness - thickness value
+   * @param {number} bArea - available bar area
+   * @returns {number} calculated size
+   */
+  calculateBarSize(t, o) {
+    return typeof t == "string" && /[0-9]+px/.test(t) ? Math.min(o, Number(t.replace("px", ""))) : typeof t == "number" && t <= 1 && t >= 0 ? Math.ceil(o * t) : o;
+  }
+  drawBar({ ctx: t, positions: o }) {
+    const { isHorizontal: h, borderRadius: c } = this, r = "stackIndex" in this, l = c && c > 0, { x: e, y: i, w: a } = o, n = h ? -o.h : o.h;
+    if (!(a === 0 || n === 0)) {
+      if (t.save(), l && !r)
+        try {
+          this.drawRoundedRect(t, o);
+        } catch {
+          t.fillRect(e, i, a, n);
+        }
+      else
+        t.fillRect(e, i, a, n);
+      t.restore();
+    }
+  }
+  /**
+   * Check if point is within bar boundaries
+   * @param {array} offset - [x, y] mouse position
+   * @param {object} barData - bar data object with xp, yp, w, h properties
+   * @returns {boolean} true if point is within bar
+   */
+  isPointInBar(t, o) {
+    const [h, c] = t, { xp: r, yp: l, w: e, h: i } = o, a = r + e, n = l + i;
+    return r <= h && h <= a && n <= c && c <= l;
+  }
+  drawRoundedRect(t, o) {
+    const { chartRect: h, labelOffset: c, isHorizontal: r, borderRadius: l } = this, { x: e, y: i } = o;
+    let { w: a, h: n } = o, s = l;
+    const g = new Path2D();
+    g.rect(
+      h.x1 + c.left,
+      h.y1,
+      h.chartWidth - c.right,
+      h.chartHeight - c.bottom
+    ), t.clip(g), t.beginPath(), t.moveTo(e, i), Math.abs(a) < s * 2 && (s = Math.abs(a) / 2), Math.abs(n) < s * 2 && (s = Math.abs(n) / 2), r ? a < 0 ? (a += s, t.lineTo(e + a, i), t.arcTo(e + a - s, i, e + a - s, i - s, s), t.arcTo(e + a - s, i - n, e + a, i - n, s), t.lineTo(e, i - n), t.lineTo(e, i)) : (a -= s, t.lineTo(e + a, i), t.arcTo(e + a + s, i, e + a + s, i - s, s), t.arcTo(e + a + s, i - n, e + a, i - n, s), t.lineTo(e, i - n), t.lineTo(e, i)) : n > 0 ? (n -= s, t.lineTo(e + a, i), t.lineTo(e + a, i + n), t.arcTo(e + a, i + n + s, e - a + s, i + n + s, s), t.arcTo(e, i + n + s, e, i + n, s), t.lineTo(e, i)) : (n += s, t.lineTo(e + a, i), t.lineTo(e + a, i + n), t.arcTo(e + a, i + n - s, e + a - s, i + n - s, s), t.arcTo(e, i + n - s, e, i + n, s), t.lineTo(e, i)), t.fill(), t.closePath();
+  }
+}
+export {
+  yt as default
+};

package/dist/components/chart/element/element.bar.time.js

@@ -0,0 +1,55 @@
+import n from "../helpers/helpers.canvas.js";
+import G from "./element.bar.js";
+import P from "../helpers/helpers.util.js";
+class L extends G {
+  /**
+   * Draw series data
+   * It shows partial bar item as time goes by.
+   * @param {object} param     object for drawing series data
+   *
+   * @returns {undefined}
+   */
+  draw(a) {
+    if (!this.show)
+      return;
+    const f = a.ctx, d = a.chartRect, o = a.labelOffset, R = a.axesSteps, Y = a.showIndex, i = a.isHorizontal, p = a.thickness, H = a.showSeriesCount;
+    let t, c;
+    const r = R.x[this.xAxisIndex], h = R.y[this.yAxisIndex], b = d.chartWidth - (o.left + o.right), y = d.chartHeight - (o.top + o.bottom), u = d.x1 + o.left, w = d.y2 - o.bottom, S = d.x2 - o.right, z = (i ? y : b) / (this.data.length || 1), A = 2;
+    let l;
+    this.isExistGrp ? l = z - A * 2 : l = (z - A * 2) / H;
+    const O = typeof p == "string" && /[0-9]+px/.test(p) ? Math.min(l, Number(p.replace("px", ""))) : typeof p == "number" && p <= 1 && p >= 0 ? Math.ceil(l * p) : l;
+    let e = i ? null : O, g = i ? null : O, x = i ? O : null;
+    const X = i ? (l - x) / 2 : (l - e) / 2, C = this.isExistGrp ? 1 : Y + 1;
+    this.size.cat = z, this.size.bar = l, this.size.cPad = A, this.size.bPad = X, this.size.w = e, this.size.ix = C, this.chartRect = d, this.labelOffset = o, this.borderRadius = a.borderRadius, this.data.forEach((s, I) => {
+      if (f.beginPath(), i ? (t = u, c = n.calculateY(s.y, h.graphMin, h.graphMax, y, w)) : (t = n.calculateSubX(s.x, r.graphMin, r.graphMax, b, u), t < u ? (g -= u - t, t = t + e < u ? null : u) : t + e > S && (g -= g - (S - t)), t >= S && (t = null), t !== null && (t += Math.ceil(l * C) - Math.round(e + X)), c = w), i ? s.b ? (e = n.calculateX(s.x - s.b, r.graphMin, r.graphMax, b), t = n.calculateX(s.b, r.graphMin, r.graphMax, b, u)) : e = n.calculateX(s.x, r.graphMin, r.graphMax, b) : s.b ? (x = n.calculateY(s.y - s.b, h.graphMin, h.graphMax, y), c = n.calculateY(s.b, h.graphMin, h.graphMax, y, w)) : x = n.calculateY(s.y, h.graphMin, h.graphMax, y), t !== null && c !== null) {
+        const M = s.dataColor || this.color, B = M.includes("rgba") ? P.getOpacity(M) : 1, E = this.state === "downplay" ? a.unSelectedOpacity : B;
+        typeof M != "string" ? (e = e !== g ? g : e, f.fillStyle = n.createGradient(
+          f,
+          i,
+          { x: t, y: c, w: e, h: x },
+          M,
+          this.state === "downplay",
+          a.unSelectedOpacity
+        )) : f.fillStyle = P.colorStringToRgba(M, E), this.drawBar({
+          ctx: f,
+          positions: { x: t, y: c, w: e, h: x }
+        }), this.showValue.use && this.drawValueLabels({
+          context: f,
+          data: s,
+          positions: {
+            x: t,
+            y: c,
+            h: x,
+            w: e
+          },
+          isHighlight: !1,
+          index: I
+        });
+      }
+      g = e, s.xp = t, s.yp = c, s.w = e, s.h = i ? -x : x;
+    });
+  }
+}
+export {
+  L as default
+};