vue-data-ui 2.2.90 → 2.2.92

package/dist/vue-ui-donut-DMiwVXNd.js

@@ -0,0 +1,1534 @@
+import { computed as $, ref as w, onMounted as Re, onBeforeUnmount as vt, watch as ct, openBlock as u, createElementBlock as n, normalizeClass as R, normalizeStyle as H, renderSlot as N, createVNode as we, createCommentVNode as p, createBlock as ee, unref as c, createSlots as Ue, withCtx as F, normalizeProps as ye, guardReactiveProps as fe, createElementVNode as b, Fragment as A, renderList as T, toDisplayString as x, createTextVNode as Ae, nextTick as je, pushScopeId as dt, popScopeId as ht, withKeys as yt } from "vue";
+import { _ as Xe, i as Ye, j as ge, k as qe, e as Me, f as Ke, p as K, g as Je, h as re, m as ze, n as le, X as Qe, o as Ne, r as Ge, s as S, u as ne, y as We, D as Ze, z as ft, v as et, w as tt, A as He, C as gt, G as Be } from "./data-table-d-VcuH-r.js";
+import { t as bt, u as pt } from "./vue-ui-age-pyramid-4hcuKpFY.js";
+import { t as lt } from "./themes-lgjsYHsH.js";
+import { u as Te, _ as at } from "./title-BF-9Qcni.js";
+import { U as ot } from "./user-options-DZgCz8UA.js";
+import { _ as mt } from "./tooltip-D85WEOKi.js";
+import { L as ut } from "./legend-DJCYLsl_.js";
+import { u as st, a as nt, S as rt, A as it } from "./vue-ui-3d-bar-DW7kGJSz.js";
+import { S as xt } from "./vue-ui-candlestick-diclGj95.js";
+const kt = (ae) => (dt("data-v-a76ecc28"), ae = ae(), ht(), ae), _t = ["id"], wt = ["xmlns", "viewBox"], $t = ["id"], Ct = ["stop-color"], Lt = ["stop-color"], St = ["stop-color"], Ft = ["id"], zt = ["id"], Nt = /* @__PURE__ */ kt(() => /* @__PURE__ */ b("feColorMatrix", {
+  type: "saturate",
+  values: "0"
+}, null, -1)), At = ["id"], Tt = ["flood-color"], Pt = ["d", "stroke", "filter"], Ot = ["cx", "cy", "r", "fill", "filter"], It = ["stroke", "d"], Dt = ["d", "fill", "stroke", "stroke-width", "filter"], Vt = ["cx", "cy", "r", "fill"], Et = ["d", "fill", "onMouseenter", "onClick"], Mt = ["cx", "cy", "r", "fill"], Gt = ["x", "y", "fill", "font-size"], Wt = ["x", "y", "fill", "font-size"], Ht = ["x", "y", "fill", "font-size"], Bt = ["x", "y", "fill", "font-size"], Rt = ["filter"], Ut = { key: 0 }, jt = ["x", "y"], Xt = { key: 1 }, Yt = ["cx", "cy", "fill", "filter", "onClick"], qt = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], Kt = ["text-anchor", "x", "y", "fill", "font-size", "onClick"], Jt = { key: 2 }, Qt = ["x", "y", "width"], Zt = ["onClick"], el = {
+  key: 0,
+  style: { "font-variant-numeric": "tabular-nums" }
+}, tl = { key: 1 }, ll = ["innerHTML"], al = {
+  __name: "vue-ui-donut",
+  props: {
+    config: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    dataset: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  emits: ["selectLegend", "selectDatapoint"],
+  setup(ae, { expose: Pe, emit: be }) {
+    const P = ae, { vue_ui_donut: Oe } = st(), J = $({
+      get() {
+        return !!P.dataset && P.dataset.length;
+      },
+      set(l) {
+        return l;
+      }
+    }), C = w(null), $e = w(null), Q = w(null), O = w(null);
+    Re(() => {
+      if (Ye(P.dataset) ? ge({
+        componentName: "VueUiDonut",
+        type: "dataset"
+      }) : P.dataset.forEach((l, r) => {
+        qe({
+          datasetObject: l,
+          requiredAttributes: ["name", "values"]
+        }).forEach((o) => {
+          J.value = !1, ge({
+            componentName: "VueUiDonut",
+            type: "datasetSerieAttribute",
+            property: o,
+            index: r
+          });
+        });
+      }), e.value.responsive) {
+        const l = bt(() => {
+          const { width: r, height: o } = pt({
+            chart: C.value,
+            title: e.value.style.chart.title.text ? $e.value : null,
+            legend: e.value.style.chart.legend.show ? Q.value : null
+          });
+          m.value.width = r, m.value.height = o;
+        });
+        O.value = new ResizeObserver(l), O.value.observe(C.value.parentNode);
+      }
+    }), vt(() => {
+      O.value && O.value.disconnect();
+    });
+    const k = w(Me()), pe = w(null), M = w(!1), W = w(""), U = w(null), me = w(0), e = $(() => {
+      const l = Te({
+        userConfig: P.config,
+        defaultConfig: Oe
+      });
+      return l.theme ? {
+        ...Te({
+          userConfig: lt.vue_ui_donut[l.theme] || P.config,
+          defaultConfig: l
+        }),
+        customPalette: Ke[l.theme] || K
+      } : l;
+    }), { isPrinting: t, isImaging: Ie, generatePdf: Ce, generateImage: xe } = nt({
+      elementId: `donut__${k.value}`,
+      fileName: e.value.style.chart.title.text || "vue-ui-donut"
+    }), ke = $(() => Je(e.value.customPalette)), I = w({
+      dataLabels: {
+        show: e.value.style.chart.layout.labels.dataLabels.show
+      },
+      showTable: e.value.table.show,
+      showTooltip: e.value.style.chart.tooltip.show
+    }), m = w({
+      height: 360,
+      width: 512
+    }), i = $(() => {
+      const l = e.value.style.chart.layout.donut.strokeWidth / 512, r = m.value.width * l;
+      return r > e.value.style.chart.layout.donut.strokeWidth ? e.value.style.chart.layout.donut.strokeWidth : r;
+    }), d = $(() => P.dataset.map((l, r) => ({
+      name: l.name,
+      color: re(l.color) || ke.value[r] || K[r] || K[r % K.length],
+      value: l.values.reduce((o, f) => o + f, 0),
+      absoluteValues: l.values,
+      comment: l.comment || ""
+    }))), z = w(d.value);
+    ct(() => d.value, (l) => z.value = l);
+    function oe() {
+      return d.value.map((l) => ({
+        name: l.name,
+        color: l.color,
+        value: l.value
+      }));
+    }
+    const V = w([]), E = w(null), D = w(null), X = w(!1);
+    function ie(l) {
+      const r = d.value.find((g, _) => _ === l);
+      let f = z.value.find((g, _) => _ === l).value;
+      if (V.value.includes(l)) {
+        let _ = function() {
+          f > g ? (cancelAnimationFrame(E.value), z.value = z.value.map((L, he) => l === he ? {
+            ...L,
+            value: g
+          } : L), X.value = !1) : (X.value = !0, f += g * 0.025, z.value = z.value.map((L, he) => l === he ? {
+            ...L,
+            value: f
+          } : L), E.value = requestAnimationFrame(_));
+        };
+        V.value = V.value.filter((L) => L !== l);
+        const g = r.value;
+        _();
+      } else if (V.value.length < d.value.length - 1) {
+        let g = function() {
+          f < 0.1 ? (cancelAnimationFrame(D.value), V.value.push(l), z.value = z.value.map((_, L) => l === L ? {
+            ..._,
+            value: 0
+          } : _), X.value = !1) : (X.value = !0, f /= 1.1, z.value = z.value.map((_, L) => l === L ? {
+            ..._,
+            value: f
+          } : _), D.value = requestAnimationFrame(g));
+        };
+        g();
+      }
+      be("selectLegend", B.value.map((g) => ({
+        name: g.name,
+        color: g.color,
+        value: g.value
+      })));
+    }
+    const B = $(() => (z.value.forEach((l, r) => {
+      if ([null, void 0].includes(l.values))
+        return {
+          ...l,
+          values: []
+        };
+    }), z.value.map((l, r) => ({
+      ...l,
+      seriesIndex: r
+    })).filter((l, r) => !V.value.includes(r)))), Le = $(() => P.dataset.map((l, r) => ({
+      name: l.name,
+      color: re(l.color) || ke.value[r] || K[r] || K[r % K.length],
+      value: (l.values || []).reduce((o, f) => o + f, 0),
+      shape: "circle"
+    })).map((l, r) => ({
+      ...l,
+      proportion: l.value / P.dataset.map((o) => (o.values || []).reduce((f, g) => f + g, 0)).reduce((o, f) => o + f, 0),
+      opacity: V.value.includes(r) ? 0.5 : 1,
+      segregate: () => ie(r),
+      isSegregated: V.value.includes(r)
+    }))), De = $(() => ({
+      cy: "donut-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" : ""
+    })), Y = $(() => {
+      const l = Math.min(m.value.width / 3, m.value.height / 3);
+      return l < 55 ? 55 : l;
+    }), Z = $(() => ze({ series: B.value }, m.value.width / 2, m.value.height / 2, Y.value, Y.value, 1.99999, 2, 1, 360, 105.25, i.value));
+    function te(l) {
+      return l.proportion * 100 > e.value.style.chart.layout.labels.dataLabels.hideUnderValue;
+    }
+    function ve(l, r) {
+      return isNaN(l.value / ce(r)) ? 0 : (l.value / ce(r) * 100).toFixed(0) + "%";
+    }
+    function ce(l) {
+      return [...l].map((r) => r.value).reduce((r, o) => r + o, 0);
+    }
+    const j = $(() => B.value.map((l) => l.value).reduce((l, r) => l + r, 0)), Se = $(() => j.value / B.value.length), de = w(null);
+    function Ve({ datapoint: l, relativeIndex: r, seriesIndex: o, show: f = !1 }) {
+      de.value = { datapoint: l, seriesIndex: o, config: e.value, series: d.value }, M.value = f, U.value = r;
+      let g = "";
+      const _ = e.value.style.chart.tooltip.customFormat;
+      We(_) && ft(() => _({
+        seriesIndex: o,
+        datapoint: l,
+        series: d.value,
+        config: e.value
+      })) ? W.value = _({
+        seriesIndex: o,
+        datapoint: l,
+        series: d.value,
+        config: e.value
+      }) : (g += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${l.name}</div>`, g += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${l.color}"/></svg>`, e.value.style.chart.tooltip.showValue && (g += `<b>${le({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: l.value, s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.style.chart.tooltip.roundingValue })}</b>`), e.value.style.chart.tooltip.showPercentage && (e.value.style.chart.tooltip.showValue ? g += `<span>(${(l.proportion * 100).toFixed(e.value.style.chart.tooltip.roundingPercentage)}%)</span></div>` : g += `<b>${(l.proportion * 100).toFixed(e.value.style.chart.tooltip.roundingPercentage)}%</b></div>`), e.value.style.chart.comments.showInTooltip && l.comment && (g += `<div class="vue-data-ui-tooltip-comment" style="background:${l.color}20; padding: 6px; margin-bottom: 6px; margin-top:6px; border-left: 1px solid ${l.color}">${l.comment}</div>`), W.value = `<div>${g}</div>`);
+    }
+    function ue(l) {
+      return e.value.useBlurOnHover && ![null, void 0].includes(U.value) && U.value !== l ? `url(#blur_${k.value})` : "";
+    }
+    const G = $(() => {
+      const l = B.value.map((o) => ({
+        name: o.name,
+        color: o.color
+      })), r = B.value.map((o) => o.value);
+      return { head: l, body: r };
+    });
+    function Fe() {
+      je(() => {
+        const l = G.value.head.map((f, g) => [[
+          f.name
+        ], [G.value.body[g]], [isNaN(G.value.body[g] / j.value) ? "-" : G.value.body[g] / j.value * 100]]), r = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(l), o = et(r);
+        tt({ csvContent: o, title: e.value.style.chart.title.text || "vue-ui-donut" });
+      });
+    }
+    const se = $(() => {
+      const l = [
+        ' <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>',
+        le({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: j.value, s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.table.td.roundingValue }),
+        "100%"
+      ], r = G.value.head.map((g, _) => {
+        const L = le({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: G.value.body[_], s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.table.td.roundingValue });
+        return [
+          {
+            color: g.color,
+            name: g.name
+          },
+          L,
+          isNaN(G.value.body[_] / j.value) ? "-" : (G.value.body[_] / j.value * 100).toFixed(e.value.table.td.roundingPercentage) + "%"
+        ];
+      }), o = {
+        th: {
+          backgroundColor: e.value.table.th.backgroundColor,
+          color: e.value.table.th.color,
+          outline: e.value.table.th.outline
+        },
+        td: {
+          backgroundColor: e.value.table.td.backgroundColor,
+          color: e.value.table.td.color,
+          outline: e.value.table.td.outline
+        },
+        breakpoint: e.value.table.responsiveBreakpoint
+      };
+      return {
+        colNames: [
+          e.value.table.columnNames.series,
+          e.value.table.columnNames.value,
+          e.value.table.columnNames.percentage
+        ],
+        head: l,
+        body: r,
+        config: o
+      };
+    }), q = w(!1);
+    function Ee(l) {
+      q.value = l, me.value += 1;
+    }
+    const _e = $(() => /^((?!chrome|android).)*safari/i.test(navigator.userAgent));
+    function s(l) {
+      return l.toFixed(e.value.style.chart.legend.roundingPercentage).split("").map((r) => "-").join("");
+    }
+    function h(l, r) {
+      be("selectDatapoint", { datapoint: l, index: r });
+    }
+    function a() {
+      I.value.showTable = !I.value.showTable;
+    }
+    function y() {
+      I.value.dataLabels.show = !I.value.dataLabels.show;
+    }
+    function v() {
+      I.value.showTooltip = !I.value.showTooltip;
+    }
+    return Pe({
+      getData: oe,
+      generatePdf: Ce,
+      generateCsv: Fe,
+      generateImage: xe,
+      toggleTable: a,
+      toggleLabels: y,
+      toggleTooltip: v
+    }), (l, r) => (u(), n("div", {
+      ref_key: "donutChart",
+      ref: C,
+      class: R(`vue-ui-donut ${q.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      style: H(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height:100%;" : ""} text-align:center;${e.value.style.chart.title.text ? "" : "padding-top:36px"};background:${e.value.style.chart.backgroundColor}`),
+      id: `donut__${k.value}`
+    }, [
+      N(l.$slots, "userConfig", {}, void 0, !0),
+      e.value.style.chart.title.text ? (u(), n("div", {
+        key: 0,
+        ref_key: "chartTitle",
+        ref: $e,
+        style: H(`width:100%;background:${e.value.style.chart.backgroundColor};padding-bottom:24px`)
+      }, [
+        we(at, {
+          config: {
+            title: {
+              cy: "donut-div-title",
+              ...e.value.style.chart.title
+            },
+            subtitle: {
+              cy: "donut-div-subtitle",
+              ...e.value.style.chart.title.subtitle
+            }
+          }
+        }, null, 8, ["config"])
+      ], 4)) : p("", !0),
+      e.value.userOptions.show && J.value ? (u(), ee(ot, {
+        ref_key: "details",
+        ref: pe,
+        key: `user_option_${me.value}`,
+        backgroundColor: e.value.style.chart.backgroundColor,
+        color: e.value.style.chart.color,
+        isPrinting: c(t),
+        isImaging: c(Ie),
+        uid: k.value,
+        hasTooltip: e.value.style.chart.tooltip.show && e.value.userOptions.buttons.tooltip,
+        hasPdf: e.value.userOptions.buttons.pdf,
+        hasImg: e.value.userOptions.buttons.img,
+        hasXls: e.value.userOptions.buttons.csv,
+        hasTable: e.value.userOptions.buttons.table,
+        hasLabel: e.value.userOptions.buttons.labels,
+        hasFullscreen: e.value.userOptions.buttons.fullscreen,
+        isFullscreen: q.value,
+        chartElement: C.value,
+        isTooltip: I.value.showTooltip,
+        titles: { ...e.value.userOptions.buttonTitles },
+        onToggleFullscreen: Ee,
+        onGeneratePdf: c(Ce),
+        onGenerateCsv: Fe,
+        onGenerateImage: c(xe),
+        onToggleTable: a,
+        onToggleLabels: y,
+        onToggleTooltip: v
+      }, Ue({ _: 2 }, [
+        l.$slots.optionTooltip ? {
+          name: "optionTooltip",
+          fn: F(() => [
+            N(l.$slots, "optionTooltip", {}, void 0, !0)
+          ]),
+          key: "0"
+        } : void 0,
+        l.$slots.optionPdf ? {
+          name: "optionPdf",
+          fn: F(() => [
+            N(l.$slots, "optionPdf", {}, void 0, !0)
+          ]),
+          key: "1"
+        } : void 0,
+        l.$slots.optionCsv ? {
+          name: "optionCsv",
+          fn: F(() => [
+            N(l.$slots, "optionCsv", {}, void 0, !0)
+          ]),
+          key: "2"
+        } : void 0,
+        l.$slots.optionImg ? {
+          name: "optionImg",
+          fn: F(() => [
+            N(l.$slots, "optionImg", {}, void 0, !0)
+          ]),
+          key: "3"
+        } : void 0,
+        l.$slots.optionTable ? {
+          name: "optionTable",
+          fn: F(() => [
+            N(l.$slots, "optionTable", {}, void 0, !0)
+          ]),
+          key: "4"
+        } : void 0,
+        l.$slots.optionLabels ? {
+          name: "optionLabels",
+          fn: F(() => [
+            N(l.$slots, "optionLabels", {}, void 0, !0)
+          ]),
+          key: "5"
+        } : void 0,
+        l.$slots.optionFullscreen ? {
+          name: "optionFullscreen",
+          fn: F(({ toggleFullscreen: o, isFullscreen: f }) => [
+            N(l.$slots, "optionFullscreen", ye(fe({ toggleFullscreen: o, isFullscreen: f })), void 0, !0)
+          ]),
+          key: "6"
+        } : void 0
+      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasLabel", "hasFullscreen", "isFullscreen", "chartElement", "isTooltip", "titles", "onGeneratePdf", "onGenerateImage"])) : p("", !0),
+      J.value ? (u(), n("svg", {
+        key: 2,
+        xmlns: c(Qe),
+        class: R({ "vue-data-ui-fullscreen--on": q.value, "vue-data-ui-fulscreen--off": !q.value }),
+        viewBox: `0 0 ${m.value.width <= 0 ? 10 : m.value.width} ${m.value.height <= 0 ? 10 : m.value.height}`,
+        style: H(`max-width:100%; overflow: visible; background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color}`)
+      }, [
+        b("defs", null, [
+          e.value.style.chart.useGradient ? (u(), n("radialGradient", {
+            key: 0,
+            id: `gradient_${k.value}`
+          }, [
+            b("stop", {
+              offset: "0%",
+              "stop-color": `${c(re)(e.value.style.chart.backgroundColor)}00`
+            }, null, 8, Ct),
+            b("stop", {
+              offset: "77%",
+              "stop-color": "#FFFFFF" + c(Ne)[e.value.style.chart.gradientIntensity]
+            }, null, 8, Lt),
+            b("stop", {
+              offset: "100%",
+              "stop-color": `${c(re)(e.value.style.chart.backgroundColor)}00`
+            }, null, 8, St)
+          ], 8, $t)) : p("", !0)
+        ]),
+        b("defs", null, [
+          b("filter", {
+            id: `blur_${k.value}`,
+            x: "-50%",
+            y: "-50%",
+            width: "200%",
+            height: "200%"
+          }, [
+            b("feGaussianBlur", {
+              in: "SourceGraphic",
+              stdDeviation: 2,
+              id: `blur_std_${k.value}`
+            }, null, 8, zt),
+            Nt
+          ], 8, Ft),
+          b("filter", {
+            id: `shadow_${k.value}`,
+            "color-interpolation-filters": "sRGB"
+          }, [
+            b("feDropShadow", {
+              dx: "0",
+              dy: "0",
+              stdDeviation: "10",
+              "flood-opacity": "0.5",
+              "flood-color": e.value.style.chart.layout.donut.shadowColor
+            }, null, 8, Tt)
+          ], 8, At)
+        ]),
+        (u(!0), n(A, null, T(Z.value, (o, f) => (u(), n("g", null, [
+          te(o) && I.value.dataLabels.show ? (u(), n("path", {
+            key: 0,
+            d: c(Ge)(o, { x: m.value.width / 2, y: m.value.height / 2 }, 16, 16, !1, !1, i.value),
+            stroke: o.color,
+            "stroke-width": "1",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            fill: "none",
+            filter: ue(f)
+          }, null, 8, Pt)) : p("", !0)
+        ]))), 256)),
+        b("circle", {
+          cx: m.value.width / 2,
+          cy: m.value.height / 2,
+          r: Y.value <= 0 ? 10 : Y.value,
+          fill: e.value.style.chart.backgroundColor,
+          filter: e.value.style.chart.layout.donut.useShadow ? `url(#shadow_${k.value})` : ""
+        }, null, 8, Ot),
+        (u(!0), n(A, null, T(Z.value, (o, f) => (u(), n("path", {
+          stroke: e.value.style.chart.backgroundColor,
+          d: o.arcSlice,
+          fill: "#FFFFFF"
+        }, null, 8, It))), 256)),
+        (u(!0), n(A, null, T(Z.value, (o, f) => (u(), n("path", {
+          class: "vue-ui-donut-arc-path",
+          d: o.arcSlice,
+          fill: `${o.color}CC`,
+          stroke: e.value.style.chart.backgroundColor,
+          "stroke-width": e.value.style.chart.layout.donut.borderWidth,
+          filter: ue(f)
+        }, null, 8, Dt))), 256)),
+        e.value.style.chart.useGradient ? (u(), n("circle", {
+          key: 0,
+          cx: m.value.width / 2,
+          cy: m.value.height / 2,
+          r: (
+            /* This might require adjustments */
+            Y.value <= 0 ? 10 : Y.value
+          ),
+          fill: `url(#gradient_${k.value})`
+        }, null, 8, Vt)) : p("", !0),
+        (u(!0), n(A, null, T(Z.value, (o, f) => (u(), n("path", {
+          "data-cy-donut-trap": "",
+          d: o.arcSlice,
+          fill: U.value === f ? "rgba(0,0,0,0.1)" : "transparent",
+          onMouseenter: (g) => Ve({
+            datapoint: o,
+            relativeIndex: f,
+            seriesIndex: o.seriesIndex,
+            show: !0
+          }),
+          onMouseleave: r[0] || (r[0] = (g) => {
+            M.value = !1, U.value = null;
+          }),
+          onClick: (g) => h(o, f)
+        }, null, 40, Et))), 256)),
+        e.value.style.chart.layout.labels.hollow.show ? (u(), n("circle", {
+          key: 1,
+          cx: m.value.width / 2,
+          cy: m.value.height / 2,
+          r: (
+            /* This might require adjustments */
+            Y.value - i.value <= 0 ? 10 : Y.value - i.value
+          ),
+          fill: e.value.style.chart.backgroundColor
+        }, null, 8, Mt)) : p("", !0),
+        e.value.style.chart.layout.labels.hollow.total.show ? (u(), n("text", {
+          key: 2,
+          "text-anchor": "middle",
+          x: m.value.width / 2,
+          y: m.value.height / 2 - (e.value.style.chart.layout.labels.hollow.average.show ? e.value.style.chart.layout.labels.hollow.total.fontSize : 0) + e.value.style.chart.layout.labels.hollow.total.offsetY,
+          fill: e.value.style.chart.layout.labels.hollow.total.color,
+          "font-size": e.value.style.chart.layout.labels.hollow.total.fontSize,
+          style: H(`font-weight:${e.value.style.chart.layout.labels.hollow.total.bold ? "bold" : ""}`)
+        }, x(e.value.style.chart.layout.labels.hollow.total.text), 13, Gt)) : p("", !0),
+        e.value.style.chart.layout.labels.hollow.total.show ? (u(), n("text", {
+          key: 3,
+          "text-anchor": "middle",
+          x: m.value.width / 2,
+          y: m.value.height / 2 + e.value.style.chart.layout.labels.hollow.total.fontSize - (e.value.style.chart.layout.labels.hollow.average.show ? e.value.style.chart.layout.labels.hollow.total.fontSize : 0) + e.value.style.chart.layout.labels.hollow.total.value.offsetY,
+          fill: e.value.style.chart.layout.labels.hollow.total.value.color,
+          "font-size": e.value.style.chart.layout.labels.hollow.total.value.fontSize,
+          style: H(`font-weight:${e.value.style.chart.layout.labels.hollow.total.value.bold ? "bold" : ""}`)
+        }, x(c(le)({
+          p: e.value.style.chart.layout.labels.hollow.total.value.prefix,
+          v: j.value,
+          s: e.value.style.chart.layout.labels.hollow.total.value.suffix
+        })), 13, Wt)) : p("", !0),
+        e.value.style.chart.layout.labels.hollow.average.show ? (u(), n("text", {
+          key: 4,
+          "text-anchor": "middle",
+          x: m.value.width / 2,
+          y: m.value.height / 2 + (e.value.style.chart.layout.labels.hollow.total.show ? e.value.style.chart.layout.labels.hollow.average.fontSize : 0) + e.value.style.chart.layout.labels.hollow.average.offsetY,
+          fill: e.value.style.chart.layout.labels.hollow.average.color,
+          "font-size": e.value.style.chart.layout.labels.hollow.average.fontSize,
+          style: H(`font-weight:${e.value.style.chart.layout.labels.hollow.average.bold ? "bold" : ""}`)
+        }, x(e.value.style.chart.layout.labels.hollow.average.text), 13, Ht)) : p("", !0),
+        e.value.style.chart.layout.labels.hollow.average.show ? (u(), n("text", {
+          key: 5,
+          "text-anchor": "middle",
+          x: m.value.width / 2,
+          y: m.value.height / 2 + (e.value.style.chart.layout.labels.hollow.total.show ? e.value.style.chart.layout.labels.hollow.average.fontSize : 0) + e.value.style.chart.layout.labels.hollow.average.fontSize + e.value.style.chart.layout.labels.hollow.average.value.offsetY,
+          fill: e.value.style.chart.layout.labels.hollow.average.value.color,
+          "font-size": e.value.style.chart.layout.labels.hollow.average.value.fontSize,
+          style: H(`font-weight:${e.value.style.chart.layout.labels.hollow.average.value.bold ? "bold" : ""}`)
+        }, x(X.value ? "--" : c(le)({
+          p: e.value.style.chart.layout.labels.hollow.average.value.prefix,
+          v: Se.value,
+          s: e.value.style.chart.layout.labels.hollow.average.value.suffix,
+          r: e.value.style.chart.layout.labels.hollow.average.value.rounding
+        })), 13, Bt)) : p("", !0),
+        (u(!0), n(A, null, T(Z.value, (o, f) => (u(), n("g", {
+          filter: ue(f),
+          class: R({ animated: e.value.useCssAnimation })
+        }, [
+          e.value.style.chart.layout.labels.dataLabels.useLabelSlots ? (u(), n("g", Ut, [
+            (u(), n("foreignObject", {
+              x: c(S)(o, !0).anchor === "end" ? c(S)(o).x - 120 : c(S)(o, !0).anchor === "middle" ? c(S)(o).x - 60 : c(S)(o).x,
+              y: c(ne)(o) - (_e.value ? 20 : 0),
+              width: "120",
+              height: "60",
+              style: { overflow: "visible" }
+            }, [
+              b("div", null, [
+                N(l.$slots, "dataLabel", ye(fe({
+                  datapoint: o,
+                  isBlur: !e.value.useBlurOnHover || [null, void 0].includes(U.value) || U.value === f,
+                  isSafari: _e.value,
+                  isVisible: te(o) && I.value.dataLabels.show,
+                  textAlign: c(S)(o, !0, 16, !0).anchor,
+                  flexAlign: c(S)(o, !0, 16).anchor,
+                  percentage: ve(o, Z.value)
+                })), void 0, !0)
+              ])
+            ], 8, jt))
+          ])) : (u(), n("g", Xt, [
+            te(o) && I.value.dataLabels.show ? (u(), n("circle", {
+              key: 0,
+              cx: c(S)(o).x,
+              cy: c(ne)(o) - 3.5,
+              fill: o.color,
+              r: 3,
+              filter: !e.value.useBlurOnHover || [null, void 0].includes(U.value) || U.value === f ? "" : `url(#blur_${k.value})`,
+              onClick: (g) => h(o, f)
+            }, null, 8, Yt)) : p("", !0),
+            te(o) && I.value.dataLabels.show ? (u(), n("text", {
+              key: 1,
+              "text-anchor": c(S)(o, !0, 12).anchor,
+              x: c(S)(o, !0, 12).x,
+              y: c(ne)(o),
+              fill: e.value.style.chart.layout.labels.percentage.color,
+              "font-size": e.value.style.chart.layout.labels.percentage.fontSize,
+              style: H(`font-weight:${e.value.style.chart.layout.labels.percentage.bold ? "bold" : ""}`),
+              onClick: (g) => h(o, f)
+            }, x(ve(o, Z.value)) + " " + x(e.value.style.chart.layout.labels.value.show ? `(${c(le)({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: o.value, s: e.value.style.chart.layout.labels.dataLabels.suffix, rounding: e.value.style.chart.layout.labels.value.rounding })})` : ""), 13, qt)) : p("", !0),
+            te(o) && I.value.dataLabels.show ? (u(), n("text", {
+              key: 2,
+              "text-anchor": c(S)(o).anchor,
+              x: c(S)(o, !0, 12).x,
+              y: c(ne)(o) + e.value.style.chart.layout.labels.percentage.fontSize,
+              fill: e.value.style.chart.layout.labels.name.color,
+              "font-size": e.value.style.chart.layout.labels.name.fontSize,
+              style: H(`font-weight:${e.value.style.chart.layout.labels.name.bold ? "bold" : ""}`),
+              onClick: (g) => h(o, f)
+            }, x(o.name), 13, Kt)) : p("", !0)
+          ])),
+          I.value.dataLabels.show && e.value.style.chart.comments.show && o.comment ? (u(), n("g", Jt, [
+            te(o) ? (u(), n("foreignObject", {
+              key: 0,
+              x: e.value.style.chart.comments.offsetX + (c(S)(o, !0).anchor === "end" ? c(S)(o).x - e.value.style.chart.comments.width : c(S)(o, !0).anchor === "middle" ? c(S)(o).x - e.value.style.chart.comments.width / 2 : c(S)(o).x),
+              y: c(ne)(o) + 24 + e.value.style.chart.comments.offsetY,
+              width: e.value.style.chart.comments.width,
+              height: "200",
+              style: { overflow: "visible", "pointer-events": "none" }
+            }, [
+              b("div", null, [
+                N(l.$slots, "plot-comment", {
+                  plot: { ...o, textAlign: c(S)(o, !0, 16, !0).anchor, flexAlign: c(S)(o, !0, 16).anchor }
+                }, void 0, !0)
+              ])
+            ], 8, Qt)) : p("", !0)
+          ])) : p("", !0)
+        ], 10, Rt))), 256)),
+        N(l.$slots, "svg", { svg: m.value }, void 0, !0)
+      ], 14, wt)) : p("", !0),
+      J.value ? p("", !0) : (u(), ee(rt, {
+        key: 3,
+        config: {
+          type: "donut",
+          style: {
+            backgroundColor: e.value.style.chart.backgroundColor,
+            donut: {
+              color: "#CCCCCC",
+              strokeWidth: i.value * 0.8
+            }
+          }
+        }
+      }, null, 8, ["config"])),
+      b("div", {
+        ref_key: "chartLegend",
+        ref: Q
+      }, [
+        e.value.style.chart.legend.show ? (u(), ee(ut, {
+          key: 0,
+          legendSet: Le.value,
+          config: De.value,
+          onClickMarker: r[1] || (r[1] = ({ i: o }) => ie(o))
+        }, {
+          item: F(({ legend: o, index: f }) => [
+            b("div", {
+              onClick: (g) => o.segregate(),
+              style: H(`opacity:${V.value.includes(f) ? 0.5 : 1}`)
+            }, [
+              Ae(x(o.name) + ": " + x(c(le)({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: o.value, s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.style.chart.legend.roundingValue })) + " ", 1),
+              V.value.includes(f) ? (u(), n("span", tl, " ( " + x(s(o.proportion * 100)) + " % ) ", 1)) : (u(), n("span", el, " (" + x(isNaN(o.value / j.value) ? "-" : c(le)({
+                v: X.value ? o.proportion * 100 : o.value / j.value * 100,
+                s: "%",
+                r: e.value.style.chart.legend.roundingPercentage
+              })) + ") ", 1))
+            ], 12, Zt)
+          ]),
+          _: 1
+        }, 8, ["legendSet", "config"])) : p("", !0),
+        N(l.$slots, "legend", { legend: Le.value }, void 0, !0)
+      ], 512),
+      we(mt, {
+        show: I.value.showTooltip && M.value,
+        backgroundColor: e.value.style.chart.tooltip.backgroundColor,
+        color: e.value.style.chart.tooltip.color,
+        fontSize: e.value.style.chart.tooltip.fontSize,
+        borderRadius: e.value.style.chart.tooltip.borderRadius,
+        borderColor: e.value.style.chart.tooltip.borderColor,
+        borderWidth: e.value.style.chart.tooltip.borderWidth,
+        backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
+        parent: C.value,
+        content: W.value,
+        isCustom: c(We)(e.value.style.chart.tooltip.customFormat)
+      }, {
+        "tooltip-before": F(() => [
+          N(l.$slots, "tooltip-before", ye(fe({ ...de.value })), void 0, !0)
+        ]),
+        "tooltip-after": F(() => [
+          N(l.$slots, "tooltip-after", ye(fe({ ...de.value })), void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "parent", "content", "isCustom"]),
+      J.value ? (u(), ee(it, {
+        key: 4,
+        hideDetails: "",
+        config: {
+          open: I.value.showTable,
+          maxHeight: 1e4,
+          body: {
+            backgroundColor: e.value.style.chart.backgroundColor,
+            color: e.value.style.chart.color
+          },
+          head: {
+            backgroundColor: e.value.style.chart.backgroundColor,
+            color: e.value.style.chart.color
+          }
+        }
+      }, {
+        content: F(() => [
+          we(Ze, {
+            colNames: se.value.colNames,
+            head: se.value.head,
+            body: se.value.body,
+            config: se.value.config,
+            title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
+            onClose: r[2] || (r[2] = (o) => I.value.showTable = !1)
+          }, {
+            th: F(({ th: o }) => [
+              b("div", {
+                innerHTML: o,
+                style: { display: "flex", "align-items": "center" }
+              }, null, 8, ll)
+            ]),
+            td: F(({ td: o }) => [
+              Ae(x(o.name || o), 1)
+            ]),
+            _: 1
+          }, 8, ["colNames", "head", "body", "config", "title"])
+        ]),
+        _: 1
+      }, 8, ["config"])) : p("", !0)
+    ], 14, _t));
+  }
+}, ol = /* @__PURE__ */ Xe(al, [["__scopeId", "data-v-a76ecc28"]]), ga = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: ol
+}, Symbol.toStringTag, { value: "Module" })), ul = ["id"], sl = ["xmlns", "viewBox"], nl = ["id"], rl = ["stop-color"], il = ["stop-color"], vl = ["id"], cl = ["stop-color"], dl = ["stop-color"], hl = ["stop-color"], yl = { key: 0 }, fl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], gl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], bl = { key: 0 }, pl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ml = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], xl = ["x", "y", "font-size", "fill", "font-weight"], kl = ["text-anchor", "font-size", "fill", "transform"], _l = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], wl = { key: 1 }, $l = ["cx", "cy", "r", "fill"], Cl = { key: 0 }, Ll = { key: 0 }, Sl = ["d", "stroke"], Fl = ["text-anchor", "x", "y", "fill"], zl = ["cx", "cy", "r", "fill"], Nl = { key: 0 }, Al = ["cx", "cy", "fill"], Tl = { key: 1 }, Pl = ["d", "fill", "stroke"], Ol = { key: 2 }, Il = ["d", "fill", "stroke"], Dl = ["x", "y", "font-size", "fill"], Vl = ["x", "y", "width", "fill", "onClick"], El = ["x", "y", "width", "height", "onMouseenter", "onClick"], Ml = {
+  key: 3,
+  "data-cy-zoom": "",
+  class: "vue-ui-donut-evolution-dialog"
+}, Gl = ["x", "y", "width", "height", "fill"], Wl = ["x1", "y1", "x2", "y2", "stroke"], Hl = ["x1", "y2", "x2", "y1", "stroke"], Bl = ["onKeypress", "cx", "cy", "r"], Rl = ["d", "stroke"], Ul = ["cx", "cy", "r", "fill"], jl = ["d", "fill", "stroke"], Xl = { class: "vue-ui-donut-evolution-focus" }, Yl = ["text-anchor", "x", "y", "fill"], ql = ["cx", "cy", "r", "fill"], Kl = ["cx", "cy", "r", "fill"], Jl = ["x", "y", "fill"], Ql = ["x", "y", "font-size", "fill"], Zl = ["onClick"], ea = { key: 0 }, ta = { key: 1 }, la = { key: 0 }, aa = { key: 1 }, oa = {
+  __name: "vue-ui-donut-evolution",
+  props: {
+    config: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    dataset: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  emits: ["selectLegend"],
+  setup(ae, { expose: Pe, emit: be }) {
+    const P = ae, { vue_ui_donut_evolution: Oe } = st(), J = $(() => !!P.dataset && P.dataset.length), C = w({
+      start: 0,
+      end: Math.max(...P.dataset.map((s) => s.values.length))
+    });
+    function $e() {
+      C.value = {
+        start: 0,
+        end: V.value
+      }, e.value += 1;
+    }
+    Re(() => {
+      Ye(P.dataset) ? ge({
+        componentName: "VueUiDonutEvolution",
+        type: "dataset"
+      }) : P.dataset.length && P.dataset.forEach((s, h) => {
+        qe({
+          datasetObject: s,
+          requiredAttributes: ["name", "values"]
+        }).forEach((a) => {
+          ge({
+            componentName: "VueUiDonutEvolution",
+            type: "datasetSerieAttribute",
+            property: a,
+            index: h
+          });
+        });
+      });
+    });
+    const Q = w(Me()), O = w([]), k = w(null), pe = w(null), M = w(!1), W = w(null), U = w(null), me = w(0), e = w(0), t = $(() => {
+      const s = Te({
+        userConfig: P.config,
+        defaultConfig: Oe
+      });
+      return s.theme ? {
+        ...Te({
+          userConfig: lt.vue_ui_donut_evolution[s.theme] || P.config,
+          defaultConfig: s
+        }),
+        customPalette: Ke[s.theme] || K
+      } : s;
+    }), { isPrinting: Ie, isImaging: Ce, generatePdf: xe, generateImage: ke } = nt({
+      elementId: Q.value,
+      fileName: t.value.style.chart.title.text || "vue-ui-donut-evolution"
+    }), I = $(() => Je(t.value.customPalette)), m = w({
+      showTable: t.value.table.show
+    }), i = $(() => ({
+      top: t.value.style.chart.layout.padding.top,
+      right: t.value.style.chart.layout.padding.right,
+      bottom: t.value.style.chart.layout.padding.bottom,
+      left: t.value.style.chart.layout.padding.left
+    })), d = $(() => {
+      const s = t.value.style.chart.layout.height, h = t.value.style.chart.layout.width, a = s - i.value.top - i.value.bottom, y = h - i.value.left - i.value.right;
+      return {
+        absoluteHeight: s,
+        absoluteWidth: h,
+        centerX: i.value.left + y / 2,
+        centerY: i.value.top + a / 2,
+        height: a,
+        width: y
+      };
+    }), z = $(() => (P.dataset.forEach((s, h) => {
+      [null, void 0].includes(s.name) && ge({
+        componentName: "VueUiDonutEvolution",
+        type: "datasetSerieAttribute",
+        property: "name",
+        index: h
+      }), [null, void 0].includes(s.values) && ge({
+        componentName: "VueUiDonutEvolution",
+        type: "datasetSerieAttribute",
+        property: "values",
+        index: h
+      });
+    }), P.dataset.map((s, h) => ({
+      ...s,
+      values: s.values || [],
+      color: re(s.color) || I.value[h] || K[h] || K[h % K.length],
+      length: (s.values || []).length,
+      uid: Me()
+    })))), oe = $(() => z.value.filter((s) => !O.value.includes(s.uid)).map((s) => ({
+      ...s,
+      values: s.values.filter((h, a) => a >= C.value.start && a <= C.value.end)
+    }))), V = $(() => Math.max(...oe.value.map((s) => s.length))), E = $(() => d.value.width / (C.value.end - C.value.start)), D = $(() => {
+      const s = [];
+      for (let v = 0; v < C.value.end - C.value.start; v += 1) {
+        const l = oe.value.map((_) => _.values[v] ?? null), r = l.filter((_) => [void 0, null].includes(_)).length === l.length, o = l.reduce((_, L) => _ + L, 0), f = l.map((_) => _ / o), g = i.value.left + E.value * v + E.value / 2;
+        s.push({
+          index: v,
+          percentages: f,
+          subtotal: r || o < 0 ? null : o,
+          values: l,
+          x: g
+        });
+      }
+      const h = 0, a = Math.max(...s.map((v) => v.subtotal)), y = s.length === 1 ? a * 2 : a;
+      return s.map((v, l) => {
+        const r = E.value / 2 * 0.7, o = r > d.value.width / 16 ? d.value.width / 16 : r, f = k.value === v.index ? d.value.width / 16 : o, g = s.length > 4 ? r * 2 : r * 2 > E.value / 2 * 0.7 ? E.value / 2 * 0.7 : r * 2, _ = d.value.absoluteHeight - i.value.bottom - d.value.height * v.subtotal / He(h, y, t.value.style.chart.layout.grid.yAxis.dataLabels.steps).max;
+        return {
+          ...v,
+          y: _,
+          radius: o,
+          activeRadius: f,
+          hoverRadius: g,
+          donut: ze({
+            series: oe.value.map((L, he) => ({
+              color: L.color,
+              name: L.name,
+              value: L.values[l] ?? 0
+            }))
+          }, v.x, _, o, o, 1.99999, 2, 1, 360, 105.25, o / 2),
+          donutHover: ze({
+            series: oe.value.map((L, he) => ({
+              color: L.color,
+              name: L.name,
+              value: L.values[l] ?? 0
+            }))
+          }, v.x, _, g, g, 1.99999, 2, 1, 360, 105.25, g / 2),
+          donutFocus: ze({
+            series: oe.value.map((L, he) => ({
+              color: L.color,
+              name: L.name,
+              value: L.values[l] ?? 0
+            }))
+          }, d.value.centerX, d.value.centerY, d.value.height / 3.6, d.value.height / 3.6, 1.99999, 2, 1, 360, 105.25, d.value.height / 6)
+        };
+      });
+    });
+    function X(s) {
+      return `${t.value.style.chart.layout.dataLabels.prefix}${isNaN(s) ? "-" : Number(s.toFixed(t.value.style.chart.layout.dataLabels.rounding)).toLocaleString()}${t.value.style.chart.layout.dataLabels.suffix}`;
+    }
+    const ie = $(() => ({
+      max: Math.max(...D.value.map((s) => s.subtotal)),
+      min: 0
+    })), B = $(() => {
+      const s = D.value.length === 1 ? ie.value.max * 2 : ie.value.max;
+      return He(ie.value.min, s, t.value.style.chart.layout.grid.yAxis.dataLabels.steps);
+    });
+    function Le(s) {
+      return s / B.value.max;
+    }
+    const De = $(() => B.value.ticks.map((s) => ({
+      y: d.value.absoluteHeight - i.value.bottom - d.value.height * Le(s),
+      value: s
+    })));
+    function Y(s, h) {
+      return isNaN(s.value / Be(h, "value")) ? 0 : (s.value / Be(h, "value") * 100).toFixed(0) + "%";
+    }
+    function Z() {
+      M.value || (k.value = null, pe.value = null);
+    }
+    function te(s) {
+      M.value || (k.value = s.index, pe.value = s);
+    }
+    const ve = w(null);
+    function ce(s, h) {
+      s.subtotal && (pe.value = null, k.value = null, M.value = !0, W.value = s, [null, void 0].includes(h) || (ve.value = h));
+    }
+    function j() {
+      W.value = null, M.value = !1, ve.value = null;
+    }
+    const Se = $(() => z.value.map((s, h) => ({
+      name: s.name,
+      value: s.values.reduce((a, y) => a + y, 0),
+      shape: "circle",
+      uid: s.uid,
+      color: s.color
+    })).sort((s, h) => h.value - s.value).map((s) => ({
+      ...s,
+      opacity: O.value.includes(s.uid) ? 0.5 : 1,
+      segregate: () => ue(s.uid),
+      isSegregated: O.value.includes(s.uid)
+    }))), de = $(() => D.value.map((s) => s.subtotal).reduce((s, h) => s + h, 0)), Ve = $(() => ({
+      cy: "donut-div-legend",
+      backgroundColor: t.value.style.chart.legend.backgroundColor,
+      color: t.value.style.chart.legend.color,
+      fontSize: t.value.style.chart.legend.fontSize,
+      paddingBottom: 12,
+      fontWeight: t.value.style.chart.legend.bold ? "bold" : ""
+    }));
+    function ue(s) {
+      if (O.value.includes(s))
+        O.value = O.value.filter((h) => h !== s), be("selectLegend", null);
+      else {
+        if (O.value.length === z.value.length - 1) return;
+        O.value.push(s), be("selectLegend", z.value.find((h) => h.uid === s));
+      }
+      W.value && ce(D.value.find((h, a) => a === ve.value));
+    }
+    const G = $(() => {
+      const s = [""].concat(z.value.filter((v) => !O.value.includes(v.uid)).map((v) => ({
+        name: v.name,
+        color: v.color
+      }))).concat(["Σ"]);
+      let h = [];
+      for (let v = 0; v < V.value; v += 1) {
+        const l = z.value.filter((r) => !O.value.includes(r.uid)).map((r) => r.values[v] ?? 0).reduce((r, o) => r + o, 0);
+        h.push([t.value.style.chart.layout.grid.xAxis.dataLabels.values[v] ?? "-"].concat(z.value.filter((r) => !O.value.includes(r.uid)).map((r) => ({
+          value: r.values[v] ?? 0,
+          percentage: r.values[v] ? r.values[v] / l * 100 : 0
+        }))).concat([`${t.value.style.chart.layout.dataLabels.prefix}${Number(l.toFixed(t.value.table.td.roundingValue))}${t.value.style.chart.layout.dataLabels.suffix}`]));
+      }
+      const a = {
+        th: {
+          backgroundColor: t.value.table.th.backgroundColor,
+          color: t.value.table.th.color,
+          outline: t.value.table.th.outline
+        },
+        td: {
+          backgroundColor: t.value.table.td.backgroundColor,
+          color: t.value.table.td.color,
+          outline: t.value.table.td.outline
+        },
+        breakpoint: t.value.table.responsiveBreakpoint
+      }, y = [
+        t.value.table.columnNames.period
+      ].concat(z.value.filter((v) => !O.value.includes(v.uid)).map((v) => v.name)).concat(t.value.table.columnNames.total);
+      return { head: s, body: h, config: a, colNames: y };
+    });
+    function Fe() {
+      return z.value;
+    }
+    function se() {
+      je(() => {
+        const s = [[t.value.style.chart.title.text], [t.value.style.chart.title.subtitle.text], [""]], h = [...G.value.head.map((l) => l.name ?? l)], a = [...G.value.body.map((l) => l.map((r) => r.value ?? r))], y = s.concat([h]).concat(a), v = et(y);
+        tt({ csvContent: v, title: t.value.style.chart.title.text || "vue-ui-donut-evolution" });
+      });
+    }
+    const q = w(!1);
+    function Ee(s) {
+      q.value = s, me.value += 1;
+    }
+    function _e() {
+      m.value.showTable = !m.value.showTable;
+    }
+    return Pe({
+      getData: Fe,
+      generatePdf: xe,
+      generateCsv: se,
+      generateImage: ke,
+      toggleTable: _e
+    }), (s, h) => (u(), n("div", {
+      ref_key: "donutEvolutionChart",
+      ref: U,
+      class: R(`vue-ui-donut-evolution ${q.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${t.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      style: H(`font-family:${t.value.style.fontFamily};width:100%; text-align:center;${t.value.style.chart.title.text ? "" : "padding-top:36px"};background:${t.value.style.chart.backgroundColor}`),
+      id: Q.value
+    }, [
+      t.value.style.chart.title.text ? (u(), n("div", {
+        key: 0,
+        style: H(`width:100%;background:${t.value.style.chart.backgroundColor};padding-bottom:24px`),
+        onMouseleave: Z
+      }, [
+        we(at, {
+          config: {
+            title: {
+              cy: "donut-evolution-div-title",
+              ...t.value.style.chart.title
+            },
+            subtitle: {
+              cy: "donut-evolution-div-subtitle",
+              ...t.value.style.chart.title.subtitle
+            }
+          }
+        }, null, 8, ["config"])
+      ], 36)) : p("", !0),
+      t.value.userOptions.show && J.value ? (u(), ee(ot, {
+        ref: "details",
+        key: `user_options_${me.value}`,
+        backgroundColor: t.value.style.chart.backgroundColor,
+        color: t.value.style.chart.color,
+        isPrinting: c(Ie),
+        isImaging: c(Ce),
+        uid: Q.value,
+        hasPdf: t.value.userOptions.buttons.pdf,
+        hasImg: t.value.userOptions.buttons.img,
+        hasXls: t.value.userOptions.buttons.csv,
+        hasTable: t.value.userOptions.buttons.table,
+        hasFullscreen: t.value.userOptions.buttons.fullscreen,
+        isFullscreen: q.value,
+        titles: { ...t.value.userOptions.buttonTitles },
+        chartElement: U.value,
+        onToggleFullscreen: Ee,
+        onGeneratePdf: c(xe),
+        onGenerateCsv: se,
+        onGenerateImage: c(ke),
+        onToggleTable: _e
+      }, Ue({ _: 2 }, [
+        s.$slots.optionPdf ? {
+          name: "optionPdf",
+          fn: F(() => [
+            N(s.$slots, "optionPdf", {}, void 0, !0)
+          ]),
+          key: "0"
+        } : void 0,
+        s.$slots.optionCsv ? {
+          name: "optionCsv",
+          fn: F(() => [
+            N(s.$slots, "optionCsv", {}, void 0, !0)
+          ]),
+          key: "1"
+        } : void 0,
+        s.$slots.optionImg ? {
+          name: "optionImg",
+          fn: F(() => [
+            N(s.$slots, "optionImg", {}, void 0, !0)
+          ]),
+          key: "2"
+        } : void 0,
+        s.$slots.optionTable ? {
+          name: "optionTable",
+          fn: F(() => [
+            N(s.$slots, "optionTable", {}, void 0, !0)
+          ]),
+          key: "3"
+        } : void 0,
+        s.$slots.optionFullscreen ? {
+          name: "optionFullscreen",
+          fn: F(({ toggleFullscreen: a, isFullscreen: y }) => [
+            N(s.$slots, "optionFullscreen", ye(fe({ toggleFullscreen: a, isFullscreen: y })), void 0, !0)
+          ]),
+          key: "4"
+        } : void 0
+      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "titles", "chartElement", "onGeneratePdf", "onGenerateImage"])) : p("", !0),
+      J.value ? (u(), n("svg", {
+        key: 2,
+        xmlns: c(Qe),
+        class: R({ "vue-data-ui-fullscreen--on": q.value, "vue-data-ui-fulscreen--off": !q.value }),
+        viewBox: `0 0 ${d.value.absoluteWidth} ${d.value.absoluteHeight}`,
+        style: H(`max-width:100%; overflow: visible; background:${t.value.style.chart.backgroundColor};color:${t.value.style.chart.color}`)
+      }, [
+        b("defs", null, [
+          b("linearGradient", {
+            id: `hover_${Q.value}`,
+            x1: "0%",
+            y1: "0%",
+            x2: "0%",
+            y2: "100%"
+          }, [
+            b("stop", {
+              offset: "0%",
+              "stop-color": `${t.value.style.chart.backgroundColor}${c(Ne)[t.value.style.chart.layout.highlighter.opacity]}`
+            }, null, 8, rl),
+            b("stop", {
+              offset: "100%",
+              "stop-color": `${t.value.style.chart.layout.highlighter.color}${c(Ne)[t.value.style.chart.layout.highlighter.opacity]}`
+            }, null, 8, il)
+          ], 8, nl),
+          b("radialGradient", {
+            id: `focus_${Q.value}`
+          }, [
+            b("stop", {
+              offset: "0%",
+              "stop-color": `${c(re)(t.value.style.chart.backgroundColor)}00`
+            }, null, 8, cl),
+            b("stop", {
+              offset: "77%",
+              "stop-color": "#FFFFFF" + c(Ne)[30]
+            }, null, 8, dl),
+            b("stop", {
+              offset: "100%",
+              "stop-color": `${c(re)(t.value.style.chart.backgroundColor)}00`
+            }, null, 8, hl)
+          ], 8, vl)
+        ]),
+        t.value.style.chart.layout.grid.show ? (u(), n("g", yl, [
+          b("line", {
+            x1: i.value.left,
+            x2: i.value.left,
+            y1: i.value.top,
+            y2: i.value.top + d.value.height,
+            stroke: t.value.style.chart.layout.grid.stroke,
+            "stroke-width": t.value.style.chart.layout.grid.strokeWidth,
+            "stroke-linecap": "round"
+          }, null, 8, fl),
+          b("line", {
+            x1: i.value.left,
+            x2: d.value.absoluteWidth - i.value.right,
+            y1: d.value.absoluteHeight - i.value.bottom,
+            y2: d.value.absoluteHeight - i.value.bottom,
+            stroke: t.value.style.chart.layout.grid.stroke,
+            "stroke-width": t.value.style.chart.layout.grid.strokeWidth,
+            "stroke-linecap": "round"
+          }, null, 8, gl),
+          t.value.style.chart.layout.grid.showVerticalLines ? (u(), n("g", bl, [
+            (u(!0), n(A, null, T(C.value.end - C.value.start, (a, y) => (u(), n("line", {
+              x1: i.value.left + (y + 1) * E.value,
+              x2: i.value.left + (y + 1) * E.value,
+              y1: i.value.top,
+              y2: d.value.absoluteHeight - i.value.bottom,
+              stroke: t.value.style.chart.layout.grid.stroke,
+              "stroke-width": t.value.style.chart.layout.grid.strokeWidth,
+              "stroke-linecap": "round"
+            }, null, 8, pl))), 256))
+          ])) : p("", !0)
+        ])) : p("", !0),
+        t.value.style.chart.layout.grid.yAxis.dataLabels.show ? (u(), n("g", {
+          key: 1,
+          class: R({ "donut-opacity": !0, "donut-behind": k.value !== null || M.value })
+        }, [
+          (u(!0), n(A, null, T(De.value, (a, y) => (u(), n("g", null, [
+            a.value >= B.value.min && a.value <= B.value.max ? (u(), n("line", {
+              key: 0,
+              x1: i.value.left,
+              x2: i.value.left - 5,
+              y1: a.y,
+              y2: a.y,
+              stroke: t.value.style.chart.layout.grid.stroke,
+              "stroke-width": t.value.style.chart.layout.grid.strokeWidth
+            }, null, 8, ml)) : p("", !0),
+            a.value >= B.value.min && a.value <= B.value.max ? (u(), n("text", {
+              key: 1,
+              x: i.value.left - 8 + t.value.style.chart.layout.grid.yAxis.dataLabels.offsetX,
+              y: a.y + t.value.style.chart.layout.grid.yAxis.dataLabels.fontSize / 3,
+              "font-size": t.value.style.chart.layout.grid.yAxis.dataLabels.fontSize,
+              "text-anchor": "end",
+              fill: t.value.style.chart.layout.grid.yAxis.dataLabels.color,
+              "font-weight": t.value.style.chart.layout.grid.yAxis.dataLabels.bold ? "bold" : "normal"
+            }, x(t.value.style.chart.layout.dataLabels.prefix) + " " + x(c(gt)(a.value) ? a.value.toFixed(t.value.style.chart.layout.grid.yAxis.dataLabels.roundingValue) : "") + " " + x(t.value.style.chart.layout.dataLabels.suffix), 9, xl)) : p("", !0)
+          ]))), 256))
+        ], 2)) : p("", !0),
+        t.value.style.chart.layout.grid.xAxis.dataLabels.show ? (u(), n("g", {
+          key: 2,
+          class: R({ "donut-opacity": !0, "donut-behind": M.value })
+        }, [
+          (u(!0), n(A, null, T(C.value.end - C.value.start, (a, y) => (u(), n("g", null, [
+            t.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast && (y === 0 || y === V.value - 1) || !t.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast ? (u(), n("text", {
+              key: 0,
+              "text-anchor": t.value.style.chart.layout.grid.xAxis.dataLabels.rotation > 0 ? "start" : t.value.style.chart.layout.grid.xAxis.dataLabels.rotation < 0 ? "end" : "middle",
+              "font-size": t.value.style.chart.layout.grid.xAxis.dataLabels.fontSize,
+              fill: t.value.style.chart.layout.grid.xAxis.dataLabels.color,
+              transform: `translate(${i.value.left + E.value * y + E.value / 2}, ${t.value.style.chart.layout.grid.xAxis.dataLabels.offsetY + d.value.absoluteHeight - i.value.bottom + t.value.style.chart.layout.grid.xAxis.dataLabels.fontSize * 2}), rotate(${t.value.style.chart.layout.grid.xAxis.dataLabels.rotation})`
+            }, x(t.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(y) + Number(C.value.start)] ?? ""), 9, kl)) : p("", !0)
+          ]))), 256))
+        ], 2)) : p("", !0),
+        (u(!0), n(A, null, T(D.value, (a, y) => (u(), n("g", null, [
+          t.value.style.chart.layout.line.show && y < D.value.length - 1 && ![a.subtotal, D.value[y + 1].subtotal].includes(null) ? (u(), n("line", {
+            key: 0,
+            class: R({ "donut-opacity": !0, "donut-behind": k.value !== null || M.value }),
+            x1: a.x,
+            y1: a.y,
+            x2: D.value[y + 1].x,
+            y2: D.value[y + 1].y,
+            stroke: t.value.style.chart.layout.line.stroke,
+            "stroke-width": t.value.style.chart.layout.line.strokeWidth,
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round"
+          }, null, 10, _l)) : p("", !0),
+          a.subtotal !== null ? (u(), n("g", wl, [
+            a.subtotal ? (u(), n("circle", {
+              key: 0,
+              cx: a.x,
+              cy: a.y,
+              r: a.activeRadius,
+              fill: t.value.style.chart.backgroundColor
+            }, null, 8, $l)) : p("", !0)
+          ])) : p("", !0)
+        ]))), 256)),
+        (u(!0), n(A, null, T(D.value, (a, y) => (u(), n("g", {
+          class: R({ "donut-opacity": !0, "donut-behind": y !== k.value && k.value !== null || M.value })
+        }, [
+          a.subtotal ? (u(), n("g", Cl, [
+            k.value !== null && k.value === y ? (u(), n("g", Ll, [
+              (u(!0), n(A, null, T(a.donutHover, (v) => (u(), n("g", null, [
+                b("path", {
+                  d: c(Ge)(v, { x: v.center.endX, y: v.center.endY }, 12, 12, { x: a.x, y: a.y }, !0),
+                  stroke: v.color,
+                  "stroke-width": "1",
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round",
+                  fill: "none"
+                }, null, 8, Sl)
+              ]))), 256)),
+              (u(!0), n(A, null, T(a.donutHover, (v, l) => (u(), n("g", null, [
+                b("text", {
+                  "data-cy-hover-label": "",
+                  "text-anchor": c(S)(v, !0, 0).anchor,
+                  x: c(S)(v, !0, 3).x,
+                  y: c(ne)(v),
+                  fill: t.value.style.chart.layout.grid.yAxis.dataLabels.color,
+                  "font-size": 8,
+                  "font-weight": "bold"
+                }, x(v.name) + ": " + x(Y(v, a.donut)) + " (" + x(v.value === null ? "-" : X(v.value)) + ") ", 9, Fl)
+              ]))), 256)),
+              b("g", null, [
+                b("circle", {
+                  cx: a.x,
+                  cy: a.y,
+                  r: a.hoverRadius,
+                  fill: t.value.style.chart.backgroundColor
+                }, null, 8, zl)
+              ])
+            ])) : p("", !0)
+          ])) : p("", !0)
+        ], 2))), 256)),
+        (u(!0), n(A, null, T(D.value, (a, y) => (u(), n("g", {
+          class: R({ "donut-opacity": !0, "donut-behind": y !== k.value && k.value !== null || M.value })
+        }, [
+          a.subtotal !== null ? (u(), n("g", Nl, [
+            a.subtotal === 0 ? (u(), n("circle", {
+              key: 0,
+              cx: a.x,
+              cy: a.y,
+              r: 3,
+              fill: t.value.style.chart.color
+            }, null, 8, Al)) : k.value !== null && k.value === y ? (u(), n("g", Tl, [
+              (u(!0), n(A, null, T(a.donutHover, (v, l) => (u(), n("path", {
+                d: v.arcSlice,
+                fill: `${v.color}`,
+                "stroke-width": 1,
+                stroke: t.value.style.chart.backgroundColor
+              }, null, 8, Pl))), 256))
+            ])) : (u(), n("g", Ol, [
+              (u(!0), n(A, null, T(a.donut, (v, l) => (u(), n("path", {
+                d: v.arcSlice,
+                fill: `${v.color}`,
+                "stroke-width": 0.5,
+                stroke: t.value.style.chart.backgroundColor
+              }, null, 8, Il))), 256))
+            ]))
+          ])) : p("", !0)
+        ], 2))), 256)),
+        (u(!0), n(A, null, T(D.value, (a, y) => (u(), n("g", {
+          class: R({ "donut-opacity": !0, "donut-behind": y !== k.value && k.value !== null || M.value })
+        }, [
+          a.subtotal !== null && t.value.style.chart.layout.dataLabels.show ? (u(), n("text", {
+            key: 0,
+            "text-anchor": "middle",
+            x: a.x,
+            y: k.value === a.index && a.subtotal ? a.y + t.value.style.chart.layout.dataLabels.fontSize / 3 : a.y - a.radius - t.value.style.chart.layout.dataLabels.fontSize + t.value.style.chart.layout.dataLabels.offsetY,
+            "font-size": t.value.style.chart.layout.dataLabels.fontSize,
+            "font-weight": "bold",
+            fill: t.value.style.chart.layout.dataLabels.color
+          }, x(X(a.subtotal)), 9, Dl)) : p("", !0)
+        ], 2))), 256)),
+        (u(!0), n(A, null, T(D.value, (a, y) => (u(), n("rect", {
+          x: i.value.left + y * E.value,
+          y: d.value.absoluteHeight - i.value.bottom - 10,
+          width: E.value,
+          height: 10,
+          fill: k.value === a.index ? `url(#hover_${Q.value})` : "transparent",
+          onClick: (v) => ce(a, y),
+          class: R({ "donut-hover": k.value === a.index && a.subtotal })
+        }, null, 10, Vl))), 256)),
+        (u(!0), n(A, null, T(D.value, (a, y) => (u(), n("rect", {
+          "data-cy-trap": "",
+          x: i.value.left + y * E.value,
+          y: i.value.top,
+          width: E.value,
+          height: d.value.height,
+          fill: "transparent",
+          onMouseenter: (v) => te(a),
+          onMouseleave: Z,
+          onClick: (v) => ce(a, y),
+          class: R({ "donut-hover": k.value === a.index && a.subtotal })
+        }, null, 42, El))), 256)),
+        M.value ? (u(), n("g", Ml, [
+          b("rect", {
+            rx: 4,
+            x: i.value.left,
+            y: i.value.top,
+            width: d.value.width,
+            height: d.value.height,
+            fill: t.value.style.chart.backgroundColor,
+            style: { filter: "drop-shadow(0 12px 12px rgba(0,0,0,0.3))" }
+          }, null, 8, Gl),
+          b("line", {
+            "data-html2canvas-ignore": "",
+            x1: d.value.absoluteWidth - i.value.right - 15,
+            y1: i.value.top + 5,
+            x2: d.value.absoluteWidth - i.value.right - 4,
+            y2: i.value.top + 15.5,
+            "stroke-linecap": "round",
+            stroke: t.value.style.chart.color,
+            "stroke-width": "1.5"
+          }, null, 8, Wl),
+          b("line", {
+            "data-html2canvas-ignore": "",
+            x1: d.value.absoluteWidth - i.value.right - 15,
+            y2: i.value.top + 5,
+            x2: d.value.absoluteWidth - i.value.right - 4,
+            y1: i.value.top + 15.5,
+            "stroke-linecap": "round",
+            stroke: t.value.style.chart.color,
+            "stroke-width": "1.5"
+          }, null, 8, Hl),
+          b("circle", {
+            "data-cy-close": "",
+            onClick: j,
+            onKeypress: yt(j, ["enter"]),
+            cx: d.value.absoluteWidth - i.value.right - d.value.width / 40,
+            cy: i.value.top + d.value.height / 30,
+            r: d.value.height / 12,
+            fill: "transparent",
+            style: { cursor: "pointer" },
+            tabindex: "0"
+          }, null, 40, Bl),
+          (u(!0), n(A, null, T(W.value.donutFocus, (a) => (u(), n("g", null, [
+            b("path", {
+              "data-cy-zoom-donut": "",
+              d: c(Ge)(a, { x: d.value.centerX, y: d.value.centerY }, 12, 12, !1, !1, 1),
+              stroke: a.color,
+              "stroke-width": "1",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round",
+              fill: "none",
+              class: "vue-ui-donut-evolution-focus"
+            }, null, 8, Rl)
+          ]))), 256)),
+          b("circle", {
+            cx: i.value.left + d.value.width / 2,
+            cy: i.value.top + d.value.height / 2,
+            r: d.value.height / 7,
+            fill: t.value.style.chart.backgroundColor
+          }, null, 8, Ul),
+          (u(!0), n(A, null, T(W.value.donutFocus, (a, y) => (u(), n("path", {
+            d: a.arcSlice,
+            fill: `${a.color}`,
+            "stroke-width": 1,
+            stroke: t.value.style.chart.backgroundColor,
+            class: "vue-ui-donut-evolution-focus"
+          }, null, 8, jl))), 256)),
+          (u(!0), n(A, null, T(W.value.donutFocus, (a, y) => (u(), n("g", Xl, [
+            b("text", {
+              "text-anchor": c(S)(a, !0, 20).anchor,
+              x: c(S)(a, !0, 10).x,
+              y: c(ne)(a),
+              fill: t.value.style.chart.layout.grid.yAxis.dataLabels.color,
+              "font-size": 10,
+              "font-weight": "bold"
+            }, x(a.name) + ": " + x(Y(a, W.value.donutFocus)) + " (" + x(a.value === null ? "-" : X(a.value)) + ") ", 9, Yl)
+          ]))), 256)),
+          b("circle", {
+            cx: i.value.left + d.value.width / 2,
+            cy: i.value.top + d.value.height / 2,
+            r: d.value.height / 3.8,
+            fill: `url(#focus_${Q.value})`
+          }, null, 8, ql),
+          b("circle", {
+            cx: i.value.left + d.value.width / 2,
+            cy: i.value.top + d.value.height / 2,
+            r: d.value.height / 7.7,
+            fill: t.value.style.chart.backgroundColor
+          }, null, 8, Kl),
+          b("text", {
+            "text-anchor": "middle",
+            x: i.value.left + d.value.width / 2,
+            y: i.value.top + d.value.height / 2 + 14 / 3,
+            "font-size": 14,
+            "font-weight": "bold",
+            fill: t.value.style.chart.layout.dataLabels.color,
+            class: "vue-ui-donut-evolution-focus"
+          }, x(X(W.value.subtotal)), 9, Jl),
+          t.value.style.chart.layout.grid.xAxis.dataLabels.values[W.value.index] ? (u(), n("text", {
+            key: 0,
+            x: i.value.left + 6,
+            y: i.value.top + t.value.style.chart.layout.grid.xAxis.dataLabels.fontSize * 2,
+            "font-size": t.value.style.chart.layout.grid.xAxis.dataLabels.fontSize * 1.6,
+            fill: t.value.style.chart.layout.dataLabels.color
+          }, x(t.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(W.value.index) + Number(C.value.start)]), 9, Ql)) : p("", !0)
+        ])) : p("", !0),
+        N(s.$slots, "svg", { svg: d.value }, void 0, !0)
+      ], 14, sl)) : p("", !0),
+      J.value ? p("", !0) : (u(), ee(rt, {
+        key: 3,
+        config: {
+          type: "donutEvolution",
+          style: {
+            backgroundColor: t.value.style.chart.backgroundColor,
+            donutEvolution: {
+              axis: {
+                color: "#CCCCCC"
+              },
+              donuts: {
+                color: "#CCCCCC"
+              }
+            }
+          }
+        }
+      }, null, 8, ["config"])),
+      V.value > 1 && t.value.style.chart.zoom.show ? (u(), ee(xt, {
+        key: `slicer_${e.value}`,
+        background: t.value.style.chart.zoom.color,
+        borderColor: t.value.style.chart.backgroundColor,
+        fontSize: t.value.style.chart.zoom.fontSize,
+        useResetSlot: t.value.style.chart.zoom.useResetSlot,
+        labelLeft: t.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(C.value.start)] || "",
+        labelRight: t.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(C.value.end) - 1] || "",
+        textColor: t.value.style.chart.color,
+        inputColor: t.value.style.chart.zoom.color,
+        selectColor: t.value.style.chart.zoom.highlightColor,
+        max: V.value,
+        min: 0,
+        valueStart: C.value.start,
+        valueEnd: C.value.end,
+        start: C.value.start,
+        "onUpdate:start": h[0] || (h[0] = (a) => C.value.start = a),
+        end: C.value.end,
+        "onUpdate:end": h[1] || (h[1] = (a) => C.value.end = a),
+        onReset: $e
+      }, {
+        "reset-action": F(({ reset: a }) => [
+          N(s.$slots, "reset-action", ye(fe({ reset: a })), void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "start", "end"])) : p("", !0),
+      t.value.style.chart.legend.show ? (u(), ee(ut, {
+        key: 5,
+        legendSet: Se.value,
+        config: Ve.value,
+        onClickMarker: h[2] || (h[2] = ({ legend: a }) => ue(a.uid))
+      }, {
+        item: F(({ legend: a, index: y }) => [
+          b("div", {
+            "data-cy-legend-item": "",
+            onClick: (v) => ue(a.uid),
+            style: H(`opacity:${O.value.includes(a.uid) ? 0.5 : 1}`)
+          }, [
+            Ae(x(a.name) + ": " + x(Number(a.value.toFixed(t.value.style.chart.legend.roundingValue)).toLocaleString()) + " ", 1),
+            O.value.includes(a.uid) ? (u(), n("span", ta, " ( - % ) ")) : (u(), n("span", ea, " (" + x(isNaN(a.value / de.value) ? "-" : (a.value / de.value * 100).toFixed(t.value.style.chart.legend.roundingPercentage)) + "%) ", 1))
+          ], 12, Zl)
+        ]),
+        _: 1
+      }, 8, ["legendSet", "config"])) : p("", !0),
+      N(s.$slots, "legend", { legend: Se.value }, void 0, !0),
+      J.value ? (u(), ee(it, {
+        key: 6,
+        hideDetails: "",
+        config: {
+          open: m.value.showTable,
+          maxHeight: 1e4,
+          body: {
+            backgroundColor: t.value.style.chart.backgroundColor,
+            color: t.value.style.chart.color
+          },
+          head: {
+            backgroundColor: t.value.style.chart.backgroundColor,
+            color: t.value.style.chart.color
+          }
+        }
+      }, {
+        content: F(() => [
+          we(Ze, {
+            colNames: G.value.colNames,
+            head: G.value.head,
+            body: G.value.body,
+            config: G.value.config,
+            title: `${t.value.style.chart.title.text}${t.value.style.chart.title.subtitle.text ? ` : ${t.value.style.chart.title.subtitle.text}` : ""}`,
+            onClose: h[3] || (h[3] = (a) => m.value.showTable = !1)
+          }, {
+            th: F(({ th: a }) => [
+              Ae(x(a.name ?? a), 1)
+            ]),
+            td: F(({ td: a }) => [
+              a.value === null ? (u(), n("span", la, "-")) : (u(), n("b", aa, x(isNaN(a.value) ? "" : t.value.style.chart.layout.dataLabels.prefix) + x(!isNaN(a.value) && a.value !== null ? Number(a.value.toFixed(t.value.table.td.roundingValue)).toLocaleString() : a) + x(isNaN(a.value) ? "" : t.value.style.chart.layout.dataLabels.suffix), 1)),
+              b("span", null, x(a.percentage && !isNaN(a.percentage) ? `(${Number(a.percentage.toFixed(t.value.table.td.roundingPercentage)).toLocaleString()}%)` : ""), 1)
+            ]),
+            _: 1
+          }, 8, ["colNames", "head", "body", "config", "title"])
+        ]),
+        _: 1
+      }, 8, ["config"])) : p("", !0)
+    ], 14, ul));
+  }
+}, ua = /* @__PURE__ */ Xe(oa, [["__scopeId", "data-v-1b8abb9d"]]), ba = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: ua
+}, Symbol.toStringTag, { value: "Module" }));
+export {
+  ua as a,
+  ga as b,
+  ba as c,
+  ol as v
+};