@hybridcore/ui 1.5.79 → 1.5.80

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

@@ -1,612 +1,27 @@
-import { jsxs as oe, jsx as q } from "react/jsx-runtime";
-import { X as ie, e as D, v as K, P as V, i as Q, a as T, _ as $, R as W, G as ne, L as E, T as z, m as H, b as le, A as ae, c as re, d as he, D as ce, f as ge, g as I, V as ee, h as te, j as S, p as ue } from "../../../AxisRendererY-CFo972D5.js";
-import { useRef as se, useLayoutEffect as pe, useEffect as fe } from "react";
-class G extends ie {
-  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 r = this.dataItems[n];
-        this._createGraphics(r);
-      }
-  }
-  _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, r = 0, f = 0;
-    D(o.series, (g) => {
-      if (g instanceof G) {
-        const _ = g.get("stacked");
-        _ && f == 0 && r++, !_ && g.get("clustered") && r++;
-      }
-      g === this && (n = r - 1), f++;
-    }), this.get("clustered") || (n = 0, r = 1), r === 0 && (r = 1, n = 0);
-    const x = t.get("renderer"), u = s.get("renderer"), c = "cellStartLocation", a = "cellEndLocation", h = x.get(c, 0), d = x.get(a, 1), p = u.get(c, 0), l = u.get(a, 1);
-    if (this._aLocationX0 = h + n / r * (d - h), this._aLocationX1 = h + (n + 1) / r * (d - h), this._aLocationY0 = p + n / r * (l - p), this._aLocationY1 = p + (n + 1) / r * (l - p), t.inited && s.inited) {
-      if (this._axesDirty || this._valuesDirty || this._stackDirty || this.isDirty("vcx") || this.isDirty("vcy") || this._sizeDirty) {
-        const g = this.dataItems.length;
-        let _ = Math.max(0, this.startIndex() - 2), m = Math.min(this.endIndex() + 2, g - 1);
-        for (let y = 0; y < _; y++)
-          this._toggleColumn(this.dataItems[y], !1);
-        let w = this.dataItems[_];
-        for (let y = _; y <= m; y++) {
-          let Y = this.dataItems[y];
-          if (Y.get("valueX") != null && Y.get("valueY") != null) {
-            if (w = Y, y > 0 && _ > 0)
-              for (let A = y - 1; A >= 0; A--) {
-                let b = this.dataItems[A];
-                if (b.get("valueX") != null && b.get("valueY") != null) {
-                  w = b;
-                  break;
-                }
-              }
-            break;
-          } else
-            this._toggleColumn(Y, !1);
-        }
-        this._beforeColumnsDraw();
-        let k = 0;
-        s.isType("CategoryAxis") && t.isType("CategoryAxis") ? k = 2 : t === o ? k = 0 : s === o && (k = 1);
-        for (let y = _; y <= m; y++) {
-          let Y = this.dataItems[y];
-          this._updateGraphics(Y, w, k), Y.get("valueX") != null && Y.get("valueY") != null && (w = Y);
-        }
-        this._afterColumnsDraw();
-        for (let y = m + 1; y < g; 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");
-          D(K, (r) => {
-            const f = t.get(r, this.get(r));
-            i.set(r, f), n.set(r, f);
-          });
-        }
-      }
-      let o = e.get("rangeGraphics");
-      o && D(o, (i) => {
-        i.dispose();
-      }), o = [], e.setRaw("rangeGraphics", o), this.axisRanges.each((i) => {
-        const n = i.container, r = this._makeGraphics(i.columns, e);
-        o && o.push(r), r.setPrivate("list", i.columns), n.children.push(r);
-      });
-    }
-  }
-  createAxisRange(e) {
-    return D(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, r = e.get(i), f = e.get(n), x = this.get("exactLocationX", !1);
-    if (r != null && f != null) {
-      const u = this._xOpenField, c = this._yOpenField, a = this.get("locationX", e.get("locationX", 0.5)), h = this.get("locationY", e.get("locationY", 0.5)), d = this.get("openLocationX", e.get("openLocationX", a)), p = this.get("openLocationY", e.get("openLocationY", h)), l = o.get("width"), g = o.get("height"), _ = this.get("stacked"), m = this.get("xAxis"), w = this.get("yAxis"), k = m.get("start"), y = m.get("end"), Y = w.get("start"), A = w.get("end");
-      let b, L, F, C, R = this.get("vcy", 1), M = this.get("vcx", 1), B = !1, Z = !1;
-      if (s == 0) {
-        let X = this._aLocationX0 + d - 0.5, P = this._aLocationX1 + a - 0.5;
-        if (l instanceof V) {
-          let v = (P - X) * (1 - l.value) / 2;
-          X += v, P -= v;
-        }
-        if (b = m.getDataItemPositionX(e, u, X, M, x), L = m.getDataItemPositionX(e, i, P, M, x), F = w.getDataItemPositionY(e, n, h, R), this._yOpenField !== this._yField)
-          C = w.getDataItemPositionY(e, c, p, R);
-        else if (_) {
-          let v = e.get("stackToItemY");
-          v ? C = w.getDataItemPositionY(v, n, p, v.component.get("vcy")) : C = w.basePosition();
-        } else
-          C = w.basePosition();
-        e.setRaw("point", { x: b + (L - b) / 2, y: F }), Z = !0;
-      } else if (s == 1) {
-        let X = this._aLocationY0 + p - 0.5, P = this._aLocationY1 + h - 0.5;
-        if (g instanceof V) {
-          let v = (P - X) * (1 - g.value) / 2;
-          X += v, P -= v;
-        }
-        if (F = w.getDataItemPositionY(e, c, X, R), C = w.getDataItemPositionY(e, n, P, R), L = m.getDataItemPositionX(e, i, a, M, x), this._xOpenField !== this._xField)
-          b = m.getDataItemPositionX(e, u, d, M, x);
-        else if (_) {
-          let v = e.get("stackToItemX");
-          v ? b = m.getDataItemPositionX(v, i, d, v.component.get("vcx"), x) : b = m.basePosition();
-        } else
-          b = m.basePosition();
-        B = !0, e.setRaw("point", { x: L, y: F + (C - F) / 2 });
-      } else if (s == 2) {
-        let X = this._aLocationX0 + d - 0.5, P = this._aLocationX1 + a - 0.5;
-        if (l instanceof V) {
-          let v = (P - X) * (1 - l.value) / 2;
-          X += v, P -= v;
-        }
-        if (b = m.getDataItemPositionX(e, u, X, M), L = m.getDataItemPositionX(e, i, P, M), X = this._aLocationY0 + p - 0.5, P = this._aLocationY1 + h - 0.5, g instanceof V) {
-          let v = (P - X) * (1 - g.value) / 2;
-          X += v, P -= v;
-        }
-        F = w.getDataItemPositionY(e, c, X, R), C = w.getDataItemPositionY(e, n, P, R), e.setRaw("point", { x: b + (L - b) / 2, y: F + (C - F) / 2 });
-      }
-      this._applyGraphicsStates(e, t), this._updateSeriesGraphics(e, o, b, L, F, C, B, Z), b < k && L < k || b > y && L > y || F < Y && C <= Y || F >= A && C > A || Q(b) || Q(F) ? this._toggleColumn(e, !1) : this._toggleColumn(e, !0);
-      let J = e.get("rangeGraphics");
-      J && D(J, (X) => {
-        this._updateSeriesGraphics(e, X, b, L, F, C, B, Z);
-      });
-    } else
-      this._toggleColumn(e, !1);
-  }
-  _updateSeriesGraphics(e, t, s, o, i, n, r, f) {
-    const x = t.get("width"), u = t.get("height"), c = t.get("maxWidth"), a = t.get("maxHeight"), h = this.getPoint(s, i), d = this.getPoint(o, n), p = e.get("point");
-    if (p) {
-      const l = this.getPoint(p.x, p.y);
-      p.x = l.x + this._x, p.y = l.y + this._y;
-    }
-    if (s = h.x, o = d.x, i = h.y, n = d.y, T(x)) {
-      const l = (o - s - x) / 2;
-      s += l, o -= l;
-    }
-    if (T(c) && c < Math.abs(o - s)) {
-      const l = (o - s - c) / 2;
-      s += l, o -= l;
-    }
-    if (T(u)) {
-      const l = (n - i - u) / 2;
-      i += l, n -= l;
-    }
-    if (T(a) && a < Math.abs(n - i)) {
-      const l = (n - i - a) / 2;
-      i += l, n -= l;
-    }
-    this.get("adjustBulletPosition") && (r && (o = Math.min(Math.max(0, o), this._pw), s = Math.min(Math.max(0, s), this._pw)), f && (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(), D(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"), r = s.states.lookup("riseFromPrevious");
-    if (o || n || i || r) {
-      const f = this.get("xAxis"), x = this.get("yAxis"), u = this.get("baseAxis");
-      let c, a, h;
-      u === f && x.isType("ValueAxis") ? (c = e.get(this._yOpenField), a = e.get(this._yField), h = t.get(this._yField)) : u === x && f.isType("ValueAxis") && (c = e.get(this._xOpenField), a = e.get(this._xField), h = t.get(this._xField)), T(c) && T(a) && (a < c ? o && o.apply() : i && i.apply(), T(h) && (a < h ? n && n.apply() : r && r.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 && D(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 && D(n, (r) => {
-        o.push(r.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 && D(o, (n) => {
-      n.setPrivate("visible", t);
-    });
-    const i = e.bullets;
-    i && D(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 && D(n, (r) => {
-        o.push(r.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");
-        D(K, (n) => {
-          const r = s.get(n, this.get(n));
-          o.set(n, r), i.set(n, r);
-        });
-      }
-    }
-  }
-  _getTooltipTarget(e) {
-    if (this.get("seriesTooltipTarget") == "bullet")
-      return super._getTooltipTarget(e);
-    let t = e.get("graphics");
-    return t || this;
-  }
-}
-Object.defineProperty(G, "className", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: "BaseColumnSeries"
-});
-Object.defineProperty(G, "classNames", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: ie.classNames.concat([G.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 j extends G {
-  constructor() {
-    super(...arguments), Object.defineProperty(this, "allColumns", {
-      enumerable: !0,
-      configurable: !0,
-      writable: !0,
-      value: this.children.push(ne.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(z.new({}), () => W._new(this._root, {
-        position: "absolute",
-        themeTags: H(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(z.new({}), () => W._new(this._root, {
-      position: "absolute",
-      themeTags: H(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(), D(this.allColumnsData, (t) => {
-        const s = t.width, o = t.height, i = t.x, n = t.y, r = t.stroke, f = t.fill, x = t.strokeWidth, u = t.strokeOpacity, c = t.fillOpacity;
-        e.beginFill(f, c), e.beginPath(), e.lineStyle(x, r, u), e.drawRect(i, n, s, o), e.endStroke(), e.endFill();
-      });
-    });
-  }
-  _updateSeriesGraphics(e, t, s, o, i, n, r, f) {
-    if (this.get("turboMode")) {
-      const x = t.get("stroke"), u = t.get("fillOpacity", 1), c = t.get("strokeOpacity", 1), a = t.get("strokeWidth", 1), h = t.get("fill"), d = this.getPoint(s, i), p = this.getPoint(o, n), l = e.get("point");
-      if (l) {
-        const g = this.getPoint(l.x, l.y);
-        l.x = g.x + this._x, l.y = g.y + this._y;
-      }
-      s = d.x, o = p.x, i = d.y, n = p.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: x, fill: h, strokeWidth: a, strokeOpacity: c, fillOpacity: u });
-    } else
-      super._updateSeriesGraphics(e, t, s, o, i, n, r, f);
-  }
-}
-Object.defineProperty(j, "className", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: "ColumnSeries"
-});
-Object.defineProperty(j, "classNames", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: G.classNames.concat([j.className])
-});
-class U extends j {
-  constructor() {
-    super(...arguments), Object.defineProperty(this, "columns", {
-      enumerable: !0,
-      configurable: !0,
-      writable: !0,
-      value: this.addDisposer(new E(z.new({
-        themeTags: ["autocolor"]
-      }), () => N._new(this._root, {
-        themeTags: H(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), r = this.get("vcx", 1), f, x, u, c, a, h, d, p, l = this.get("locationX", e.get("locationX", 0.5)), g = this.get("locationY", e.get("locationY", 0.5)), _ = this.get("openLocationX", e.get("openLocationX", l)), m = this.get("openLocationY", e.get("openLocationY", g)), w;
-    if (s == 0) {
-      let k = i.getDataItemPositionY(e, this._yOpenField, 1, n), y = i.getDataItemPositionY(e, this._yField, 1, n);
-      c = i.getDataItemPositionY(e, this._yLowField, 1, n), p = i.getDataItemPositionY(e, this._yHighField, 1, n), d = Math.max(k, y), u = Math.min(k, y);
-      let Y = this._aLocationX0 + _ - 0.5, A = this._aLocationX1 + l - 0.5;
-      f = o.getDataItemPositionX(e, this._xField, Y + (A - Y) / 2, r), x = f, a = f, h = f, w = "vertical";
-    } else {
-      let k = o.getDataItemPositionX(e, this._xOpenField, 1, r), y = o.getDataItemPositionX(e, this._xField, 1, r);
-      x = o.getDataItemPositionX(e, this._xLowField, 1, r), h = o.getDataItemPositionX(e, this._xHighField, 1, r), a = Math.max(k, y), f = Math.min(k, y);
-      let Y = this._aLocationY0 + m - 0.5, A = this._aLocationY1 + g - 0.5;
-      u = i.getDataItemPositionY(e, this._yField, Y + (A - Y) / 2, n), c = u, d = u, p = u, w = "horizontal";
-    }
-    this._updateCandleGraphics(e, f, x, u, c, a, h, d, p, w);
-  }
-  _updateCandleGraphics(e, t, s, o, i, n, r, f, x, u) {
-    let c = e.get("graphics");
-    if (c) {
-      let a = this.getPoint(t, o), h = this.getPoint(s, i), d = this.getPoint(n, f), p = this.getPoint(r, x);
-      if (this.get("turboMode")) {
-        const l = this.allColumnsData[this.allColumnsData.length - 1];
-        l.lowX0 = a.x, l.lowY0 = a.y, l.lowX1 = h.x, l.lowY1 = h.y, l.highX0 = d.x, l.highY0 = d.y, l.highX1 = p.x, l.highY1 = p.y;
-      } else {
-        let l = c.x(), g = c.y();
-        c.set("lowX0", a.x - l), c.set("lowY0", a.y - g), c.set("lowX1", h.x - l), c.set("lowY1", h.y - g), c.set("highX0", d.x - l), c.set("highY0", d.y - g), c.set("highX1", p.x - l), c.set("highY1", p.y - g), c.set("orientation", u);
-        let _ = e.get("rangeGraphics");
-        _ && D(_, (m) => {
-          m.set("lowX0", a.x - l), m.set("lowY0", a.y - g), m.set("lowX1", h.x - l), m.set("lowY1", h.y - g), m.set("highX0", d.x - l), m.set("highY0", d.y - g), m.set("highX1", p.x - l), m.set("highY1", p.y - g), m.set("orientation", u);
-        });
+import { jsxs as c, jsx as t } from "react/jsx-runtime";
+import { useCandlestickChartLogic as h } from "./logic.js";
+import { CandlestickChartRoot as f } from "./styled.js";
+function u(i) {
+  const {
+    chartDivRef: n,
+    data: o,
+    chartId: r,
+    loading: e,
+    emptyMessage: s,
+    sx: a,
+    other: l,
+    ownerState: d
+  } = h(i);
+  return /* @__PURE__ */ c(f, { ownerState: d, sx: a, ...l, children: [
+    /* @__PURE__ */ t(
+      "div",
+      {
+        ref: n,
+        id: r,
+        style: { width: "100%", height: "100%" }
       }
-    }
-  }
-  _afterColumnsDraw() {
-    this.get("turboMode") && this.allColumns.set("draw", (e) => {
-      e.clear(), D(this.allColumnsData, (t) => {
-        e.beginPath();
-        const s = t.width, o = t.height, i = t.x, n = t.y, r = t.stroke, f = t.fill, x = t.strokeWidth, u = t.strokeOpacity, c = t.fillOpacity, a = t.lowX0, h = t.lowY0, d = t.lowX1, p = t.lowY1, l = t.highX0, g = t.highY0, _ = t.highX1, m = t.highY1;
-        e.beginFill(f, c), e.beginPath(), e.lineStyle(x, r, u), e.drawRect(i, n, s, o), e.moveTo(a, h), e.lineTo(d, p), e.moveTo(l, g), e.lineTo(_, m), e.endStroke(), e.endFill();
-      });
-    });
-  }
-  _processAxisRange(e) {
-    super._processAxisRange(e), e.columns = new E(z.new({}), () => N._new(this._root, {
-      themeTags: H(e.columns.template.get("themeTags", []), ["candlestick", "series", "column"])
-    }, [this.columns.template, e.columns.template]));
-  }
-}
-Object.defineProperty(U, "className", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: "CandlestickSeries"
-});
-Object.defineProperty(U, "classNames", {
-  enumerable: !0,
-  configurable: !0,
-  writable: !0,
-  value: j.classNames.concat([U.className])
-});
-function ye({
-  data: O,
-  seriesName: e,
-  height: t = "500px",
-  width: s = "100%",
-  chartId: o = "candlestick-chart",
-  showVolume: i = !1,
-  risingColor: n = "#00b050",
-  fallingColor: r = "#ff3b30",
-  loading: f = !1,
-  emptyMessage: x = "No data available"
-}) {
-  const u = se(null), c = se(null);
-  return pe(() => {
-    const a = le.new(o);
-    c.current = a, a.setThemes([ae.new(a)]);
-    const h = a.container.children.push(
-      re.new(a, {
-        panX: !0,
-        panY: !0,
-        wheelX: "panX",
-        wheelY: "zoomX",
-        pinchZoomX: !0,
-        layout: a.verticalLayout
-      })
-    );
-    u.current = h, h.set(
-      "cursor",
-      he.new(a, {
-        behavior: "zoomX"
-      })
-    ).lineY.set("visible", !1);
-    const d = h.xAxes.push(
-      ce.new(a, {
-        maxDeviation: 0.3,
-        groupData: !0,
-        baseInterval: { timeUnit: "day", count: 1 },
-        renderer: ge.new(a, {
-          minorGridEnabled: !0
-        }),
-        tooltip: I.new(a, {})
-      })
-    ), p = h.yAxes.push(
-      ee.new(a, {
-        renderer: te.new(a, {})
-      })
-    ), l = h.series.push(
-      U.new(a, {
-        name: e || "Price",
-        xAxis: d,
-        yAxis: p,
-        valueXField: "date",
-        openValueYField: "open",
-        highValueYField: "high",
-        lowValueYField: "low",
-        valueYField: "close",
-        tooltip: I.new(a, {
-          labelText: `
-          Open: {openValueY}
-          High: {highValueY}
-          Low: {lowValueY}
-          Close: {valueY}
-          Change: {valueY - openValueY > 0 ? "+" : ""}{((valueY - openValueY)/openValueY*100).toFixed(2)}%
-          `
-        })
-      })
-    );
-    l.columns.template.states.create("riseFromPrevious", {
-      fill: S(n),
-      stroke: S(n)
-    }), l.columns.template.states.create("dropFromPrevious", {
-      fill: S(r),
-      stroke: S(r)
-    });
-    let g = null, _ = null;
-    return i && (_ = h.yAxes.push(
-      ee.new(a, {
-        renderer: te.new(a, {
-          opposite: !0
-        }),
-        numberFormat: "#a"
-      })
-    ), g = h.series.push(
-      j.new(a, {
-        name: "Volume",
-        xAxis: d,
-        yAxis: _,
-        valueYField: "volume",
-        valueXField: "date",
-        fill: S("#2962ff"),
-        stroke: S("#2962ff"),
-        opacity: 0.6
-      })
-    ), g.columns.template.setAll({
-      width: ue(80)
-    })), l.data.setAll(O), i && g && g.data.setAll(O), h.appear(1e3), l.appear(1e3), () => {
-      a.dispose();
-    };
-  }, []), fe(() => {
-    if (u.current && c.current) {
-      const a = u.current.series.getIndex(
-        0
-      ), h = i ? u.current.series.getIndex(1) : null;
-      a == null || a.data.setAll(O), h == null || h.data.setAll(O);
-    }
-  }, [O, i]), /* @__PURE__ */ oe("div", { style: { position: "relative", width: s, height: t }, children: [
-    /* @__PURE__ */ q("div", { id: o, style: { width: "100%", height: "100%" } }),
-    f && /* @__PURE__ */ q(
+    ),
+    e && /* @__PURE__ */ t(
       "div",
       {
         style: {
@@ -617,12 +32,13 @@ function ye({
           alignItems: "center",
           justifyContent: "center",
           fontSize: "1.2rem",
-          color: "#555"
+          color: "#555",
+          zIndex: 10
         },
         children: "Loading..."
       }
     ),
-    !f && O.length === 0 && /* @__PURE__ */ q(
+    !e && o.length === 0 && /* @__PURE__ */ t(
       "div",
       {
         style: {
@@ -632,13 +48,14 @@ function ye({
           alignItems: "center",
           justifyContent: "center",
           color: "#999",
-          fontSize: "1.1rem"
+          fontSize: "1.1rem",
+          zIndex: 10
         },
-        children: x
+        children: s
       }
     )
   ] });
 }
 export {
-  ye as CandlestickChart
+  u as CandlestickChart
 };