vue-data-ui 3.10.0 → 3.10.2

package/dist/{vue-ui-nested-donuts-cz79gQlJ.js → vue-ui-nested-donuts-ywWUDYjT.js}

@@ -1,42 +1,46 @@
-import { defineAsyncComponent as B, computed as k, ref as v, toRefs as wl, watch as oe, onMounted as Al, shallowRef as kt, onBeforeUnmount as $l, createElementBlock as r, openBlock as n, unref as c, normalizeStyle as he, normalizeClass as H, createBlock as z, createCommentVNode as L, createElementVNode as g, createVNode as Ie, withCtx as p, renderSlot as y, normalizeProps as S, guardReactiveProps as O, createSlots as wt, Fragment as x, renderList as T, toDisplayString as M, withDirectives as At, vShow as $t, Teleport as Ll, resolveDynamicComponent as _l, mergeProps as Fl, createTextVNode as Lt, nextTick as _t } from "vue";
-import { c as xl, t as Tl, i as Dl, j as Ee, a1 as Ve, o as Sl, g as K, k as Ol, a7 as U, m as Nl, a3 as Be, a as fe, d as N, X as Pl, s as Il, G as Ft, a5 as xt, a6 as be, p as Tt, y as Dt, v as El, r as Vl, _ as Bl, ag as St, U as ze } from "./lib-2iaAPQ_c.js";
-import { b as zl } from "./labelUtils-B3mOOEke.js";
-import { t as Ml, u as Ul } from "./useResponsive-DfdjqQps.js";
-import { u as Rl, a as Me } from "./useNestedProp-BCt4DMkT.js";
-import { u as Gl, B as Yl } from "./BaseScanner-BMpwQAfz.js";
-import { u as Wl } from "./usePrinter-ChVMpU2f.js";
-import { u as Xl } from "./useSvgExport-ByUukOZt.js";
-import { u as Hl } from "./useThemeCheck-DGJ31Vi5.js";
-import { u as ql } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as jl } from "./useChartAccessibility-9icAAmYg.js";
-import Jl from "./img-CqYIrJ8I.js";
-import Kl from "./Title-B5L2jweB.js";
-import Ql from "./Legend-D2xmnFPH.js";
-import { _ as Zl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", layout: { donut: { emptyFill: "#3A3A3A" }, labels: { dataLabels: { color: "#CCCCCC" } } }, legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, Nt = { style: { chart: { backgroundColor: "#FFF8E1", color: "#424242", layout: { labels: { dataLabels: { color: "#424242" } } }, legend: { backgroundColor: "#FFF8E1", color: "#424242" }, title: { color: "#424242", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#FFF8E1", color: "#424242" }, td: { backgroundColor: "#FFF8E1", color: "#424242" } } }, Pt = { style: { chart: { backgroundColor: "#1E1E1E", color: "#BDBDBD", layout: { labels: { dataLabels: { color: "#BDBDBD" } } }, legend: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, td: { backgroundColor: "#1E1E1E", color: "#BDBDBD" } } }, It = { style: { chart: { backgroundColor: "#1A1A1A", color: "#99AA99", layout: { labels: { dataLabels: { color: "#AACCAA" } } }, legend: { backgroundColor: "#1A1A1A", color: "#99AA99" }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#2A2F2A", color: "#AACCAA", borderColor: "#66CC66" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#99AA99" }, td: { backgroundColor: "#1A1A1A", color: "#AACCAA" } } }, Et = { style: { chart: { backgroundColor: "#fbfafa", color: "#8A9892", layout: { labels: { dataLabels: { color: "#A0AC94" } } }, legend: { backgroundColor: "#fbfafa", color: "#99AA99" }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#fbfafa", color: "#8A9892" } } }, table: { th: { backgroundColor: "#fbfafa", color: "#8F837A" }, td: { backgroundColor: "#fbfafa", color: "#8F837A" } } }, Vt = { style: { chart: { backgroundColor: "#f6f6fb", color: "#50606C", layout: { labels: { dataLabels: { color: "#61747E" } } }, legend: { backgroundColor: "#f6f6fb", color: "#61747E" }, title: { color: "#50606C", subtitle: { color: "#718890" } }, tooltip: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, table: { th: { backgroundColor: "#f6f6fb", color: "#50606C" }, td: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, Bt = {
+import { defineAsyncComponent as B, computed as k, ref as v, toRefs as $l, watch as oe, onMounted as Ll, shallowRef as kt, onBeforeUnmount as _l, createElementBlock as r, openBlock as n, unref as c, normalizeStyle as he, normalizeClass as H, createBlock as z, createCommentVNode as L, createElementVNode as g, createVNode as Ie, withCtx as p, renderSlot as y, normalizeProps as S, guardReactiveProps as O, createSlots as At, Fragment as x, renderList as T, toDisplayString as M, withDirectives as wt, vShow as $t, Teleport as Fl, resolveDynamicComponent as xl, mergeProps as Tl, createTextVNode as Lt, nextTick as _t } from "vue";
+import { c as Dl, t as Sl, i as Ol, j as Ee, a1 as Ve, o as Nl, g as K, k as Pl, a7 as U, m as Il, a3 as Be, a as fe, d as N, X as El, s as Vl, G as Ft, a5 as xt, a6 as be, p as Tt, y as Dt, v as Bl, r as zl, _ as Ml, ag as St, U as ze } from "./lib-CVHM9FhP.js";
+import { b as Ul } from "./labelUtils-D6Y-n7cD.js";
+import { t as Rl, u as Gl } from "./useResponsive-DfdjqQps.js";
+import { u as Yl, a as Me } from "./useNestedProp-Ckf_2P_V.js";
+import { u as Wl, B as Xl } from "./BaseScanner-BMpwQAfz.js";
+import { u as Hl } from "./usePrinter-1NmjuP-i.js";
+import { u as ql } from "./useSvgExport-ByUukOZt.js";
+import { u as jl } from "./useThemeCheck-D1ZYXUwG.js";
+import { u as Jl } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as Kl } from "./useChartAccessibility-9icAAmYg.js";
+import Ql from "./img-6fNF_rG0.js";
+import Zl from "./Title-NgeRXqRA.js";
+import ea from "./Legend-DN5UJOBH.js";
+import { _ as ta } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const Ot = { userOptions: { show: !1 }, style: { chart: { useGradient: !1, legend: { show: !1 } } } }, Nt = { userOptions: { show: !1 }, style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", useGradient: !1, layout: { donut: { emptyFill: "#3A3A3A" }, labels: { dataLabels: { color: "#CCCCCC" } } }, legend: { show: !1, backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, Pt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", layout: { donut: { emptyFill: "#3A3A3A" }, labels: { dataLabels: { color: "#CCCCCC" } } }, legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, It = { style: { chart: { backgroundColor: "#FFF8E1", color: "#424242", layout: { labels: { dataLabels: { color: "#424242" } } }, legend: { backgroundColor: "#FFF8E1", color: "#424242" }, title: { color: "#424242", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#FFF8E1", color: "#424242" }, td: { backgroundColor: "#FFF8E1", color: "#424242" } } }, Et = { style: { chart: { backgroundColor: "#1E1E1E", color: "#BDBDBD", layout: { labels: { dataLabels: { color: "#BDBDBD" } } }, legend: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, td: { backgroundColor: "#1E1E1E", color: "#BDBDBD" } } }, Vt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#99AA99", layout: { labels: { dataLabels: { color: "#AACCAA" } } }, legend: { backgroundColor: "#1A1A1A", color: "#99AA99" }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#2A2F2A", color: "#AACCAA", borderColor: "#66CC66" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#99AA99" }, td: { backgroundColor: "#1A1A1A", color: "#AACCAA" } } }, Bt = { style: { chart: { backgroundColor: "#fbfafa", color: "#8A9892", layout: { labels: { dataLabels: { color: "#A0AC94" } } }, legend: { backgroundColor: "#fbfafa", color: "#99AA99" }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#fbfafa", color: "#8A9892" } } }, table: { th: { backgroundColor: "#fbfafa", color: "#8F837A" }, td: { backgroundColor: "#fbfafa", color: "#8F837A" } } }, zt = { style: { chart: { backgroundColor: "#f6f6fb", color: "#50606C", layout: { labels: { dataLabels: { color: "#61747E" } } }, legend: { backgroundColor: "#f6f6fb", color: "#61747E" }, title: { color: "#50606C", subtitle: { color: "#718890" } }, tooltip: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, table: { th: { backgroundColor: "#f6f6fb", color: "#50606C" }, td: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, Mt = {
   default: {},
-  dark: Ot,
-  celebration: Nt,
-  celebrationNight: Pt,
-  hack: It,
-  zen: Et,
-  concrete: Vt
-}, Ha = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  minimal: Ot,
+  minimalDark: Nt,
+  dark: Pt,
+  celebration: It,
+  celebrationNight: Et,
+  hack: Vt,
+  zen: Bt,
+  concrete: zt
+}, ja = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  celebration: Nt,
-  celebrationNight: Pt,
-  concrete: Vt,
-  dark: Ot,
-  default: Bt,
-  hack: It,
-  zen: Et
-}, Symbol.toStringTag, { value: "Module" })), ea = ["id"], ta = ["id"], la = ["xmlns", "viewBox"], aa = ["width", "height"], oa = ["id"], sa = ["offset", "stop-color"], na = ["offset", "stop-opacity"], ua = ["id"], ra = ["id"], ia = ["id"], ca = ["flood-color"], da = ["id", "d"], va = ["d", "fill", "stroke", "stroke-width", "filter"], ha = ["d", "fill", "stroke", "stroke-width"], fa = { key: 1 }, ba = ["d", "fill"], ga = { key: 2 }, pa = ["font-size", "font-weight", "fill", "dy"], ya = ["href"], ma = ["x", "y", "font-size", "font-weight", "fill"], Ca = { key: 3 }, ka = ["filter"], wa = ["opacity", "text-anchor", "x", "y", "fill", "font-size", "font-weight"], Aa = ["opacity", "text-anchor", "x", "y", "fill", "font-size", "font-weight"], $a = ["d", "fill", "onMouseenter", "onClick", "onMouseleave"], La = {
+  celebration: It,
+  celebrationNight: Et,
+  concrete: zt,
+  dark: Pt,
+  default: Mt,
+  hack: Vt,
+  minimal: Ot,
+  minimalDark: Nt,
+  zen: Bt
+}, Symbol.toStringTag, { value: "Module" })), la = ["id"], aa = ["id"], oa = ["xmlns", "viewBox"], sa = ["width", "height"], na = ["id"], ua = ["offset", "stop-color"], ra = ["offset", "stop-opacity"], ia = ["id"], ca = ["id"], da = ["id"], va = ["flood-color"], ha = ["id", "d"], fa = ["d", "fill", "stroke", "stroke-width", "filter"], ba = ["d", "fill", "stroke", "stroke-width"], ga = { key: 1 }, pa = ["d", "fill"], ya = { key: 2 }, ma = ["font-size", "font-weight", "fill", "dy"], Ca = ["href"], ka = ["x", "y", "font-size", "font-weight", "fill"], Aa = { key: 3 }, wa = ["filter"], $a = ["opacity", "text-anchor", "x", "y", "fill", "font-size", "font-weight"], La = ["opacity", "text-anchor", "x", "y", "fill", "font-size", "font-weight"], _a = ["d", "fill", "onMouseenter", "onClick", "onMouseleave"], Fa = {
   key: 4,
   class: "vue-data-ui-watermark"
-}, _a = ["id"], Fa = {
+}, xa = ["id"], Ta = {
   key: 0,
   class: "vue-ui-nested-donuts-legend-title"
-}, xa = ["onClick"], Ta = ["innerHTML"], Da = {
+}, Da = ["onClick"], Sa = ["innerHTML"], Oa = {
   __name: "vue-ui-nested-donuts",
   props: {
     config: {
@@ -53,15 +57,15 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
     }
   },
   emits: ["selectLegend", "selectDatapoint"],
-  setup(zt, { expose: Mt, emit: Ut }) {
-    const Rt = B(() => import("./Tooltip-DpfUZbt7.js")), Gt = B(() => import("./BaseIcon-B9bGT7HU.js")), Yt = B(() => import("./vue-ui-accordion-CAXPDm31.js")), Wt = B(() => import("./DataTable-DEwh__D8.js")), Xt = B(() => import("./UserOptions-5pXc4J-c.js")), Ht = B(() => import("./PenAndPaper-CulSakut.js")), qt = B(() => import("./PackageVersion-C-JOGZBL.js")), jt = B(() => import("./BaseDraggableDialog-O2XSymlZ.js")), { vue_ui_nested_donuts: Jt } = Rl(), { isThemeValid: Kt, warnInvalidTheme: Qt } = Hl(), w = zt, ge = k({
+  setup(Ut, { expose: Rt, emit: Gt }) {
+    const Yt = B(() => import("./Tooltip-B6qvABDL.js")), Wt = B(() => import("./BaseIcon-4uOct8re.js")), Xt = B(() => import("./vue-ui-accordion-DFKaB_05.js")), Ht = B(() => import("./DataTable-DyoDzNNY.js")), qt = B(() => import("./UserOptions-CX7Xsusk.js")), jt = B(() => import("./PenAndPaper-LTuSTmWE.js")), Jt = B(() => import("./PackageVersion-CQxJyGQr.js")), Kt = B(() => import("./BaseDraggableDialog-BQYfVNu8.js")), { vue_ui_nested_donuts: Qt } = Yl(), { isThemeValid: Zt, warnInvalidTheme: el } = jl(), A = Ut, ge = k({
       get() {
-        return !!w.dataset && w.dataset.length;
+        return !!A.dataset && A.dataset.length;
       },
       set(t) {
         return t;
       }
-    }), b = v(xl()), pe = v(!1), ye = v(""), me = v(null), Ue = v(0), P = v(null), Re = v(null), Ce = v(null), Ge = v(null), Ye = v(null), We = v(0), Xe = v(0), He = v(0), R = v(!0), G = v([]), Q = v([]), qe = v(!1), Z = v(null), ke = v(null), Y = v(!1);
+    }), b = v(Dl()), pe = v(!1), ye = v(""), me = v(null), Ue = v(0), P = v(null), Re = v(null), Ce = v(null), Ge = v(null), Ye = v(null), We = v(0), Xe = v(0), He = v(0), R = v(!0), G = v([]), Q = v([]), qe = v(!1), Z = v(null), ke = v(null), Y = v(!1);
     function je(t) {
       Y.value = t, Ue.value += 1;
     }
@@ -84,8 +88,8 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           color: "#CACACA"
         }
       ]
-    }, { loading: we, FINAL_DATASET: W, manualLoading: Ae } = Gl({
-      ...wl(w),
+    }, { loading: Ae, FINAL_DATASET: W, manualLoading: we } = Wl({
+      ...$l(A),
       FINAL_CONFIG: e,
       prepareConfig: Le,
       callback: () => {
@@ -94,7 +98,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         });
       },
       skeletonDataset: [Je, Je],
-      skeletonConfig: Tl({
+      skeletonConfig: Sl({
         defaultConfig: e.value,
         userConfig: {
           useCssAnimation: !1,
@@ -120,40 +124,40 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           }
         }
       })
-    }), { userOptionsVisible: $e, setUserOptionsVisibility: Ke, keepUserOptionState: Qe } = ql({ config: e.value }), { svgRef: ee } = jl({
+    }), { userOptionsVisible: $e, setUserOptionsVisibility: Ke, keepUserOptionState: Qe } = Jl({ config: e.value }), { svgRef: ee } = Kl({
       config: e.value.style.chart.title
     });
     function Le() {
       const t = Me({
-        userConfig: w.config,
-        defaultConfig: Jt
+        userConfig: A.config,
+        defaultConfig: Qt
       });
       let s = {};
       const l = t.theme;
       if (l)
-        if (!Kt.value(t))
-          Qt(t), s = t;
+        if (!Zt.value(t))
+          el(t), s = t;
         else {
           const o = Me({
-            userConfig: Bt[l] || w.config,
+            userConfig: Mt[l] || A.config,
             defaultConfig: t
           });
           s = {
             ...Me({
-              userConfig: w.config,
+              userConfig: A.config,
               defaultConfig: o
             }),
-            customPalette: t.customPalette.length ? t.customPalette : Dl[l] || Ee
+            customPalette: t.customPalette.length ? t.customPalette : Ol[l] || Ee
           };
         }
       else
         s = t;
-      return w.config && Ve(w.config, "events.datapointEnter") ? s.events.datapointEnter = w.config.events.datapointEnter : s.events.datapointEnter = null, w.config && Ve(w.config, "events.datapointLeave") ? s.events.datapointLeave = w.config.events.datapointLeave : s.events.datapointLeave = null, w.config && Ve(w.config, "events.datapointClick") ? s.events.datapointClick = w.config.events.datapointClick : s.events.datapointClick = null, s;
+      return A.config && Ve(A.config, "events.datapointEnter") ? s.events.datapointEnter = A.config.events.datapointEnter : s.events.datapointEnter = null, A.config && Ve(A.config, "events.datapointLeave") ? s.events.datapointLeave = A.config.events.datapointLeave : s.events.datapointLeave = null, A.config && Ve(A.config, "events.datapointClick") ? s.events.datapointClick = A.config.events.datapointClick : s.events.datapointClick = null, s;
     }
     oe(
-      () => w.config,
+      () => A.config,
       (t) => {
-        we.value || (e.value = Le()), $e.value = !e.value.userOptions.showOnChartHover, tt(), We.value += 1, Xe.value += 1, He.value += 1, _.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, _.value.showTable = e.value.table.show, _.value.showTooltip = e.value.style.chart.tooltip.show, h.value.width = e.value.style.chart.width, h.value.height = e.value.style.chart.height;
+        Ae.value || (e.value = Le()), $e.value = !e.value.userOptions.showOnChartHover, tt(), We.value += 1, Xe.value += 1, He.value += 1, _.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, _.value.showTable = e.value.table.show, _.value.showTooltip = e.value.style.chart.tooltip.show, h.value.width = e.value.style.chart.width, h.value.height = e.value.style.chart.height;
       },
       { deep: !0 }
     );
