vue-data-ui 3.17.3 → 3.17.4

package/dist/{vue-ui-donut-UUgV1d0_.js → vue-ui-donut-d0LLrlKG.js}

@@ -1,22 +1,22 @@
 import { computed as m, defineAsyncComponent as Me, useSlots as aa, shallowRef as Ie, ref as b, onMounted as vl, onBeforeUnmount as dl, toRefs as oa, watch as je, openBlock as u, createElementBlock as i, normalizeStyle as L, normalizeClass as qt, createElementVNode as w, toDisplayString as ye, createBlock as ge, createCommentVNode as d, unref as s, withCtx as _, renderSlot as k, normalizeProps as W, guardReactiveProps as j, createSlots as Wt, createVNode as Tt, Fragment as P, renderList as J, mergeProps as jt, withDirectives as Pt, vShow as St, Teleport as na, resolveDynamicComponent as sa, createTextVNode as hl, nextTick as fl } from "vue";
-import { o as yl, q as Kt, r as ua, j as ra, t as gl, n as ia, p as Re, K as ca, s as pl, k as pe, l as ve, a4 as ml, ax as va, X as da, u as Lt, v as ha, a5 as fa, ae as X, G as bl, a6 as we, a7 as A, as as wl, C as ya, m as ga, a0 as pa, a1 as ma, T as ba, ay as kl, ai as xl } from "./lib-DBptbyyI.js";
-import { f as wa, b as ka } from "./labelUtils-CqTHa20R.js";
+import { o as yl, q as Kt, r as ua, j as ra, t as gl, n as ia, p as Re, K as ca, s as pl, k as pe, l as ve, a4 as ml, ax as va, X as da, u as Lt, v as ha, a5 as fa, ae as X, G as bl, a6 as we, a7 as A, as as wl, C as ya, m as ga, a0 as pa, a1 as ma, T as ba, ay as kl, ai as xl } from "./lib-DMzrGQHK.js";
+import { f as wa, b as ka } from "./labelUtils-DX9oyq3C.js";
 import { t as xa, u as $a } from "./useResponsive-DfdjqQps.js";
-import { u as Ca } from "./useConfig-C40HvGpD.js";
-import { u as _a } from "./usePrinter-CEpYU3r5.js";
-import { u as Aa, B as Ta } from "./BaseScanner-BhhkKVoj.js";
-import { u as Pa } from "./useSvgExport-ByUukOZt.js";
-import { u as Qt } from "./useNestedProp-Bf5XFbs8.js";
-import { u as Sa } from "./useThemeCheck-D1ZYXUwG.js";
-import { u as La } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as Ma } from "./useChartAccessibility-9icAAmYg.js";
-import Ia from "./img-LXxMLmCg.js";
-import { _ as Fa } from "./Shape-BKRUOeKk.js";
-import za from "./Title-BeMKE1cj.js";
+import { u as Ca } from "./useConfig-DTHxOX6V.js";
+import { u as _a } from "./usePrinter-C4t8DdQ-.js";
+import { u as Aa, B as Ta } from "./BaseScanner-BON3d_Sx.js";
+import { u as Pa } from "./useSvgExport-BTG4hVPO.js";
+import { u as Qt } from "./useNestedProp-DH0BEVVS.js";
+import { u as Sa } from "./useThemeCheck-C9Ccl7U9.js";
+import { u as La } from "./useUserOptionState-B7Ej974k.js";
+import { u as Ma } from "./useChartAccessibility-cp6XQtqi.js";
+import Ia from "./img-CjTQXS0U.js";
+import { _ as Fa } from "./Shape-CxJ5_Rre.js";
+import za from "./Title-BbKoiBk2.js";
 import Oa from "./vue_ui_donut-CA4dgV8J.js";
