vue-data-ui 2.4.41 → 2.4.43

package/dist/vue-ui-candlestick-z1XCCmjs.js

@@ -0,0 +1,740 @@
+import { computed as f, ref as n, watch as $e, onMounted as je, onBeforeUnmount as He, nextTick as V, openBlock as s, createElementBlock as u, normalizeClass as Ce, normalizeStyle as _e, createBlock as _, createCommentVNode as v, unref as g, createSlots as Ye, withCtx as m, renderSlot as p, normalizeProps as T, guardReactiveProps as I, createVNode as ze, createElementVNode as r, Fragment as F, renderList as L, toDisplayString as O, createTextVNode as qe } from "vue";
+import { u as Je, c as Ke, t as Qe, C as Se, o as Ze, e as z, D as et, v as B, X as tt, w as j, E as lt, s as ot, x as at, y as st, q as ut, r as it, F as Ne } from "./index-CvhiHStv.js";
+import { t as nt, u as rt } from "./useResponsive-CoxXLe23.js";
+import { _ as dt } from "./Title-DQcop8gI.js";
+import { u as vt, U as yt } from "./usePrinter-BVA2_kNp.js";
+import { _ as ct } from "./Tooltip-Dx07vASW.js";
+import { D as ht } from "./DataTable-YQ5lDRtX.js";
+import ft from "./vue-ui-skeleton-p82n8dLi.js";
+import { S as pt } from "./Slicer-BcXvtaNe.js";
+import gt from "./vue-ui-accordion-CzsbGsxC.js";
+import { u as Ae } from "./useNestedProp-Ccre6tXM.js";
+import { _ as mt } from "./PackageVersion-CS8EAteX.js";
+import { P as xt } from "./PenAndPaper-D22t_fD9.js";
+import { _ as bt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const kt = ["id"], wt = ["xmlns", "viewBox"], $t = { key: 0 }, Ct = ["id"], _t = ["stop-color"], zt = ["stop-color"], St = ["stop-color"], Nt = ["id"], At = ["stop-color"], Tt = ["stop-color"], It = ["stop-color"], Ft = { key: 0 }, Lt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Rt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Pt = { key: 1 }, Vt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ot = ["x", "y", "font-size", "fill", "font-weight"], Bt = { key: 2 }, Et = ["transform", "text-anchor", "font-size", "fill", "font-weight"], Mt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ut = { key: 0 }, Dt = ["cx", "cy", "r", "fill"], Wt = ["cx", "cy", "r", "fill"], Gt = { key: 1 }, Xt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], jt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ht = ["x", "y", "height", "width", "fill", "rx"], Yt = ["x", "y", "height", "width", "fill", "rx", "stroke", "stroke-width"], qt = ["x", "y", "height", "width", "fill", "onMouseover"], Jt = {
+  key: 5,
+  class: "vue-data-ui-watermark"
+}, Kt = ["innerHTML"], Qt = {
+  __name: "vue-ui-candlestick",
+  props: {
+    config: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    dataset: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  setup($, { expose: Te }) {
+    const c = $, { vue_ui_candlestick: Ie } = Je(), R = f(() => !!c.dataset && c.dataset.length), k = n(Ke()), Fe = n(null), H = n(!1), Y = n(""), q = n(void 0), Z = n(0), S = n(null), ee = n(null), te = n(null), le = n(null), oe = n(null), ae = n(null), E = n(0), se = n(0), ue = n(0), e = f({
+      get: () => ie(),
+      set: (t) => t
+    });
+    function ie() {
+      const t = Ae({
+        userConfig: c.config,
+        defaultConfig: Ie
+      });
+      let o = {};
+      return t.theme ? o = {
+        ...Ae({
+          userConfig: Qe.vue_ui_candlestick[t.theme] || c.config,
+          defaultConfig: t
+        })
+      } : o = t, c.config && Se(c.config, "style.zoom.startIndex") ? o.style.zoom.startIndex = c.config.style.zoom.startIndex : o.style.zoom.startIndex = null, c.config && Se(c.config, "style.zoom.endIndex") ? o.style.zoom.endIndex = c.config.style.zoom.endIndex : o.style.zoom.endIndex = null, o;
+    }
+    $e(() => c.config, (t) => {
+      e.value = ie(), ne(), E.value += 1, ue.value += 1, se.value += 1;
+    }, { deep: !0 }), $e(() => c.dataset, (t) => {
+      h.value.start = 0, h.value.end = t.length, E.value += 1;
+    }, { deep: !0 });
+    const y = n({
+      height: e.value.style.height,
+      width: e.value.style.width,
+      xAxisFontSize: e.value.style.layout.grid.xAxis.dataLabels.fontSize,
+      yAxisFontSize: e.value.style.layout.grid.yAxis.dataLabels.fontSize
+    }), M = n(null);
+    je(() => {
+      ne();
+    });
+    function ne() {
+      if (Ze(c.dataset) && z({
+        componentName: "VueUiCandlestick",
+        type: "dataset"
+      }), e.value.responsive) {
+        const t = nt(() => {
+          const { width: o, height: l } = rt({
+            chart: S.value,
+            title: e.value.style.title.text ? ee.value : null,
+            slicer: le.value,
+            legend: te.value,
+            source: oe.value,
+            noTitle: ae.value
+          });
+          y.value.width = o, y.value.height = l, y.value.xAxisFontSize = Ne({
+            relator: Math.min(o, l),
+            adjuster: e.value.style.width,
+            source: e.value.style.layout.grid.xAxis.dataLabels.fontSize,
+            threshold: 6,
+            fallback: 6
+          }), y.value.yAxisFontSize = Ne({
+            relator: Math.min(o, l),
+            adjuster: e.value.style.width,
+            source: e.value.style.layout.grid.yAxis.dataLabels.fontSize,
+            threshold: 6,
+            fallback: 6
+          });
+        });
+        M.value = new ResizeObserver(t), M.value.observe(S.value.parentNode);
+      }
+      fe();
+    }
+    He(() => {
+      M.value && M.value.disconnect();
+    });
+    const { isPrinting: re, isImaging: de, generatePdf: ve, generateImage: ye } = vt({
+      elementId: `vue-ui-candlestick_${k.value}`,
+      fileName: e.value.style.title.text || "vue-ui-candlestick"
+    }), Le = f(() => e.value.userOptions.show && !e.value.style.title.text), w = n({
+      showTable: e.value.table.show,
+      showTooltip: e.value.style.tooltip.show
+    }), i = f(() => {
+      const { top: t, right: o, bottom: l, left: a } = e.value.style.layout.padding;
+      return {
+        top: t,
+        right: y.value.width - o,
+        left: a,
+        bottom: y.value.height - l,
+        width: y.value.width - a - o,
+        height: y.value.height - t - l
+      };
+    }), P = f(() => c.dataset.length), h = n({
+      start: 0,
+      end: P.value
+    }), ce = f(() => c.dataset.slice(h.value.start, h.value.end)), J = f(() => (c.dataset.forEach((t, o) => {
+      [null, void 0].includes(t[0]) && z({
+        componentName: "VueUiCandlestick",
+        type: "datasetAttribute",
+        property: "period (index 0)",
+        index: o
+      }), [null, void 0].includes(t[1]) && z({
+        componentName: "VueUiCandlestick",
+        type: "datasetAttribute",
+        property: "open (index 1)",
+        index: o
+      }), [null, void 0].includes(t[2]) && z({
+        componentName: "VueUiCandlestick",
+        type: "datasetAttribute",
+        property: "high (index 2)",
+        index: o
+      }), [null, void 0].includes(t[3]) && z({
+        componentName: "VueUiCandlestick",
+        type: "datasetAttribute",
+        property: "low (index 3)",
+        index: o
+      }), [null, void 0].includes(t[4]) && z({
+        componentName: "VueUiCandlestick",
+        type: "datasetAttribute",
+        property: "last (index 4)",
+        index: o
+      }), [null, void 0].includes(t[5]) && z({
+        componentName: "VueUiCandlestick",
+        type: "datasetAttribute",
+        property: "volume (index 5)",
+        index: o
+      });
+    }), ce.value.map((t) => ({
+      period: t[0],
+      open: t[1],
+      high: t[2],
+      low: t[3],
+      last: t[4],
+      volume: t[5]
+    })))), d = f(() => i.value.width / ce.value.length), he = f(() => ({
+      max: Math.max(...J.value.map((t) => t.high)),
+      min: 0
+    })), C = f(() => et(he.value.min, he.value.max, e.value.style.layout.grid.yAxis.dataLabels.steps));
+    function U(t, o) {
+      return {
+        ...t,
+        x: B(i.value.left + o * d.value + d.value / 2),
+        y: B(i.value.top + (1 - t / C.value.max) * i.value.height),
+        value: B(t)
+      };
+    }
+    const x = f(() => J.value.map((t, o) => {
+      const l = U(t.open, o), a = U(t.high, o), b = U(t.low, o), G = U(t.last, o), X = t.last > t.open;
+      return {
+        period: t.period,
+        open: l,
+        high: a,
+        low: b,
+        last: G,
+        volume: t.volume,
+        isBullish: X
+      };
+    }));
+    function Re(t) {
+      return B(t / C.value.max);
+    }
+    const Pe = f(() => C.value.ticks.map((t) => ({
+      y: i.value.bottom - i.value.height * Re(t),
+      value: B(t)
+    }))), Ve = f(() => J.value.map((t) => t.period)), K = n(null);
+    function Oe(t, o) {
+      q.value = t, K.value = {
+        datapoint: o,
+        seriesIndex: t,
+        series: x.value,
+        config: e.value
+      };
+      const l = e.value.style.tooltip.customFormat;
+      if (at(l) && st(() => l({
+        seriesIndex: t,
+        datapoint: o,
+        series: x.value,
+        config: e.value
+      })))
+        Y.value = l({
+          seriesIndex: t,
+          datapoint: o,
+          series: x.value,
+          config: e.value
+        });
+      else if (e.value.style.tooltip.show) {
+        let a = "";
+        const { period: b, open: G, high: X, low: xe, last: be, volume: ke, isBullish: we } = x.value[t], { period: Zt, open: Ue, high: De, low: We, last: Ge, volume: Xe } = e.value.translations;
+        a += `<div><svg style="margin-right:6px" viewBox="0 0 12 12" height="12" width="12"><rect x="0" y="0" height="12" width="12" rx="${e.value.style.layout.candle.borderRadius * 3}" stroke="${e.value.style.layout.candle.stroke}" stroke-width="${e.value.style.layout.candle.strokeWidth}" 
+                fill="${e.value.style.layout.candle.gradient.show ? we ? `url(#bullish_gradient_${k.value})` : `url(#bearish_gradient_${k.value})` : we ? e.value.style.layout.candle.colors.bullish : e.value.style.layout.candle.colors.bearish}"/></svg>${b}</div>`, a += `${Xe} : <b>${isNaN(ke) ? "-" : Number(ke.toFixed(e.value.style.tooltip.roundingValue)).toLocaleString()}</b>`, a += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}">`, a += `<div>${Ue}: <b>${e.value.style.tooltip.prefix} ${isNaN(G.value) ? "-" : Number(G.value.toFixed(e.value.style.tooltip.roundingValue)).toLocaleString()} ${e.value.style.tooltip.suffix}</b></div>`, a += `<div>${De}: <b>${e.value.style.tooltip.prefix} ${isNaN(X.value) ? "-" : Number(X.value.toFixed(e.value.style.tooltip.roundingValue)).toLocaleString()} ${e.value.style.tooltip.suffix}</b></div>`, a += `<div>${We}: <b>${e.value.style.tooltip.prefix} ${isNaN(xe.value) ? "-" : Number(xe.value.toFixed(e.value.style.tooltip.roundingValue)).toLocaleString()} ${e.value.style.tooltip.suffix}</b></div>`, a += `<div>${Ge}: <b>${e.value.style.tooltip.prefix} ${isNaN(be.value) ? "-" : Number(be.value.toFixed(e.value.style.tooltip.roundingValue)).toLocaleString()} ${e.value.style.tooltip.suffix}</b></div>`, a += "</div>", Y.value = `<div style="text-align:right">${a}</div>`;
+      }
+      H.value = !0;
+    }
+    function Be() {
+      fe();
+    }
+    const N = n(null);
+    async function fe() {
+      (e.value.style.zoom.startIndex !== null || e.value.style.zoom.endIndex !== null) && N.value ? (e.value.style.zoom.startIndex !== null && (await V(), await V(), N.value && N.value.setStartValue(e.value.style.zoom.startIndex)), e.value.style.zoom.endIndex !== null && (await V(), await V(), N.value && N.value.setEndValue(Ee(e.value.style.zoom.endIndex + 1)))) : (h.value = {
+        start: 0,
+        end: P.value
+      }, E.value += 1);
+    }
+    function Ee(t) {
+      const o = P.value;
+      return t > o ? o : t < 0 || e.value.style.zoom.startIndex !== null && t < e.value.style.zoom.startIndex ? e.value.style.zoom.startIndex !== null ? e.value.style.zoom.startIndex + 1 : 1 : t;
+    }
+    function pe() {
+      V(() => {
+        const t = [e.value.translations.period, e.value.translations.open, e.value.translations.high, e.value.translations.low, e.value.translations.last, e.value.translations.volume], o = x.value.map((b) => [
+          b.period,
+          b.open.value,
+          b.high.value,
+          b.low.value,
+          b.last.value,
+          b.volume
+        ]), l = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([t]).concat(o), a = ut(l);
+        it({ csvContent: a, title: e.value.style.title.text || "vue-ui-candlestick" });
+      });
+    }
+    const D = f(() => {
+      const t = x.value.map((a) => [
+        `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12" height="12" width="12" style="margin-right: 6px"><rect x="0" y="0" height="12" width="12" :rx="${e.value.style.layout.candle.borderRadius * 3}" fill="${e.value.style.layout.candle.gradient.show ? a.isBullish ? `url(#bullish_gradient_${k.value}` : `url(#bearish_gradient_${k.value})` : a.isBullish ? e.value.style.layout.candle.colors.bullish : e.value.style.layout.candle.colors.bearish}"/></svg> ${a.period}`,
+        `${e.value.table.td.prefix} ${isNaN(a.open.value) ? "-" : Number(a.open.value.toFixed(e.value.table.td.roundingValue)).toLocaleString()} ${e.value.table.td.suffix}`,
+        `${e.value.table.td.prefix} ${isNaN(a.high.value) ? "-" : Number(a.high.value.toFixed(e.value.table.td.roundingValue)).toLocaleString()} ${e.value.table.td.suffix}`,
+        `${e.value.table.td.prefix} ${isNaN(a.low.value) ? "-" : Number(a.low.value.toFixed(e.value.table.td.roundingValue)).toLocaleString()} ${e.value.table.td.suffix}`,
+        `${e.value.table.td.prefix} ${isNaN(a.last.value) ? "-" : Number(a.last.value.toFixed(e.value.table.td.roundingValue)).toLocaleString()} ${e.value.table.td.suffix}`,
+        `${isNaN(a.volume) ? "-" : a.volume.toLocaleString()}`
+      ]), o = {
+        th: {
+          backgroundColor: e.value.table.th.backgroundColor,
+          color: e.value.table.th.color,
+          outline: e.value.table.th.outline
+        },
+        td: {
+          backgroundColor: e.value.table.td.backgroundColor,
+          color: e.value.table.td.color,
+          outline: e.value.table.td.outline
+        },
+        breakpoint: e.value.table.responsiveBreakpoint
+      }, l = [
+        e.value.translations.period,
+        e.value.translations.open,
+        e.value.translations.high,
+        e.value.translations.low,
+        e.value.translations.last,
+        e.value.translations.volume
+      ];
+      return { head: l, body: t, config: o, colNames: l };
+    }), A = n(!1);
+    function Me(t) {
+      A.value = t, Z.value += 1;
+    }
+    function ge() {
+      w.value.showTable = !w.value.showTable;
+    }
+    function me() {
+      w.value.showTooltip = !w.value.showTooltip;
+    }
+    const W = n(!1);
+    function Q() {
+      W.value = !W.value;
+    }
+    return Te({
+      generatePdf: ve,
+      generateCsv: pe,
+      generateImage: ye,
+      toggleTable: ge,
+      toggleTooltip: me,
+      toggleAnnotator: Q
+    }), (t, o) => (s(), u("div", {
+      ref_key: "candlestickChart",
+      ref: S,
+      class: Ce(`vue-ui-candlestick ${A.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      style: _e(`position:relative;font-family:${e.value.style.fontFamily}; text-align:center;background:${e.value.style.backgroundColor}; ${e.value.responsive ? "height: 100%" : ""}`),
+      id: `vue-ui-candlestick_${k.value}`
+    }, [
+      e.value.userOptions.buttons.annotator ? (s(), _(xt, {
+        key: 0,
+        parent: S.value,
+        backgroundColor: e.value.style.backgroundColor,
+        color: e.value.style.color,
+        active: W.value,
+        onClose: Q
+      }, null, 8, ["parent", "backgroundColor", "color", "active"])) : v("", !0),
+      Le.value ? (s(), u("div", {
+        key: 1,
+        ref_key: "noTitle",
+        ref: ae,
+        class: "vue-data-ui-no-title-space",
+        style: "height:36px; width: 100%;background:transparent"
+      }, null, 512)) : v("", !0),
+      e.value.style.title.text ? (s(), u("div", {
+        key: 2,
+        ref_key: "chartTitle",
+        ref: ee,
+        style: "width:100%;background:transparent"
+      }, [
+        (s(), _(dt, {
+          key: `title_${ue.value}`,
+          config: {
+            title: {
+              cy: "candlestick-div-title",
+              ...e.value.style.title
+            },
+            subtitle: {
+              cy: "candlestick-div-subtitle",
+              ...e.value.style.title.subtitle
+            }
+          }
+        }, null, 8, ["config"]))
+      ], 512)) : v("", !0),
+      e.value.userOptions.show && R.value ? (s(), _(yt, {
+        ref_key: "details",
+        ref: Fe,
+        key: `user_options_${Z.value}`,
+        backgroundColor: e.value.style.backgroundColor,
+        color: e.value.style.color,
+        isImaging: g(de),
+        isPrinting: g(re),
+        uid: k.value,
+        hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.tooltip.show,
+        hasPdf: e.value.userOptions.buttons.pdf,
+        hasImg: e.value.userOptions.buttons.img,
+        hasXls: e.value.userOptions.buttons.csv,
+        hasTable: e.value.userOptions.buttons.table,
+        hasFullscreen: e.value.userOptions.buttons.fullscreen,
+        isFullscreen: A.value,
+        isTooltip: w.value.showTooltip,
+        titles: { ...e.value.userOptions.buttonTitles },
+        chartElement: S.value,
+        position: e.value.userOptions.position,
+        hasAnnotator: e.value.userOptions.buttons.annotator,
+        isAnnotation: W.value,
+        onToggleFullscreen: Me,
+        onGeneratePdf: g(ve),
+        onGenerateCsv: pe,
+        onGenerateImage: g(ye),
+        onToggleTable: ge,
+        onToggleTooltip: me,
+        onToggleAnnotator: Q
+      }, Ye({ _: 2 }, [
+        t.$slots.optionTooltip ? {
+          name: "optionTooltip",
+          fn: m(() => [
+            p(t.$slots, "optionTooltip", {}, void 0, !0)
+          ]),
+          key: "0"
+        } : void 0,
+        t.$slots.optionPdf ? {
+          name: "optionPdf",
+          fn: m(() => [
+            p(t.$slots, "optionPdf", {}, void 0, !0)
+          ]),
+          key: "1"
+        } : void 0,
+        t.$slots.optionCsv ? {
+          name: "optionCsv",
+          fn: m(() => [
+            p(t.$slots, "optionCsv", {}, void 0, !0)
+          ]),
+          key: "2"
+        } : void 0,
+        t.$slots.optionImg ? {
+          name: "optionImg",
+          fn: m(() => [
+            p(t.$slots, "optionImg", {}, void 0, !0)
+          ]),
+          key: "3"
+        } : void 0,
+        t.$slots.optionTable ? {
+          name: "optionTable",
+          fn: m(() => [
+            p(t.$slots, "optionTable", {}, void 0, !0)
+          ]),
+          key: "4"
+        } : void 0,
+        t.$slots.optionFullscreen ? {
+          name: "optionFullscreen",
+          fn: m(({ toggleFullscreen: l, isFullscreen: a }) => [
+            p(t.$slots, "optionFullscreen", T(I({ toggleFullscreen: l, isFullscreen: a })), void 0, !0)
+          ]),
+          key: "5"
+        } : void 0,
+        t.$slots.optionAnnotator ? {
+          name: "optionAnnotator",
+          fn: m(({ toggleAnnotator: l, isAnnotator: a }) => [
+            p(t.$slots, "optionAnnotator", T(I({ toggleAnnotator: l, isAnnotator: a })), void 0, !0)
+          ]),
+          key: "6"
+        } : void 0
+      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage"])) : v("", !0),
+      R.value ? (s(), u("svg", {
+        key: 4,
+        xmlns: g(tt),
+        class: Ce({ "vue-data-ui-fullscreen--on": A.value, "vue-data-ui-fulscreen--off": !A.value }),
+        viewBox: `0 0 ${y.value.width <= 0 ? 10 : y.value.width} ${y.value.height <= 0 ? 10 : y.value.height}`,
+        style: _e(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.color}`)
+      }, [
+        ze(mt),
+        x.value.length > 0 ? (s(), u("g", $t, [
+          r("defs", null, [
+            r("linearGradient", {
+              id: `bearish_gradient_${k.value}`,
+              x2: "0%",
+              y2: "100%"
+            }, [
+              r("stop", {
+                offset: "0%",
+                "stop-color": e.value.style.layout.candle.colors.bearish
+              }, null, 8, _t),
+              r("stop", {
+                offset: "50%",
+                "stop-color": `${g(j)(e.value.style.layout.candle.colors.bearish, 0.02)}DE`
+              }, null, 8, zt),
+              r("stop", {
+                offset: "100%",
+                "stop-color": `${g(j)(e.value.style.layout.candle.colors.bearish, 0.05)}66`
+              }, null, 8, St)
+            ], 8, Ct),
+            r("linearGradient", {
+              id: `bullish_gradient_${k.value}`,
+              x2: "0%",
+              y2: "100%"
+            }, [
+              r("stop", {
+                offset: "0%",
+                "stop-color": e.value.style.layout.candle.colors.bullish
+              }, null, 8, At),
+              r("stop", {
+                offset: "50%",
+                "stop-color": `${g(j)(e.value.style.layout.candle.colors.bullish, 0.02)}DE`
+              }, null, 8, Tt),
+              r("stop", {
+                offset: "100%",
+                "stop-color": `${g(j)(e.value.style.layout.candle.colors.bullish, 0.05)}66`
+              }, null, 8, It)
+            ], 8, Nt)
+          ]),
+          e.value.style.layout.grid.show ? (s(), u("g", Ft, [
+            r("line", {
+              x1: i.value.left,
+              x2: i.value.left,
+              y1: i.value.top,
+              y2: i.value.bottom,
+              stroke: e.value.style.layout.grid.stroke,
+              "stroke-width": e.value.style.layout.grid.strokeWidth,
+              "stroke-linecap": "round"
+            }, null, 8, Lt),
+            r("line", {
+              x1: i.value.left,
+              x2: i.value.right,
+              y1: i.value.bottom,
+              y2: i.value.bottom,
+              stroke: e.value.style.layout.grid.stroke,
+              "stroke-width": e.value.style.layout.grid.strokeWidth,
+              "stroke-linecap": "round"
+            }, null, 8, Rt)
+          ])) : v("", !0),
+          e.value.style.layout.grid.yAxis.dataLabels.show ? (s(), u("g", Pt, [
+            (s(!0), u(F, null, L(Pe.value, (l, a) => (s(), u("g", null, [
+              l.value >= C.value.min && l.value <= C.value.max ? (s(), u("line", {
+                key: 0,
+                x1: i.value.left,
+                x2: i.value.left - 5,
+                y1: l.y,
+                y2: l.y,
+                stroke: e.value.style.layout.grid.stroke,
+                "stroke-width": e.value.style.layout.grid.strokeWidth,
+                "stroke-linecap": "round"
+              }, null, 8, Vt)) : v("", !0),
+              l.value >= C.value.min && l.value <= C.value.max ? (s(), u("text", {
+                key: 1,
+                x: i.value.left - 8 + e.value.style.layout.grid.yAxis.dataLabels.offsetX,
+                y: l.y + y.value.yAxisFontSize / 3,
+                "font-size": y.value.yAxisFontSize,
+                "text-anchor": "end",
+                fill: e.value.style.layout.grid.yAxis.dataLabels.color,
+                "font-weight": e.value.style.layout.grid.yAxis.dataLabels.bold ? "bold" : "normal"
+              }, O(e.value.style.layout.grid.yAxis.dataLabels.prefix) + " " + O(g(lt)(l.value) ? l.value.toFixed(e.value.style.layout.grid.yAxis.dataLabels.roundingValue) : "") + " " + O(e.value.style.layout.grid.yAxis.dataLabels.suffix), 9, Ot)) : v("", !0)
+            ]))), 256))
+          ])) : v("", !0),
+          e.value.style.layout.grid.xAxis.dataLabels.show ? (s(), u("g", Bt, [
+            (s(!0), u(F, null, L(Ve.value, (l, a) => (s(), u("g", null, [
+              r("text", {
+                transform: `translate(${i.value.left + d.value * a + d.value / 2}, ${i.value.bottom + y.value.xAxisFontSize * 2 + e.value.style.layout.grid.xAxis.dataLabels.offsetY}), rotate(${e.value.style.layout.grid.xAxis.dataLabels.rotation})`,
+                "text-anchor": e.value.style.layout.grid.xAxis.dataLabels.rotation > 0 ? "start" : e.value.style.layout.grid.xAxis.dataLabels.rotation < 0 ? "end" : "middle",
+                "font-size": y.value.xAxisFontSize,
+                fill: e.value.style.layout.grid.xAxis.dataLabels.color,
+                "font-weight": e.value.style.layout.grid.xAxis.dataLabels.bold ? "bold" : "normal"
+              }, O(l), 9, Et)
+            ]))), 256))
+          ])) : v("", !0),
+          r("g", null, [
+            (s(!0), u(F, null, L(x.value, (l, a) => (s(), u("g", null, [
+              r("line", {
+                x1: l.open.x,
+                x2: l.open.x,
+                y1: l.high.y,
+                y2: l.low.y,
+                stroke: e.value.style.layout.wick.stroke,
+                "stroke-width": e.value.style.layout.wick.strokeWidth,
+                "stroke-linecap": "round"
+              }, null, 8, Mt),
+              e.value.style.layout.wick.extremity.shape === "circle" ? (s(), u("g", Ut, [
+                r("circle", {
+                  cx: l.high.x,
+                  cy: l.high.y,
+                  r: e.value.style.layout.wick.extremity.size === "auto" ? d.value / 20 : e.value.style.layout.wick.extremity.size,
+                  fill: e.value.style.layout.wick.extremity.color
+                }, null, 8, Dt),
+                r("circle", {
+                  cx: l.low.x,
+                  cy: l.low.y,
+                  r: e.value.style.layout.wick.extremity.size === "auto" ? d.value / 20 : e.value.style.layout.wick.extremity.size,
+                  fill: e.value.style.layout.wick.extremity.color
+                }, null, 8, Wt)
+              ])) : v("", !0),
+              e.value.style.layout.wick.extremity.shape === "line" ? (s(), u("g", Gt, [
+                r("line", {
+                  x1: l.high.x - (e.value.style.layout.wick.extremity.size === "auto" ? d.value * e.value.style.layout.candle.widthRatio : e.value.style.layout.wick.extremity.size) / 2,
+                  x2: l.high.x + (e.value.style.layout.wick.extremity.size === "auto" ? d.value * e.value.style.layout.candle.widthRatio : e.value.style.layout.wick.extremity.size) / 2,
+                  y1: l.high.y,
+                  y2: l.high.y,
+                  stroke: e.value.style.layout.wick.extremity.color,
+                  "stroke-width": e.value.style.layout.wick.strokeWidth,
+                  "stroke-linecap": "round"
+                }, null, 8, Xt),
+                r("line", {
+                  x1: l.low.x - (e.value.style.layout.wick.extremity.size === "auto" ? d.value * e.value.style.layout.candle.widthRatio : e.value.style.layout.wick.extremity.size) / 2,
+                  x2: l.low.x + (e.value.style.layout.wick.extremity.size === "auto" ? d.value * e.value.style.layout.candle.widthRatio : e.value.style.layout.wick.extremity.size) / 2,
+                  y1: l.low.y,
+                  y2: l.low.y,
+                  stroke: e.value.style.layout.wick.extremity.color,
+                  "stroke-width": e.value.style.layout.wick.strokeWidth,
+                  "stroke-linecap": "round"
+                }, null, 8, jt)
+              ])) : v("", !0)
+            ]))), 256))
+          ]),
+          r("g", null, [
+            (s(!0), u(F, null, L(x.value, (l, a) => (s(), u("rect", {
+              x: l.open.x - d.value / 2 + d.value * (1 - e.value.style.layout.candle.widthRatio) / 2,
+              y: l.isBullish ? l.last.y : l.open.y,
+              height: Math.abs(l.last.y - l.open.y) <= 0 ? 1e-4 : Math.abs(l.last.y - l.open.y),
+              width: d.value * e.value.style.layout.candle.widthRatio <= 0 ? 1e-4 : d.value * e.value.style.layout.candle.widthRatio,
+              fill: e.value.style.layout.candle.gradient.underlayer,
+              rx: e.value.style.layout.candle.borderRadius,
+              stroke: "none"
+            }, null, 8, Ht))), 256)),
+            (s(!0), u(F, null, L(x.value, (l, a) => (s(), u("rect", {
+              x: l.open.x - d.value / 2 + d.value * (1 - e.value.style.layout.candle.widthRatio) / 2,
+              y: l.isBullish ? l.last.y : l.open.y,
+              height: Math.abs(l.last.y - l.open.y) <= 0 ? 1e-4 : Math.abs(l.last.y - l.open.y),
+              width: d.value * e.value.style.layout.candle.widthRatio <= 0 ? 1e-4 : d.value * e.value.style.layout.candle.widthRatio,
+              fill: l.isBullish ? e.value.style.layout.candle.gradient.show ? `url(#bullish_gradient_${k.value})` : e.value.style.layout.candle.colors.bullish : e.value.style.layout.candle.gradient.show ? `url(#bearish_gradient_${k.value})` : e.value.style.layout.candle.colors.bearish,
+              rx: e.value.style.layout.candle.borderRadius,
+              stroke: e.value.style.layout.candle.stroke,
+              "stroke-width": e.value.style.layout.candle.strokeWidth,
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round"
+            }, null, 8, Yt))), 256))
+          ]),
+          r("g", null, [
+            (s(!0), u(F, null, L(x.value, (l, a) => (s(), u("rect", {
+              x: i.value.left + a * d.value,
+              y: i.value.top,
+              height: i.value.height <= 0 ? 1e-4 : i.value.height,
+              width: d.value <= 0 ? 1e-4 : d.value,
+              fill: q.value === a ? g(ot)(e.value.style.layout.selector.color, e.value.style.layout.selector.opacity) : "transparent",
+              onMouseover: (b) => Oe(a, l),
+              onMouseleave: o[0] || (o[0] = (b) => {
+                q.value = void 0, H.value = !1;
+              })
+            }, null, 40, qt))), 256))
+          ])
+        ])) : v("", !0),
+        p(t.$slots, "svg", { svg: y.value }, void 0, !0)
+      ], 14, wt)) : v("", !0),
+      t.$slots.watermark ? (s(), u("div", Jt, [
+        p(t.$slots, "watermark", T(I({ isPrinting: g(re) || g(de) })), void 0, !0)
+      ])) : v("", !0),
+      R.value ? v("", !0) : (s(), _(ft, {
+        key: 6,
+        config: {
+          type: "candlesticks",
+          style: {
+            backgroundColor: e.value.style.backgroundColor,
+            candlesticks: {
+              axis: {
+                color: "#CCCCCC"
+              },
+              candle: {
+                color: "#CCCCCC"
+              }
+            }
+          }
+        }
+      }, null, 8, ["config"])),
+      e.value.style.zoom.show && R.value ? (s(), u("div", {
+        key: 7,
+        ref_key: "chartSlicer",
+        ref: le
+      }, [
+        (s(), _(pt, {
+          ref_key: "slicerComponent",
+          ref: N,
+          key: `slicer_${E.value}`,
+          background: e.value.style.zoom.color,
+          borderColor: e.value.style.backgroundColor,
+          fontSize: e.value.style.zoom.fontSize,
+          useResetSlot: e.value.style.zoom.useResetSlot,
+          labelLeft: $.dataset[h.value.start] ? $.dataset[h.value.start][0] : $.dataset[0][0],
+          labelRight: $.dataset[h.value.end - 1] ? $.dataset[h.value.end - 1][0] : $.dataset.at(-1)[0],
+          textColor: e.value.style.color,
+          inputColor: e.value.style.zoom.color,
+          selectColor: e.value.style.zoom.highlightColor,
+          max: P.value,
+          min: 0,
+          valueStart: h.value.start,
+          valueEnd: h.value.end,
+          start: h.value.start,
+          "onUpdate:start": o[1] || (o[1] = (l) => h.value.start = l),
+          end: h.value.end,
+          "onUpdate:end": o[2] || (o[2] = (l) => h.value.end = l),
+          refreshStartPoint: e.value.style.zoom.startIndex !== null ? e.value.style.zoom.startIndex : 0,
+          refreshEndPoint: e.value.style.zoom.endIndex !== null ? e.value.style.zoom.endIndex + 1 : P.value,
+          onReset: Be
+        }, {
+          "reset-action": m(({ reset: l }) => [
+            p(t.$slots, "reset-action", T(I({ reset: l })), void 0, !0)
+          ]),
+          _: 3
+        }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "start", "end", "refreshStartPoint", "refreshEndPoint"]))
+      ], 512)) : v("", !0),
+      r("div", {
+        ref_key: "chartLegend",
+        ref: te
+      }, [
+        p(t.$slots, "legend", { legend: x.value }, void 0, !0)
+      ], 512),
+      t.$slots.source ? (s(), u("div", {
+        key: 8,
+        ref_key: "source",
+        ref: oe,
+        dir: "auto"
+      }, [
+        p(t.$slots, "source", {}, void 0, !0)
+      ], 512)) : v("", !0),
+      ze(ct, {
+        show: w.value.showTooltip && H.value,
+        backgroundColor: e.value.style.tooltip.backgroundColor,
+        color: e.value.style.tooltip.color,
+        borderRadius: e.value.style.tooltip.borderRadius,
+        borderColor: e.value.style.tooltip.borderColor,
+        borderWidth: e.value.style.tooltip.borderWidth,
+        fontSize: e.value.style.tooltip.fontSize,
+        backgroundOpacity: e.value.style.tooltip.backgroundOpacity,
+        position: e.value.style.tooltip.position,
+        offsetY: e.value.style.tooltip.offsetY,
+        parent: S.value,
+        content: Y.value,
+        isFullscreen: A.value,
+        isCustom: e.value.style.tooltip.customFormat && typeof e.value.style.tooltip.customFormat == "function"
+      }, {
+        "tooltip-before": m(() => [
+          p(t.$slots, "tooltip-before", T(I({ ...K.value })), void 0, !0)
+        ]),
+        "tooltip-after": m(() => [
+          p(t.$slots, "tooltip-after", T(I({ ...K.value })), void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom"]),
+      R.value ? (s(), _(gt, {
+        key: 9,
+        hideDetails: "",
+        config: {
+          open: w.value.showTable,
+          maxHeight: 1e4,
+          body: {
+            backgroundColor: e.value.style.backgroundColor,
+            color: e.value.style.color
+          },
+          head: {
+            backgroundColor: e.value.style.backgroundColor,
+            color: e.value.style.color
+          }
+        }
+      }, {
+        content: m(() => [
+          (s(), _(ht, {
+            key: `table_${se.value}`,
+            colNames: D.value.colNames,
+            head: D.value.head,
+            body: D.value.body,
+            config: D.value.config,
+            title: `${e.value.style.title.text}${e.value.style.title.subtitle.text ? ` : ${e.value.style.title.subtitle.text}` : ""}`,
+            onClose: o[3] || (o[3] = (l) => w.value.showTable = !1)
+          }, {
+            th: m(({ th: l }) => [
+              qe(O(l), 1)
+            ]),
+            td: m(({ td: l }) => [
+              r("div", { innerHTML: l }, null, 8, Kt)
+            ]),
+            _: 1
+          }, 8, ["colNames", "head", "body", "config", "title"]))
+        ]),
+        _: 1
+      }, 8, ["config"])) : v("", !0)
+    ], 14, kt));
+  }
+}, hl = /* @__PURE__ */ bt(Qt, [["__scopeId", "data-v-c83d8995"]]);
+export {
+  hl as default
+};