@@ -167,7 +171,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         left: o
       };
     });
-    function Zt(t, s = 1e3, l = 50) {
+    function tl(t, s = 1e3, l = 50) {
       return new Promise((o) => {
         const a = t.length;
         G.value = Array(a).fill(0), Q.value = [];
@@ -180,11 +184,11 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               G.value[f] = ae, G.value = [...G.value];
               const de = [];
               let De = 0;
-              w.dataset.forEach((ve, Se) => {
-                const yl = ze(ve.series.reduce(
-                  (Ne, Pe) => Ne + ze(U(Pe.values).reduce((Cl, kl) => Cl + kl, 0)),
+              A.dataset.forEach((ve, Se) => {
+                const Cl = ze(ve.series.reduce(
+                  (Ne, Pe) => Ne + ze(U(Pe.values).reduce((Al, wl) => Al + wl, 0)),
                   0
-                )), ml = ze(G.value.slice(De, De + ve.series.length).reduce((Ne, Pe) => Ne + Pe, 0)), Oe = yl - ml;
+                )), kl = ze(G.value.slice(De, De + ve.series.length).reduce((Ne, Pe) => Ne + Pe, 0)), Oe = Cl - kl;
                 Oe > Number.MIN_VALUE && de.push({
                   name: "__ghost__",
                   arcOf: ve.name,
@@ -228,7 +232,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
             absoluteValues: [],
             ghost: !0
           };
-        }), await _t(), Zt(
+        }), await _t(), tl(
           s,
           e.value.startAnimation.durationMs,
           e.value.startAnimation.staggerMs
@@ -238,18 +242,18 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       } else
         R.value = !1;
     }
-    Al(async () => {
+    Ll(async () => {
       qe.value = !0, tt(), await et();
     });
     const E = kt(null), q = kt(null), j = k(() => !!e.value.debug);
     function tt() {
-      if (Sl(w.dataset) ? (K({
+      if (Nl(A.dataset) ? (K({
         componentName: "VueUiNestedDonuts",
         type: "dataset",
         debug: j.value
-      }), ge.value = !1, Ae.value = !0) : Ae.value = e.value.loading, e.value.responsive) {
-        const t = Ml(() => {
-          const { width: s, height: l } = Ul({
+      }), ge.value = !1, we.value = !0) : we.value = e.value.loading, e.value.responsive) {
+        const t = Rl(() => {
+          const { width: s, height: l } = Gl({
             chart: P.value,
             title: e.value.style.chart.title.text ? Re.value : null,
             legend: e.value.style.chart.legend.show ? Ce.value : null,
@@ -264,14 +268,14 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         E.value && (q.value && E.value.unobserve(q.value), E.value.disconnect()), E.value = new ResizeObserver(t), q.value = P.value.parentNode, E.value.observe(q.value);
       }
     }
-    $l(() => {
+    _l(() => {
       E.value && (q.value && E.value.unobserve(q.value), E.value.disconnect());
     });
-    const { isPrinting: lt, isImaging: at, generatePdf: ot, generateImage: st } = Wl({
+    const { isPrinting: lt, isImaging: at, generatePdf: ot, generateImage: st } = Hl({
       elementId: `nested_donuts_${b.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-nested-donuts",
       options: e.value.userOptions.print
-    }), el = k(() => e.value.userOptions.show && !e.value.style.chart.title.text), tl = k(() => Ol(e.value.customPalette)), _ = v({
+    }), ll = k(() => e.value.userOptions.show && !e.value.style.chart.title.text), al = k(() => Pl(e.value.customPalette)), _ = v({
       dataLabels: {
         show: e.value.style.chart.layout.labels.dataLabels.show
       },
@@ -290,8 +294,8 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
     const h = v({
       width: e.value.style.chart.width,
       height: e.value.style.chart.height
-    }), nt = Ut;
-    function ll({ datapoint: t, index: s, seriesIndex: l }) {
+    }), nt = Gt;
+    function ol({ datapoint: t, index: s, seriesIndex: l }) {
       e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: l }), nt("selectDatapoint", { datapoint: t, index: s });
     }
     function ut({
@@ -310,7 +314,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       requestAnimationFrame(f);
     }
     const C = v([]), D = k(() => {
-      we.value, W.value.forEach((s, l) => {
+      Ae.value, W.value.forEach((s, l) => {
         [null, void 0].includes(s.name) && K({
           componentName: "VueUiNestedDonuts",
           type: "datasetSerieAttribute",
@@ -361,15 +365,15 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
             id: `${b.value}_${l}_${a}`,
             seriesIndex: a,
             datasetIndex: l,
-            color: Nl(o.color) || tl.value[a] || Ee[a % Ee.length],
+            color: Il(o.color) || al.value[a] || Ee[a % Ee.length],
             value: R.value ? G.value[t++] ?? 0 : u,
             absoluteValues: o.values || []
           };
         })
       }));
     });
-    oe(() => w.dataset, (t) => {
-      Array.isArray(t) && t.length > 0 && (Ae.value = !1);
+    oe(() => A.dataset, (t) => {
+      Array.isArray(t) && t.length > 0 && (we.value = !1);
     }, { immediate: !0 });
     const I = k(() => Math.min(h.value.height, h.value.width) * (e.value.style.chart.layout.donut.strokeWidth / 512)), rt = k(() => [...D.value].map((t, s) => {
       const l = t.series.filter((o) => !C.value.includes(o.id)).map((o) => o.value).reduce((o, a) => o + a, 0);
@@ -382,20 +386,20 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         }))
       };
     }));
-    function al(t, s, l) {
+    function sl(t, s, l) {
       let o = 0;
       for (let a = 0; a < t.length; a += 1)
         l.includes(t[a]) && (o += 1);
       return o < s;
     }
-    const A = v(rt.value);
+    const w = v(rt.value);
     oe(
       () => rt.value,
-      (t) => A.value = t
+      (t) => w.value = t
     );
     function X(t) {
       nt("selectLegend", t);
-      const s = w.dataset.flatMap(
+      const s = A.dataset.flatMap(
         (i, m) => i.series.map((F, le) => ({
           value: U(F.values).reduce((ae, de) => ae + de, 0),
           id: `${b.value}_${m}_${le}`,
@@ -403,13 +407,13 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         }))
       ).find((i) => i.id === t.id);
       if (!s) return;
-      const l = D.value.flatMap((i) => i.series).find((i) => i.id === t.id)?.value ?? 0, o = A.value.flatMap((i) => i.series).find((i) => i.id === t.id);
+      const l = D.value.flatMap((i) => i.series).find((i) => i.id === t.id)?.value ?? 0, o = w.value.flatMap((i) => i.series).find((i) => i.id === t.id);
       let u = o ? o.value : 0;
       const d = D.value.find(
         (i) => i.id === s.arcOfId
       );
       if (!d) return;
-      const f = d.series.map((i) => i.id), $ = al(
+      const f = d.series.map((i) => i.id), $ = sl(
         f,
         f.length - 1,
         C.value
@@ -419,12 +423,12 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         to: l,
         duration: e.value.serieToggleAnimation.durationMs,
         onUpdate: (i) => {
-          A.value = A.value.map((m) => ({
+          w.value = w.value.map((m) => ({
             ...m,
             series: m.series.map((F) => F.id === t.id ? { ...F, value: i } : F)
           }));
         }
-      }) : A.value = A.value.map((i) => ({
+      }) : w.value = w.value.map((i) => ({
         ...i,
         series: i.series.map((m) => m.id === t.id ? { ...m, value: l } : m)
       }))) : $ && (e.value.serieToggleAnimation.show ? ut({
@@ -432,7 +436,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         to: 0,
         duration: e.value.serieToggleAnimation.durationMs,
         onUpdate: (i) => {
-          A.value = A.value.map((m) => ({
+          w.value = w.value.map((m) => ({
             ...m,
             series: m.series.map((F) => F.id === t.id ? { ...F, value: i } : F)
           }));
@@ -440,7 +444,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         onDone: () => {
           C.value.push(t.id);
         }
-      }) : (A.value = A.value.map((i) => ({
+      }) : (w.value = w.value.map((i) => ({
         ...i,
         series: i.series.map((m) => m.id === t.id ? { ...m, value: 0 } : m)
       })), C.value.push(t.id)));
@@ -451,20 +455,20 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       const s = D.value.flatMap((l) => l.series).filter((l) => l.name === t);
       return s || (e.value.debug && console.warn(`VueUiNestedDonuts - Series name not found "${t}"`), null);
     }
-    function ol(t) {
+    function nl(t) {
       const s = it(t);
       s !== null && (Array.isArray(s) ? s.forEach((l) => {
         C.value.includes(l.id) && X({ id: l.id });
       }) : C.value.includes(s.id) && X({ id: s.id }));
     }
-    function sl(t) {
+    function ul(t) {
       const s = it(t);
       s !== null && (Array.isArray(s) ? s.forEach((l) => {
         C.value.includes(l.id) || X({ id: l.id });
       }) : C.value.includes(s.id) || X({ id: s.id }));
     }
-    const se = k(() => I.value / D.value.length * e.value.style.chart.layout.donut.spacingRatio), ct = k(() => A.value.map((t, s) => I.value - s * I.value / D.value.length)), J = k(() => A.value.map((t, s) => {
-      const l = Math.abs(t.series.map(($) => $.value).reduce(($, i) => $ + i, 0)) > 0, o = I.value - s * I.value / A.value.length, a = R.value ? Q.value.find(($) => $.datasetIndex === s) : null, u = [...t.series, ...a ? [a] : []].map(($) => ({
+    const se = k(() => I.value / D.value.length * e.value.style.chart.layout.donut.spacingRatio), ct = k(() => w.value.map((t, s) => I.value - s * I.value / D.value.length)), J = k(() => w.value.map((t, s) => {
+      const l = Math.abs(t.series.map(($) => $.value).reduce(($, i) => $ + i, 0)) > 0, o = I.value - s * I.value / w.value.length, a = R.value ? Q.value.find(($) => $.datasetIndex === s) : null, u = [...t.series, ...a ? [a] : []].map(($) => ({
         ...$,
         value: $.value < 1e-11 ? Number.MIN_VALUE : $.value
       })), d = Be(
@@ -523,7 +527,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         )[0]
       };
     })), vt = v(null), ne = v(null), ue = v(null), _e = v(null);
-    function nl({ datapoint: t, seriesIndex: s }) {
+    function rl({ datapoint: t, seriesIndex: s }) {
       e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: s }), pe.value = !1, vt.value = null, me.value = null, ne.value = null, ue.value = null;
     }
     function ht({
@@ -533,7 +537,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       showPercentage: o,
       config: a
     }) {
-      return zl({
+      return Ul({
         config: a,
         val: t,
         percentage: s,
@@ -541,32 +545,32 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         showPercentage: o
       });
     }
-    function ul({ datapoint: t, _relativeIndex: s, seriesIndex: l }) {
+    function il({ datapoint: t, _relativeIndex: s, seriesIndex: l }) {
       e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: l }), vt.value = t.arcOfId, ne.value = t.id, ue.value = l, me.value = t.id, _e.value = {
         datapoint: t,
         seriesIndex: l,
-        series: A.value,
+        series: w.value,
         config: e.value
       };
       const o = e.value.style.chart.tooltip.customFormat;
-      if (Dt(o) && Bl(
+      if (Dt(o) && Ml(
         () => o({
           seriesIndex: l,
           datapoint: t,
-          series: A.value,
+          series: w.value,
           config: e.value
         })
       ))
         ye.value = o({
           seriesIndex: l,
           datapoint: t,
-          series: A.value,
+          series: w.value,
           config: e.value
         });
       else {
         let a = "";
         if (e.value.style.chart.tooltip.showAllItemsAtIndex && C.value.length === 0) {
-          const u = A.value.map((d) => d.series.find((f) => f.seriesIndex === l));
+          const u = w.value.map((d) => d.series.find((f) => f.seriesIndex === l));
           u.forEach((d, f) => {
             if (!d) return "";
             a += `
@@ -695,7 +699,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           isSegregated: C.value.includes(a.id)
         };
       });
-    })), rl = k(() => ({
+    })), cl = k(() => ({
       cy: "nested-donuts-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
@@ -703,11 +707,11 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       paddingBottom: 12,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
     })), V = k(() => {
-      const t = A.value.flatMap((l) => l.series.map((o) => ({
+      const t = w.value.flatMap((l) => l.series.map((o) => ({
         name: `${l.name} - ${o.name}`,
         color: o.color,
         total: l.total
-      }))), s = A.value.flatMap((l) => l.series.map((o) => o.value));
+      }))), s = w.value.flatMap((l) => l.series.map((o) => o.value));
       return { head: t, body: s };
     });
     function Fe(t = null) {
@@ -722,8 +726,8 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           [e.value.style.chart.title.text],
           [e.value.style.chart.title.subtitle.text],
           [[""], ["val"], ["%"]]
-        ].concat(s), o = El(l);
-        t ? t(o) : Vl({
+        ].concat(s), o = Bl(l);
+        t ? t(o) : zl({
           csvContent: o,
           title: e.value.style.chart.title.text || "vue-ui-nested-donuts"
         });
@@ -777,7 +781,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         config: l
       };
     });
-    function il() {
+    function dl() {
       return D.value;
     }
     function gt() {
@@ -793,9 +797,9 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
     function xe() {
       ce.value = !ce.value;
     }
-    async function cl({ scale: t = 2 } = {}) {
+    async function vl({ scale: t = 2 } = {}) {
       if (!P.value) return;
-      const { width: s, height: l } = P.value.getBoundingClientRect(), o = s / l, { imageUri: a, base64: u } = await Jl({ domElement: P.value, base64: !0, img: !0, scale: t });
+      const { width: s, height: l } = P.value.getBoundingClientRect(), o = s / l, { imageUri: a, base64: u } = await Ql({ domElement: P.value, base64: !0, img: !0, scale: t });
       return {
         imageUri: a,
         base64: u,
@@ -806,7 +810,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       };
     }
     const Te = v(null);
-    function dl() {
+    function hl() {
       if (!Te.value) return;
       const { x: t, y: s, width: l, height: o } = Te.value.getBBox();
       ee.value && ee.value.setAttribute("viewBox", `${t} ${s} ${l + Math.min(0, t)} ${o + Math.min(0, s)}`);
@@ -814,7 +818,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
     const te = k(() => {
       const t = e.value.table.useDialog && !e.value.table.show, s = _.value.showTable;
       return {
-        component: t ? jt : Yt,
+        component: t ? Kt : Xt,
         title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
         props: t ? {
           backgroundColor: e.value.table.th.backgroundColor,
@@ -847,33 +851,33 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
     function mt() {
       _.value.showTable = !1, ke.value && ke.value.setTableIconState(!1);
     }
-    const vl = k(() => e.value.style.chart.backgroundColor), hl = k(() => e.value.style.chart.legend), fl = k(() => e.value.style.chart.title), bl = k(() => re.value.flat().map((t) => ({
+    const fl = k(() => e.value.style.chart.backgroundColor), bl = k(() => e.value.style.chart.legend), gl = k(() => e.value.style.chart.title), pl = k(() => re.value.flat().map((t) => ({
       ...t,
       name: t.svgDisplay
-    }))), { exportSvg: gl, getSvg: pl } = Xl({
+    }))), { exportSvg: yl, getSvg: ml } = ql({
       svg: ee,
-      title: fl,
-      legend: hl,
-      legendItems: bl,
-      backgroundColor: vl
+      title: gl,
+      legend: bl,
+      legendItems: pl,
+      backgroundColor: fl
     });
     async function Ct({ isCb: t }) {
       if (t) {
-        const { blob: s, url: l, text: o, dataUrl: a } = await pl();
+        const { blob: s, url: l, text: o, dataUrl: a } = await ml();
         e.value.userOptions.callbacks.svg({ blob: s, url: l, text: o, dataUrl: a });
       } else
-        gl();
+        yl();
     }
-    return Mt({
-      autoSize: dl,
-      getData: il,
-      getImage: cl,
+    return Rt({
+      autoSize: hl,
+      getData: dl,
+      getImage: vl,
       generatePdf: ot,
       generateCsv: Fe,
       generateImage: st,
       generateSvg: Ct,
-      hideSeries: sl,
-      showSeries: ol,
+      hideSeries: ul,
+      showSeries: nl,
       toggleTable: gt,
       toggleLabels: pt,
       toggleTooltip: yt,
@@ -888,7 +892,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       onMouseenter: s[2] || (s[2] = () => c(Ke)(!0)),
       onMouseleave: s[3] || (s[3] = () => c(Ke)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (n(), z(c(Ht), {
+      e.value.userOptions.buttons.annotator ? (n(), z(c(jt), {
         key: 0,
         svgRef: c(ee),
         backgroundColor: e.value.style.chart.backgroundColor,
@@ -916,7 +920,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         ]),
         _: 3
       }, 8, ["svgRef", "backgroundColor", "color", "active"])) : L("", !0),
-      el.value ? (n(), r("div", {
+      ll.value ? (n(), r("div", {
         key: 1,
         ref_key: "noTitle",
         ref: Ye,
@@ -928,7 +932,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         ref_key: "chartTitle",
         ref: Re
       }, [
-        (n(), z(Kl, {
+        (n(), z(Zl, {
           key: `title_${We.value}`,
           config: {
             title: {
@@ -944,8 +948,8 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       ], 512)) : L("", !0),
       g("div", {
         id: `legend-top-${b.value}`
-      }, null, 8, ta),
-      e.value.userOptions.show && ge.value && (c(Qe) || c($e)) ? (n(), z(c(Xt), {
+      }, null, 8, aa),
+      e.value.userOptions.show && ge.value && (c(Qe) || c($e)) ? (n(), z(c(qt), {
         ref_key: "userOptionsRef",
         ref: ke,
         key: `user_option_${Ue.value}`,
@@ -984,7 +988,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         style: he({
           visibility: c(Qe) ? c($e) ? "visible" : "hidden" : "visible"
         })
-      }, wt({ _: 2 }, [
+      }, At({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
           fn: p(({ isOpen: l, color: o }) => [
@@ -1059,7 +1063,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       (n(), r("svg", {
         ref_key: "svgRef",
         ref: ee,
-        xmlns: c(Pl),
+        xmlns: c(El),
         class: H({
           "vue-data-ui-fullscreen--on": Y.value,
           "vue-data-ui-fulscreen--off": !Y.value,
@@ -1073,7 +1077,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           ref: Te,
           class: "vue-data-ui-g"
         }, [
-          Ie(c(qt)),
+          Ie(c(Jt)),
           t.$slots["chart-background"] ? (n(), r("foreignObject", {
             key: 0,
             x: 0,
@@ -1085,7 +1089,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
             }
           }, [
             y(t.$slots, "chart-background", {}, void 0, !0)
-          ], 8, aa)) : L("", !0),
+          ], 8, sa)) : L("", !0),
           g("defs", null, [
             (n(!0), r(x, null, T(dt.value, (l, o) => (n(), r("radialGradient", {
               id: `radial_${b.value}_${o}`
@@ -1097,20 +1101,20 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               }, null, -1)),
               g("stop", {
                 offset: `${(1 - se.value / ct.value[o]) * 100}%`,
-                "stop-color": c(Il)("#FFFFFF", 0),
+                "stop-color": c(Vl)("#FFFFFF", 0),
                 "stop-opacity": "0"
-              }, null, 8, sa),
+              }, null, 8, ua),
               g("stop", {
                 offset: `${(1 - se.value / ct.value[o] / 2) * 100}%`,
                 "stop-color": "#FFFFFF",
                 "stop-opacity": e.value.style.chart.gradientIntensity / 100
-              }, null, 8, na),
+              }, null, 8, ra),
               s[5] || (s[5] = g("stop", {
                 offset: "100%",
                 "stop-color": "#FFFFFF",
                 "stop-opacity": "0"
               }, null, -1))
-            ], 8, oa))), 256))
+            ], 8, na))), 256))
           ]),
           g("defs", null, [
             g("filter", {
@@ -1124,12 +1128,12 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                 in: "SourceGraphic",
                 stdDeviation: 2,
                 id: `blur_std_${b.value}`
-              }, null, 8, ra),
+              }, null, 8, ca),
               s[6] || (s[6] = g("feColorMatrix", {
                 type: "saturate",
                 values: "0"
               }, null, -1))
-            ], 8, ua),
+            ], 8, ia),
             g("filter", {
               id: `shadow_${b.value}`,
               "color-interpolation-filters": "sRGB"
@@ -1140,8 +1144,8 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                 stdDeviation: "10",
                 "flood-opacity": "0.5",
                 "flood-color": e.value.style.chart.layout.donut.shadowColor
-              }, null, 8, ca)
-            ], 8, ia)
+              }, null, 8, va)
+            ], 8, da)
           ]),
           g("defs", null, [
             (n(!0), r(x, null, T(J.value, (l, o) => (n(), r("path", {
@@ -1149,7 +1153,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               id: `path-full-${o}-${b.value}`,
               d: l.fullCirclePath,
               fill: "none"
-            }, null, 8, da))), 128))
+            }, null, 8, ha))), 128))
           ]),
           (n(!0), r(x, null, T(J.value, (l, o) => (n(), r("g", null, [
             l.hasData ? (n(!0), r(x, { key: 0 }, T(l.donut.filter((a) => !a.ghost), (a, u) => (n(), r("g", null, [
@@ -1160,7 +1164,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                 stroke: e.value.style.chart.layout.donut.borderColorAuto ? e.value.style.chart.backgroundColor : e.value.style.chart.layout.donut.borderColor,
                 "stroke-width": e.value.style.chart.layout.donut.borderWidth,
                 filter: bt(a, u)
-              }, null, 8, va)
+              }, null, 8, fa)
             ]))), 256)) : (n(!0), r(x, { key: 1 }, T(l.skeleton, (a, u) => (n(), r("g", null, [
               g("path", {
                 class: "vue-ui-donut-arc-path",
@@ -1168,20 +1172,20 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                 fill: a.color,
                 stroke: e.value.style.chart.layout.donut.borderColorAuto ? e.value.style.chart.backgroundColor : e.value.style.chart.layout.donut.borderColor,
                 "stroke-width": e.value.style.chart.layout.donut.borderWidth
-              }, null, 8, ha)
+              }, null, 8, ba)
             ]))), 256))
           ]))), 256)),
-          e.value.style.chart.useGradient ? (n(), r("g", fa, [
+          e.value.style.chart.useGradient ? (n(), r("g", ga, [
             (n(!0), r(x, null, T(dt.value, (l, o) => (n(), r("g", null, [
               g("path", {
                 d: l.donut.arcSlice,
                 fill: `url(#radial_${b.value}_${o})`,
                 stroke: "transparent",
                 "stroke-width": "0"
-              }, null, 8, ba)
+              }, null, 8, pa)
             ]))), 256))
           ])) : L("", !0),
-          e.value.style.chart.layout.labels.dataLabels.showDonutName ? (n(), r("g", ga, [
+          e.value.style.chart.layout.labels.dataLabels.showDonutName ? (n(), r("g", ya, [
             e.value.style.chart.layout.labels.dataLabels.curvedDonutName ? (n(!0), r(x, { key: 0 }, T(J.value, (l, o) => (n(), r("g", null, [
               (n(!0), r(x, null, T(l.donut, (a, u) => (n(), r("g", null, [
                 u === 0 && h.value.width && h.value.height ? (n(), r("text", {
@@ -1202,8 +1206,8 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                   }, M(e.value.style.chart.layout.labels.dataLabels.donutNameAbbreviation ? c(Ft)({
                     source: l.name,
                     length: e.value.style.chart.layout.labels.dataLabels.donutNameMaxAbbreviationSize
-                  }) : l.name), 9, ya)
-                ], 10, pa)) : L("", !0)
+                  }) : l.name), 9, Ca)
+                ], 10, ma)) : L("", !0)
               ]))), 256))
             ]))), 256)) : (n(!0), r(x, { key: 1 }, T(J.value, (l, o) => (n(), r("g", null, [
               (n(!0), r(x, null, T(l.donut, (a, u) => (n(), r("g", null, [
@@ -1219,16 +1223,16 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                 }, M(e.value.style.chart.layout.labels.dataLabels.donutNameAbbreviation ? c(Ft)({
                   source: l.name,
                   length: e.value.style.chart.layout.labels.dataLabels.donutNameMaxAbbreviationSize
-                }) : l.name), 11, ma)) : L("", !0)
+                }) : l.name), 11, ka)) : L("", !0)
               ]))), 256))
             ]))), 256))
           ])) : L("", !0),
-          e.value.style.chart.layout.labels.dataLabels.show ? (n(), r("g", Ca, [
+          e.value.style.chart.layout.labels.dataLabels.show ? (n(), r("g", Aa, [
             (n(!0), r(x, null, T(J.value, (l, o) => (n(), r("g", null, [
               (n(!0), r(x, null, T(l.donut.filter((a) => !a.ghost), (a, u) => (n(), r("g", {
                 filter: bt(a, u)
               }, [
-                At(g("text", {
+                wt(g("text", {
                   class: H({ animated: e.value.useCssAnimation }),
                   opacity: ft(a) ? 1 : 0,
                   "text-anchor": c(be)(a, !0).anchor,
@@ -1253,10 +1257,10 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                   }),
                   e.value.style.chart.layout.labels.dataLabels.usePercentageParens ? "(" : "",
                   e.value.style.chart.layout.labels.dataLabels.usePercentageParens ? ")" : ""
-                )), 11, wa), [
+                )), 11, $a), [
                   [$t, _.value.dataLabels.show && e.value.style.chart.layout.labels.dataLabels.showPercentage]
                 ]),
-                At(g("text", {
+                wt(g("text", {
                   class: H({ animated: e.value.useCssAnimation }),
                   opacity: ft(a) ? 1 : 0,
                   "text-anchor": c(be)(a, !0).anchor,
@@ -1287,10 +1291,10 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                   ),
                   e.value.style.chart.layout.labels.dataLabels.useValueParens ? "(" : "",
                   e.value.style.chart.layout.labels.dataLabels.useValueParens ? ")" : ""
-                )), 11, Aa), [
+                )), 11, La), [
                   [$t, _.value.dataLabels.show && e.value.style.chart.layout.labels.dataLabels.showValue]
                 ])
-              ], 8, ka))), 256))
+              ], 8, wa))), 256))
             ]))), 256))
           ])) : L("", !0),
           (n(!0), r(x, null, T(J.value, (l, o) => (n(), r("g", null, [
@@ -1298,22 +1302,22 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               g("path", {
                 d: a.arcSlice,
                 fill: me.value === a.id ? e.value.style.chart.layout.donut.selectedColor : "transparent",
-                onMouseenter: (d) => ul({
+                onMouseenter: (d) => il({
                   datapoint: a,
                   seriesIndex: a.seriesIndex
                 }),
-                onClick: (d) => ll({ datapoint: a, index: u, seriesIndex: a.seriesIndex }),
-                onMouseleave: (d) => nl({ datapoint: a, seriesIndex: a.seriesIndex })
-              }, null, 40, $a)
+                onClick: (d) => ol({ datapoint: a, index: u, seriesIndex: a.seriesIndex }),
+                onMouseleave: (d) => rl({ datapoint: a, seriesIndex: a.seriesIndex })
+              }, null, 40, _a)
             ]))), 256))
           ]))), 256)),
           y(t.$slots, "svg", { svg: h.value }, void 0, !0)
         ], 512)