-import Ya from "./Legend-CS7Xo5LK.js";
-import { A as Da } from "./A11yDataTable-KcVAX2cP.js";
-import { B as Ba } from "./BaseLegendToggle-BQVIawmA.js";
+import Ya from "./Legend-DGN5lY60.js";
+import { A as Da } from "./A11yDataTable-BpmuNomI.js";
+import { B as Ba } from "./BaseLegendToggle-cMP8M2u0.js";
 import { _ as Xa } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 function Na(it) {
   const {
@@ -41,9 +41,13 @@ function Na(it) {
     function pt({ midX: h, midY: g, bandX: f, bandY: C }) {
       if (!gt)
         return `M ${h} ${g} L ${h} ${C} L ${f} ${C}`;
-      const I = f < B ? -1 : 1, F = f - h, le = C - g, ae = Math.sqrt(F * F + le * le) || 1, ke = h - B, p = g - M, oe = Math.sqrt(ke * ke + p * p) || 1, se = ke / oe, z = p / oe, Oe = oe + 9;
+      const I = f < B ? -1 : 1, F = f - h, le = C - g, ae = Math.sqrt(F * F + le * le) || 1, ke = h - B, p = g - M, oe = Math.sqrt(
+        ke * ke + p * p
+      ) || 1, se = ke / oe, z = p / oe, Oe = oe + 9;
       function e({ x: _e, y: de }) {
-        const re = _e - B, Z = de - M, Ae = Math.sqrt(re * re + Z * Z) || 1;
+        const re = _e - B, Z = de - M, Ae = Math.sqrt(
+          re * re + Z * Z
+        ) || 1;
         if (Ae >= Oe) return { x: _e, y: de };
         const Te = Oe / Ae;
         return {
@@ -56,7 +60,10 @@ function Na(it) {
         let re = -(le / ae), Z = _e;
         const Ae = (h + f) * 0.5, Te = (g + C) * 0.5, K = Ae + re, kt = Te + Z, Nt = (K - B) * (K - B) + (kt - M) * (kt - M), He = Ae - re, Ge = Te - Z;
         (He - B) * (He - B) + (Ge - M) * (Ge - M) > Nt && (re = -re, Z = -Z);
-        const at = 0.78, $t = h + F * at, Rt = g + le * at, qe = Math.max(0, Math.min(1, (ae - 18) / 44)), x = qe * qe * (3 - 2 * qe);
+        const at = 0.78, $t = h + F * at, Rt = g + le * at, qe = Math.max(
+          0,
+          Math.min(1, (ae - 18) / 44)
+        ), x = qe * qe * (3 - 2 * qe);
         let n = 2.5 + x * 4, he = 1 + x * 2.5;
         n *= 0.9;
         const ot = {
@@ -73,7 +80,10 @@ function Na(it) {
         x: h + se * $e,
         y: g + z * $e
       }, Ue = B + I * Math.max(Math.abs(f - B), Oe), Xt = {
-        x: f - I * Math.min(ue, Math.abs(Ue - f) * 0.75),
+        x: f - I * Math.min(
+          ue,
+          Math.abs(Ue - f) * 0.75
+        ),
         y: C
       }, Y = e(Ye), Ce = e(Xt);
       return `M ${h} ${g} C ${Y.x} ${Y.y} ${Ce.x} ${Ce.y} ${f} ${C}`;
@@ -104,12 +114,22 @@ function Na(it) {
     }
     function Ve(h, g) {
       if (g.startsWith("T")) {
-        h.sort((C, I) => C.inlineMarkerY - I.inlineMarkerY || C.index - I.index);
+        h.sort(
+          (C, I) => C.inlineMarkerY - I.inlineMarkerY || C.index - I.index
+        );
         return;
       }
-      h.sort((C, I) => I.inlineMarkerY - C.inlineMarkerY || C.index - I.index);
+      h.sort(
+        (C, I) => I.inlineMarkerY - C.inlineMarkerY || C.index - I.index
+      );
     }
-    function Ee({ side: h, markerX: g, markerY: f, labelY: C, connectorPath: I }) {
+    function Ee({
+      side: h,
+      markerX: g,
+      markerY: f,
+      labelY: C,
+      connectorPath: I
+    }) {
       return {
         side: h,
         labelX: h === "left" ? g - ne : g + ne,
@@ -156,7 +176,10 @@ function Na(it) {
     return wt.forEach((h) => {
       G[tt(h)].push(h);
     }), Object.keys(G).forEach((h) => {
-      Ve(G[h], h);
+      Ve(
+        G[h],
+        h
+      );
     }), H({
       candidateList: G.TL,
       side: "left",
@@ -213,7 +236,15 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
   },
   emits: ["selectLegend", "selectDatapoint", "copyAlt"],
   setup(it, { expose: ct, emit: Mt }) {
-    const Ke = Me(() => import("./Tooltip-C8KGyqQk.js")), vt = Me(() => import("./BaseIcon-Cb3zzG6s.js")), It = Me(() => import("./vue-ui-accordion-DDuJT1xA.js")), dt = Me(() => import("./DataTable-DT2kIdQ6.js")), Ft = Me(() => import("./PenAndPaper-Ct3qJ4lA.js")), zt = Me(() => import("./UserOptions-rW2fRf3V.js")), Ot = Me(() => import("./PackageVersion-DP_kfXUM.js")), Yt = Me(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_donut: Dt } = Ca(), { isThemeValid: Bt, warnInvalidTheme: Jt } = Sa(), Qe = aa(), E = it, B = m({
+    const Ke = Me(() => import("./Tooltip-Cvt7Fi0Q.js")), vt = Me(() => import("./BaseIcon-DX0hTWa-.js")), It = Me(() => import("./vue-ui-accordion-BHmfmb_6.js")), dt = Me(() => import("./DataTable-cMnb68Ik.js")), Ft = Me(
+      () => import("./PenAndPaper-CJDoB5H9.js")
+    ), zt = Me(
+      () => import("./UserOptions-DVduN6X7.js")
+    ), Ot = Me(
+      () => import("./PackageVersion-DVvvyQXB.js")
+    ), Yt = Me(
+      () => import("./BaseDraggableDialog-Di8Hlru3.js")
+    ), { vue_ui_donut: Dt } = Ca(), { isThemeValid: Bt, warnInvalidTheme: Jt } = Sa(), Qe = aa(), E = it, B = m({
       get() {
         return !!E.dataset && E.dataset.length;
       },
@@ -361,7 +392,9 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       }
       return o;
     }
-    const e = b(Oe()), xe = m(() => e.value.userOptions.useCursorPointer), $e = m(() => gl({
+    const e = b(Oe()), xe = m(
+      () => e.value.userOptions.useCursorPointer
+    ), $e = m(() => gl({
       defaultConfig: {
         useCssAnimation: !1,
         table: { show: !1 },
@@ -453,16 +486,22 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       },
       { immediate: !0 }
     );
-    const { userOptionsVisible: Z, setUserOptionsVisibility: Ae, keepUserOptionState: Te } = La({ config: e.value }), { svgRef: K } = Ma({ config: e.value.style.chart.title });
+    const { userOptionsVisible: Z, setUserOptionsVisibility: Ae, keepUserOptionState: Te } = La({ config: e.value }), { svgRef: K } = Ma({
+      config: e.value.style.chart.title
+    });
     function kt() {
       Ae(!0);
     }
     function Nt() {
       Ae(!1);
     }
-    je(() => E.config, (t) => {
-      ue.value || (e.value = Oe()), Z.value = !e.value.userOptions.showOnChartHover, ke(), gt.value += 1, pt.value += 1, mt.value += 1, x.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, x.value.showTable = e.value.table.show, x.value.showTooltip = e.value.style.chart.tooltip.show, n.value.height = e.value.style.chart.height, n.value.width = e.value.style.chart.width;
-    }, { deep: !0 });
+    je(
+      () => E.config,
+      (t) => {
+        ue.value || (e.value = Oe()), Z.value = !e.value.userOptions.showOnChartHover, ke(), gt.value += 1, pt.value += 1, mt.value += 1, x.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, x.value.showTable = e.value.table.show, x.value.showTooltip = e.value.style.chart.tooltip.show, n.value.height = e.value.style.chart.height, n.value.width = e.value.style.chart.width;
+      },
+      { deep: !0 }
+    );
     const He = m(() => {
       const { top: t, right: o, bottom: l, left: a } = e.value.style.chart.padding;
       return {
@@ -483,15 +522,19 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       showTable: e.value.table.show,
       showTooltip: e.value.style.chart.tooltip.show
     });
-    je(e, () => {
-      x.value = {
-        dataLabels: {
-          show: e.value.style.chart.layout.labels.dataLabels.show
-        },
-        showTable: e.value.table.show,
-        showTooltip: e.value.style.chart.tooltip.show
-      };
-    }, { immediate: !0 });
+    je(
+      e,
+      () => {
+        x.value = {
+          dataLabels: {
+            show: e.value.style.chart.layout.labels.dataLabels.show
+          },
+          showTable: e.value.table.show,
+          showTooltip: e.value.style.chart.tooltip.show
+        };
+      },
+      { immediate: !0 }
+    );
     const n = b({
       height: e.value.style.chart.height,
       width: e.value.style.chart.width
@@ -514,13 +557,20 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       ghost: !1,
       pattern: `pattern_${p.value}_${o}`
     })));
-    je(() => E.dataset, (t) => {
-      Array.isArray(t) && t.length > 0 && (Ue.value = !1);
-    }, { immediate: !0 });
+    je(
+      () => E.dataset,
+      (t) => {
+        Array.isArray(t) && t.length > 0 && (Ue.value = !1);
+      },
+      { immediate: !0 }
+    );
     const Q = Ie(U.value);
-    je(() => U.value, (t) => {
-      Q.value = t, requestAnimationFrame(F);
-    });
+    je(
+      () => U.value,
+      (t) => {
+        Q.value = t, requestAnimationFrame(F);
+      }
+    );
     function $l() {
       return U.value.map((t) => ({
         name: t.name,
@@ -529,7 +579,14 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       }));
     }
     const N = b([]), Pe = b(!1), De = b(null);
-    function Zt({ from: t, to: o, duration: l, onUpdate: a, onDone: r, easing: c = xl }) {
+    function Zt({
+      from: t,
+      to: o,
+      duration: l,
+      onUpdate: a,
+      onDone: r,
+      easing: c = xl
+    }) {
       const y = performance.now();
       function $(D) {
         const S = Math.min((D - y) / l, 1), V = c(S), Ne = t + (o - t) * V;
@@ -590,11 +647,14 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
         };
         e.value.serieToggleAnimation.show && e.value.type === "classic" ? c() : r();
       }
-      ot("selectLegend", be.value.map((r) => ({
-        name: r.name,
-        color: r.color,
-        value: r.value
-      })));
+      ot(
+        "selectLegend",
+        be.value.map((r) => ({
+          name: r.name,
+          color: r.color,
+          value: r.value
+        }))
+      );
     }
     function el(t) {
       if (!U.value.length)
@@ -639,7 +699,9 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
         }), Q.value.map((t, o) => ({
           ...t,
           seriesIndex: o
-        })).filter((t, o) => !N.value.includes(o));
+        })).filter(
+          (t, o) => !N.value.includes(o)
+        );
     }), nt = m(() => Ye.value.map((t, o) => {
       const l = (t.values || []).reduce((r, c) => r + c, 0), a = l / Ye.value.map((r) => (r.values || []).reduce((c, y) => c + y, 0)).reduce((r, c) => r + c, 0);
       return {
@@ -651,16 +713,25 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
         proportion: a
       };
     }).map((t, o) => {
-      const l = pe(e.value.style.chart.layout.labels.value.formatter, t.value, ve({
-        p: e.value.style.chart.layout.labels.dataLabels.prefix,
-        v: t.value,
-        s: e.value.style.chart.layout.labels.dataLabels.suffix,
-        r: e.value.style.chart.legend.roundingValue
-      }), { datapoint: t, index: o }), a = pe(e.value.style.chart.layout.labels.percentage.formatter, ll(t), ve({
-        v: ll(t),
-        s: "%",
-        r: e.value.style.chart.legend.roundingPercentage
-      })), r = Ut({
+      const l = pe(
+        e.value.style.chart.layout.labels.value.formatter,
+        t.value,
+        ve({
+          p: e.value.style.chart.layout.labels.dataLabels.prefix,
+          v: t.value,
+          s: e.value.style.chart.layout.labels.dataLabels.suffix,
+          r: e.value.style.chart.legend.roundingValue
+        }),
+        { datapoint: t, index: o }
+      ), a = pe(
+        e.value.style.chart.layout.labels.percentage.formatter,
+        ll(t),
+        ve({
+          v: ll(t),
+          s: "%",
+          r: e.value.style.chart.legend.roundingPercentage
+        })
+      ), r = Ut({
         val: l,
         percentage: N.value.includes(o) ? `${Xl(t.proportion * 100)}%` : a,
         showVal: e.value.style.chart.legend.showValue,
@@ -682,21 +753,52 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       paddingBottom: 12,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
     })), O = m(() => {
-      const t = e.value.style.chart.layout.donut.radiusRatio, o = Math.max(0.1, Math.min(0.50001, t)), l = Math.min(n.value.width * o, n.value.height * o);
+      const t = e.value.style.chart.layout.donut.radiusRatio, o = Math.max(0.1, Math.min(0.50001, t)), l = Math.min(
+        n.value.width * o,
+        n.value.height * o
+      );
       return Math.max(12, l);
-    }), q = m(() => ml({ series: be.value }, n.value.width / 2, n.value.height / 2, O.value, O.value, 1.99999, 2, 1, 360, 105.25, he.value)), Sl = m(() => Math.abs(be.value.map((t) => t.value).reduce((t, o) => t + o, 0)) > 0), Ll = m(() => ml({
-      series: [
-        {
-          value: 1,
-          color: e.value.style.chart.layout.donut.emptyFill,
-          name: "_",
-          seriesIndex: 0,
-          patternIndex: -1,
-          ghost: !1,
-          absoluteValues: [1]
-        }
-      ]
-    }, n.value.width / 2, n.value.height / 2, O.value, O.value, 1.99999, 2, 1, 360, 105.25, he.value)), T = m(() => q.value.filter((t) => !t.ghost)), v = m(() => {
+    }), q = m(() => ml(
+      { series: be.value },
+      n.value.width / 2,
+      n.value.height / 2,
+      O.value,
+      O.value,
+      1.99999,
+      2,
+      1,
+      360,
+      105.25,
+      he.value
+    )), Sl = m(() => Math.abs(
+      be.value.map((t) => t.value).reduce((t, o) => t + o, 0)
+    ) > 0), Ll = m(() => ml(
+      {
+        series: [
+          {
+            value: 1,
+            color: e.value.style.chart.layout.donut.emptyFill,
+            name: "_",
+            seriesIndex: 0,
+            patternIndex: -1,
+            ghost: !1,
+            absoluteValues: [1]
+          }
+        ]
+      },
+      n.value.width / 2,
+      n.value.height / 2,
+      O.value,
+      O.value,
+      1.99999,
+      2,
+      1,
+      360,
+      105.25,
+      he.value
+    )), T = m(
+      () => q.value.filter((t) => !t.ghost)
+    ), v = m(() => {
       const t = Math.max(...be.value.map((l) => l.value)), o = be.value.map((l) => l.value / t);
       return va({
         series: o,
@@ -712,7 +814,19 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       return t.x > n.value.width / 2 + 6 ? "start" : t.x < n.value.width / 2 - 6 ? "end" : "middle";
     }
     function Ml(t) {
-      return t.middlePoint.y > n.value.height / 2 ? X({ initX: t.middlePoint.x, initY: t.middlePoint.y, offset: 100, centerX: n.value.width / 2, centerY: n.value.height / 2 }).y : X({ initX: t.middlePoint.x, initY: t.middlePoint.y, offset: 0, centerX: n.value.width / 2, centerY: n.value.height / 2 }).y - 100;
+      return t.middlePoint.y > n.value.height / 2 ? X({
+        initX: t.middlePoint.x,
+        initY: t.middlePoint.y,
+        offset: 100,
+        centerX: n.value.width / 2,
+        centerY: n.value.height / 2
+      }).y : X({
+        initX: t.middlePoint.x,
+        initY: t.middlePoint.y,
+        offset: 0,
+        centerX: n.value.width / 2,
+        centerY: n.value.height / 2
+      }).y - 100;
     }
     function ee(t) {
       return t.proportion * 100 > e.value.style.chart.layout.labels.dataLabels.hideUnderValue;
@@ -762,8 +876,19 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
     function fe({ datapoint: t, seriesIndex: o }) {
       e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: o }), oe.value = !1, z.value = null, H.value = null, G.value = "pointer";
     }
-    function ie({ datapoint: t, relativeIndex: o, seriesIndex: l, show: a = !1, triggerMode: r = "pointer" }) {
-      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: l }), G.value = r, H.value = o, _t.value = { datapoint: t, seriesIndex: l, config: e.value, series: U.value }, oe.value = a, z.value = o;
+    function ie({
+      datapoint: t,
+      relativeIndex: o,
+      seriesIndex: l,
+      show: a = !1,
+      triggerMode: r = "pointer"
+    }) {
+      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: l }), G.value = r, H.value = o, _t.value = {
+        datapoint: t,
+        seriesIndex: l,
+        config: e.value,
+        series: U.value
+      }, oe.value = a, z.value = o;
       let c = "";
       const y = e.value.style.chart.tooltip.customFormat;
       if (st.value = !1, ba(y))
@@ -914,16 +1039,32 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
     });
     function Et(t = null) {
       fl(() => {
-        const o = Le.value.head.map((r, c) => [[
-          r.name
-        ], [Le.value.body[c]], [isNaN(Le.value.body[c] / te.value) ? "-" : Le.value.body[c] / te.value * 100]]), l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(o), a = pa(l);
-        t ? t(a) : ma({ csvContent: a, title: e.value.style.chart.title.text || "vue-ui-donut" });
+        const o = Le.value.head.map((r, c) => [
+          [r.name],
+          [Le.value.body[c]],
+          [
+            isNaN(Le.value.body[c] / te.value) ? "-" : Le.value.body[c] / te.value * 100
+          ]
+        ]), l = [
+          [e.value.style.chart.title.text],
+          [e.value.style.chart.title.subtitle.text],
+          [[""], ["val"], ["%"]]
+        ].concat(o), a = pa(l);
+        t ? t(a) : ma({
+          csvContent: a,
+          title: e.value.style.chart.title.text || "vue-ui-donut"
+        });
       });
     }
     const We = m(() => {
       const t = [
         ' <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>',
-        ve({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: te.value, s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.table.td.roundingValue }),
+        ve({
+          p: e.value.style.chart.layout.labels.dataLabels.prefix,
+          v: te.value,
+          s: e.value.style.chart.layout.labels.dataLabels.suffix,
+          r: e.value.table.td.roundingValue
+        }),
         "100%"
       ], o = Le.value.head.map((c, y) => [
         {
@@ -931,7 +1072,9 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
           name: c.name || "-"
         },
         Le.value.body[y],
-        isNaN(Le.value.body[y] / te.value) ? "-" : (Le.value.body[y] / te.value * 100).toFixed(e.value.table.td.roundingPercentage) + "%"
+        isNaN(Le.value.body[y] / te.value) ? "-" : (Le.value.body[y] / te.value * 100).toFixed(
+          e.value.table.td.roundingPercentage
+        ) + "%"
       ]), l = o.map((c) => c.map((y, $) => $ === 0 ? y.name : y)), a = {
         th: {
           backgroundColor: e.value.table.th.backgroundColor,
@@ -967,13 +1110,7 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
         rounding: e.value.style.chart.legend.roundingPercentage
       });
     }
-    function Ut({
-      val: t,
-      percentage: o,
-      showVal: l,
-      showPercentage: a,
-      config: r
-    }) {
+    function Ut({ val: t, percentage: o, showVal: l, showPercentage: a, config: r }) {
       return ka({
         config: r,
         val: t,
@@ -1002,7 +1139,10 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       });
     }
     function ce(t, o) {
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: t.seriesIndex }), ot("selectDatapoint", { datapoint: t, index: o });
+      e.value.events.datapointClick && e.value.events.datapointClick({
+        datapoint: t,
+        seriesIndex: t.seriesIndex
+      }), ot("selectDatapoint", { datapoint: t, index: o });
     }
     function nl() {
       x.value.showTable = !x.value.showTable;
@@ -1019,7 +1159,12 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
     }
     async function Nl({ scale: t = 2 } = {}) {
       if (!M.value) return;
-      const { width: o, height: l } = M.value.getBoundingClientRect(), a = o / l, { imageUri: r, base64: c } = await Ia({ domElement: M.value, base64: !0, img: !0, scale: t });
+      const { width: o, height: l } = M.value.getBoundingClientRect(), a = o / l, { imageUri: r, base64: c } = await Ia({
+        domElement: M.value,
+        base64: !0,
+        img: !0,
+        scale: t
+      });
       return {
         imageUri: r,
         base64: c,
@@ -1032,7 +1177,10 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
     function Rl() {
       if (!Fe.value) return;
       const { x: t, y: o, width: l, height: a } = Fe.value.getBBox();
-      K.value && K.value.setAttribute("viewBox", `${t} ${o} ${l + Math.min(0, t)} ${a + Math.min(0, o)}`);
+      K.value && K.value.setAttribute(
+        "viewBox",
+        `${t} ${o} ${l + Math.min(0, t)} ${a + Math.min(0, o)}`
+      );
     }
     const rt = m(() => {
       const t = e.value.table.useDialog && !e.value.table.show, o = x.value.showTable;
@@ -1065,9 +1213,12 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
         }
       };
     });
-    je(() => x.value.showTable, (t) => {
-      e.value.table.show || (t && e.value.table.useDialog && ze.value ? ze.value.open() : "close" in ze.value && ze.value.close());
-    });
+    je(
+      () => x.value.showTable,
+      (t) => {
+        e.value.table.show || (t && e.value.table.useDialog && ze.value ? ze.value.open() : "close" in ze.value && ze.value.close());
+      }
+    );
     function rl() {
       x.value.showTable = !1, tt.value && tt.value.setTableIconState(!1);
     }
@@ -1086,7 +1237,14 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       try {
         if (t) {
           const { blob: o, url: l, text: a, dataUrl: r } = await ql();
-          await Promise.resolve(e.value.userOptions.callbacks.svg({ blob: o, url: l, text: a, dataUrl: r }));
+          await Promise.resolve(
+            e.value.userOptions.callbacks.svg({
+              blob: o,
+              url: l,
+              text: a,
+              dataUrl: r
+            })
+          );
         } else
           await Promise.resolve(Gl());
       } finally {
@@ -1109,13 +1267,17 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
         config: e.value,
         dataset: Q.value
       }), !e.value.userOptions.callbacks.altCopy) {
-        console.warn("Vue Data UI - A callback must be set for `altCopy` in userOptions.");
+        console.warn(
+          "Vue Data UI - A callback must be set for `altCopy` in userOptions."
+        );
         return;
       }
-      await Promise.resolve(e.value.userOptions.callbacks.altCopy({
-        config: e.value,
-        dataset: Q.value
-      }));
+      await Promise.resolve(
+        e.value.userOptions.callbacks.altCopy({
+          config: e.value,
+          dataset: Q.value
+        })
+      );
     }
     function jl() {
       H.value = null, h.value = !0;
@@ -1126,7 +1288,8 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
     function Ql(t) {
       if (!K.value || ut.value || document.activeElement !== K.value || !T.value.length) return;
       const o = ["ArrowLeft", "ArrowUp"].includes(t.key), l = ["ArrowRight", "ArrowDown"].includes(t.key), a = t.key === "Enter" || t.key === " ", r = t.key === "Escape";
-      if (!o && !l && !a && !r) return;
+      if (!o && !l && !a && !r)
+        return;
       if (t.preventDefault(), t.stopPropagation(), r) {
         H.value = null, G.value = "pointer", oe.value = !1, z.value = null;
         return;
@@ -1312,7 +1475,9 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
         onToggleTooltip: ul,
         onToggleAnnotator: Ht,
         onCopyAlt: cl,
-        style: L({ visibility: s(Te) ? s(Z) ? "visible" : "hidden" : "visible" })
+        style: L({
+          visibility: s(Te) ? s(Z) ? "visible" : "hidden" : "visible"
+        })
       }, Wt({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
@@ -1398,7 +1563,11 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
           ref: K,
           xmlns: s(da),
           "aria-describedby": `chart-instructions-${p.value}`,
-          class: qt({ "vue-data-ui-fullscreen--on": Xe.value, "vue-data-ui-fulscreen--off": !Xe.value, "vue-data-ui-svg": !0 }),
+          class: qt({
+            "vue-data-ui-fullscreen--on": Xe.value,
+            "vue-data-ui-fulscreen--off": !Xe.value,
+            "vue-data-ui-svg": !0
+          }),
           viewBox: `0 0 ${n.value.width <= 0 ? 10 : n.value.width} ${n.value.height <= 0 ? 10 : n.value.height}`,
           style: L(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color};${He.value.css}`),
           tabindex: "0",
@@ -1431,7 +1600,10 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
               }, [
                 w("stop", {
                   offset: "0%",
-                  "stop-color": s(Lt)(e.value.style.chart.backgroundColor, 0),
+                  "stop-color": s(Lt)(
+                    e.value.style.chart.backgroundColor,
+                    0
+                  ),
                   "stop-opacity": "0"
                 }, null, 8, ja),
                 w("stop", {
@@ -1441,11 +1613,17 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                 }, null, 8, Ka),
                 w("stop", {
                   offset: `${(1 - he.value / O.value / 2) * 100}%`,
-                  "stop-color": s(Lt)("#FFFFFF", e.value.style.chart.gradientIntensity)
+                  "stop-color": s(Lt)(
+                    "#FFFFFF",
+                    e.value.style.chart.gradientIntensity
+                  )
                 }, null, 8, Qa),
                 w("stop", {
                   offset: "100%",
-                  "stop-color": s(Lt)(e.value.style.chart.backgroundColor, 0),
+                  "stop-color": s(Lt)(
+                    e.value.style.chart.backgroundColor,
+                    0
+                  ),
                   "stop-opacity": "0"
                 }, null, 8, Ja)
               ], 8, Wa)) : d("", !0)
@@ -1515,7 +1693,9 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                 }, null, 8, ro)
               ], 8, uo)
             ]),
-            e.value.type === "classic" ? (u(!0), i(P, { key: 3 }, J(q.value.filter((l) => !l.ghost), (l, a) => (u(), i("g", null, [
+            e.value.type === "classic" ? (u(!0), i(P, { key: 3 }, J(q.value.filter(
+              (l) => !l.ghost
+            ), (l, a) => (u(), i("g", null, [
               ee(l) && x.value.dataLabels.show ? (u(), i("path", {
                 key: 0,
                 d: s(R)[a]?.connectorPath || s(fa)(
@@ -1537,7 +1717,9 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                 filter: Be(a)
               }, null, 8, io)) : d("", !0)
             ]))), 256)) : d("", !0),
-            e.value.type === "polar" ? (u(!0), i(P, { key: 4 }, J(q.value.filter((l) => !l.ghost), (l, a) => (u(), i("g", null, [
+            e.value.type === "polar" ? (u(!0), i(P, { key: 4 }, J(q.value.filter(
+              (l) => !l.ghost
+            ), (l, a) => (u(), i("g", null, [
               ee(l) && x.value.dataLabels.show ? (u(), i("path", {
                 key: 0,
                 d: `M ${s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 24, centerX: n.value.width / 2, centerY: n.value.height / 2 }).x},${s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 24, centerX: n.value.width / 2, centerY: n.value.height / 2 }).y} ${v.value[a].middlePoint.x},${v.value[a].middlePoint.y}`,
@@ -1564,7 +1746,10 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
               (u(!0), i(P, null, J(it.dataset, (l, a) => (u(), i("defs", {
                 key: `pattern-${l.patternIndex}`
               }, [
-                k(t.$slots, "pattern", jt({ ref_for: !0 }, { seriesIndex: a, patternId: `pattern_${p.value}_${a}` }), void 0, !0)
+                k(t.$slots, "pattern", jt({ ref_for: !0 }, {
+                  seriesIndex: a,
+                  patternId: `pattern_${p.value}_${a}`
+                }), void 0, !0)
               ]))), 128))
             ])) : d("", !0),
             te.value && e.value.type === "classic" ? (u(), i(P, { key: 7 }, [
@@ -1698,7 +1883,9 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
             }, null, 8, Io),
             te.value ? (u(), i(P, { key: 11 }, [
               q.value.length > 1 || e.value.type === "classic" ? (u(), i("g", Fo, [
-                (u(!0), i(P, null, J(q.value.filter((l) => !l.ghost), (l, a) => (u(), i("path", {
+                (u(!0), i(P, null, J(q.value.filter(
+                  (l) => !l.ghost
+                ), (l, a) => (u(), i("path", {
                   d: e.value.type === "classic" ? l.arcSlice : v.value[a].path,
                   stroke: e.value.style.chart.layout.donut.borderColorAuto ? e.value.style.chart.backgroundColor : e.value.style.chart.layout.donut.borderColor,
                   fill: z.value === a ? e.value.style.chart.layout.donut.selectedColor : "transparent",
@@ -1708,7 +1895,10 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                     seriesIndex: l.seriesIndex,
                     show: !0
                   }),
-                  onMouseleave: (r) => fe({ datapoint: l, seriesIndex: l.seriesIndex }),
+                  onMouseleave: (r) => fe({
+                    datapoint: l,
+                    seriesIndex: l.seriesIndex
+                  }),
                   onClick: (r) => ce(l, a)
                 }, null, 40, zo))), 256))
               ])) : (u(), i("g", Oo, [
@@ -1723,7 +1913,10 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                     seriesIndex: q.value[0].seriesIndex,
                     show: !0
                   })),
-                  onMouseleave: o[1] || (o[1] = (l) => fe({ datapoint: q.value[0], seriesIndex: q.value[0].seriesIndex })),
+                  onMouseleave: o[1] || (o[1] = (l) => fe({
+                    datapoint: q.value[0],
+                    seriesIndex: q.value[0].seriesIndex
+                  })),
                   onClick: o[2] || (o[2] = (l) => ce(q.value[0], t.i))
                 }, null, 40, Yo)
               ]))
@@ -1788,7 +1981,9 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                 })
               )), 13, No)) : d("", !0)
             ], 512)) : d("", !0),
-            (u(!0), i(P, null, J(T.value.filter((l) => !l.ghost), (l, a) => (u(), i("g", {
+            (u(!0), i(P, null, J(T.value.filter(
+              (l) => !l.ghost
+            ), (l, a) => (u(), i("g", {
               filter: Be(a),
               class: qt({ animated: e.value.useCssAnimation }),
               key: l.seriesIndex,
@@ -1805,12 +2000,26 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                   w("div", null, [
                     k(t.$slots, "dataLabel", jt({ ref_for: !0 }, {
                       datapoint: l,
-                      isBlur: !e.value.useBlurOnHover || [null, void 0].includes(z.value) || z.value === a,
+                      isBlur: !e.value.useBlurOnHover || [null, void 0].includes(
+                        z.value
+                      ) || z.value === a,
                       isSafari: ol.value,
                       isVisible: ee(l) && x.value.dataLabels.show,
-                      textAlign: s(A)(l, !0, 16, !0).anchor,
-                      flexAlign: s(A)(l, !0, 16).anchor,
-                      percentage: tl(l, T.value)
+                      textAlign: s(A)(
+                        l,
+                        !0,
+                        16,
+                        !0
+                      ).anchor,
+                      flexAlign: s(A)(
+                        l,
+                        !0,
+                        16
+                      ).anchor,
+                      percentage: tl(
+                        l,
+                        T.value
+                      )
                     }), void 0, !0)
                   ])
                 ], 8, Eo))
@@ -1824,7 +2033,9 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                     stroke: e.value.style.chart.backgroundColor,
                     "stroke-width": 1,
                     r: 3,
-                    filter: !e.value.useBlurOnHover || [null, void 0].includes(z.value) || z.value === a ? "" : `url(#blur_${p.value})`,
+                    filter: !e.value.useBlurOnHover || [null, void 0].includes(
+                      z.value
+                    ) || z.value === a ? "" : `url(#blur_${p.value})`,
                     onClick: (r) => ce(l, a),
                     onMouseenter: (r) => ie({
                       datapoint: l,
@@ -1832,7 +2043,10 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                       seriesIndex: l.seriesIndex,
                       show: !0
                     }),
-                    onMouseleave: (r) => fe({ datapoint: l, seriesIndex: l.seriesIndex })
+                    onMouseleave: (r) => fe({
+                      datapoint: l,
+                      seriesIndex: l.seriesIndex
+                    })
                   }, null, 40, Ho)) : d("", !0),
                   e.value.style.chart.layout.labels.dataLabels.oneLine || s(R)[a] ? Pt((u(), i("text", {
                     key: 1,
@@ -1847,10 +2061,20 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                       seriesIndex: l.seriesIndex,
                       show: !0
                     }),
-                    onMouseleave: (r) => fe({ datapoint: l, seriesIndex: l.seriesIndex }),
-                    innerHTML: Yl(l, a, !!s(R)[a])
+                    onMouseleave: (r) => fe({
+                      datapoint: l,
+                      seriesIndex: l.seriesIndex
+                    }),
+                    innerHTML: Yl(
+                      l,
+                      a,
+                      !!s(R)[a]
+                    )
                   }, null, 40, Go)), [
-                    [St, ee(l) && x.value.dataLabels.show]
+                    [
+                      St,
+                      ee(l) && x.value.dataLabels.show
+                    ]
                   ]) : (u(), i(P, { key: 2 }, [
                     Pt(w("text", {
                       class: "vue-data-ui-datalabel-value",
@@ -1867,9 +2091,15 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                         seriesIndex: l.seriesIndex,
                         show: !0
                       }),
-                      onMouseleave: (r) => fe({ datapoint: l, seriesIndex: l.seriesIndex })
+                      onMouseleave: (r) => fe({
+                        datapoint: l,
+                        seriesIndex: l.seriesIndex
+                      })
                     }, ye(At(l)), 45, qo), [
-                      [St, ee(l) && x.value.dataLabels.show]
+                      [
+                        St,
+                        ee(l) && x.value.dataLabels.show
+                      ]
                     ]),
                     Pt(w("text", {
                       class: "vue-data-ui-datalabel-name",
@@ -1886,29 +2116,55 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                         seriesIndex: l.seriesIndex,
                         show: !0
                       }),
-                      onMouseleave: (r) => fe({ datapoint: l, seriesIndex: l.seriesIndex }),
+                      onMouseleave: (r) => fe({
+                        datapoint: l,
+                        seriesIndex: l.seriesIndex
+                      }),
                       innerHTML: s(wl)({
                         content: l.name,
                         fontSize: f.value,
                         fill: e.value.style.chart.layout.labels.name.color,
-                        x: s(R)[a]?.labelX ?? s(A)(l, !0, 12).x,
-                        y: (s(R)[a]?.labelY ?? s(we)(l)) + f.value
+                        x: s(R)[a]?.labelX ?? s(A)(
+                          l,
+                          !0,
+                          12
+                        ).x,
+                        y: (s(R)[a]?.labelY ?? s(we)(
+                          l
+                        )) + f.value
                       })
                     }, null, 44, Wo), [
-                      [St, ee(l) && x.value.dataLabels.show && e.value.style.chart.layout.labels.name.show]
+                      [
+                        St,
+                        ee(l) && x.value.dataLabels.show && e.value.style.chart.layout.labels.name.show
+                      ]
                     ])
                   ], 64))
                 ], 64)) : d("", !0),
                 e.value.type === "polar" ? (u(), i(P, { key: 1 }, [
                   ee(l) && x.value.dataLabels.show ? (u(), i("circle", {
                     key: 0,
-                    cx: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 24, centerX: n.value.width / 2, centerY: n.value.height / 2 }).x,
-                    cy: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 24, centerX: n.value.width / 2, centerY: n.value.height / 2 }).y,
+                    cx: s(X)({
+                      initX: v.value[a].middlePoint.x,
+                      initY: v.value[a].middlePoint.y,
+                      offset: 24,
+                      centerX: n.value.width / 2,
+                      centerY: n.value.height / 2
+                    }).x,
+                    cy: s(X)({
+                      initX: v.value[a].middlePoint.x,
+                      initY: v.value[a].middlePoint.y,
+                      offset: 24,
+                      centerX: n.value.width / 2,
+                      centerY: n.value.height / 2
+                    }).y,
                     fill: l.color,
                     stroke: e.value.style.chart.backgroundColor,
                     "stroke-width": 1,
                     r: 3,
-                    filter: !e.value.useBlurOnHover || [null, void 0].includes(z.value) || z.value === a ? "" : `url(#blur_${p.value})`,
+                    filter: !e.value.useBlurOnHover || [null, void 0].includes(
+                      z.value
+                    ) || z.value === a ? "" : `url(#blur_${p.value})`,
                     onClick: (r) => ce(l, a),
                     onMouseenter: (r) => ie({
                       datapoint: l,
@@ -1916,7 +2172,10 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                       seriesIndex: l.seriesIndex,
                       show: !0
                     }),
-                    onMouseleave: (r) => fe({ datapoint: l, seriesIndex: l.seriesIndex }),
+                    onMouseleave: (r) => fe({
+                      datapoint: l,
+                      seriesIndex: l.seriesIndex
+                    }),
                     style: L({
                       transition: Y.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
                     })
@@ -1924,9 +2183,23 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                   e.value.style.chart.layout.labels.dataLabels.oneLine ? Pt((u(), i("text", {
                     key: 1,
                     class: "vue-data-ui-datalabel-inline",
-                    "text-anchor": Se(v.value[a].middlePoint),
-                    x: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).x,
-                    y: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).y,
+                    "text-anchor": Se(
+                      v.value[a].middlePoint
+                    ),
+                    x: s(X)({
+                      initX: v.value[a].middlePoint.x,
+                      initY: v.value[a].middlePoint.y,
+                      offset: 42,
+                      centerX: n.value.width / 2,
+                      centerY: n.value.height / 2
+                    }).x,
+                    y: s(X)({
+                      initX: v.value[a].middlePoint.x,
+                      initY: v.value[a].middlePoint.y,
+                      offset: 42,
+                      centerX: n.value.width / 2,
+                      centerY: n.value.height / 2
+                    }).y,
                     style: L({
                       transition: Y.value || !e.value.serieToggleAnimation.show ? "none" : `all ${e.value.serieToggleAnimation.durationMs}ms ease-in-out`
                     }),
@@ -1937,17 +2210,37 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                       seriesIndex: l.seriesIndex,
                       show: !0
                     }),
-                    onMouseleave: (r) => fe({ datapoint: l, seriesIndex: l.seriesIndex }),
+                    onMouseleave: (r) => fe({
+                      datapoint: l,
+                      seriesIndex: l.seriesIndex
+                    }),
                     innerHTML: Dl(l, a)
                   }, null, 44, Ko)), [
-                    [St, ee(l) && x.value.dataLabels.show]
+                    [
+                      St,
+                      ee(l) && x.value.dataLabels.show
+                    ]
                   ]) : (u(), i(P, { key: 2 }, [
                     ee(l) && x.value.dataLabels.show ? (u(), i("text", {
                       key: 0,
                       class: "vue-data-ui-datalabel-value",
-                      "text-anchor": Se(v.value[a].middlePoint),
-                      x: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).x,
-                      y: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).y,
+                      "text-anchor": Se(
+                        v.value[a].middlePoint
+                      ),
+                      x: s(X)({
+                        initX: v.value[a].middlePoint.x,
+                        initY: v.value[a].middlePoint.y,
+                        offset: 42,
+                        centerX: n.value.width / 2,
+                        centerY: n.value.height / 2
+                      }).x,
+                      y: s(X)({
+                        initX: v.value[a].middlePoint.x,
+                        initY: v.value[a].middlePoint.y,
+                        offset: 42,
+                        centerX: n.value.width / 2,
+                        centerY: n.value.height / 2
+                      }).y,
                       fill: e.value.style.chart.layout.labels.percentage.color,
                       "font-size": g.value,
                       style: L({
@@ -1961,14 +2254,31 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                         seriesIndex: l.seriesIndex,
                         show: !0
                       }),
-                      onMouseleave: (r) => fe({ datapoint: l, seriesIndex: l.seriesIndex })
+                      onMouseleave: (r) => fe({
+                        datapoint: l,
+                        seriesIndex: l.seriesIndex
+                      })
                     }, ye(At(l)), 45, Qo)) : d("", !0),
                     ee(l) && x.value.dataLabels.show && e.value.style.chart.layout.labels.name.show ? (u(), i("text", {
                       key: 1,
                       class: "vue-data-ui-datalabel-name",
-                      "text-anchor": Se(v.value[a].middlePoint),
-                      x: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).x,
-                      y: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).y + f.value * 1.2,
+                      "text-anchor": Se(
+                        v.value[a].middlePoint
+                      ),
+                      x: s(X)({
+                        initX: v.value[a].middlePoint.x,
+                        initY: v.value[a].middlePoint.y,
+                        offset: 42,
+                        centerX: n.value.width / 2,
+                        centerY: n.value.height / 2
+                      }).x,
+                      y: s(X)({
+                        initX: v.value[a].middlePoint.x,
+                        initY: v.value[a].middlePoint.y,
+                        offset: 42,
+                        centerX: n.value.width / 2,
+                        centerY: n.value.height / 2
+                      }).y + f.value * 1.2,
                       fill: e.value.style.chart.layout.labels.name.color,
                       "font-size": f.value,
                       style: L({
@@ -1982,13 +2292,28 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                         seriesIndex: l.seriesIndex,
                         show: !0
                       }),
-                      onMouseleave: (r) => fe({ datapoint: l, seriesIndex: l.seriesIndex }),
+                      onMouseleave: (r) => fe({
+                        datapoint: l,
+                        seriesIndex: l.seriesIndex
+                      }),
                       innerHTML: s(wl)({
                         content: l.name,
                         fontSize: f.value,
                         fill: e.value.style.chart.layout.labels.name.color,
-                        x: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).x,
-                        y: s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).y + f.value * 1.2
+                        x: s(X)({
+                          initX: v.value[a].middlePoint.x,
+                          initY: v.value[a].middlePoint.y,
+                          offset: 42,
+                          centerX: n.value.width / 2,
+                          centerY: n.value.height / 2
+                        }).x,
+                        y: s(X)({
+                          initX: v.value[a].middlePoint.x,
+                          initY: v.value[a].middlePoint.y,
+                          offset: 42,
+                          centerX: n.value.width / 2,
+                          centerY: n.value.height / 2
+                        }).y + f.value * 1.2
                       })
                     }, null, 44, Jo)) : d("", !0)
                   ], 64))
