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