-      ], 14, la)),
-      t.$slots.watermark ? (n(), r("div", La, [
+      ], 14, oa)),
+      t.$slots.watermark ? (n(), r("div", Fa, [
         y(t.$slots, "watermark", S(O({ isPrinting: c(lt) || c(at) })), void 0, !0)
       ])) : L("", !0),
-      Ie(c(Rt), {
+      Ie(c(Yt), {
         teleportTo: e.value.style.chart.tooltip.teleportTo,
         show: _.value.showTooltip && pe.value,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
@@ -1344,8 +1348,8 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       }, 8, ["teleportTo", "show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
       g("div", {
         id: `legend-bottom-${b.value}`
-      }, null, 8, _a),
-      qe.value ? (n(), z(Ll, {
+      }, null, 8, xa),
+      qe.value ? (n(), z(Fl, {
         key: 5,
         to: e.value.style.chart.legend.position === "top" ? `#legend-top-${b.value}` : `#legend-bottom-${b.value}`
       }, [
@@ -1355,20 +1359,20 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           ref: Ce,
           class: H({ "vue-ui-nested-donuts-legend": re.value.length > 1 })
         }, [
-          (n(!0), r(x, null, T(re.value, (l, o) => (n(), z(Ql, {
+          (n(!0), r(x, null, T(re.value, (l, o) => (n(), z(ea, {
             key: `legend_${o}_${He.value}`,
             legendSet: l,
-            config: rl.value,
+            config: cl.value,
             onClickMarker: s[0] || (s[0] = ({ legend: a }) => X(a))
           }, {
             legendTitle: p(({ titleSet: a }) => [
-              a[0] && a[0].arcOf ? (n(), r("div", Fa, M(a[0].arcOf), 1)) : L("", !0)
+              a[0] && a[0].arcOf ? (n(), r("div", Ta, M(a[0].arcOf), 1)) : L("", !0)
             ]),
             item: p(({ legend: a, index: u }) => [
               g("div", {
                 onClick: (d) => X(a),
                 style: he(`opacity:${C.value.includes(a.id) ? 0.5 : 1}`)
-              }, M(a.display), 13, xa)
+              }, M(a.display), 13, Da)
             ]),
             _: 1
           }, 8, ["legendSet", "config"]))), 128))
@@ -1389,13 +1393,13 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       }, [
         y(t.$slots, "source", {}, void 0, !0)
       ], 512)) : L("", !0),
-      ge.value && e.value.userOptions.buttons.table ? (n(), z(_l(te.value.component), Fl({ key: 8 }, te.value.props, {
+      ge.value && e.value.userOptions.buttons.table ? (n(), z(xl(te.value.component), Tl({ key: 8 }, te.value.props, {
         ref_key: "tableUnit",
         ref: Z,
         onClose: mt
-      }), wt({
+      }), At({
         content: p(() => [
-          (n(), z(c(Wt), {
+          (n(), z(c(Ht), {
             key: `table_${Xe.value}`,
             colNames: ie.value.colNames,
             head: ie.value.head,
@@ -1409,7 +1413,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               g("div", {
                 innerHTML: l,
                 style: { display: "flex", "align-items": "center" }
-              }, null, 8, Ta)
+              }, null, 8, Sa)
             ]),
             td: p(({ td: l }) => [
               Lt(M(l.name || l), 1)
@@ -1434,7 +1438,7 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               class: "vue-ui-user-options-button",
               onClick: s[1] || (s[1] = (l) => Fe(e.value.userOptions.callbacks.csv))
             }, [
-              Ie(c(Gt), {
+              Ie(c(Wt), {
                 name: "excel",
                 stroke: te.value.props.color
               }, null, 8, ["stroke"])
@@ -1443,15 +1447,15 @@ const Ot = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           key: "1"
         } : void 0
       ]), 1040)) : L("", !0),
-      c(we) ? (n(), z(Yl, { key: 9 })) : L("", !0)
-    ], 46, ea));
+      c(Ae) ? (n(), z(Xl, { key: 9 })) : L("", !0)
+    ], 46, la));
   }
-}, Sa = /* @__PURE__ */ Zl(Da, [["__scopeId", "data-v-a538bb7a"]]), qa = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, Na = /* @__PURE__ */ ta(Oa, [["__scopeId", "data-v-a538bb7a"]]), Ja = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: Sa
+  default: Na
 }, Symbol.toStringTag, { value: "Module" }));
 export {
-  Ha as a,
-  qa as b,
-  Sa as v
+  ja as a,
+  Ja as b,
+  Na as v
 };