@hybridcore/ui 1.5.78 → 1.5.80

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

@@ -0,0 +1,642 @@
+import { X as se, e as k, v as K, P as V, i as Q, a as O, _ as $, R as W, G as ie, L as E, T as H, m as U, b as oe, A as ne, c as le, d as ae, D as re, f as he, g as I, V as ee, h as te, j as M, p as ce } from "../../../AxisRendererY-CFo972D5.js";
+import { useThemeProps as ge } from "@mui/material";
+import { useRef as q, useLayoutEffect as ue, useEffect as pe } from "react";
+class T extends se {
+  constructor() {
+    super(...arguments), Object.defineProperty(this, "_ph", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: 0
+    }), Object.defineProperty(this, "_pw", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: 0
+    }), Object.defineProperty(this, "_columnsUpdated", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: !1
+    });
+  }
+  _makeGraphics(e, t) {
+    return this.makeColumn(t, e);
+  }
+  _makeFieldNames() {
+    super._makeFieldNames();
+    const e = this.get("xAxis"), t = this.get("yAxis"), s = "CategoryAxis", o = "ValueAxis";
+    e.isType(s) && (this.get("openCategoryXField") || (this._xOpenField = this._xField)), e.isType(o) && (this.get("openValueXField") || (this._xOpenField = this._xField)), t.isType(s) && (this.get("openCategoryYField") || (this._yOpenField = this._yField)), t.isType(o) && (this.get("openValueYField") || (this._yOpenField = this._yField));
+  }
+  _prepareChildren() {
+    super._prepareChildren();
+    const e = this.get("xAxis"), t = this.get("yAxis"), s = this.dataItems.length, o = Math.max(0, this.startIndex() - 2), i = Math.min(this.endIndex() + 2, s - 1);
+    if (e.inited && t.inited)
+      for (let n = o; n <= i; n++) {
+        let l = this.dataItems[n];
+        this._createGraphics(l);
+      }
+  }
+  _updateChildren() {
+    const e = this.chart;
+    e && (this._ph = e.plotContainer.height(), this._pw = e.plotContainer.width());
+    const t = this.get("xAxis"), s = this.get("yAxis"), o = this.get("baseAxis"), i = this.columns.template;
+    this.isDirty("fill") && i.get("fill") == null && i.set("fill", this.get("fill")), this.isDirty("fillPattern") && i.get("fillPattern") == null && i.set("fillPattern", this.get("fillPattern")), this.isDirty("stroke") && i.get("stroke") == null && i.set("stroke", this.get("stroke"));
+    let n = 0, l = 0, d = 0;
+    k(o.series, (f) => {
+      if (f instanceof T) {
+        const c = f.get("stacked");
+        c && d == 0 && l++, !c && f.get("clustered") && l++;
+      }
+      f === this && (n = l - 1), d++;
+    }), this.get("clustered") || (n = 0, l = 1), l === 0 && (l = 1, n = 0);
+    const m = t.get("renderer"), x = s.get("renderer"), h = "cellStartLocation", u = "cellEndLocation", p = m.get(h, 0), _ = m.get(u, 1), g = x.get(h, 0), a = x.get(u, 1);
+    if (this._aLocationX0 = p + n / l * (_ - p), this._aLocationX1 = p + (n + 1) / l * (_ - p), this._aLocationY0 = g + n / l * (a - g), this._aLocationY1 = g + (n + 1) / l * (a - g), t.inited && s.inited) {
+      if (this._axesDirty || this._valuesDirty || this._stackDirty || this.isDirty("vcx") || this.isDirty("vcy") || this._sizeDirty) {
+        const f = this.dataItems.length;
+        let c = Math.max(0, this.startIndex() - 2), r = Math.min(this.endIndex() + 2, f - 1);
+        for (let y = 0; y < c; y++)
+          this._toggleColumn(this.dataItems[y], !1);
+        let w = this.dataItems[c];
+        for (let y = c; y <= r; y++) {
+          let b = this.dataItems[y];
+          if (b.get("valueX") != null && b.get("valueY") != null) {
+            if (w = b, y > 0 && c > 0)
+              for (let C = y - 1; C >= 0; C--) {
+                let Y = this.dataItems[C];
+                if (Y.get("valueX") != null && Y.get("valueY") != null) {
+                  w = Y;
+                  break;
+                }
+              }
+            break;
+          } else
+            this._toggleColumn(b, !1);
+        }
+        this._beforeColumnsDraw();
+        let X = 0;
+        s.isType("CategoryAxis") && t.isType("CategoryAxis") ? X = 2 : t === o ? X = 0 : s === o && (X = 1);
+        for (let y = c; y <= r; y++) {
+          let b = this.dataItems[y];
+          this._updateGraphics(b, w, X), b.get("valueX") != null && b.get("valueY") != null && (w = b);
+        }
+        this._afterColumnsDraw();
+        for (let y = r + 1; y < f; y++)
+          this._toggleColumn(this.dataItems[y], !1);
+        this._columnsUpdated = !0;
+      }
+    } else
+      this._skipped = !0;
+    this.getPrivate("doNotUpdateLegend") || this.updateLegendMarker(this.get("tooltipDataItem")), super._updateChildren();
+  }
+  _afterChanged() {
+    super._afterChanged(), this._columnsUpdated = !1;
+  }
+  _beforeColumnsDraw() {
+  }
+  _afterColumnsDraw() {
+  }
+  _createGraphics(e) {
+    let t = e.get("graphics");
+    if (!t) {
+      t = this._makeGraphics(this.columns, e), e.set("graphics", t), t._setDataItem(e);
+      const s = e.get("legendDataItem");
+      if (s) {
+        const i = s.get("markerRectangle");
+        if (i) {
+          const n = i.states.lookup("default");
+          k(K, (l) => {
+            const d = t.get(l, this.get(l));
+            i.set(l, d), n.set(l, d);
+          });
+        }
+      }
+      let o = e.get("rangeGraphics");
+      o && k(o, (i) => {
+        i.dispose();
+      }), o = [], e.setRaw("rangeGraphics", o), this.axisRanges.each((i) => {
+        const n = i.container, l = this._makeGraphics(i.columns, e);
+        o && o.push(l), l.setPrivate("list", i.columns), n.children.push(l);
+      });
+    }
+  }
+  createAxisRange(e) {
+    return k(this.dataItems, (t) => {
+      const s = t.get("graphics");
+      s && (s.dispose(), t.set("graphics", void 0));
+    }), super.createAxisRange(e);
+  }
+  _updateGraphics(e, t, s) {
+    let o = e.get("graphics");
+    const i = this._xField, n = this._yField, l = e.get(i), d = e.get(n), m = this.get("exactLocationX", !1);
+    if (l != null && d != null) {
+      const x = this._xOpenField, h = this._yOpenField, u = this.get("locationX", e.get("locationX", 0.5)), p = this.get("locationY", e.get("locationY", 0.5)), _ = this.get("openLocationX", e.get("openLocationX", u)), g = this.get("openLocationY", e.get("openLocationY", p)), a = o.get("width"), f = o.get("height"), c = this.get("stacked"), r = this.get("xAxis"), w = this.get("yAxis"), X = r.get("start"), y = r.get("end"), b = w.get("start"), C = w.get("end");
+      let Y, L, F, A, G = this.get("vcy", 1), R = this.get("vcx", 1), B = !1, Z = !1;
+      if (s == 0) {
+        let P = this._aLocationX0 + _ - 0.5, D = this._aLocationX1 + u - 0.5;
+        if (a instanceof V) {
+          let v = (D - P) * (1 - a.value) / 2;
+          P += v, D -= v;
+        }
+        if (Y = r.getDataItemPositionX(e, x, P, R, m), L = r.getDataItemPositionX(e, i, D, R, m), F = w.getDataItemPositionY(e, n, p, G), this._yOpenField !== this._yField)
+          A = w.getDataItemPositionY(e, h, g, G);
+        else if (c) {
+          let v = e.get("stackToItemY");
+          v ? A = w.getDataItemPositionY(v, n, g, v.component.get("vcy")) : A = w.basePosition();
+        } else
+          A = w.basePosition();
+        e.setRaw("point", { x: Y + (L - Y) / 2, y: F }), Z = !0;
+      } else if (s == 1) {
+        let P = this._aLocationY0 + g - 0.5, D = this._aLocationY1 + p - 0.5;
+        if (f instanceof V) {
+          let v = (D - P) * (1 - f.value) / 2;
+          P += v, D -= v;
+        }
+        if (F = w.getDataItemPositionY(e, h, P, G), A = w.getDataItemPositionY(e, n, D, G), L = r.getDataItemPositionX(e, i, u, R, m), this._xOpenField !== this._xField)
+          Y = r.getDataItemPositionX(e, x, _, R, m);
+        else if (c) {
+          let v = e.get("stackToItemX");
+          v ? Y = r.getDataItemPositionX(v, i, _, v.component.get("vcx"), m) : Y = r.basePosition();
+        } else
+          Y = r.basePosition();
+        B = !0, e.setRaw("point", { x: L, y: F + (A - F) / 2 });
+      } else if (s == 2) {
+        let P = this._aLocationX0 + _ - 0.5, D = this._aLocationX1 + u - 0.5;
+        if (a instanceof V) {
+          let v = (D - P) * (1 - a.value) / 2;
+          P += v, D -= v;
+        }
+        if (Y = r.getDataItemPositionX(e, x, P, R), L = r.getDataItemPositionX(e, i, D, R), P = this._aLocationY0 + g - 0.5, D = this._aLocationY1 + p - 0.5, f instanceof V) {
+          let v = (D - P) * (1 - f.value) / 2;
+          P += v, D -= v;
+        }
+        F = w.getDataItemPositionY(e, h, P, G), A = w.getDataItemPositionY(e, n, D, G), e.setRaw("point", { x: Y + (L - Y) / 2, y: F + (A - F) / 2 });
+      }
+      this._applyGraphicsStates(e, t), this._updateSeriesGraphics(e, o, Y, L, F, A, B, Z), Y < X && L < X || Y > y && L > y || F < b && A <= b || F >= C && A > C || Q(Y) || Q(F) ? this._toggleColumn(e, !1) : this._toggleColumn(e, !0);
+      let J = e.get("rangeGraphics");
+      J && k(J, (P) => {
+        this._updateSeriesGraphics(e, P, Y, L, F, A, B, Z);
+      });
+    } else
+      this._toggleColumn(e, !1);
+  }
+  _updateSeriesGraphics(e, t, s, o, i, n, l, d) {
+    const m = t.get("width"), x = t.get("height"), h = t.get("maxWidth"), u = t.get("maxHeight"), p = this.getPoint(s, i), _ = this.getPoint(o, n), g = e.get("point");
+    if (g) {
+      const a = this.getPoint(g.x, g.y);
+      g.x = a.x + this._x, g.y = a.y + this._y;
+    }
+    if (s = p.x, o = _.x, i = p.y, n = _.y, O(m)) {
+      const a = (o - s - m) / 2;
+      s += a, o -= a;
+    }
+    if (O(h) && h < Math.abs(o - s)) {
+      const a = (o - s - h) / 2;
+      s += a, o -= a;
+    }
+    if (O(x)) {
+      const a = (n - i - x) / 2;
+      i += a, n -= a;
+    }
+    if (O(u) && u < Math.abs(n - i)) {
+      const a = (n - i - u) / 2;
+      i += a, n -= a;
+    }
+    this.get("adjustBulletPosition") && (l && (o = Math.min(Math.max(0, o), this._pw), s = Math.min(Math.max(0, s), this._pw)), d && (i = Math.min(Math.max(0, i), this._ph), n = Math.min(Math.max(0, n), this._ph))), e.setRaw("left", s), e.setRaw("right", o), e.setRaw("top", i), e.setRaw("bottom", n), t.setPrivate("width", o - s), t.setPrivate("height", n - i), t.set("x", s), t.set("y", n - (n - i));
+  }
+  _handleDataSetChange() {
+    super._handleDataSetChange(), k(this._dataItems, (e) => {
+      this._toggleColumn(e, !1);
+    });
+  }
+  _applyGraphicsStates(e, t) {
+    const s = e.get("graphics"), o = s.states.lookup("dropFromOpen"), i = s.states.lookup("riseFromOpen"), n = s.states.lookup("dropFromPrevious"), l = s.states.lookup("riseFromPrevious");
+    if (o || n || i || l) {
+      const d = this.get("xAxis"), m = this.get("yAxis"), x = this.get("baseAxis");
+      let h, u, p;
+      x === d && m.isType("ValueAxis") ? (h = e.get(this._yOpenField), u = e.get(this._yField), p = t.get(this._yField)) : x === m && d.isType("ValueAxis") && (h = e.get(this._xOpenField), u = e.get(this._xField), p = t.get(this._xField)), O(h) && O(u) && (u < h ? o && o.apply() : i && i.apply(), O(p) && (u < p ? n && n.apply() : l && l.apply()));
+    }
+  }
+  /**
+   * @ignore
+   */
+  disposeDataItem(e) {
+    super.disposeDataItem(e);
+    const t = e.get("graphics");
+    t && (this.columns.removeValue(t), t.dispose());
+    const s = e.get("rangeGraphics");
+    s && k(s, (o) => {
+      const i = o.getPrivate("list");
+      i && i.removeValue(o), o.dispose();
+    });
+  }
+  /**
+   * Hides series's data item.
+   *
+   * @param   dataItem  Data item
+   * @param   duration  Animation duration in milliseconds
+   * @return            Promise
+   */
+  hideDataItem(e, t) {
+    const s = Object.create(null, {
+      hideDataItem: { get: () => super.hideDataItem }
+    });
+    return $(this, void 0, void 0, function* () {
+      const o = [s.hideDataItem.call(this, e, t)], i = e.get("graphics");
+      i && o.push(i.hide(t));
+      const n = e.get("rangeGraphics");
+      n && k(n, (l) => {
+        o.push(l.hide(t));
+      }), yield Promise.all(o);
+    });
+  }
+  _toggleColumn(e, t) {
+    const s = e.get("graphics");
+    s && s.setPrivate("visible", t);
+    const o = e.get("rangeGraphics");
+    o && k(o, (n) => {
+      n.setPrivate("visible", t);
+    });
+    const i = e.bullets;
+    i && k(i, (n) => {
+      n.setPrivate("hidden", !t);
+    });
+  }
+  /**
+   * Shows series's data item.
+   *
+   * @param   dataItem  Data item
+   * @param   duration  Animation duration in milliseconds
+   * @return            Promise
+   */
+  showDataItem(e, t) {
+    const s = Object.create(null, {
+      showDataItem: { get: () => super.showDataItem }
+    });
+    return $(this, void 0, void 0, function* () {
+      const o = [s.showDataItem.call(this, e, t)], i = e.get("graphics");
+      i && o.push(i.show(t));
+      const n = e.get("rangeGraphics");
+      n && k(n, (l) => {
+        o.push(l.show(t));
+      }), yield Promise.all(o);
+    });
+  }
+  /**
+   * @ignore
+   */
+  updateLegendMarker(e) {
+    let t = this.get("legendDataItem");
+    if (this.get("useLastColorForLegendMarker") && !e) {
+      const s = this.dataItems[this.endIndex() - 1];
+      s && (e = s);
+    }
+    if (t) {
+      let s = this.columns.template;
+      if (e) {
+        let i = e.get("graphics");
+        i && (s = i);
+      }
+      const o = t.get("markerRectangle");
+      if (o && !t.get("itemContainer").get("disabled")) {
+        const i = o.states.lookup("default");
+        k(K, (n) => {
+          const l = s.get(n, this.get(n));
+          o.set(n, l), i.set(n, l);
+        });
+      }
+    }
+  }
+  _getTooltipTarget(e) {
+    if (this.get("seriesTooltipTarget") == "bullet")
+      return super._getTooltipTarget(e);
+    let t = e.get("graphics");
+    return t || this;
+  }
+}
+Object.defineProperty(T, "className", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: "BaseColumnSeries"
+});
+Object.defineProperty(T, "classNames", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: se.classNames.concat([T.className])
+});
+class N extends W {
+  _beforeChanged() {
+    super._beforeChanged(), (this.isDirty("lowX0") || this.isDirty("lowY0") || this.isDirty("lowX1") || this.isDirty("lowY1") || this.isDirty("highX0") || this.isDirty("highX1") || this.isDirty("highY0") || this.isDirty("highY1")) && (this._clear = !0);
+  }
+  _draw() {
+    super._draw();
+    const e = this._display;
+    e.moveTo(this.get("lowX0", 0), this.get("lowY0", 0)), e.lineTo(this.get("lowX1", 0), this.get("lowY1", 0)), e.moveTo(this.get("highX0", 0), this.get("highY0", 0)), e.lineTo(this.get("highX1", 0), this.get("highY1", 0));
+  }
+}
+Object.defineProperty(N, "className", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: "Candlestick"
+});
+Object.defineProperty(N, "classNames", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: W.classNames.concat([N.className])
+});
+class S extends T {
+  constructor() {
+    super(...arguments), Object.defineProperty(this, "allColumns", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: this.children.push(ie.new(this._root, {}))
+    }), Object.defineProperty(this, "allColumnsData", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: []
+    }), Object.defineProperty(this, "columns", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: this.addDisposer(new E(H.new({}), () => W._new(this._root, {
+        position: "absolute",
+        themeTags: U(this.columns.template.get("themeTags", []), ["series", "column"])
+      }, [this.columns.template])))
+    });
+  }
+  /**
+   * @ignore
+   */
+  makeColumn(e, t) {
+    const s = t.make();
+    return this.get("turboMode") ? s.virtualParent = this.chart : this.mainContainer.children.push(s), s._setDataItem(e), t.push(s), s;
+  }
+  _processAxisRange(e) {
+    super._processAxisRange(e), e.columns = new E(H.new({}), () => W._new(this._root, {
+      position: "absolute",
+      themeTags: U(e.columns.template.get("themeTags", []), ["series", "column"])
+    }, [this.columns.template, e.columns.template]));
+  }
+  _beforeColumnsDraw() {
+    this.allColumnsData = [];
+  }
+  _afterColumnsDraw() {
+    this.get("turboMode") && this.allColumns.set("draw", (e) => {
+      e.clear(), k(this.allColumnsData, (t) => {
+        const s = t.width, o = t.height, i = t.x, n = t.y, l = t.stroke, d = t.fill, m = t.strokeWidth, x = t.strokeOpacity, h = t.fillOpacity;
+        e.beginFill(d, h), e.beginPath(), e.lineStyle(m, l, x), e.drawRect(i, n, s, o), e.endStroke(), e.endFill();
+      });
+    });
+  }
+  _updateSeriesGraphics(e, t, s, o, i, n, l, d) {
+    if (this.get("turboMode")) {
+      const m = t.get("stroke"), x = t.get("fillOpacity", 1), h = t.get("strokeOpacity", 1), u = t.get("strokeWidth", 1), p = t.get("fill"), _ = this.getPoint(s, i), g = this.getPoint(o, n), a = e.get("point");
+      if (a) {
+        const f = this.getPoint(a.x, a.y);
+        a.x = f.x + this._x, a.y = f.y + this._y;
+      }
+      s = _.x, o = g.x, i = _.y, n = g.y, e.setRaw("left", s), e.setRaw("right", o), e.setRaw("top", i), e.setRaw("bottom", n), this.allColumnsData.push({ width: o - s, height: n - i, x: s, y: i, stroke: m, fill: p, strokeWidth: u, strokeOpacity: h, fillOpacity: x });
+    } else
+      super._updateSeriesGraphics(e, t, s, o, i, n, l, d);
+  }
+}
+Object.defineProperty(S, "className", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: "ColumnSeries"
+});
+Object.defineProperty(S, "classNames", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: T.classNames.concat([S.className])
+});
+class z extends S {
+  constructor() {
+    super(...arguments), Object.defineProperty(this, "columns", {
+      enumerable: !0,
+      configurable: !0,
+      writable: !0,
+      value: this.addDisposer(new E(H.new({
+        themeTags: ["autocolor"]
+      }), () => N._new(this._root, {
+        themeTags: U(this.columns.template.get("themeTags", []), ["candlestick", "series", "column"])
+      }, [this.columns.template])))
+    });
+  }
+  /**
+   * @ignore
+   */
+  makeColumn(e, t) {
+    const s = t.make();
+    return this.get("turboMode") ? s.virtualParent = this.chart : this.mainContainer.children.push(s), s._setDataItem(e), t.push(s), s;
+  }
+  _updateGraphics(e, t, s) {
+    super._updateGraphics(e, t, s);
+    const o = this.getRaw("xAxis"), i = this.getRaw("yAxis");
+    let n = this.get("vcy", 1), l = this.get("vcx", 1), d, m, x, h, u, p, _, g, a = this.get("locationX", e.get("locationX", 0.5)), f = this.get("locationY", e.get("locationY", 0.5)), c = this.get("openLocationX", e.get("openLocationX", a)), r = this.get("openLocationY", e.get("openLocationY", f)), w;
+    if (s == 0) {
+      let X = i.getDataItemPositionY(e, this._yOpenField, 1, n), y = i.getDataItemPositionY(e, this._yField, 1, n);
+      h = i.getDataItemPositionY(e, this._yLowField, 1, n), g = i.getDataItemPositionY(e, this._yHighField, 1, n), _ = Math.max(X, y), x = Math.min(X, y);
+      let b = this._aLocationX0 + c - 0.5, C = this._aLocationX1 + a - 0.5;
+      d = o.getDataItemPositionX(e, this._xField, b + (C - b) / 2, l), m = d, u = d, p = d, w = "vertical";
+    } else {
+      let X = o.getDataItemPositionX(e, this._xOpenField, 1, l), y = o.getDataItemPositionX(e, this._xField, 1, l);
+      m = o.getDataItemPositionX(e, this._xLowField, 1, l), p = o.getDataItemPositionX(e, this._xHighField, 1, l), u = Math.max(X, y), d = Math.min(X, y);
+      let b = this._aLocationY0 + r - 0.5, C = this._aLocationY1 + f - 0.5;
+      x = i.getDataItemPositionY(e, this._yField, b + (C - b) / 2, n), h = x, _ = x, g = x, w = "horizontal";
+    }
+    this._updateCandleGraphics(e, d, m, x, h, u, p, _, g, w);
+  }
+  _updateCandleGraphics(e, t, s, o, i, n, l, d, m, x) {
+    let h = e.get("graphics");
+    if (h) {
+      let u = this.getPoint(t, o), p = this.getPoint(s, i), _ = this.getPoint(n, d), g = this.getPoint(l, m);
+      if (this.get("turboMode")) {
+        const a = this.allColumnsData[this.allColumnsData.length - 1];
+        a.lowX0 = u.x, a.lowY0 = u.y, a.lowX1 = p.x, a.lowY1 = p.y, a.highX0 = _.x, a.highY0 = _.y, a.highX1 = g.x, a.highY1 = g.y;
+      } else {
+        let a = h.x(), f = h.y();
+        h.set("lowX0", u.x - a), h.set("lowY0", u.y - f), h.set("lowX1", p.x - a), h.set("lowY1", p.y - f), h.set("highX0", _.x - a), h.set("highY0", _.y - f), h.set("highX1", g.x - a), h.set("highY1", g.y - f), h.set("orientation", x);
+        let c = e.get("rangeGraphics");
+        c && k(c, (r) => {
+          r.set("lowX0", u.x - a), r.set("lowY0", u.y - f), r.set("lowX1", p.x - a), r.set("lowY1", p.y - f), r.set("highX0", _.x - a), r.set("highY0", _.y - f), r.set("highX1", g.x - a), r.set("highY1", g.y - f), r.set("orientation", x);
+        });
+      }
+    }
+  }
+  _afterColumnsDraw() {
+    this.get("turboMode") && this.allColumns.set("draw", (e) => {
+      e.clear(), k(this.allColumnsData, (t) => {
+        e.beginPath();
+        const s = t.width, o = t.height, i = t.x, n = t.y, l = t.stroke, d = t.fill, m = t.strokeWidth, x = t.strokeOpacity, h = t.fillOpacity, u = t.lowX0, p = t.lowY0, _ = t.lowX1, g = t.lowY1, a = t.highX0, f = t.highY0, c = t.highX1, r = t.highY1;
+        e.beginFill(d, h), e.beginPath(), e.lineStyle(m, l, x), e.drawRect(i, n, s, o), e.moveTo(u, p), e.lineTo(_, g), e.moveTo(a, f), e.lineTo(c, r), e.endStroke(), e.endFill();
+      });
+    });
+  }
+  _processAxisRange(e) {
+    super._processAxisRange(e), e.columns = new E(H.new({}), () => N._new(this._root, {
+      themeTags: U(e.columns.template.get("themeTags", []), ["candlestick", "series", "column"])
+    }, [this.columns.template, e.columns.template]));
+  }
+}
+Object.defineProperty(z, "className", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: "CandlestickSeries"
+});
+Object.defineProperty(z, "classNames", {
+  enumerable: !0,
+  configurable: !0,
+  writable: !0,
+  value: S.classNames.concat([z.className])
+});
+const xe = (j) => {
+  const e = ge({
+    props: j,
+    name: "MuiCandlestickChart"
+  }), {
+    data: t,
+    seriesName: s,
+    height: o = "500px",
+    width: i = "100%",
+    chartId: n = "candlestick-chart",
+    showVolume: l = !1,
+    risingColor: d = "#00b050",
+    fallingColor: m = "#ff3b30",
+    loading: x = !1,
+    emptyMessage: h = "No data available",
+    sx: u,
+    ...p
+  } = e, _ = {
+    ...e,
+    height: o,
+    width: i,
+    chartId: n,
+    showVolume: l,
+    risingColor: d,
+    fallingColor: m,
+    loading: x,
+    emptyMessage: h
+  }, g = q(null), a = q(null), f = q(null);
+  return ue(() => {
+    if (!f.current) return;
+    const c = oe.new(f.current);
+    a.current = c, c.setThemes([ne.new(c)]);
+    const r = c.container.children.push(
+      le.new(c, {
+        panX: !0,
+        panY: !0,
+        wheelX: "panX",
+        wheelY: "zoomX",
+        pinchZoomX: !0,
+        layout: c.verticalLayout
+      })
+    );
+    g.current = r, r.set(
+      "cursor",
+      ae.new(c, {
+        behavior: "zoomX"
+      })
+    ).lineY.set("visible", !1);
+    const w = r.xAxes.push(
+      re.new(c, {
+        maxDeviation: 0.3,
+        groupData: !0,
+        baseInterval: { timeUnit: "day", count: 1 },
+        renderer: he.new(c, {
+          minorGridEnabled: !0
+        }),
+        tooltip: I.new(c, {})
+      })
+    ), X = r.yAxes.push(
+      ee.new(c, {
+        renderer: te.new(c, {})
+      })
+    ), y = r.series.push(
+      z.new(c, {
+        name: s || "Price",
+        xAxis: w,
+        yAxis: X,
+        valueXField: "date",
+        openValueYField: "open",
+        highValueYField: "high",
+        lowValueYField: "low",
+        valueYField: "close",
+        tooltip: I.new(c, {
+          labelText: `
+          Open: {openValueY}
+          High: {highValueY}
+          Low: {lowValueY}
+          Close: {valueY}
+          Change: {valueY - openValueY > 0 ? "+" : ""}{((valueY - openValueY)/openValueY*100).toFixed(2)}%
+          `
+        })
+      })
+    );
+    y.columns.template.states.create("riseFromPrevious", {
+      fill: M(d),
+      stroke: M(d)
+    }), y.columns.template.states.create("dropFromPrevious", {
+      fill: M(m),
+      stroke: M(m)
+    });
+    let b = null, C = null;
+    return l && (C = r.yAxes.push(
+      ee.new(c, {
+        renderer: te.new(c, {
+          opposite: !0
+        }),
+        numberFormat: "#a"
+      })
+    ), b = r.series.push(
+      S.new(c, {
+        name: "Volume",
+        xAxis: w,
+        yAxis: C,
+        valueYField: "volume",
+        valueXField: "date",
+        fill: M("#2962ff"),
+        stroke: M("#2962ff"),
+        opacity: 0.6
+      })
+    ), b.columns.template.setAll({
+      width: ce(80)
+    })), y.data.setAll(t), l && b && b.data.setAll(t), r.appear(1e3), y.appear(1e3), () => {
+      c.dispose();
+    };
+  }, []), pe(() => {
+    if (g.current && a.current) {
+      const c = g.current.series.getIndex(
+        0
+      ), r = l ? g.current.series.getIndex(1) : null;
+      c == null || c.data.setAll(t), r == null || r.data.setAll(t);
+    }
+  }, [t, l]), {
+    chartDivRef: f,
+    data: t,
+    seriesName: s,
+    height: o,
+    width: i,
+    chartId: n,
+    showVolume: l,
+    risingColor: d,
+    fallingColor: m,
+    loading: x,
+    emptyMessage: h,
+    sx: u,
+    other: p,
+    ownerState: _
+  };
+};
+export {
+  xe as useCandlestickChartLogic
+};

package/dist/components/charts/candlestick/styled.js

@@ -0,0 +1,12 @@
+import { styled as i } from "@mui/material";
+const h = i("div", {
+  name: "MuiCandlestickChart",
+  slot: "Root"
+})(({ ownerState: t }) => ({
+  position: "relative",
+  width: t.width,
+  height: t.height
+}));
+export {
+  h as CandlestickChartRoot
+};