import { computed as T, ref as S, watch as Ee, onMounted as He, openBlock as i, createElementBlock as d, normalizeClass as Fe, normalizeStyle as D, unref as e, createBlock as G, createCommentVNode as y, createSlots as Ze, withCtx as N, renderSlot as j, normalizeProps as re, guardReactiveProps as ie, createVNode as qe, createElementVNode as u, Fragment as _, renderList as m, toDisplayString as P, mergeProps as Me, createTextVNode as Xe, nextTick as Re } from "vue";
import { u as Ye, c as Pe, t as Je, a as Ke, p as Y, b as Qe, d as et, o as tt, e as J, g as ae, l as U, m as je, f as z, X as ot, s as g, h as K, i as Q, j as Se, k as A, n as ee, q as lt, r as st } from "./index-WrV3SAID.js";
import { _ as nt } from "./Title-BR-xoRp4.js";
import { u as rt, U as it } from "./usePrinter-kVpf1iV8.js";
import at from "./vue-ui-skeleton-Qec_XSRf.js";
import { D as ut } from "./DataTable-DNPvKWC0.js";
import dt from "./vue-ui-accordion-BQCDXXDs.js";
import { u as Te } from "./useNestedProp-Cj0kHD7k.js";
import { _ as ct } from "./PackageVersion-1NslmM8M.js";
import { P as ht } from "./PenAndPaper-BF1ZRVm3.js";
import { u as ft } from "./useUserOptionState-BIvW1Kz7.js";
import { _ as pt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const vt = ["id"], yt = {
  key: 1,
  style: "width:100%;background:transparent"
}, kt = ["xmlns", "viewBox"], gt = ["width", "height"], $t = ["id"], _t = ["stop-color"], mt = ["stop-color"], bt = ["id"], xt = ["stop-color"], wt = ["stop-color"], Ct = ["id"], Ft = ["stop-color"], Mt = ["stop-color"], Pt = ["id"], jt = ["stop-color"], St = ["stop-color"], Tt = ["stop-color"], zt = { key: 1 }, Dt = ["id"], Nt = ["stop-color"], Ot = ["stop-color"], Bt = ["id"], At = ["stop-color"], Lt = ["stop-color"], It = ["id"], Wt = ["stop-color"], Vt = ["stop-color"], Gt = ["id"], Ut = ["x", "y", "font-size", "font-weight", "fill"], Et = ["x", "y"], Ht = ["d", "stroke"], Zt = ["d", "stroke"], qt = { key: 4 }, Xt = { key: 0 }, Rt = ["stroke-dasharray", "d", "stroke", "stroke-width"], Yt = ["stroke-dasharray", "d", "stroke", "stroke-width"], Jt = ["stroke-dasharray", "d", "stroke", "stroke-width"], Kt = ["stroke-dasharray", "d", "stroke", "stroke-width"], Qt = { key: 1 }, eo = ["d", "stroke", "stroke-width", "fill"], to = ["d", "stroke", "stroke-width", "fill"], oo = ["d", "stroke", "stroke-width", "fill"], lo = { key: 2 }, so = ["d", "fill", "onMouseenter", "onClick"], no = ["d", "fill", "onMouseenter", "onClick"], ro = ["d", "fill", "onMouseenter", "onClick"], io = ["d", "onMouseenter", "onClick"], ao = ["d"], uo = ["d", "stroke"], co = ["onClick"], ho = ["stroke", "d"], fo = ["cx", "cy", "fill", "stroke"], po = ["x", "y", "width", "height"], vo = { key: 1 }, yo = ["d", "stroke"], ko = ["d", "fill", "stroke"], go = ["id"], $o = ["stop-color"], _o = ["stop-color"], mo = ["cx", "cy", "fill"], bo = ["cx", "cy", "fill"], xo = { key: 0 }, wo = ["text-anchor", "x", "y", "fill", "font-size"], Co = ["text-anchor", "x", "y", "fill", "font-size"], Fo = { key: 2 }, Mo = ["d", "fill", "stroke"], Po = { key: 5 }, jo = { key: 0 }, So = ["stroke-dasharray", "d", "stroke", "stroke-width"], To = ["stroke-dasharray", "d", "stroke", "stroke-width"], zo = ["stroke-dasharray", "d", "stroke", "stroke-width"], Do = ["stroke-dasharray", "d", "stroke", "stroke-width"], No = ["d", "stroke", "stroke-width", "fill"], Oo = ["d", "stroke", "stroke-width", "fill"], Bo = { key: 1 }, Ao = ["onClick"], Lo = ["id"], Io = ["stop-color"], Wo = ["stop-color"], Vo = ["id"], Go = ["stop-color"], Uo = ["stop-color"], Eo = ["stop-color"], Ho = ["stop-color"], Zo = ["stop-color"], qo = ["onMouseenter", "onClick", "d", "fill"], Xo = ["onMouseenter", "onClick", "d"], Ro = ["onMouseenter", "onClick", "d", "fill"], Yo = ["onClick"], Jo = ["stroke", "d"], Ko = ["cx", "cy", "fill", "stroke"], Qo = ["x", "y", "width", "height"], el = { key: 1 }, tl = ["d", "stroke"], ol = ["d", "fill", "stroke"], ll = ["id"], sl = ["stop-color"], nl = ["stop-color"], rl = ["cx", "cy", "fill"], il = ["cx", "cy", "fill"], al = { key: 0 }, ul = ["text-anchor", "x", "y", "fill", "font-size"], dl = ["text-anchor", "x", "y", "fill", "font-size"], cl = { key: 2 }, hl = ["d", "fill", "stroke"], fl = {
  key: 4,
  class: "vue-data-ui-watermark"
}, pl = {
  key: 6,
  ref: "source",
  dir: "auto"
}, vl = ["innerHTML"], yl = {
  __name: "vue-ui-3d-bar",
  props: {
    config: {
      type: Object,
      default() {
        return {};
      }
    },
    dataset: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  emits: ["selectDatapoint"],
  setup(ze, { expose: De, emit: Ne }) {
    const { vue_ui_3d_bar: Oe } = Ye(), $ = ze, H = Ne, Z = T(() => !!$.dataset && Object.keys($.dataset).length), b = S(Pe()), Be = S(null), te = S(null), L = S(!1), ue = S(0), de = S(0), o = T({
      get: () => fe(),
      set: (r) => r
    }), { userOptionsVisible: oe, setUserOptionsVisibility: ce, keepUserOptionState: he } = ft({ config: o.value });
    function fe() {
      const r = Te({
        userConfig: $.config,
        defaultConfig: Oe
      });
      return r.theme ? {
        ...Te({
          userConfig: Je.vue_ui_3d_bar[r.theme] || $.config,
          defaultConfig: r
        }),
        customPalette: Ke[r.theme] || Y
      } : r;
    }
    Ee(() => $.config, (r) => {
      o.value = fe(), oe.value = !o.value.showOnChartHover, ge(), ue.value += 1, de.value += 1;
    }, { deep: !0 });
    const { isPrinting: pe, isImaging: ve, generatePdf: ye, generateImage: ke } = rt({
      elementId: `3d_bar_${b.value}`,
      fileName: o.value.style.chart.title.text || "vue-ui-3d-bar"
    }), Ae = T(() => Qe(o.value.customPalette)), q = S({
      showTable: o.value.table.show
    }), F = T(() => $.dataset.series && $.dataset.series.length), s = T(() => ({
      height: o.value.style.chart.box.dimensions.height,
      width: o.value.style.chart.box.dimensions.width,
      absoluteWidth: o.value.style.chart.box.dimensions.width * (F.value ? 2 : 1),
      top: o.value.style.chart.box.dimensions.top,
      bottom: o.value.style.chart.box.dimensions.bottom,
      left: o.value.style.chart.box.dimensions.left,
      right: o.value.style.chart.box.dimensions.right,
      perspective: o.value.style.chart.box.dimensions.perspective
    })), C = T(() => {
      if (F.value) {
        const r = $.dataset.series.map((l) => l.value || 0).reduce((l, a) => l + a, 0), n = $.dataset.series.map((l, a) => ({
          ...l,
          id: Pe(),
          proportion: (l.value || 0) / r,
          color: et(l.color) || Ae.value[a] || Y[a] || Y[a % Y.length],
          breakdown: l.breakdown ? l.breakdown.sort((c, k) => k.value - c.value) : null
        })).sort((l, a) => a.value - l.value), t = [];
        let h = 0;
        for (let l = 0; l < n.length; l += 1)
          t.push({
            ...n[l],
            fill: Le(h, n[l].proportion, n[l].breakdown, n[l].color)
          }), h += n[l].proportion;
        return t;
      }
      return null;
    }), O = T(() => ({
      right: `M${s.value.width / 2},${s.value.top} ${s.value.width - s.value.right}, ${s.value.top + s.value.perspective} ${s.value.width - s.value.right},${s.value.height - s.value.bottom - s.value.perspective} ${s.value.width / 2},${s.value.height - s.value.bottom}`,
      left: `M${s.value.width / 2},${s.value.top} ${s.value.left},${s.value.top + s.value.perspective} ${s.value.left},${s.value.height - s.value.bottom - s.value.perspective} ${s.value.width / 2},${s.value.height - s.value.bottom}`,
      side: `M${s.value.width / 2},${s.value.height - s.value.bottom} ${s.value.width / 2},${s.value.top + s.value.perspective * 2}`,
      topSides: `M${s.value.left},${s.value.top + s.value.perspective} ${s.value.width / 2},${s.value.top + s.value.perspective * 2} ${s.value.width - s.value.right},${s.value.top + s.value.perspective}`,
      tubeTop: `M${s.value.left},${s.value.top + s.value.perspective} C ${s.value.left},${s.value.top - s.value.perspective / 3} ${s.value.width - s.value.right},${s.value.top - s.value.perspective / 3} ${s.value.width - s.value.right},${s.value.top + s.value.perspective} C ${s.value.width - s.value.right},${s.value.top + s.value.perspective * 2.3} ${s.value.left},${s.value.top + s.value.perspective * 2.3} ${s.value.left},${s.value.top + s.value.perspective}`,
      tubeLeft: `M${s.value.left},${s.value.top + s.value.perspective} ${s.value.left},${s.value.height - s.value.bottom - s.value.perspective}`,
      tubeRight: `M${s.value.width - s.value.right},${s.value.top + s.value.perspective} ${s.value.width - s.value.right},${s.value.height - s.value.bottom - s.value.perspective}`,
      tubeBottom: `M${s.value.width - s.value.right},${s.value.height - s.value.bottom - s.value.perspective} C ${s.value.width - s.value.right},${s.value.height} ${s.value.left},${s.value.height} ${s.value.left},${s.value.height - s.value.bottom - s.value.perspective}`
    })), W = S(o.value.style.chart.animation.use ? 0 : $.dataset.percentage);
    He(() => {
      ge();
      let r = 0, n = o.value.style.chart.animation.speed, t = 5e-3 * o.value.style.chart.animation.acceleration;
      function h() {
        W.value += n + r, r += t, W.value < $.dataset.percentage ? requestAnimationFrame(h) : W.value = $.dataset.percentage;
      }
      o.value.style.chart.animation.use && (W.value = 0, h());
    });
    function ge() {
      tt($.dataset) ? J({
        componentName: "VueUi3dBar",
        type: "dataset"
      }) : $.dataset.series ? $.dataset.series.forEach((r, n) => {
        ae({
          datasetObject: r,
          requiredAttributes: ["name", "value"]
        }).forEach((t) => {
          J({
            componentName: "VueUi3dBar",
            type: "datasetSerieAttribute",
            property: t,
            index: n
          });
        }), r.breakdown && r.breakdown.forEach((t, h) => {
          ae({
            datasetObject: t,
            requiredAttributes: ["name", "value"]
          }).forEach((l) => {
            J({
              componentName: "VueUi3dBar",
              type: "datasetSerieAttribute",
              property: l,
              index: `${n} - ${h}`
            });
          });
        });
      }) : ae({
        datasetObject: $.dataset,
        requiredAttributes: ["percentage"]
      }).forEach((r) => {
        J({
          componentName: "VueUi3dBar",
          type: "datasetAttribute",
          property: r
        });
      });
    }
    function Le(r, n, t, h) {
      const l = s.value.height - s.value.bottom - s.value.top - s.value.perspective * 2, { width: a, height: c, bottom: k, right: w, left: p, perspective: v } = s.value, f = k + l * r, ne = c - f - v - l * n / 2, Ve = ne > s.value.height / 2 ? "top" : "bottom", be = 64, Ge = !!t;
      let xe = null, we = null;
      return Ge && (t = t.map((Ce, Ue) => ({
        ...Ce,
        value: Ce.value || 0,
        color: U(h, Ue / t.length)
      })), xe = je(
        { series: t },
        a + s.value.absoluteWidth / 4 - 14,
        Ve === "top" ? ne - be : ne + be,
        28,
        28,
        1.99999,
        2,
        1,
        360,
        105.25,
        14
      ), we = je(
        { series: t },
        a - w + 20,
        c - f - v - l * n / 2,
        6,
        6,
        1.99999,
        2,
        1,
        360,
        105.25,
        6
      )), {
        donut: xe,
        miniDonut: we,
        sidePointer: {
          x: a - w,
          y: c - f - v - l * n / 2,
          topY: c - f - v - l * n,
          height: l * n
        },
        apexBottom: { y: c - f, x: a / 2 },
        apexTop: { y: c - f - l * n, x: a / 2 },
        right: `M${a / 2},${c - f} ${a / 2},${c - f - l * n} ${a - w},${c - f - v - l * n} ${a - w},${c - f - v}Z`,
        left: `M${a / 2},${c - f} ${a / 2},${c - f - l * n} ${p}, ${c - f - v - l * n} ${p},${c - f - v}Z`,
        liningTop: `M${p},${c - f - v - l * n} ${a / 2},${c - f - l * n} ${a - w},${c - f - v - l * n}`,
        liningTopShade: `M${p},${c - f - v - l * n - 0.5} ${a / 2},${c - f - l * n - 0.5} ${a - w},${c - f - v - l * n - 0.5}`,
        top: `M${a / 2},${c - f - l * n} ${p},${c - f - v - l * n} ${a / 2},${c - f - v * 2 - l * n} ${a - w},${c - f - v - l * n} Z`,
        tubeTop: `M${p},${c - f - l * n - v} C ${p},${c - f - l * n - v * 2.5} ${a - w},${c - f - l * n - v * 2.5} ${a - w},${c - f - l * n - v} C ${a - w},${c - f - l * n + v / 2} ${p},${c - f - l * n + v / 2} ${p},${c - f - l * n - v}`,
        bottomTubeTop: `M ${a - w - 0.5},${c - f - v} C ${a - w - 0.5},${c - f + v / 2} ${p},${c - f + v / 2} ${p + 0.5},${c - f - v}`,
        tubeBody: `M
        ${p},${c - f - l * n - v} 
        C ${p},${c - f - l * n + v / 2} 
        ${a - w},${c - f - l * n + v / 2} 
        ${a - w},${c - f - l * n - v} 
        L${a - w},${c - f - v}
        C 
        ${a - w},${c - f + v / 2}
        ${p},${c - f + v / 2}
        ${p},${c - f - v}Z`
      };
    }
    const E = T(() => {
      const r = W.value / 100, n = s.value.height - s.value.bottom - s.value.top - s.value.perspective * 2, { width: t, height: h, bottom: l, right: a, left: c, perspective: k } = s.value, p = l + n * 0;
      return {
        right: `M${t / 2},${h - p} ${t / 2},${h - p - n * r} ${t - a},${h - p - k - n * r} ${t - a},${h - p - k}Z`,
        left: `M${t / 2},${h - p} ${t / 2},${h - p - n * r} ${c}, ${h - p - k - n * r} ${c},${h - p - k}Z`,
        top: `M${t / 2},${h - p - n * r} ${c},${h - p - k - n * r} ${t / 2},${h - p - k * 2 - n * r} ${t - a},${h - p - k - n * r} Z`,
        tubeTop: `M${c},${h - p - n * r - k} C ${c},${h - p - n * r - k * 2.5} ${t - a},${h - p - n * r - k * 2.5} ${t - a},${h - p - n * r - k} C ${t - a},${h - p - n * r + k / 2} ${c},${h - p - n * r + k / 2} ${c},${h - p - n * r - k}`,
        tubeBody: `M
        ${c},${h - p - n * r - k} 
        C ${c},${h - p - n * r + k / 2} 
        ${t - a},${h - p - n * r + k / 2} 
        ${t - a},${h - p - n * r - k} 
        L${t - a},${h - k * 1.5}
        C 
        ${t - a},${h}
        ${c},${h}
        ${c},${h - p - k}Z`
      };
    }), x = S(null);
    function M(r, n = !1) {
      H("selectDatapoint", r), n || (x.value = r.id), n && L.value && (L.value = !1), n && !L.value && (L.value = !0);
    }
    function I() {
      L.value || (x.value = null);
    }
    function V(r, n, t = !1) {
      const h = $.dataset.series.map((c) => c.value || 0).reduce((c, k) => c + k, 0), l = isNaN(r.value / h) ? 0 : r.value / h * 100, a = isNaN(r.value / $e(n)) ? 0 : r.value / $e(n) * 100;
      return t ? a : l.toFixed(0) + "%";
    }
    function $e(r) {
      return [...r].map((n) => n.value).reduce((n, t) => n + t, 0);
    }
    const le = S(!1);
    function Ie(r) {
      le.value = r;
    }
    function We() {
      return F.value ? C.value : $.dataset.percentage;
    }
    const B = T(() => {
      if (F.value) {
        const r = C.value.flatMap((t) => t.breakdown && t.breakdown.length ? [{ name: t.name, color: t.color }, ...t.breakdown.map((h, l) => ({
          name: h.name,
          color: U(t.color, l / t.breakdown.length)
        }))] : {
          name: t.name,
          color: t.color
        }), n = C.value.flatMap((t) => t.breakdown && t.breakdown.length ? [t.value, ...t.breakdown.map((h) => h.value)] : t.value);
        return { head: r, body: n };
      } else
        return null;
    });
    function _e() {
      if (!F.value) {
        console.warn("VueUi3dBar : CSV download is only available in stack mode (providing dataset.series instead of dataset.percentage)");
        return;
      }
      Re(() => {
        const r = C.value.map((l) => l.value).reduce((l, a) => l + a, 0), n = B.value.head.map((l, a) => [[
          l.name
        ], [B.value.body[a]], [isNaN(B.value.body[a] / r) ? "-" : B.value.body[a] / r * 100]]), t = [[o.value.style.chart.title.text], [o.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(n), h = lt(t);
        st({ csvContent: h, title: o.value.style.chart.title.text || "vue-ui-3d-bar" });
      });
    }
    const X = T(() => {
      const r = C.value.map((a) => a.value).reduce((a, c) => a + c, 0), n = [
        ' <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 16v2a1 1 0 0 1 -1 1h-11l6 -7l-6 -7h11a1 1 0 0 1 1 1v2" /></svg>',
        z({ p: o.value.style.chart.legend.prefix, v: r, s: o.value.style.chart.legend.suffix, r: o.value.table.td.roundingValue }),
        "100%"
      ], t = B.value.head.map((a, c) => {
        const k = z({ p: o.value.style.chart.legend.prefix, v: B.value.body[c], s: o.value.style.chart.legend.suffix, r: o.value.table.td.roundingValue });
        return [
          {
            color: a.color,
            name: a.name
          },
          k,
          isNaN(B.value.body[c] / r) ? "-" : z({
            v: B.value.body[c] / r * 100,
            s: "%",
            r: o.value.table.td.roundingPercentage
          })
        ];
      }), h = {
        th: {
          backgroundColor: o.value.table.th.backgroundColor,
          color: o.value.table.th.color,
          outline: o.value.table.th.outline
        },
        td: {
          backgroundColor: o.value.table.td.backgroundColor,
          color: o.value.table.td.color,
          outline: o.value.table.td.outline
        },
        breakpoint: o.value.table.responsiveBreakpoint,
        shape: o.value.style.shape === "tube" ? "circle" : "square"
      };
      return {
        colNames: [
          o.value.table.columnNames.series,
          o.value.table.columnNames.value,
          o.value.table.columnNames.percentage
        ],
        head: n,
        body: t,
        config: h
      };
    });
    function me() {
      q.value.showTable = !q.value.showTable;
    }
    const R = S(!1);
    function se() {
      R.value = !R.value;
    }
    return De({
      generateCsv: _e,
      generatePdf: ye,
      generateImage: ke,
      getData: We,
      toggleTable: me,
      toggleAnnotator: se
    }), (r, n) => (i(), d("div", {
      ref_key: "bar3dChart",
      ref: te,
      class: Fe("vue-ui-3d-bar"),
      style: D(`font-family:${e(o).style.fontFamily};width:100%; text-align:center;background:${e(o).style.chart.backgroundColor}`),
      id: `3d_bar_${e(b)}`,
      onMouseenter: n[2] || (n[2] = () => e(ce)(!0)),
      onMouseleave: n[3] || (n[3] = () => e(ce)(!1))
    }, [
      e(o).userOptions.buttons.annotator ? (i(), G(ht, {
        key: 0,
        parent: e(te),
        backgroundColor: e(o).style.chart.backgroundColor,
        color: e(o).style.chart.color,
        active: e(R),
        onClose: se
      }, null, 8, ["parent", "backgroundColor", "color", "active"])) : y("", !0),
      e(o).style.chart.title.text ? (i(), d("div", yt, [
        (i(), G(nt, {
          key: `title_${e(ue)}`,
          config: {
            title: {
              cy: "3dBar-div-title",
              ...e(o).style.chart.title
            },
            subtitle: {
              cy: "3dBar-div-subtitle",
              ...e(o).style.chart.title.subtitle
            }
          }
        }, null, 8, ["config"]))
      ])) : y("", !0),
      e(o).userOptions.show && e(Z) && (e(he) || e(oe)) ? (i(), G(it, {
        key: 2,
        ref_key: "details",
        ref: Be,
        backgroundColor: e(o).style.chart.backgroundColor,
        color: e(o).style.chart.color,
        isPrinting: e(pe),
        isImaging: e(ve),
        uid: e(b),
        hasPdf: e(o).userOptions.buttons.pdf,
        hasTable: !!e(F) && e(o).userOptions.buttons.table,
        hasXls: !!e(F) && e(o).userOptions.buttons.csv,
        hasImg: e(o).userOptions.buttons.img,
        hasFullscreen: e(o).userOptions.buttons.fullscreen,
        titles: { ...e(o).userOptions.buttonTitles },
        chartElement: e(te),
        position: e(o).userOptions.position,
        hasAnnotator: e(o).userOptions.buttons.annotator,
        isAnnotation: e(R),
        onToggleFullscreen: Ie,
        onGeneratePdf: e(ye),
        onGenerateCsv: _e,
        onGenerateImage: e(ke),
        onToggleTable: me,
        onToggleAnnotator: se,
        style: D({
          visibility: e(he) ? e(oe) ? "visible" : "hidden" : "visible"
        })
      }, Ze({ _: 2 }, [
        r.$slots.optionPdf ? {
          name: "optionPdf",
          fn: N(() => [
            j(r.$slots, "optionPdf", {}, void 0, !0)
          ]),
          key: "0"
        } : void 0,
        r.$slots.optionCsv ? {
          name: "optionCsv",
          fn: N(() => [
            j(r.$slots, "optionCsv", {}, void 0, !0)
          ]),
          key: "1"
        } : void 0,
        r.$slots.optionImg ? {
          name: "optionImg",
          fn: N(() => [
            j(r.$slots, "optionImg", {}, void 0, !0)
          ]),
          key: "2"
        } : void 0,
        r.$slots.optionTable ? {
          name: "optionTable",
          fn: N(() => [
            j(r.$slots, "optionTable", {}, void 0, !0)
          ]),
          key: "3"
        } : void 0,
        r.$slots.optionFullscreen ? {
          name: "optionFullscreen",
          fn: N(({ toggleFullscreen: t, isFullscreen: h }) => [
            j(r.$slots, "optionFullscreen", re(ie({ toggleFullscreen: t, isFullscreen: h })), void 0, !0)
          ]),
          key: "4"
        } : void 0,
        r.$slots.optionAnnotator ? {
          name: "optionAnnotator",
          fn: N(({ toggleAnnotator: t, isAnnotator: h }) => [
            j(r.$slots, "optionAnnotator", re(ie({ toggleAnnotator: t, isAnnotator: h })), void 0, !0)
          ]),
          key: "5"
        } : void 0
      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasTable", "hasXls", "hasImg", "hasFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage", "style"])) : y("", !0),
      e(Z) ? (i(), d("svg", {
        key: 3,
        xmlns: e(ot),
        class: Fe({ "vue-data-ui-fullscreen--on": e(le), "vue-data-ui-fulscreen--off": !e(le) }),
        viewBox: `0 0 ${e(s).absoluteWidth} ${e(s).height}`,
        style: D(`max-width:100%; overflow: visible; background:transparent;color:${e(o).style.chart.color}`)
      }, [
        qe(ct),
        r.$slots["chart-background"] ? (i(), d("foreignObject", {
          key: 0,
          x: 0,
          y: 0,
          width: e(s).absoluteWidth,
          height: e(s).height,
          style: {
            pointerEvents: "none"
          }
        }, [
          j(r.$slots, "chart-background", {}, void 0, !0)
        ], 8, gt)) : y("", !0),
        u("defs", null, [
          u("radialGradient", {
            id: `gradient_top${e(b)}`
          }, [
            u("stop", {
              offset: "0%",
              "stop-color": e(g)(e(o).style.chart.backgroundColor, 0)
            }, null, 8, _t),
            u("stop", {
              offset: "100%",
              "stop-color": e(o).style.chart.bar.color
            }, null, 8, mt)
          ], 8, $t),
          u("radialGradient", {
            id: `gradient_left${e(b)}`
          }, [
            u("stop", {
              offset: "0%",
              "stop-color": e(g)(e(o).style.chart.backgroundColor, 0)
            }, null, 8, xt),
            u("stop", {
              offset: "100%",
              "stop-color": e(g)(e(o).style.chart.bar.color, 20)
            }, null, 8, wt)
          ], 8, bt),
          u("radialGradient", {
            id: `gradient_right${e(b)}`
          }, [
            u("stop", {
              offset: "0%",
              "stop-color": e(g)(e(o).style.chart.backgroundColor, 0)
            }, null, 8, Ft),
            u("stop", {
              offset: "100%",
              "stop-color": e(g)(e(o).style.chart.bar.color, 20)
            }, null, 8, Mt)
          ], 8, Ct),
          u("linearGradient", {
            id: `gradient_tube_body${e(b)}`,
            x1: "0%",
            y1: "0%",
            x2: "100%",
            y2: "0%"
          }, [
            u("stop", {
              offset: "0%",
              "stop-color": `${e(o).style.chart.bar.color}`
            }, null, 8, jt),
            u("stop", {
              offset: "75%",
              "stop-color": e(g)(e(o).style.chart.backgroundColor, 0)
            }, null, 8, St),
            u("stop", {
              offset: "100%",
              "stop-color": e(g)(e(o).style.chart.bar.color, 40)
            }, null, 8, Tt)
          ], 8, Pt)
        ]),
        e(F) ? (i(), d("defs", zt, [
          (i(!0), d(_, null, m(e(C), (t) => (i(), d("radialGradient", {
            id: `grad_top_${t.id}`
          }, [
            u("stop", {
              offset: "0%",
              "stop-color": e(g)(e(U)(t.color, 0.5), 80)
            }, null, 8, Nt),
            u("stop", {
              offset: "100%",
              "stop-color": t.color
            }, null, 8, Ot)
          ], 8, Dt))), 256)),
          (i(!0), d(_, null, m(e(C), (t) => (i(), d("linearGradient", {
            id: `grad_left_${t.id}`
          }, [
            u("stop", {
              offset: "0%",
              "stop-color": e(g)(t.color, 80)
            }, null, 8, At),
            u("stop", {
              offset: "100%",
              "stop-color": e(g)(e(K)(t.color, 0.5), 100)
            }, null, 8, Lt)
          ], 8, Bt))), 256)),
          (i(!0), d(_, null, m(e(C), (t) => (i(), d("linearGradient", {
            id: `grad_right_${t.id}`
          }, [
            u("stop", {
              offset: "2%",
              "stop-color": e(g)(e(U)(t.color, 0.5), 100)
            }, null, 8, Wt),
            u("stop", {
              offset: "100%",
              "stop-color": e(g)(t.color, 80)
            }, null, 8, Vt)
          ], 8, It))), 256)),
          u("linearGradient", {
            x1: "0%",
            y1: "0%",
            x2: "0%",
            y2: "100%",
            id: `vertical_line_${e(b)}`
          }, n[4] || (n[4] = [
            u("stop", {
              offset: "0%",
              "stop-color": "#FFFFFF"
            }, null, -1),
            u("stop", {
              offset: "100%",
              "stop-color": "#FFFFFF33"
            }, null, -1)
          ]), 8, Gt)
        ])) : y("", !0),
        e(o).style.chart.dataLabel.show && ![null, void 0].includes($.dataset.percentage) && [null, void 0].includes($.dataset.series) ? (i(), d("text", {
          key: 2,
          x: e(s).width / 2,
          y: e(s).top - e(o).style.chart.dataLabel.fontSize / 2,
          "font-size": e(o).style.chart.dataLabel.fontSize,
          "font-weight": e(o).style.chart.dataLabel.bold ? "bold" : "normal",
          fill: e(o).style.chart.dataLabel.color,
          "text-anchor": "middle"
        }, P(e(z)({
          v: e(W),
          s: "%",
          r: e(o).style.chart.dataLabel.rounding
        })), 9, Ut)) : y("", !0),
        e(L) ? (i(), d("g", {
          key: 3,
          onClick: n[0] || (n[0] = (t) => {
            L.value = !1, x.value = null;
          }),
          "data-html2canvas-ignore": "",
          style: { cursor: "pointer" }
        }, [
          u("rect", {
            x: e(s).width / 2 - 6,
            y: e(s).top - 20,
            height: 12,
            width: 12,
            fill: "transparent"
          }, null, 8, Et),
          u("path", {
            d: `M${e(s).width / 2 - 6},${e(s).top - 20} ${e(s).width / 2 + 6},${e(s).top - 9}`,
            stroke: e(o).style.chart.color,
            "stroke-linecap": "round",
            "stroke-width": "1"
          }, null, 8, Ht),
          u("path", {
            d: `M${e(s).width / 2 + 6},${e(s).top - 20} ${e(s).width / 2 - 6},${e(s).top - 9}`,
            stroke: e(o).style.chart.color,
            "stroke-linecap": "round",
            "stroke-width": "1"
          }, null, 8, Zt)
        ])) : y("", !0),
        !e(o).style.shape || e(o).style.shape === "bar" ? (i(), d("g", qt, [
          e(F) ? y("", !0) : (i(), d("g", Xt, [
            u("path", {
              "stroke-dasharray": e(o).style.chart.box.strokeDasharray,
              d: e(O).right,
              stroke: e(o).style.chart.box.stroke,
              "stroke-width": e(o).style.chart.box.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: "none"
            }, null, 8, Rt),
            u("path", {
              "stroke-dasharray": e(o).style.chart.box.strokeDasharray,
              d: e(O).left,
              stroke: e(o).style.chart.box.stroke,
              "stroke-width": e(o).style.chart.box.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: "none"
            }, null, 8, Yt),
            u("path", {
              "stroke-dasharray": e(o).style.chart.box.strokeDasharray,
              d: e(O).side,
              stroke: e(o).style.chart.box.stroke,
              "stroke-width": e(o).style.chart.box.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: "none"
            }, null, 8, Jt),
            u("path", {
              "stroke-dasharray": e(o).style.chart.box.strokeDasharray,
              d: e(O).topSides,
              stroke: e(o).style.chart.box.stroke,
              "stroke-width": e(o).style.chart.box.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: "none"
            }, null, 8, Kt)
          ])),
          e(F) ? y("", !0) : (i(), d("g", Qt, [
            u("path", {
              d: e(E).right,
              stroke: e(o).style.chart.bar.stroke,
              "stroke-width": e(o).style.chart.bar.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: `url(#gradient_right${e(b)})`
            }, null, 8, eo),
            u("path", {
              d: e(E).left,
              stroke: e(o).style.chart.bar.stroke,
              "stroke-width": e(o).style.chart.bar.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: `url(#gradient_left${e(b)})`
            }, null, 8, to),
            u("path", {
              d: e(E).top,
              stroke: e(o).style.chart.bar.stroke,
              "stroke-width": e(o).style.chart.bar.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: `url(#gradient_top${e(b)})`
            }, null, 8, oo)
          ])),
          e(F) ? (i(), d("g", lo, [
            (i(!0), d(_, null, m(e(C), (t, h) => (i(), d("g", {
              style: D(`opacity:${e(x) ? e(x) === t.id ? 1 : 0.3 : 1}`),
              class: "vue-ui-3d-bar-stack"
            }, [
              u("path", {
                d: t.fill.right,
                fill: `url(#grad_right_${t.id})`,
                onMouseenter: (l) => M(t),
                onClick: (l) => M(t, !0),
                onMouseout: I
              }, null, 40, so),
              u("path", {
                d: t.fill.left,
                fill: `url(#grad_left_${t.id})`,
                onMouseenter: (l) => M(t),
                onClick: (l) => M(t, !0),
                onMouseout: I
              }, null, 40, no),
              u("path", {
                d: t.fill.top,
                fill: `url(#grad_top_${t.id})`,
                onMouseenter: (l) => M(t),
                onClick: (l) => M(t, !0),
                onMouseout: I
              }, null, 40, ro),
              u("path", {
                d: t.fill.liningTop,
                stroke: "#FFFFFF",
                "stroke-width": "0.5",
                "stroke-linecap": "round",
                fill: "none",
                onMouseenter: (l) => M(t),
                onClick: (l) => M(t, !0),
                onMouseout: I
              }, null, 40, io),
              u("path", {
                d: `M ${t.fill.apexTop.x},${t.fill.apexTop.y} ${t.fill.apexBottom.x},${t.fill.apexBottom.y}`,
                stroke: "#FFFFFF",
                "stroke-width": "0.5",
                "stroke-linecap": "round"
              }, null, 8, ao)
            ], 4))), 256)),
            (i(!0), d(_, null, m(e(C), (t, h) => (i(), d("g", null, [
              h !== e(C).length - 1 ? (i(), d("path", {
                key: 0,
                d: t.fill.liningTopShade,
                stroke: e(o).style.chart.bar.shadeColor,
                "stroke-width": "0.5",
                "stroke-linecap": "round",
                fill: "none",
                style: { "pointer-events": "none" }
              }, null, 8, uo)) : y("", !0)
            ]))), 256)),
            (i(!0), d(_, null, m(e(C), (t, h) => (i(), d("g", {
              style: D(`opacity:${e(x) ? e(x) === t.id ? 1 : 0 : t.proportion * 100 > e(o).style.chart.legend.hideUnderPercentage ? 1 : 0}`),
              onClick: (l) => H("selectDatapoint", t)
            }, [
              u("path", {
                stroke: e(o).style.chart.color,
                "stroke-dasharray": "1",
                "stroke-width": "0.5",
                "stroke-linecap": "round",
                d: `M${t.fill.sidePointer.x},${t.fill.sidePointer.y} ${t.fill.sidePointer.x + 20},${t.fill.sidePointer.y}`
              }, null, 8, ho),
              !t.fill.miniDonut || e(x) ? (i(), d("circle", {
                key: 0,
                cx: t.fill.sidePointer.x + 20,
                cy: t.fill.sidePointer.y,
                r: 2,
                fill: t.color,
                stroke: e(o).style.chart.backgroundColor
              }, null, 8, fo)) : y("", !0),
              (i(), d("foreignObject", {
                x: t.fill.sidePointer.x + 30,
                y: t.fill.sidePointer.y - e(o).style.chart.legend.fontSize,
                width: e(s).absoluteWidth / 2 - 12,
                height: e(o).style.chart.legend.fontSize * 2,
                style: { overflow: "visible", position: "relative" }
              }, [
                e(o).style.chart.legend.showDefault ? (i(), d("div", {
                  key: 0,
                  style: D(`height: 100%; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-items:center;justify-content: flex-start; font-size:${e(o).style.chart.legend.fontSize}px; text-align:left; line-height: ${e(o).style.chart.legend.fontSize}px; color:${e(o).style.chart.legend.color}`)
                }, P(t.name) + ": " + P(e(z)({ v: t.proportion * 100, s: "%", r: e(o).style.chart.legend.roundingPercentage })) + " (" + P(e(Q)(
                  e(o).style.chart.dataLabel.formatter,
                  t.value,
                  e(z)({
                    p: e(o).style.chart.legend.prefix,
                    v: t.value,
                    s: e(o).style.chart.legend.suffix,
                    r: e(o).style.chart.legend.roundingValue
                  }),
                  { datapoint: t, seriesIndex: h }
                )) + ") ", 5)) : y("", !0),
                j(r.$slots, "legend", Me({ ref_for: !0 }, { datapoint: t, config: e(o), dataset: e(C) }), void 0, !0)
              ], 8, po)),
              t.fill.donut && e(x) === t.id ? (i(), d("g", vo, [
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("g", null, [
                  V(l, t.fill.donut, !0) > 6 ? (i(), d("path", {
                    key: 0,
                    d: e(Se)(l, { x: l.cx, y: l.cy }, 0, 8, !1, !0, 10),
                    stroke: l.color,
                    class: "vue-ui-donut-arc-path",
                    "stroke-width": "0.5",
                    "stroke-linecap": "round",
                    "stroke-linejoin": "round",
                    fill: "none"
                  }, null, 8, yo)) : y("", !0)
                ]))), 256)),
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("path", {
                  class: "vue-ui-donut-arc-path",
                  d: l.arcSlice,
                  fill: `${l.color}`,
                  stroke: e(o).style.chart.backgroundColor,
                  "stroke-width": 1
                }, null, 8, ko))), 256)),
                u("defs", null, [
                  u("radialGradient", {
                    id: `hollow_gradient_${e(b)}`
                  }, [
                    u("stop", {
                      offset: "0%",
                      "stop-color": e(g)(e(o).style.chart.backgroundColor, 0)
                    }, null, 8, $o),
                    n[5] || (n[5] = u("stop", {
                      offset: "77%",
                      "stop-color": "#FFFFFF20"
                    }, null, -1)),
                    u("stop", {
                      offset: "100%",
                      "stop-color": e(g)(e(o).style.chart.backgroundColor, 0)
                    }, null, 8, _o)
                  ], 8, go)
                ]),
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("circle", {
                  class: "vue-ui-donut-arc-path",
                  cx: l.cx,
                  cy: l.cy,
                  r: 28,
                  fill: `url(#hollow_gradient_${e(b)})`
                }, null, 8, mo))), 256)),
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("circle", {
                  class: "vue-ui-donut-arc-path",
                  cx: l.cx,
                  cy: l.cy,
                  r: 14,
                  fill: e(o).style.chart.backgroundColor
                }, null, 8, bo))), 256)),
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("g", null, [
                  V(l, t.fill.donut, !0) > 6 ? (i(), d("g", xo, [
                    u("text", {
                      "text-anchor": e(A)(l, !0, 0).anchor,
                      x: e(A)(l, !0, 2).x,
                      y: e(ee)(l, 12, 12),
                      fill: e(o).style.chart.legend.color,
                      "font-size": e(o).style.chart.legend.fontSize / 1.5
                    }, P(V(l, t.fill.donut)) + " (" + P(e(Q)(
                      e(o).style.chart.dataLabel.formatter,
                      l.value,
                      e(z)({
                        p: e(o).style.chart.legend.prefix,
                        v: l.value,
                        s: e(o).style.chart.legend.suffix,
                        r: e(o).style.chart.legend.roundingValue
                      }),
                      { datapoint: l, seriesIndex: a }
                    )) + ") ", 9, wo),
                    u("text", {
                      "text-anchor": e(A)(l).anchor,
                      x: e(A)(l, !0, 2).x,
                      y: e(ee)(l, 12, 12) + e(o).style.chart.legend.fontSize / 1.5,
                      fill: e(o).style.chart.legend.color,
                      "font-size": e(o).style.chart.legend.fontSize / 1.5
                    }, P(l.name), 9, Co)
                  ])) : y("", !0)
                ]))), 256))
              ])) : y("", !0),
              t.fill.miniDonut && !e(x) ? (i(), d("g", Fo, [
                (i(!0), d(_, null, m(t.fill.miniDonut, (l, a) => (i(), d("path", {
                  class: "vue-ui-donut-arc-path",
                  d: l.arcSlice,
                  fill: `${l.color}`,
                  stroke: e(o).style.chart.backgroundColor,
                  "stroke-width": 0.5
                }, null, 8, Mo))), 256))
              ])) : y("", !0)
            ], 12, co))), 256))
          ])) : y("", !0)
        ])) : y("", !0),
        e(o).style.shape === "tube" ? (i(), d("g", Po, [
          e(F) ? y("", !0) : (i(), d("g", jo, [
            u("path", {
              "stroke-dasharray": e(o).style.chart.box.strokeDasharray,
              d: e(O).tubeTop,
              stroke: e(o).style.chart.box.stroke,
              "stroke-width": e(o).style.chart.box.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: "none"
            }, null, 8, So),
            u("path", {
              "stroke-dasharray": e(o).style.chart.box.strokeDasharray,
              d: e(O).tubeLeft,
              stroke: e(o).style.chart.box.stroke,
              "stroke-width": e(o).style.chart.box.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: "none"
            }, null, 8, To),
            u("path", {
              "stroke-dasharray": e(o).style.chart.box.strokeDasharray,
              d: e(O).tubeRight,
              stroke: e(o).style.chart.box.stroke,
              "stroke-width": e(o).style.chart.box.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: "none"
            }, null, 8, zo),
            u("path", {
              "stroke-dasharray": e(o).style.chart.box.strokeDasharray,
              d: e(O).tubeBottom,
              stroke: e(o).style.chart.box.stroke,
              "stroke-width": e(o).style.chart.box.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: "none"
            }, null, 8, Do),
            u("path", {
              d: e(E).tubeTop,
              stroke: e(o).style.chart.bar.stroke,
              "stroke-width": e(o).style.chart.bar.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: `url(#gradient_top${e(b)})`
            }, null, 8, No),
            u("path", {
              d: e(E).tubeBody,
              stroke: e(o).style.chart.bar.stroke,
              "stroke-width": e(o).style.chart.bar.strokeWidth,
              "stroke-linejoin": "round",
              "stroke-linecap": "round",
              fill: `url(#gradient_tube_body${e(b)})`
            }, null, 8, Oo)
          ])),
          e(F) ? (i(), d("g", Bo, [
            (i(!0), d(_, null, m(e(C), (t, h) => (i(), d("g", {
              style: D(`opacity:${e(x) ? e(x) === t.id ? 1 : 0.3 : 1}`),
              class: "vue-ui-3d-bar-stack",
              onClick: (l) => H("selectDatapoint", t)
            }, [
              u("defs", null, [
                u("radialGradient", {
                  id: `gradient_tube_top_${t.id}`,
                  fx: "10%",
                  cy: "55%"
                }, [
                  u("stop", {
                    offset: "0%",
                    "stop-color": e(g)(e(U)(t.color, 0.5), 80)
                  }, null, 8, Io),
                  u("stop", {
                    offset: "100%",
                    "stop-color": e(g)(e(K)(t.color, 0.1), 80)
                  }, null, 8, Wo)
                ], 8, Lo),
                u("linearGradient", {
                  id: `gradient_tube_body_${t.id}`,
                  x1: "0%",
                  y1: "0%",
                  x2: "100%",
                  y2: "0%"
                }, [
                  u("stop", {
                    offset: "0%",
                    "stop-color": `${t.color}`
                  }, null, 8, Go),
                  u("stop", {
                    offset: "10%",
                    "stop-color": e(g)(e(K)(t.color, 0.7), 100)
                  }, null, 8, Uo),
                  u("stop", {
                    offset: "25%",
                    "stop-color": e(g)(e(K)(t.color, 0.5), 100)
                  }, null, 8, Eo),
                  u("stop", {
                    offset: "75%",
                    "stop-color": e(g)(t.color, 80)
                  }, null, 8, Ho),
                  u("stop", {
                    offset: "100%",
                    "stop-color": e(g)(e(U)(t.color, 0.7), 100)
                  }, null, 8, Zo)
                ], 8, Vo)
              ]),
              u("path", {
                onMouseenter: (l) => M(t),
                onClick: (l) => M(t, !0),
                onMouseout: I,
                d: t.fill.tubeBody,
                stroke: "#FFFFFF",
                "stroke-width": 0.5,
                "stroke-linejoin": "round",
                "stroke-linecap": "round",
                fill: `url(#gradient_tube_body_${t.id})`
              }, null, 40, qo),
              h > 0 ? (i(), d("path", {
                key: 0,
                onMouseenter: (l) => M(t),
                onClick: (l) => M(t, !0),
                onMouseout: I,
                d: t.fill.bottomTubeTop,
                stroke: "#000000",
                "stroke-width": 0.5,
                "stroke-linejoin": "round",
                "stroke-linecap": "round",
                fill: "none"
              }, null, 40, Xo)) : y("", !0),
              u("path", {
                onMouseenter: (l) => M(t),
                onClick: (l) => M(t, !0),
                onMouseout: I,
                d: t.fill.tubeTop,
                stroke: "#FFFFFF",
                "stroke-width": 0.5,
                "stroke-linejoin": "round",
                "stroke-linecap": "round",
                fill: `url(#gradient_tube_top_${t.id})`
              }, null, 40, Ro)
            ], 12, Ao))), 256)),
            (i(!0), d(_, null, m(e(C), (t, h) => (i(), d("g", {
              style: D(`opacity:${e(x) ? e(x) === t.id ? 1 : 0 : t.proportion * 100 > e(o).style.chart.legend.hideUnderPercentage ? 1 : 0}`),
              onClick: (l) => H("selectDatapoint", t)
            }, [
              u("path", {
                stroke: e(o).style.chart.color,
                "stroke-dasharray": "1",
                "stroke-width": "0.5",
                "stroke-linecap": "round",
                d: `M${t.fill.sidePointer.x},${t.fill.sidePointer.y} ${t.fill.sidePointer.x + 20},${t.fill.sidePointer.y}`
              }, null, 8, Jo),
              !t.fill.miniDonut || e(x) ? (i(), d("circle", {
                key: 0,
                cx: t.fill.sidePointer.x + 20,
                cy: t.fill.sidePointer.y,
                r: 2,
                fill: t.color,
                stroke: e(o).style.chart.backgroundColor
              }, null, 8, Ko)) : y("", !0),
              (i(), d("foreignObject", {
                x: t.fill.sidePointer.x + 30,
                y: t.fill.sidePointer.y - e(o).style.chart.legend.fontSize,
                width: e(s).absoluteWidth / 2 - 12,
                height: e(o).style.chart.legend.fontSize * 2,
                style: { overflow: "visible", position: "relative" }
              }, [
                e(o).style.chart.legend.showDefault ? (i(), d("div", {
                  key: 0,
                  style: D(`height: 100%; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-items:center;justify-content: flex-start; font-size:${e(o).style.chart.legend.fontSize}px; text-align:left; line-height: ${e(o).style.chart.legend.fontSize}px; color:${e(o).style.chart.legend.color}`)
                }, P(t.name) + ": " + P(e(z)({ v: t.proportion * 100, s: "%", r: e(o).style.chart.legend.roundingPercentage })) + " (" + P(e(Q)(
                  e(o).style.chart.dataLabel.formatter,
                  t.value,
                  e(z)({
                    p: e(o).style.chart.legend.prefix,
                    v: t.value,
                    s: e(o).style.chart.legend.suffix,
                    r: e(o).style.chart.legend.roundingValue
                  }),
                  { datapoint: t, seriesIndex: h }
                )) + ") ", 5)) : y("", !0),
                j(r.$slots, "legend", Me({ ref_for: !0 }, { datapoint: t, config: e(o), dataset: e(C) }), void 0, !0)
              ], 8, Qo)),
              t.fill.donut && e(x) === t.id ? (i(), d("g", el, [
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("g", null, [
                  V(l, t.fill.donut, !0) > 6 ? (i(), d("path", {
                    key: 0,
                    d: e(Se)(l, { x: l.cx, y: l.cy }, 0, 8, !1, !0, 10),
                    stroke: l.color,
                    class: "vue-ui-donut-arc-path",
                    "stroke-width": "0.5",
                    "stroke-linecap": "round",
                    "stroke-linejoin": "round",
                    fill: "none"
                  }, null, 8, tl)) : y("", !0)
                ]))), 256)),
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("path", {
                  class: "vue-ui-donut-arc-path",
                  d: l.arcSlice,
                  fill: `${l.color}`,
                  stroke: e(o).style.chart.backgroundColor,
                  "stroke-width": 1
                }, null, 8, ol))), 256)),
                u("defs", null, [
                  u("radialGradient", {
                    id: `hollow_gradient_${e(b)}`
                  }, [
                    u("stop", {
                      offset: "0%",
                      "stop-color": e(g)(e(o).style.chart.backgroundColor, 0)
                    }, null, 8, sl),
                    n[6] || (n[6] = u("stop", {
                      offset: "77%",
                      "stop-color": "#FFFFFF20"
                    }, null, -1)),
                    u("stop", {
                      offset: "100%",
                      "stop-color": e(g)(e(o).style.chart.backgroundColor, 0)
                    }, null, 8, nl)
                  ], 8, ll)
                ]),
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("circle", {
                  class: "vue-ui-donut-arc-path",
                  cx: l.cx,
                  cy: l.cy,
                  r: 28,
                  fill: `url(#hollow_gradient_${e(b)})`
                }, null, 8, rl))), 256)),
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("circle", {
                  class: "vue-ui-donut-arc-path",
                  cx: l.cx,
                  cy: l.cy,
                  r: 14,
                  fill: e(o).style.chart.backgroundColor
                }, null, 8, il))), 256)),
                (i(!0), d(_, null, m(t.fill.donut, (l, a) => (i(), d("g", null, [
                  V(l, t.fill.donut, !0) > 6 ? (i(), d("g", al, [
                    u("text", {
                      "text-anchor": e(A)(l, !0, 0).anchor,
                      x: e(A)(l, !0, 2).x,
                      y: e(ee)(l, 12, 12),
                      fill: e(o).style.chart.legend.color,
                      "font-size": e(o).style.chart.legend.fontSize / 1.5
                    }, P(V(l, t.fill.donut)) + " (" + P(e(Q)(
                      e(o).style.chart.dataLabel.formatter,
                      l.value,
                      e(z)({
                        p: e(o).style.chart.legend.prefix,
                        v: l.value,
                        s: e(o).style.chart.legend.suffix,
                        r: e(o).style.chart.legend.roundingValue
                      }),
                      { datapoint: l, seriesIndex: a }
                    )) + ") ", 9, ul),
                    u("text", {
                      "text-anchor": e(A)(l).anchor,
                      x: e(A)(l, !0, 2).x,
                      y: e(ee)(l, 12, 12) + e(o).style.chart.legend.fontSize / 1.5,
                      fill: e(o).style.chart.legend.color,
                      "font-size": e(o).style.chart.legend.fontSize / 1.5
                    }, P(l.name), 9, dl)
                  ])) : y("", !0)
                ]))), 256))
              ])) : y("", !0),
              t.fill.miniDonut && !e(x) ? (i(), d("g", cl, [
                (i(!0), d(_, null, m(t.fill.miniDonut, (l, a) => (i(), d("path", {
                  class: "vue-ui-donut-arc-path",
                  d: l.arcSlice,
                  fill: `${l.color}`,
                  stroke: e(o).style.chart.backgroundColor,
                  "stroke-width": 0.5
                }, null, 8, hl))), 256))
              ])) : y("", !0)
            ], 12, Yo))), 256))
          ])) : y("", !0)
        ])) : y("", !0),
        j(r.$slots, "svg", { svg: e(s) }, void 0, !0)
      ], 14, kt)) : y("", !0),
      r.$slots.watermark ? (i(), d("div", fl, [
        j(r.$slots, "watermark", re(ie({ isPrinting: e(pe) || e(ve) })), void 0, !0)
      ])) : y("", !0),
      e(Z) ? y("", !0) : (i(), G(at, {
        key: 5,
        config: {
          type: "bar3d",
          style: {
            backgroundColor: e(o).style.chart.backgroundColor,
            bar3d: {
              color: "#CCCCCC"
            }
          }
        }
      }, null, 8, ["config"])),
      r.$slots.source ? (i(), d("div", pl, [
        j(r.$slots, "source", {}, void 0, !0)
      ], 512)) : y("", !0),
      e(Z) && e(F) ? (i(), G(dt, {
        key: 7,
        hideDetails: "",
        config: {
          open: e(q).showTable,
          maxHeight: 1e4,
          body: {
            backgroundColor: e(o).style.chart.backgroundColor,
            color: e(o).style.chart.color
          },
          head: {
            backgroundColor: e(o).style.chart.backgroundColor,
            color: e(o).style.chart.color
          }
        }
      }, {
        content: N(() => [
          (i(), G(ut, {
            key: `table_${e(de)}`,
            colNames: e(X).colNames,
            head: e(X).head,
            body: e(X).body,
            config: e(X).config,
            title: `${e(o).style.chart.title.text}${e(o).style.chart.title.subtitle.text ? ` : ${e(o).style.chart.title.subtitle.text}` : ""}`,
            onClose: n[1] || (n[1] = (t) => e(q).showTable = !1)
          }, {
            th: N(({ th: t }) => [
              u("div", {
                innerHTML: t,
                style: { display: "flex", "align-items": "center" }
              }, null, 8, vl)
            ]),
            td: N(({ td: t }) => [
              Xe(P(t.name || t), 1)
            ]),
            _: 1
          }, 8, ["colNames", "head", "body", "config", "title"]))
        ]),
        _: 1
      }, 8, ["config"])) : y("", !0)
    ], 44, vt));
  }
}, jl = /* @__PURE__ */ pt(yl, [["__scopeId", "data-v-baddc836"]]);
export {
  jl as default
};