@@ -2005,13 +2330,49 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                 }, [
                   w("div", null, [
                     k(t.$slots, "plot-comment", {
-                      plot: { ...l, textAlign: s(A)(l, !0, 16, !0).anchor, flexAlign: s(A)(l, !0, 16).anchor, isFirstLoad: Y.value }
+                      plot: {
+                        ...l,
+                        textAlign: s(A)(
+                          l,
+                          !0,
+                          16,
+                          !0
+                        ).anchor,
+                        flexAlign: s(A)(
+                          l,
+                          !0,
+                          16
+                        ).anchor,
+                        isFirstLoad: Y.value
+                      }
                     }, void 0, !0)
                   ])
                 ], 8, en)) : d("", !0),
                 ee(l) && e.value.type === "polar" ? (u(), i("foreignObject", {
                   key: 1,
-                  x: e.value.style.chart.comments.offsetX + (Se(v.value[a].middlePoint) === "end" ? s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).x - e.value.style.chart.comments.width : Se(v.value[a].middlePoint) === "middle" ? s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).x - e.value.style.chart.comments.width / 2 : s(X)({ initX: v.value[a].middlePoint.x, initY: v.value[a].middlePoint.y, offset: 42, centerX: n.value.width / 2, centerY: n.value.height / 2 }).x),
+                  x: e.value.style.chart.comments.offsetX + (Se(
+                    v.value[a].middlePoint
+                  ) === "end" ? s(X)({
+                    initX: v.value[a].middlePoint.x,
+                    initY: v.value[a].middlePoint.y,
+                    offset: 42,
+                    centerX: n.value.width / 2,
+                    centerY: n.value.height / 2
+                  }).x - e.value.style.chart.comments.width : Se(
+                    v.value[a].middlePoint
+                  ) === "middle" ? s(X)({
+                    initX: v.value[a].middlePoint.x,
+                    initY: v.value[a].middlePoint.y,
+                    offset: 42,
+                    centerX: n.value.width / 2,
+                    centerY: n.value.height / 2
+                  }).x - e.value.style.chart.comments.width / 2 : s(X)({
+                    initX: v.value[a].middlePoint.x,
+                    initY: v.value[a].middlePoint.y,
+                    offset: 42,
+                    centerX: n.value.width / 2,
+                    centerY: n.value.height / 2
+                  }).x),
                   y: Ml(v.value[a]) + e.value.style.chart.comments.offsetY,
                   width: e.value.style.chart.comments.width,
                   height: "200",
@@ -2023,7 +2384,16 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
                 }, [
                   w("div", null, [
                     k(t.$slots, "plot-comment", {
-                      plot: { ...l, textAlign: Se(v.value[a].middlePoint), flexAlign: Se(v.value[a].middlePoint), isFirstLoad: Y.value }
+                      plot: {
+                        ...l,
+                        textAlign: Se(
+                          v.value[a].middlePoint
+                        ),
+                        flexAlign: Se(
+                          v.value[a].middlePoint
+                        ),
+                        isFirstLoad: Y.value
+                      }
                     }, void 0, !0)
                   ])
                 ], 12, tn)) : d("", !0)
