import { computed as d, ref as n, watch as he, onMounted as Ne, onBeforeUnmount as Re, openBlock as s, createElementBlock as u, normalizeClass as z, normalizeStyle as W, createBlock as C, createCommentVNode as b, unref as v, createSlots as Ae, withCtx as h, renderSlot as g, normalizeProps as Y, guardReactiveProps as B, createVNode as fe, Fragment as M, renderList as F, createElementVNode as _, toDisplayString as T, createTextVNode as De, nextTick as Le } from "vue";
import { u as ze, c as Ye, t as Be, a as Ve, p as ge, b as Xe, o as Ge, e as j, d as Ue, X as Ee, f as N, i as q, x as pe, q as He, r as We, y as je } from "./index-DK7qqHGP.js";
import { t as qe, u as Je } from "./useResponsive-NZB-WLRF.js";
import { _ as Ke } from "./Title-Cxlu3Etv.js";
import { u as Qe, U as Ze } from "./usePrinter-Cza87yNE.js";
import { L as et } from "./Legend-D4PxDNTf.js";
import { D as tt } from "./DataTable-B9SSwFM2.js";
import { _ as at } from "./Tooltip-Bt9pHzBM.js";
import lt from "./vue-ui-skeleton-CQnYuosp.js";
import ot from "./vue-ui-accordion-5C4CP3gA.js";
import { u as ye } from "./useNestedProp-0nRX_rTi.js";
import { _ as rt } from "./PackageVersion-I1_4jcn_.js";
import { _ as st } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const nt = ["id"], ut = ["xmlns", "viewBox"], it = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], ct = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], dt = ["id"], vt = ["stdDeviation"], ht = ["filter"], ft = ["cx", "cy", "r", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], gt = ["cx", "cy", "r", "stroke-width", "stroke-dasharray", "stroke-dashoffset", "onMouseenter"], pt = { key: 1 }, yt = ["onMouseenter"], mt = ["x", "y", "font-size", "fill", "font-weight"], bt = {
  key: 3,
  class: "vue-data-ui-watermark"
}, kt = ["onClick"], $t = ["innerHTML"], wt = {
  __name: "vue-ui-onion",
  props: {
    config: {
      type: Object,
      default() {
        return {};
      }
    },
    dataset: {
      type: Array,
      default() {
        return [];
      }
    }
  },
  emits: ["selectLegend"],
  setup(me, { expose: be, emit: ke }) {
    const k = me, { vue_ui_onion: $e } = ze(), R = d(() => !!k.dataset && k.dataset.length), x = n(Ye()), we = n(null), J = n(0), A = n(!1), V = n(""), p = n([]), P = n(null), K = n(null), Q = n(null), Z = n(0), ee = n(0), te = n(0), e = d({
      get: () => ae(),
      set: (a) => a
    });
    function ae() {
      const a = ye({
        userConfig: k.config,
        defaultConfig: $e
      });
      return a.theme ? {
        ...ye({
          userConfig: Be.vue_ui_onion[a.theme] || k.config,
          defaultConfig: a
        }),
        customPalette: Ve[a.theme] || ge
      } : a;
    }
    he(() => k.config, (a) => {
      e.value = ae(), ne(), Z.value += 1, ee.value += 1, te.value += 1;
    }, { deep: !0 });
    const { isPrinting: le, isImaging: oe, generatePdf: re, generateImage: se } = Qe({
      elementId: `vue-ui-onion_${x.value}`,
      fileName: e.value.style.chart.title.text || "vue-ui-onion"
    }), xe = d(() => Xe(e.value.customPalette)), $ = n({
      showTable: e.value.table.show,
      showTooltip: e.value.style.chart.tooltip.show
    }), r = n({
      height: 512,
      width: 512,
      padding: {
        top: 64,
        left: 64,
        right: 64,
        bottom: 64
      },
      minRadius: 64
    }), D = n(null);
    Ne(() => {
      ne();
    });
    function ne() {
      if (Ge(k.dataset) && j({
        componentName: "VueUiOnion",
        type: "dataset"
      }), e.value.responsive) {
        const o = qe(() => {
          const { width: t, height: l } = Je({
            chart: P.value,
            title: e.value.style.chart.title.text ? K.value : null,
            legend: e.value.style.chart.legend.show ? Q.value : null
          });
          r.value.width = t, r.value.height = l, r.value.padding.top = Math.max(t, l) * 0.125, r.value.padding.right = Math.max(t, l) * 0.125, r.value.padding.bottom = Math.max(t, l) * 0.125, r.value.padding.left = Math.max(t, l) * 0.125, r.value.minRadius = Math.min(t, l) * 0.125;
        });
        D.value = new ResizeObserver(o), D.value.observe(P.value.parentNode);
      }
    }
    Re(() => {
      D.value && D.value.disconnect();
    });
    const i = d(() => ({
      top: r.value.padding.top,
      left: r.value.padding.left,
      right: r.value.width - r.value.padding.right,
      bottom: r.value.height - r.value.padding.bottom,
      centerX: r.value.width / 2,
      centerY: r.value.height / 2,
      width: r.value.width - r.value.padding.right - r.value.padding.left,
      height: r.value.height - r.value.padding.bottom - r.value.padding.top,
      minRadius: r.value.minRadius,
      maxRadius: Math.min(r.value.width, r.value.height) - r.value.padding.top * 2
    })), c = d(() => (k.dataset.forEach((a, o) => {
      [null, void 0].includes(a.name) && j({
        componentName: "VueUiOnion",
        type: "datasetSerieAttribute",
        property: "name",
        index: o
      }), [void 0].includes(a.percentage) && j({
        componentName: "VueUiOnion",
        type: "datasetSerieAttribute",
        property: "percentage",
        index: o
      });
    }), k.dataset.map((a, o) => {
      const t = `onion_serie_${o}_${x.value}`;
      return {
        ...a,
        percentage: a.percentage || 0,
        targetPercentage: a.percentage || 0,
        color: Ue(a.color) || xe.value[o] || ge[o],
        id: t,
        shape: "circle",
        opacity: p.value.includes(t) ? 0.5 : 1,
        absoluteIndex: o,
        segregate: () => ue(t),
        isSegregated: p.value.includes(t)
      };
    }))), O = n(c.value), Ce = d(() => e.value.useStartAnimation), _e = n(null), Te = d(() => Math.max(...c.value.map((a) => a.percentage))), X = n(!1);
    he(() => c.value, Pe, { immediate: !0 });
    function Pe() {
      if (Ce.value && !X.value) {
        let o = function() {
          a >= Te.value ? (cancelAnimationFrame(_e.value), O.value = c.value, X.value = !0) : (O.value = c.value.map((t) => ({
            ...t,
            percentage: a < t.targetPercentage ? a : t.targetPercentage
          })), a += 1, requestAnimationFrame(o), X.value = !0);
        };
        O.value = c.value.map((t) => ({
          ...t,
          percentage: 0
        }));
        let a = 0;
        o();
      } else
        O.value = c.value;
    }
    const Oe = d(() => ({
      cy: "onion-div-legend",
      backgroundColor: e.value.style.chart.legend.backgroundColor,
      color: e.value.style.chart.legend.color,
      fontSize: e.value.style.chart.legend.fontSize,
      paddingBottom: 12,
      fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
    })), Ie = d(() => c.value.filter((a) => !p.value.includes(a.id)).length), w = d(() => {
      const a = Math.min(i.value.width, i.value.height) / 2 / c.value.length;
      return {
        gutter: (a > e.value.style.chart.layout.maxThickness ? e.value.style.chart.layout.maxThickness : a) * e.value.style.chart.layout.gutter.width,
        track: (a > e.value.style.chart.layout.maxThickness ? e.value.style.chart.layout.maxThickness : a) * e.value.style.chart.layout.track.width
      };
    }), y = d(() => O.value.filter((a) => !p.value.includes(a.id)).map((a, o) => {
      const t = (i.value.maxRadius - w.value.track) / Ie.value / 2 * (1 + o), l = i.value.centerY - t;
      return {
        percentage: a.percentage || 0,
        ...a,
        labelY: l,
        radius: t,
        path: Se(t, a.percentage || 0)
      };
    }));
    function Se(a, o) {
      const t = 2 * Math.PI * a, l = t * 0.75, f = `${l} ${t}`, S = l * (1 - o / 100);
      return {
        bgDashArray: `${l} ${t}`,
        bgDashOffset: 0,
        dashArray: f,
        dashOffset: S,
        fullOffset: 0,
        active: `
            M ${i.value.centerX},${i.value.centerY - a} 
            A ${a},${a} 0 1 1 
            ${i.value.centerX + a * Math.cos(Math.PI * 3 / 4)},${i.value.centerY + a * Math.sin(Math.PI * 3 / 4)}
        `.trim()
      };
    }
    function ue(a) {
      p.value.includes(a) ? p.value = p.value.filter((o) => o !== a) : p.value.push(a), ke("selectLegend", y.value);
    }
    function Me() {
      return y.value;
    }
    const G = d(() => {
      const a = [e.value.table.translations.serie, e.value.table.translations.percentage, e.value.table.translations.value], o = y.value.map((t) => [
        t.name,
        t.percentage,
        t.value
      ]);
      return { head: a, body: o };
    }), L = d(() => {
      const a = G.value.head, o = y.value.map((l) => [
        `<span style="color:${l.color}">⬤</span> ${l.name}`,
        `${Number(l.percentage ?? 0).toFixed(e.value.table.td.roundingPercentage).toLocaleString()}%`,
        `${l.prefix || ""}${[null, void 0, NaN, "NaN"].includes(l.value) ? "-" : l.value.toFixed(e.value.table.td.roundingValue).toLocaleString()}${l.suffix || ""}`
      ]), t = {
        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
      };
      return { head: a, body: o, config: t, colNames: a };
    });
    function ie() {
      Le(() => {
        const a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], o = G.value.head, t = G.value.body, l = a.concat([o]).concat(t), f = He(l);
        We({ csvContent: f, title: e.value.style.chart.title.text || "vue-ui-onion" });
      });
    }
    const m = n(void 0), I = n(!1);
    function Fe(a) {
      I.value = a, J.value += 1;
    }
    const U = n(null);
    function ce({ datapoint: a, seriesIndex: o, show: t = !0 }) {
      const l = a.absoluteIndex;
      m.value = o, U.value = {
        datapoint: a,
        seriesIndex: l,
        series: c.value,
        config: e.value
      }, A.value = t;
      let f = "";
      const S = e.value.style.chart.tooltip.customFormat;
      if (pe(S) && je(() => S({
        seriesIndex: l,
        datapoint: a,
        series: c.value,
        config: e.value
      })))
        V.value = S({
          seriesIndex: l,
          datapoint: a,
          series: c.value,
          config: e.value
        });
      else {
        const E = e.value.style.chart.tooltip.showPercentage, H = e.value.style.chart.tooltip.showValue;
        f += `<div style="width: 100%; border-bottom: 1px solid ${e.value.style.chart.tooltip.borderColor}; padding-bottom: 6px;margin-bottom:3px;display:flex;flex-direction:row;gap:3px;align-items:center"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${a.color}"/></svg><span></span>${a.name}</span></div>`, f += `<div style="width:100%;text-align:left;"><b>${E ? N({ p: "", v: a.percentage, s: "%", r: e.value.style.chart.tooltip.roundingPercentage }) : ""}</b> ${E && H ? "(" : ""}${H ? q(
          e.value.style.chart.layout.labels.value.formatter,
          a.value,
          N({
            p: a.prefix || "",
            v: a.value,
            s: a.suffix || "",
            r: e.value.style.chart.tooltip.roundingValue
          }),
          { datapoint: a, seriesIndex: o }
        ) : ""}${E && H ? ")" : ""}</div>`, V.value = `<div>${f}</div>`;
      }
    }
    function de() {
      $.value.showTable = !$.value.showTable;
    }
    function ve() {
      $.value.showTooltip = !$.value.showTooltip;
    }
    return be({
      getData: Me,
      generatePdf: re,
      generateCsv: ie,
      generateImage: se,
      toggleTable: de,
      toggleTooltip: ve
    }), (a, o) => (s(), u("div", {
      class: z(`vue-ui-onion ${I.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
      ref_key: "onionChart",
      ref: P,
      id: `vue-ui-onion_${x.value}`,
      style: W(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height: 100%;" : ""} text-align:center;background:${e.value.style.chart.backgroundColor}`)
    }, [
      e.value.style.chart.title.text ? (s(), u("div", {
        key: 0,
        ref_key: "chartTitle",
        ref: K,
        style: "width:100%;background:transparent"
      }, [
        (s(), C(Ke, {
          key: `title_${Z.value}`,
          config: {
            title: {
              cy: "onion-div-title",
              ...e.value.style.chart.title
            },
            subtitle: {
              cy: "onion-div-subtitle",
              ...e.value.style.chart.title.subtitle
            }
          }
        }, null, 8, ["config"]))
      ], 512)) : b("", !0),
      e.value.userOptions.show && R.value ? (s(), C(Ze, {
        ref_key: "details",
        ref: we,
        key: `user_options${J.value}`,
        backgroundColor: e.value.style.chart.backgroundColor,
        color: e.value.style.chart.color,
        isImaging: v(oe),
        isPrinting: v(le),
        uid: x.value,
        hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.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: I.value,
        isTooltip: $.value.showTooltip,
        titles: { ...e.value.userOptions.buttonTitles },
        chartElement: P.value,
        position: e.value.userOptions.position,
        onToggleFullscreen: Fe,
        onGeneratePdf: v(re),
        onGenerateCsv: ie,
        onGenerateImage: v(se),
        onToggleTable: de,
        onToggleTooltip: ve
      }, Ae({ _: 2 }, [
        a.$slots.optionTooltip ? {
          name: "optionTooltip",
          fn: h(() => [
            g(a.$slots, "optionTooltip", {}, void 0, !0)
          ]),
          key: "0"
        } : void 0,
        a.$slots.optionPdf ? {
          name: "optionPdf",
          fn: h(() => [
            g(a.$slots, "optionPdf", {}, void 0, !0)
          ]),
          key: "1"
        } : void 0,
        a.$slots.optionCsv ? {
          name: "optionCsv",
          fn: h(() => [
            g(a.$slots, "optionCsv", {}, void 0, !0)
          ]),
          key: "2"
        } : void 0,
        a.$slots.optionImg ? {
          name: "optionImg",
          fn: h(() => [
            g(a.$slots, "optionImg", {}, void 0, !0)
          ]),
          key: "3"
        } : void 0,
        a.$slots.optionTable ? {
          name: "optionTable",
          fn: h(() => [
            g(a.$slots, "optionTable", {}, void 0, !0)
          ]),
          key: "4"
        } : void 0,
        a.$slots.optionFullscreen ? {
          name: "optionFullscreen",
          fn: h(({ toggleFullscreen: t, isFullscreen: l }) => [
            g(a.$slots, "optionFullscreen", Y(B({ toggleFullscreen: t, isFullscreen: l })), void 0, !0)
          ]),
          key: "5"
        } : void 0
      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "onGeneratePdf", "onGenerateImage"])) : b("", !0),
      R.value ? (s(), u("svg", {
        key: 2,
        xmlns: v(Ee),
        class: z({ "vue-data-ui-fullscreen--on": I.value, "vue-data-ui-fulscreen--off": !I.value }),
        viewBox: `0 0 ${r.value.width <= 0 ? 1e-4 : r.value.width} ${r.value.height <= 0 ? 1e-4 : r.value.height}`,
        style: W(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
      }, [
        fe(rt),
        (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("circle", {
          cx: i.value.centerX,
          cy: i.value.centerY,
          r: t.radius <= 0 ? 1e-4 : t.radius,
          stroke: e.value.style.chart.layout.gutter.color,
          "stroke-width": w.value.gutter,
          fill: "none",
          "stroke-dasharray": t.path.bgDashArray,
          "stroke-dashoffset": t.path.fullOffset,
          "stroke-linecap": "round",
          class: z({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(m.value) && m.value !== l }),
          style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
        }, null, 10, it))), 256)),
        (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("circle", {
          cx: i.value.centerX,
          cy: i.value.centerY,
          r: t.radius < 0 ? 1e-4 : t.radius,
          stroke: `${t.color}`,
          "stroke-width": w.value.track,
          fill: "none",
          "stroke-dasharray": t.path.dashArray,
          "stroke-dashoffset": t.path.dashOffset,
          class: z({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(m.value) && m.value !== l }),
          "stroke-linecap": "round",
          style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
        }, null, 10, ct))), 256)),
        _("defs", null, [
          _("filter", {
            id: `blur_${x.value}`,
            x: "-50%",
            y: "-50%",
            width: "200%",
            height: "200%"
          }, [
            _("feGaussianBlur", {
              in: "SourceGraphic",
              stdDeviation: 100 / e.value.style.chart.gradientIntensity
            }, null, 8, vt)
          ], 8, dt)
        ]),
        e.value.style.chart.useGradient ? (s(), u("g", {
          key: 0,
          filter: `url(#blur_${x.value})`
        }, [
          (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("circle", {
            cx: i.value.centerX,
            cy: i.value.centerY,
            r: t.radius <= 0 ? 1e-4 : t.radius,
            stroke: "white",
            "stroke-width": w.value.track / 3,
            fill: "none",
            "stroke-linecap": "round",
            "stroke-dasharray": t.path.dashArray,
            "stroke-dashoffset": t.path.dashOffset,
            style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
          }, null, 8, ft))), 256))
        ], 8, ht)) : b("", !0),
        (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("circle", {
          "data-cy-trap": "",
          cx: i.value.centerX,
          cy: i.value.centerY,
          r: t.radius <= 0 ? 1e-4 : t.radius,
          stroke: "transparent",
          "stroke-width": Math.max(w.value.track, w.value.gutter),
          fill: "none",
          "stroke-dasharray": t.path.bgDashArray,
          "stroke-dashoffset": t.path.fullOffset,
          "stroke-linecap": "round",
          class: "vue-ui-onion-path",
          style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" },
          onMouseenter: (f) => ce({
            datapoint: t,
            show: !0,
            seriesIndex: l
          }),
          onMouseleave: o[0] || (o[0] = (f) => {
            m.value = void 0, A.value = !1;
          })
        }, null, 40, gt))), 256)),
        e.value.style.chart.layout.labels.show ? (s(), u("g", pt, [
          (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("g", {
            onMouseenter: (f) => ce({
              datapoint: t,
              show: !0,
              seriesIndex: l
            }),
            onMouseleave: o[1] || (o[1] = (f) => {
              m.value = void 0, A.value = !1;
            })
          }, [
            p.value.includes(t.id) ? b("", !0) : (s(), u("text", {
              key: 0,
              x: r.value.width / 2 - w.value.gutter * 0.8 + e.value.style.chart.layout.labels.offsetX,
              y: t.labelY + e.value.style.chart.layout.labels.offsetY,
              "text-anchor": "end",
              "font-size": e.value.style.chart.layout.labels.fontSize,
              fill: e.value.useBlurOnHover && ![null, void 0].includes(m.value) && m.value === l ? t.color : e.value.style.chart.layout.labels.color,
              "font-weight": e.value.style.chart.layout.labels.bold ? "bold" : "normal"
            }, T(t.name ? t.name + ": " : "") + " " + T(e.value.style.chart.layout.labels.percentage.show ? v(N)({
              v: t.percentage,
              s: "%",
              r: e.value.style.chart.layout.labels.roundingPercentage
            }) : "") + " " + T(!e.value.style.chart.layout.labels.percentage.show && e.value.style.chart.layout.labels.value.show ? `: ${v(q)(
              e.value.style.chart.layout.labels.value.formatter,
              t.value,
              v(N)({
                p: t.prefix || "",
                v: t.value || 0,
                s: t.suffix || "",
                r: e.value.style.chart.layout.labels.roundingValue
              }),
              { datapoint: t, seriesIndex: l }
            )}` : `${e.value.style.chart.layout.labels.value.show && t.value ? `(${v(q)(
              e.value.style.chart.layout.labels.value.formatter,
              t.value,
              v(N)({
                p: t.prefix || "",
                v: t.value || 0,
                s: t.suffix || "",
                r: e.value.style.chart.layout.labels.roundingValue
              }),
              { datapoint: t, seriesIndex: l }
            )})` : ""}`), 9, mt))
          ], 40, yt))), 256))
        ])) : b("", !0),
        g(a.$slots, "svg", { svg: r.value }, void 0, !0)
      ], 14, ut)) : b("", !0),
      a.$slots.watermark ? (s(), u("div", bt, [
        g(a.$slots, "watermark", Y(B({ isPrinting: v(le) || v(oe) })), void 0, !0)
      ])) : b("", !0),
      R.value ? b("", !0) : (s(), C(lt, {
        key: 4,
        config: {
          type: "onion",
          style: {
            backgroundColor: e.value.style.chart.backgroundColor,
            onion: {
              color: e.value.style.chart.layout.gutter.color
            }
          }
        }
      }, null, 8, ["config"])),
      _("div", {
        ref_key: "chartLegend",
        ref: Q
      }, [
        e.value.style.chart.legend.show ? (s(), C(et, {
          key: `legend_${te.value}`,
          legendSet: c.value,
          config: Oe.value,
          onClickMarker: o[2] || (o[2] = ({ legend: t }) => ue(t.id))
        }, {
          item: h(({ legend: t }) => [
            _("div", {
              "data-cy-legend-item": "",
              onClick: (l) => t.segregate(),
              style: W(`opacity:${p.value.includes(t.id) ? 0.5 : 1}`)
            }, T(t.name ? t.name + ": " : "") + " " + T((t.percentage || 0).toFixed(e.value.style.chart.legend.roundingPercentage)) + "% ", 13, kt)
          ]),
          _: 1
        }, 8, ["legendSet", "config"])) : g(a.$slots, "legend", {
          key: 1,
          legend: c.value
        }, void 0, !0)
      ], 512),
      fe(at, {
        show: $.value.showTooltip && A.value,
        backgroundColor: e.value.style.chart.tooltip.backgroundColor,
        color: e.value.style.chart.tooltip.color,
        borderRadius: e.value.style.chart.tooltip.borderRadius,
        borderColor: e.value.style.chart.tooltip.borderColor,
        borderWidth: e.value.style.chart.tooltip.borderWidth,
        fontSize: e.value.style.chart.tooltip.fontSize,
        backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
        position: e.value.style.chart.tooltip.position,
        offsetY: e.value.style.chart.tooltip.offsetY,
        parent: P.value,
        content: V.value,
        isCustom: v(pe)(e.value.style.chart.tooltip.customFormat)
      }, {
        "tooltip-before": h(() => [
          g(a.$slots, "tooltip-before", Y(B({ ...U.value })), void 0, !0)
        ]),
        "tooltip-after": h(() => [
          g(a.$slots, "tooltip-after", Y(B({ ...U.value })), void 0, !0)
        ]),
        _: 3
      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom"]),
      R.value ? (s(), C(ot, {
        key: 5,
        hideDetails: "",
        config: {
          open: $.value.showTable,
          maxHeight: 1e4,
          head: {
            backgroundColor: e.value.style.chart.backgroundColor,
            color: e.value.style.chart.color
          },
          body: {
            backgroundColor: e.value.style.chart.backgroundColor,
            color: e.value.style.chart.color
          }
        }
      }, {
        content: h(() => [
          (s(), C(tt, {
            key: `table_${ee.value}`,
            colNames: L.value.colNames,
            head: L.value.head,
            body: L.value.body,
            config: L.value.config,
            title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
            onClose: o[3] || (o[3] = (t) => $.value.showTable = !1)
          }, {
            th: h(({ th: t }) => [
              De(T(t), 1)
            ]),
            td: h(({ td: t }) => [
              _("div", { innerHTML: t }, null, 8, $t)
            ]),
            _: 1
          }, 8, ["colNames", "head", "body", "config", "title"]))
        ]),
        _: 1
      }, 8, ["config"])) : b("", !0)
    ], 14, nt));
  }
}, Dt = /* @__PURE__ */ st(wt, [["__scopeId", "data-v-3e9f72db"]]);
export {
  Dt as default
};
