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