@@ -2039,11 +2409,16 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
           ], 512)
         ], 46, Ha)),
         t.$slots.hint ? (u(), i("div", ln, [
-          k(t.$slots, "hint", W(j({ hint: e.value.a11y.translations.keyboardNavigation, isVisible: h.value })), void 0, !0)
+          k(t.$slots, "hint", W(j({
+            hint: e.value.a11y.translations.keyboardNavigation,
+            isVisible: h.value
+          })), void 0, !0)
         ])) : d("", !0)
       ]),
       t.$slots.watermark ? (u(), i("div", an, [
-        k(t.$slots, "watermark", W(j({ isPrinting: s(Ge) || s(xt) || Ve.value || Ee.value })), void 0, !0)
+        k(t.$slots, "watermark", W(j({
+          isPrinting: s(Ge) || s(xt) || Ve.value || Ee.value
+        })), void 0, !0)
       ])) : d("", !0),
       w("div", {
         id: `legend-bottom-${p.value}`
@@ -2226,7 +2601,7 @@ const Ra = ["id"], Va = ["id"], Ea = ["id"], Ua = { style: { position: "relative
       ], !0)
     ], 46, Ra));
   }
-}, Ln = /* @__PURE__ */ Xa(rn, [["__scopeId", "data-v-efe06837"]]);
+}, Ln = /* @__PURE__ */ Xa(rn, [["__scopeId", "data-v-edb07b02"]]);
 export {
   Ln as default
 };