vue-data-ui 3.4.9 → 3.5.0

package/dist/{vue-ui-quadrant-DGnasrCR.js → vue-ui-quadrant-CO52mSRY.js}

@@ -1,33 +1,33 @@
-import { defineAsyncComponent as F, computed as f, ref as y, toRefs as Xt, watch as xe, shallowRef as lt, onMounted as Yt, onBeforeUnmount as Mt, createElementBlock as n, openBlock as s, unref as i, normalizeStyle as C, normalizeClass as z, createBlock as X, createCommentVNode as h, createElementVNode as d, createVNode as se, createSlots as at, withCtx as g, renderSlot as $, normalizeProps as U, guardReactiveProps as G, Fragment as q, renderList as Y, toDisplayString as k, Teleport as Ot, resolveDynamicComponent as Nt, mergeProps as Bt, createTextVNode as ot, nextTick as ut } from "vue";
-import { c as st, t as Ft, b as Rt, p as $e, o as Pt, f as Q, e as Vt, h as Dt, aa as Ht, a as R, d as P, X as It, s as re, i as Et, ab as Ut, M as Gt, J as Qt, P as Jt, Q as jt, G as Zt, H as Kt } from "./lib-C_mNZmhD.js";
-import { t as el, u as tl } from "./useResponsive-DfdjqQps.js";
-import { u as ll, a as rt } from "./useNestedProp-BjZe1Y85.js";
-import { u as al } from "./usePrinter-DTzqpYKF.js";
-import { u as ol } from "./useSvgExport-DrjCWun4.js";
-import { u as ul } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as sl } from "./useChartAccessibility-9icAAmYg.js";
-import rl from "./img-BecE5qXd.js";
-import nl from "./Title-l36lOBMx.js";
-import { _ as nt } from "./Shape-CNXKB8O0.js";
-import { t as il } from "./themes-AUNCOb2G.js";
-import vl from "./Legend-G6GMcdAc.js";
-import { u as cl, B as dl } from "./BaseScanner-BgWxam9d.js";
-import { _ as hl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y", "width", "height"], gl = ["id"], ml = ["stop-color"], xl = ["stop-color"], $l = { key: 1 }, kl = ["fill", "x", "y", "height", "width", "stroke-width", "stroke", "rx"], Ll = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], wl = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], _l = { key: 2 }, Cl = ["points", "fill"], Sl = ["points", "fill"], ql = ["points", "fill"], Tl = ["points", "fill"], zl = { key: 3 }, Al = ["y", "fill", "font-size"], Wl = ["x", "y", "fill", "font-size"], Xl = ["x", "y", "fill", "font-size"], Yl = ["y", "fill", "font-size"], Ml = { key: 4 }, Ol = ["x", "y", "font-size", "fill"], Nl = ["x", "y", "font-size", "fill"], Bl = ["x", "y", "font-size", "fill"], Fl = ["id", "font-size", "transform", "fill"], Rl = ["id", "font-size", "transform", "fill"], Pl = ["id", "font-size", "transform", "fill"], Vl = { key: 5 }, Dl = ["fill", "points"], Hl = ["x", "y", "width", "height"], Il = ["x", "y", "width", "height"], El = ["x", "y", "width", "height"], Ul = ["x", "y", "width", "height"], Gl = {
+import { defineAsyncComponent as F, computed as f, ref as y, toRefs as Ot, watch as xe, shallowRef as at, onMounted as Nt, onBeforeUnmount as Bt, createElementBlock as n, openBlock as s, unref as i, normalizeStyle as S, normalizeClass as A, createBlock as Y, createCommentVNode as h, createElementVNode as d, createVNode as ne, createSlots as ot, withCtx as g, renderSlot as $, normalizeProps as E, guardReactiveProps as Q, Fragment as q, renderList as M, toDisplayString as k, Teleport as Ft, resolveDynamicComponent as Rt, mergeProps as Pt, createTextVNode as ut, nextTick as st } from "vue";
+import { c as rt, t as Vt, b as Dt, p as $e, o as Ht, f as G, e as It, h as Ut, aa as Et, a as R, d as P, X as Qt, s as ie, i as Gt, ab as Jt, M as jt, J as Zt, P as Kt, Q as el, G as tl, H as ll } from "./lib-C_mNZmhD.js";
+import { t as al, u as ol } from "./useResponsive-DfdjqQps.js";
+import { u as ul, a as nt } from "./useNestedProp-BjZe1Y85.js";
+import { u as sl } from "./usePrinter-DTzqpYKF.js";
+import { u as rl } from "./useSvgExport-DrjCWun4.js";
+import { u as nl } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as il } from "./useChartAccessibility-9icAAmYg.js";
+import vl from "./img-BecE5qXd.js";
+import cl from "./Title-l36lOBMx.js";
+import { _ as it } from "./Shape-CNXKB8O0.js";
+import { t as dl } from "./themes-AUNCOb2G.js";
+import hl from "./Legend-G6GMcdAc.js";
+import { u as yl, B as bl } from "./BaseScanner-BgWxam9d.js";
+import { _ as fl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const pl = ["id"], gl = ["id"], ml = ["xmlns", "viewBox", "id"], xl = ["x", "y", "width", "height"], $l = ["id"], kl = ["stop-color"], Ll = ["stop-color"], wl = { key: 1 }, _l = ["fill", "x", "y", "height", "width", "stroke-width", "stroke", "rx"], Sl = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], Cl = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], ql = { key: 2 }, Tl = ["points", "fill"], zl = ["points", "fill"], Al = ["points", "fill"], Wl = ["points", "fill"], Xl = { key: 3 }, Yl = ["y", "fill", "font-size"], Ml = ["x", "y", "fill", "font-size"], Ol = ["x", "y", "fill", "font-size"], Nl = ["y", "fill", "font-size"], Bl = { key: 4 }, Fl = ["x", "y", "font-size", "fill"], Rl = ["x", "y", "font-size", "fill"], Pl = ["x", "y", "font-size", "fill"], Vl = ["id", "font-size", "transform", "fill"], Dl = ["id", "font-size", "transform", "fill"], Hl = ["id", "font-size", "transform", "fill"], Il = { key: 5 }, Ul = ["fill", "points"], El = ["x", "y", "width", "height"], Ql = ["x", "y", "width", "height"], Gl = ["x", "y", "width", "height"], Jl = ["x", "y", "width", "height"], jl = {
   key: 0,
   style: { "pointer-events": "none" }
-}, Ql = ["x", "y", "font-size", "fill"], Jl = ["x", "y", "font-size", "fill", "innerHTML"], jl = { key: 0 }, Zl = ["x", "y", "onMouseover", "onMouseleave", "onClick"], Kl = {
+}, Zl = ["x", "y", "font-size", "fill"], Kl = ["x", "y", "font-size", "fill", "innerHTML"], ea = { key: 0 }, ta = ["x", "y", "onMouseover", "onMouseleave", "onClick"], la = {
   key: 8,
   class: "vue-ui-dna"
-}, ea = ["points", "fill"], ta = ["points", "fill"], la = ["points", "fill"], aa = ["points", "fill"], oa = { key: 9 }, ua = ["x", "y", "font-size", "fill", "font-weight"], sa = { key: 10 }, ra = ["x", "y", "fill"], na = ["x", "y", "fill"], ia = ["x", "y", "fill"], va = ["x", "y", "fill"], ca = ["stroke", "d"], da = ["stroke", "d"], ha = {
+}, aa = ["points", "fill"], oa = ["points", "fill"], ua = ["points", "fill"], sa = ["points", "fill"], ra = { key: 9 }, na = ["x", "y", "font-size", "fill", "font-weight"], ia = { key: 10 }, va = ["x", "y", "fill"], ca = ["x", "y", "fill"], da = ["x", "y", "fill"], ha = ["x", "y", "fill"], ya = ["stroke", "d"], ba = ["stroke", "d"], fa = {
   key: 4,
   class: "vue-data-ui-watermark"
-}, ya = ["id"], ba = ["onClick"], fa = {
+}, pa = ["id"], ga = ["onClick"], ma = {
   key: 0,
   height: "14",
   width: "14",
   viewBox: "0 0 20 20"
-}, pa = ["innerHTML"], ga = {
+}, xa = ["innerHTML"], $a = {
   __name: "vue-ui-quadrant",
   props: {
     config: {
@@ -44,14 +44,14 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
     }
   },
   emits: ["selectPlot", "selectSide", "selectLegend"],
-  setup(it, { expose: vt, emit: ct }) {
-    const dt = F(() => import("./Tooltip-oWCO1HKy.js")), ht = F(() => import("./BaseIcon-BmMbm4d0.js")), yt = F(() => import("./vue-ui-accordion-CZ0thhxa.js")), bt = F(() => import("./DataTable-BT7VF2ua.js")), ft = F(() => import("./PenAndPaper-DSvu9dwa.js")), pt = F(() => import("./UserOptions-CGnQt6Fd.js")), gt = F(() => import("./PackageVersion-CTUqGqWV.js")), mt = F(() => import("./BaseDraggableDialog-ymf2sfB8.js")), { vue_ui_quadrant: xt } = ll(), M = it, ke = f(() => !!M.dataset && M.dataset.length), w = y(st()), ne = ct, ie = y(!1), ve = y(""), Le = y(0), m = y(!1), A = y(null), we = y(null), _e = y(null), Ce = y(null), Se = y(null), qe = y(0), Te = y(0), ze = y(0), Ae = y(!1), J = y(null), ce = y(null), e = y(ye()), { loading: We, FINAL_DATASET: Xe } = cl({
-      ...Xt(M),
+  setup(vt, { expose: ct, emit: dt }) {
+    const ht = F(() => import("./Tooltip-oWCO1HKy.js")), yt = F(() => import("./BaseIcon-BmMbm4d0.js")), bt = F(() => import("./vue-ui-accordion-CZ0thhxa.js")), ft = F(() => import("./DataTable-BT7VF2ua.js")), pt = F(() => import("./PenAndPaper-DSvu9dwa.js")), gt = F(() => import("./UserOptions-CGnQt6Fd.js")), mt = F(() => import("./PackageVersion-Cyx_s25h.js")), xt = F(() => import("./BaseDraggableDialog-ymf2sfB8.js")), { vue_ui_quadrant: $t } = ul(), O = vt, ke = f(() => !!O.dataset && O.dataset.length), w = y(rt()), ve = dt, ce = y(!1), de = y(""), Le = y(0), m = y(!1), W = y(null), we = y(null), _e = y(null), Se = y(null), Ce = y(null), qe = y(0), Te = y(0), ze = y(0), Ae = y(!1), J = y(null), he = y(null), e = y(fe()), { loading: We, FINAL_DATASET: Xe } = yl({
+      ...Ot(O),
       FINAL_CONFIG: e,
-      prepareConfig: ye,
+      prepareConfig: fe,
       callback: () => {
         Promise.resolve().then(async () => {
-          await ut(), x.value.showTable = e.value.table.show;
+          await st(), x.value.showTable = e.value.table.show;
         });
       },
       skeletonDataset: [
@@ -76,7 +76,7 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           ]
         }
       ],
-      skeletonConfig: Ft({
+      skeletonConfig: Vt({
         defaultConfig: e.value,
         userConfig: {
           userOptions: { show: !1 },
@@ -114,44 +114,44 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           }
         }
       })
-    }), { userOptionsVisible: de, setUserOptionsVisibility: Ye, keepUserOptionState: Me } = ul({ config: e.value }), { svgRef: he } = sl({ config: e.value.style.chart.title });
-    function ye() {
-      const l = rt({
-        userConfig: M.config,
-        defaultConfig: xt
+    }), { userOptionsVisible: ye, setUserOptionsVisibility: Ye, keepUserOptionState: Me } = nl({ config: e.value }), { svgRef: be } = il({ config: e.value.style.chart.title });
+    function fe() {
+      const l = nt({
+        userConfig: O.config,
+        defaultConfig: $t
       });
       return l.theme ? {
-        ...rt({
-          userConfig: il.vue_ui_quadrant[l.theme] || M.config,
+        ...nt({
+          userConfig: dl.vue_ui_quadrant[l.theme] || O.config,
           defaultConfig: l
         }),
-        customPalette: Rt[l.theme] || $e
+        customPalette: Dt[l.theme] || $e
       } : l;
     }
-    xe(() => M.config, (l) => {
-      e.value = ye(), de.value = !e.value.userOptions.showOnChartHover, Oe(), qe.value += 1, Te.value += 1, ze.value += 1, x.value.plotLabels.show = e.value.style.chart.layout.labels.plotLabels.show, x.value.showTable = e.value.table.show, x.value.showTooltip = e.value.style.chart.tooltip.show;
+    xe(() => O.config, (l) => {
+      e.value = fe(), ye.value = !e.value.userOptions.showOnChartHover, Oe(), qe.value += 1, Te.value += 1, ze.value += 1, x.value.plotLabels.show = e.value.style.chart.layout.labels.plotLabels.show, x.value.showTable = e.value.table.show, x.value.showTooltip = e.value.style.chart.tooltip.show;
     }, { deep: !0 });
-    const O = lt(null), H = lt(null), I = f(() => e.value.debug);
+    const N = at(null), H = at(null), I = f(() => e.value.debug);
     function Oe() {
-      if (Pt(M.dataset) ? Q({
+      if (Ht(O.dataset) ? G({
         componentName: "VueUiQuadrant",
         type: "dataset",
         debug: I.value
-      }) : M.dataset.forEach((l, o) => {
-        [null, void 0].includes(l.name) && Q({
+      }) : O.dataset.forEach((l, a) => {
+        [null, void 0].includes(l.name) && G({
           componentName: "VueUiQuadrant",
           type: "datasetSerieAttribute",
           property: "name",
-          index: o,
+          index: a,
           debug: I.value
-        }), [null, void 0].includes(l.series) ? Q({
+        }), [null, void 0].includes(l.series) ? G({
           componentName: "VueUiQuadrant",
           type: "datasetSerieAttribute",
           property: "series",
-          index: o,
+          index: a,
           debug: I.value
-        }) : l.series.forEach((a, u) => {
-          [null, void 0].includes(a.name) && Q({
+        }) : l.series.forEach((o, u) => {
+          [null, void 0].includes(o.name) && G({
             componentName: "VueUiQuadrant",
             type: "datasetSerieAttribute",
             property: "name",
@@ -161,31 +161,31 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           });
         });
       }), e.value.responsive) {
-        const l = el(() => {
-          const { width: o, height: a } = tl({
-            chart: A.value,
+        const l = al(() => {
+          const { width: a, height: o } = ol({
+            chart: W.value,
             title: e.value.style.chart.title.text ? we.value : null,
             legend: e.value.style.chart.legend.show ? _e.value : null,
-            source: Ce.value,
-            noTitle: Se.value
+            source: Se.value,
+            noTitle: Ce.value
           });
           L.value = 48, requestAnimationFrame(() => {
-            t.value.height = a, t.value.usableHeight = a - L.value * 2, t.value.width = o, t.value.usableWidth = o - L.value * 2, t.value.top = L.value, t.value.left = L.value, t.value.right = o - L.value, t.value.bottom = a - L.value, t.value.centerX = o / 2, t.value.centerY = a - a / 2, t.value.padding = L.value;
+            t.value.height = o, t.value.usableHeight = o - L.value * 2, t.value.width = a, t.value.usableWidth = a - L.value * 2, t.value.top = L.value, t.value.left = L.value, t.value.right = a - L.value, t.value.bottom = o - L.value, t.value.centerX = a / 2, t.value.centerY = o - o / 2, t.value.padding = L.value;
           });
         });
-        O.value && (H.value && O.value.unobserve(H.value), O.value.disconnect()), O.value = new ResizeObserver(l), H.value = A.value.parentNode, O.value.observe(H.value);
+        N.value && (H.value && N.value.unobserve(H.value), N.value.disconnect()), N.value = new ResizeObserver(l), H.value = W.value.parentNode, N.value.observe(H.value);
       }
     }
-    Yt(() => {
+    Nt(() => {
       Ae.value = !0, Oe();
-    }), Mt(() => {
-      O.value && (H.value && O.value.unobserve(H.value), O.value.disconnect());
+    }), Bt(() => {
+      N.value && (H.value && N.value.unobserve(H.value), N.value.disconnect());
     });
-    const { isPrinting: Ne, isImaging: Be, generatePdf: Fe, generateImage: Re } = al({
+    const { isPrinting: Ne, isImaging: Be, generatePdf: Fe, generateImage: Re } = sl({
       elementId: `vue-ui-quadrant_${w.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-quadrant",
       options: e.value.userOptions.print
-    }), $t = f(() => e.value.userOptions.show && !e.value.style.chart.title.text), Pe = f(() => Vt(e.value.customPalette)), x = y({
+    }), kt = f(() => e.value.userOptions.show && !e.value.style.chart.title.text), Pe = f(() => It(e.value.customPalette)), x = y({
       plotLabels: {
         show: e.value.style.chart.layout.labels.plotLabels.show
       },
@@ -256,23 +256,23 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         default:
           return { x: 0, y: 0, text: "", fontSize: 0, fill: "none", bold: !1 };
       }
-    }), kt = y(null), ee = y(!1);
-    function j({ targetX: l, targetY: o, targetW: a, targetH: u, side: r }) {
-      c.value && Z(r);
+    }), Lt = y(null), le = y(!1);
+    function j({ targetX: l, targetY: a, targetW: o, targetH: u, side: r }) {
+      c.value && ee(r);
       const b = {
         x: l - v.value.startX,
-        y: o - v.value.startY,
-        w: a - v.value.width,
+        y: a - v.value.startY,
+        w: o - v.value.width,
         h: u - v.value.height
       }, p = e.value.zoomAnimationFrames;
-      let W = 0;
-      function tt() {
-        ee.value = !0, v.value.startX += b.x / p, v.value.startY += b.y / p, v.value.width += b.w / p, v.value.height += b.h / p, W += 1, W < p ? kt.value = requestAnimationFrame(tt) : ee.value = !1;
+      let X = 0;
+      function lt() {
+        le.value = !0, v.value.startX += b.x / p, v.value.startY += b.y / p, v.value.width += b.w / p, v.value.height += b.h / p, X += 1, X < p ? Lt.value = requestAnimationFrame(lt) : le.value = !1;
       }
-      tt();
+      lt();
     }
-    function N(l) {
-      if (!ee.value)
+    function B(l) {
+      if (!le.value)
         if (m.value && c.value === l)
           j({
             targetX: 0,
@@ -325,61 +325,61 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           m.value = !0;
         }
     }
-    const Lt = f(() => {
-      const l = e.value.style.chart.layout.grid.graduations.steps, o = t.value.usableWidth / (l * 2), a = t.value.top, u = [];
+    const wt = f(() => {
+      const l = e.value.style.chart.layout.grid.graduations.steps, a = t.value.usableWidth / (l * 2), o = t.value.top, u = [];
       for (let r = 0; r < l; r += 1)
         u.push({
-          x: t.value.padding + o * r,
-          y: a + t.value.usableHeight * (r / l / 2),
+          x: t.value.padding + a * r,
+          y: o + t.value.usableHeight * (r / l / 2),
           height: t.value.usableHeight * (1 - r / l),
           width: t.value.usableWidth * (1 - r / l),
           opacity: Math.round((r + 1) / l * 20)
         });
       return u;
-    }), S = f(() => {
-      let l = e.value.style.chart.layout.grid.xAxis.max, o = e.value.style.chart.layout.grid.xAxis.min, a = e.value.style.chart.layout.grid.yAxis.max, u = e.value.style.chart.layout.grid.yAxis.min;
-      return e.value.style.chart.layout.grid.xAxis.auto && (l = Math.max(...E.value.flatMap((r) => r.series.map((b) => b.x))), o = Math.min(...E.value.flatMap((r) => r.series.map((b) => b.x)))), e.value.style.chart.layout.grid.yAxis.auto && (a = Math.max(...E.value.flatMap((r) => r.series.map((b) => b.y))), u = Math.min(...E.value.flatMap((r) => r.series.map((b) => b.y)))), {
+    }), C = f(() => {
+      let l = e.value.style.chart.layout.grid.xAxis.max, a = e.value.style.chart.layout.grid.xAxis.min, o = e.value.style.chart.layout.grid.yAxis.max, u = e.value.style.chart.layout.grid.yAxis.min;
+      return e.value.style.chart.layout.grid.xAxis.auto && (l = Math.max(...U.value.flatMap((r) => r.series.map((b) => b.x))), a = Math.min(...U.value.flatMap((r) => r.series.map((b) => b.x)))), e.value.style.chart.layout.grid.yAxis.auto && (o = Math.max(...U.value.flatMap((r) => r.series.map((b) => b.y))), u = Math.min(...U.value.flatMap((r) => r.series.map((b) => b.y)))), {
         x: {
           max: l,
-          min: o
+          min: a
         },
         y: {
-          max: a,
+          max: o,
           min: u
         }
       };
-    }), B = y([]), E = f(() => Xe.value.map((l, o) => ({
+    }), z = y([]), U = f(() => Xe.value.map((l, a) => ({
       ...l,
-      series: Ht({
+      series: Et({
         data: l.series,
         threshold: e.value.downsample.threshold
       }),
-      id: `cat_${o}_${w.value}`,
-      color: Dt(l.color) || Pe.value[o] || $e[o]
-    }))), wt = f(() => E.value.filter((l) => !B.value.includes(l.id))), _t = f(() => E.value.map((l, o) => ({
+      id: `cat_${a}_${w.value}`,
+      color: Ut(l.color) || Pe.value[a] || $e[a]
+    }))), _t = f(() => U.value.filter((l) => !z.value.includes(l.id))), St = f(() => U.value.map((l, a) => ({
       ...l,
       shape: l.shape || "circle",
-      series: l.series.map((a) => ({
-        ...a,
-        x: Ve(a.x),
-        y: De(a.y),
-        xValue: a.x,
-        yValue: a.y,
-        quadrantSide: He({ x: a.x, y: a.y }),
+      series: l.series.map((o) => ({
+        ...o,
+        x: Ve(o.x),
+        y: De(o.y),
+        xValue: o.x,
+        yValue: o.y,
+        quadrantSide: Ie({ x: o.x, y: o.y }),
         categoryName: l.name,
         shape: l.shape,
         color: l.color
       }))
-    }))), T = f(() => (Xe.value.forEach((l, o) => {
-      l.series.forEach((a, u) => {
-        [null, void 0].includes(a.x) && Q({
+    }))), T = f(() => (Xe.value.forEach((l, a) => {
+      l.series.forEach((o, u) => {
+        [null, void 0].includes(o.x) && G({
           componentName: "VueUiQuadrant",
           type: "datasetSerieAttribute",
           property: "x",
           key: "series",
           index: u,
           debug: I.value
-        }), [null, void 0].includes(a.y) && Q({
+        }), [null, void 0].includes(o.y) && G({
           componentName: "VueUiQuadrant",
           type: "datasetSerieAttribute",
           property: "y",
@@ -388,58 +388,58 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           debug: I.value
         });
       });
-    }), wt.value.map((l, o) => ({
+    }), _t.value.map((l, a) => ({
       ...l,
       shape: l.shape || "circle",
-      color: l.color || Pe.value[o] || $e[o],
-      series: l.series.map((a) => ({
-        ...a,
-        x: Ve(a.x),
-        y: De(a.y),
-        xValue: a.x,
-        yValue: a.y,
-        quadrantSide: He({ x: a.x, y: a.y }),
+      color: l.color || Pe.value[a] || $e[a],
+      series: l.series.map((o) => ({
+        ...o,
+        x: Ve(o.x),
+        y: De(o.y),
+        xValue: o.x,
+        yValue: o.y,
+        quadrantSide: Ie({ x: o.x, y: o.y }),
         categoryName: l.name,
         shape: l.shape,
         color: l.color,
-        uid: st()
+        uid: rt()
       }))
     }))));
     function Ve(l) {
       if (l >= 0) {
-        const o = l / S.value.x.max;
-        return t.value.centerX + t.value.usableWidth / 2 * o;
+        const a = l / C.value.x.max;
+        return t.value.centerX + t.value.usableWidth / 2 * a;
       } else {
-        const o = Math.abs(l) / Math.abs(S.value.x.min);
-        return t.value.centerX - t.value.usableWidth / 2 * o;
+        const a = Math.abs(l) / Math.abs(C.value.x.min);
+        return t.value.centerX - t.value.usableWidth / 2 * a;
       }
     }
     function De(l) {
       if (l >= 0) {
-        const o = l / S.value.y.max;
-        return t.value.centerY + (1 - t.value.usableHeight / 2 * o);
+        const a = l / C.value.y.max;
+        return t.value.centerY + (1 - t.value.usableHeight / 2 * a);
       } else {
-        const o = Math.abs(l) / Math.abs(S.value.y.min);
-        return t.value.centerY - (1 - t.value.usableHeight / 2 * o);
+        const a = Math.abs(l) / Math.abs(C.value.y.min);
+        return t.value.centerY - (1 - t.value.usableHeight / 2 * a);
       }
     }
-    const te = f(() => {
-      const l = T.value.flatMap((p) => p.series.map((W) => ({
-        x: W.xValue,
-        y: W.yValue,
-        name: W.name,
-        category: W.categoryName,
-        quadrantSide: W.quadrantSide,
-        sideName: e.value.style.chart.layout.labels.quadrantLabels[W.quadrantSide].text,
+    const ae = f(() => {
+      const l = T.value.flatMap((p) => p.series.map((X) => ({
+        x: X.xValue,
+        y: X.yValue,
+        name: X.name,
+        category: X.categoryName,
+        quadrantSide: X.quadrantSide,
+        sideName: e.value.style.chart.layout.labels.quadrantLabels[X.quadrantSide].text,
         color: p.color,
         shape: p.shape
-      }))), o = e.value.style.chart.layout.grid.xAxis.name || "x", a = e.value.style.chart.layout.grid.yAxis.name || "y", u = [e.value.translations.category, e.value.translations.item, o, a, e.value.translations.side], r = l.map((p) => [p.category, p.name, p.x, p.y, p.sideName || p.quadrantSide]), b = l.map((p) => ({
+      }))), a = e.value.style.chart.layout.grid.xAxis.name || "x", o = e.value.style.chart.layout.grid.yAxis.name || "y", u = [e.value.translations.category, e.value.translations.item, a, o, e.value.translations.side], r = l.map((p) => [p.category, p.name, p.x, p.y, p.sideName || p.quadrantSide]), b = l.map((p) => ({
         shape: p.shape,
         color: p.color
       }));
       return { head: u, body: r, itsShapes: b, tableData: l };
-    }), le = f(() => {
-      const l = te.value.head, o = te.value.tableData.map((u) => [
+    }), oe = f(() => {
+      const l = ae.value.head, a = ae.value.tableData.map((u) => [
         {
           shape: u.shape,
           color: u.color,
@@ -463,7 +463,7 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           })
         ),
         u.sideName || u.quadrantSide
-      ]), a = {
+      ]), o = {
         th: {
           backgroundColor: e.value.table.th.backgroundColor,
           color: e.value.table.th.color,
@@ -476,22 +476,37 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         },
         breakpoint: e.value.table.responsiveBreakpoint
       };
-      return { head: l, body: o, config: a, colNames: l };
+      return { head: l, body: a, config: o, colNames: l };
     });
-    function be(l) {
-      B.value.includes(l) ? B.value = B.value.filter((a) => a !== l) : B.value.push(l);
-      const o = Ge();
-      ne("selectLegend", o);
+    function Z(l) {
+      z.value.includes(l) ? z.value = z.value.filter((o) => o !== l) : z.value.push(l);
+      const a = Ge();
+      ve("selectLegend", a);
     }
-    const fe = f(() => _t.value.map((l) => ({
+    const K = f(() => St.value.map((l) => ({
       name: l.name,
       shape: l.shape,
       color: l.color,
       id: l.id,
-      opacity: B.value.includes(l.id) ? 0.5 : 1,
-      segregate: () => be(l.id),
-      isSegregated: B.value.includes(l.id)
-    }))), Ct = f(() => ({
+      opacity: z.value.includes(l.id) ? 0.5 : 1,
+      segregate: () => Z(l.id),
+      isSegregated: z.value.includes(l.id)
+    })));
+    function He(l) {
+      if (!K.value.length)
+        return e.value.debug && console.warn("VueUiQuadrant - There are no series to show."), null;
+      const a = K.value.find((o) => o.name === l);
+      return a || (e.value.debug && console.warn(`VueUiQuadrant - Series name not found "${l}"`), null);
+    }
+    function Ct(l) {
+      const a = He(l);
+      a !== null && z.value.includes(a.id) && Z(a.id);
+    }
+    function qt(l) {
+      const a = He(l);
+      a !== null && (z.value.includes(a.id) || Z(a.id));
+    }
+    const Tt = f(() => ({
       cy: "quadrant-div-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
@@ -499,7 +514,7 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
       paddingBottom: 12,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
     }));
-    function He(l) {
+    function Ie(l) {
       switch (!0) {
         case (l.x >= 0 && l.y >= 0):
           return "tr";
@@ -513,80 +528,80 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           return "";
       }
     }
-    const ae = y(null), oe = y(null), pe = y(null);
-    function Ie(l, o, a) {
-      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: o, seriesIndex: a }), ae.value = o.uid, oe.value = {
+    const ue = y(null), se = y(null), pe = y(null);
+    function Ue(l, a, o) {
+      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: a, seriesIndex: o }), ue.value = a.uid, se.value = {
         color: l.color,
         shape: l.shape
       }, pe.value = {
-        datapoint: o,
-        seriesIndex: a,
+        datapoint: a,
+        seriesIndex: o,
         series: T.value,
         config: e.value
-      }, ie.value = !0;
+      }, ce.value = !0;
       const u = e.value.style.chart.tooltip.customFormat;
-      if (Zt(u) && Kt(() => u({
-        seriesIndex: a,
-        datapoint: o,
+      if (tl(u) && ll(() => u({
+        seriesIndex: o,
+        datapoint: a,
         series: T.value,
         config: e.value
       })))
-        ve.value = u({
-          seriesIndex: a,
-          datapoint: o,
+        de.value = u({
+          seriesIndex: o,
+          datapoint: a,
           series: T.value,
           config: e.value
         });
       else {
         let r = "";
-        o.quadrantSide && (r += `<div style="color:${e.value.style.chart.layout.labels.quadrantLabels[o.quadrantSide].color};font-weight:${e.value.style.chart.layout.labels.quadrantLabels[o.quadrantSide].bold ? "bold" : "400"}">${e.value.style.chart.layout.labels.quadrantLabels[o.quadrantSide].text}</div>`), r += `<div>${l.name}</div>`, r += `<div style="padding-bottom:6px;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};margin-bottom:3px">${o.name}</div>`, r += `<div>${e.value.style.chart.layout.grid.xAxis.name ? e.value.style.chart.layout.grid.xAxis.name : "x"}: <b>${R(
+        a.quadrantSide && (r += `<div style="color:${e.value.style.chart.layout.labels.quadrantLabels[a.quadrantSide].color};font-weight:${e.value.style.chart.layout.labels.quadrantLabels[a.quadrantSide].bold ? "bold" : "400"}">${e.value.style.chart.layout.labels.quadrantLabels[a.quadrantSide].text}</div>`), r += `<div>${l.name}</div>`, r += `<div style="padding-bottom:6px;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};margin-bottom:3px">${a.name}</div>`, r += `<div>${e.value.style.chart.layout.grid.xAxis.name ? e.value.style.chart.layout.grid.xAxis.name : "x"}: <b>${R(
           e.value.style.chart.layout.labels.plotLabels.x.formatter,
-          o.xValue,
+          a.xValue,
           P({
-            v: o.xValue,
+            v: a.xValue,
             r: e.value.style.chart.tooltip.roundingValue
           }),
-          { datapoint: o, category: l, categoryIndex: a }
+          { datapoint: a, category: l, categoryIndex: o }
         )}</b></div>`, r += `<div>${e.value.style.chart.layout.grid.yAxis.name ? e.value.style.chart.layout.grid.yAxis.name : "y"}: <b>${R(
           e.value.style.chart.layout.labels.plotLabels.y.formatter,
-          o.yValue,
+          a.yValue,
           P({
-            v: o.yValue,
+            v: a.yValue,
             r: e.value.style.chart.tooltip.roundingValue
           }),
-          { datapoint: o, category: l, categoryIndex: a }
-        )}</b></div>`, ve.value = `<div style="text-align:left;font-size:${e.value.style.chart.tooltip.fontSize}px">${r}</div>`;
+          { datapoint: a, category: l, categoryIndex: o }
+        )}</b></div>`, de.value = `<div style="text-align:left;font-size:${e.value.style.chart.tooltip.fontSize}px">${r}</div>`;
       }
     }
-    function Ee(l, o) {
-      ie.value = !1, ae.value = null, oe.value = null, e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: l, seriesIndex: o });
+    function Ee(l, a) {
+      ce.value = !1, ue.value = null, se.value = null, e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: l, seriesIndex: a });
     }
-    function Ue(l, o, a) {
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: o, seriesIndex: a });
+    function Qe(l, a, o) {
+      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: a, seriesIndex: o });
       const u = {
         category: l.name,
         shape: l.shape,
-        itemName: o.name,
-        x: o.xValue,
-        y: o.yValue,
-        quadrantSide: o.quadrantSide,
-        sideName: e.value.style.chart.layout.labels.quadrantLabels[o.quadrantSide].text
+        itemName: a.name,
+        x: a.xValue,
+        y: a.yValue,
+        quadrantSide: a.quadrantSide,
+        sideName: e.value.style.chart.layout.labels.quadrantLabels[a.quadrantSide].text
       };
-      ne("selectPlot", u);
+      ve("selectPlot", u);
     }
-    function Z(l) {
+    function ee(l) {
       if (!l) return;
-      const o = T.value.flatMap((u) => u.series.filter((r) => r.quadrantSide === l).map((r) => ({
+      const a = T.value.flatMap((u) => u.series.filter((r) => r.quadrantSide === l).map((r) => ({
         category: r.categoryName,
         itemName: r.name,
         x: r.xValue,
         y: r.yValue
-      }))), a = {
+      }))), o = {
         quadrantSide: l,
         sideName: e.value.style.chart.layout.labels.quadrantLabels[l].text,
-        items: [...o]
+        items: [...a]
       };
-      ne("selectSide", a);
+      ve("selectSide", o);
     }
     const _ = f(() => ({
       TL: {
@@ -699,54 +714,54 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         color: l.color,
         name: l.name,
         shape: l.shape,
-        series: l.series.map((o) => ({
-          name: o.name,
-          x: o.xValue,
-          y: o.yValue,
-          quadrantSide: o.quadrantSide,
-          sideName: e.value.style.chart.layout.labels.quadrantLabels[o.quadrantSide].text
+        series: l.series.map((a) => ({
+          name: a.name,
+          x: a.xValue,
+          y: a.yValue,
+          quadrantSide: a.quadrantSide,
+          sideName: e.value.style.chart.layout.labels.quadrantLabels[a.quadrantSide].text
         }))
       }));
     }
     function ge(l = null) {
-      ut(() => {
-        const o = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], a = te.value.head, u = te.value.body, r = o.concat([a]).concat(u), b = Jt(r);
-        l ? l(b) : jt({ csvContent: b, title: e.value.style.chart.title.text || "vue-ui-quadrant" });
+      st(() => {
+        const a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], o = ae.value.head, u = ae.value.body, r = a.concat([o]).concat(u), b = Kt(r);
+        l ? l(b) : el({ csvContent: b, title: e.value.style.chart.title.text || "vue-ui-quadrant" });
       });
     }
     const D = y(!1);
-    function Qe(l) {
+    function Je(l) {
       D.value = l, Le.value += 1;
     }
-    function Je() {
+    function je() {
       x.value.showTable = !x.value.showTable;
     }
-    function je() {
+    function Ze() {
       x.value.plotLabels.show = !x.value.plotLabels.show;
     }
-    function Ze() {
+    function Ke() {
       x.value.showTooltip = !x.value.showTooltip;
     }
-    const ue = y(!1);
+    const re = y(!1);
     function me() {
-      ue.value = !ue.value;
+      re.value = !re.value;
     }
-    async function St({ scale: l = 2 } = {}) {
-      if (!A.value) return;
-      const { width: o, height: a } = A.value.getBoundingClientRect(), u = o / a, { imageUri: r, base64: b } = await rl({ domElement: A.value, base64: !0, img: !0, scale: l });
+    async function zt({ scale: l = 2 } = {}) {
+      if (!W.value) return;
+      const { width: a, height: o } = W.value.getBoundingClientRect(), u = a / o, { imageUri: r, base64: b } = await vl({ domElement: W.value, base64: !0, img: !0, scale: l });
       return {
         imageUri: r,
         base64: b,
         title: e.value.style.chart.title.text,
-        width: o,
-        height: a,
+        width: a,
+        height: o,
         aspectRatio: u
       };
     }
-    const K = f(() => {
-      const l = e.value.table.useDialog && !e.value.table.show, o = x.value.showTable;
+    const te = f(() => {
+      const l = e.value.table.useDialog && !e.value.table.show, a = x.value.showTable;
       return {
-        component: l ? mt : yt,
+        component: l ? xt : bt,
         title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
         props: l ? {
           backgroundColor: e.value.table.th.backgroundColor,
@@ -754,12 +769,12 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           headerColor: e.value.table.th.color,
           headerBg: e.value.table.th.backgroundColor,
           isFullscreen: D.value,
-          fullscreenParent: A.value,
+          fullscreenParent: W.value,
           forcedWidth: Math.min(800, window.innerWidth * 0.8)
         } : {
           hideDetails: !0,
           config: {
-            open: o,
+            open: a,
             maxHeight: 1e4,
             body: {
               backgroundColor: e.value.style.chart.backgroundColor,
@@ -776,56 +791,58 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
     xe(() => x.value.showTable, (l) => {
       e.value.table.show || (l && e.value.table.useDialog && J.value ? J.value.open() : "close" in J.value && J.value.close());
     });
-    function Ke() {
-      x.value.showTable = !1, ce.value && ce.value.setTableIconState(!1);
+    function et() {
+      x.value.showTable = !1, he.value && he.value.setTableIconState(!1);
     }
-    const qt = f(() => e.value.style.chart.backgroundColor), Tt = f(() => e.value.style.chart.legend), zt = f(() => e.value.style.chart.title), { exportSvg: At, getSvg: Wt } = ol({
-      svg: he,
-      title: zt,
-      legend: Tt,
-      legendItems: fe,
-      backgroundColor: qt
+    const At = f(() => e.value.style.chart.backgroundColor), Wt = f(() => e.value.style.chart.legend), Xt = f(() => e.value.style.chart.title), { exportSvg: Yt, getSvg: Mt } = rl({
+      svg: be,
+      title: Xt,
+      legend: Wt,
+      legendItems: K,
+      backgroundColor: At
     });
-    async function et({ isCb: l }) {
+    async function tt({ isCb: l }) {
       if (l) {
-        const { blob: o, url: a, text: u, dataUrl: r } = await Wt();
-        e.value.userOptions.callbacks.svg({ blob: o, url: a, text: u, dataUrl: r });
+        const { blob: a, url: o, text: u, dataUrl: r } = await Mt();
+        e.value.userOptions.callbacks.svg({ blob: a, url: o, text: u, dataUrl: r });
       } else
-        At();
+        Yt();
     }
-    return vt({
+    return ct({
       getData: Ge,
-      getImage: St,
+      getImage: zt,
       generatePdf: Fe,
       generateCsv: ge,
       generateImage: Re,
-      generateSvg: et,
-      toggleTable: Je,
-      toggleLabels: je,
-      toggleTooltip: Ze,
+      generateSvg: tt,
+      hideSeries: qt,
+      showSeries: Ct,
+      toggleTable: je,
+      toggleLabels: Ze,
+      toggleTooltip: Ke,
       toggleAnnotator: me,
-      toggleFullscreen: Qe
-    }), (l, o) => (s(), n("div", {
-      class: z(`vue-data-ui-component vue-ui-quadrant ${D.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      toggleFullscreen: Je
+    }), (l, a) => (s(), n("div", {
+      class: A(`vue-data-ui-component vue-ui-quadrant ${D.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
       ref_key: "quadrantChart",
-      ref: A,
+      ref: W,
       id: `vue-ui-quadrant_${w.value}`,
-      style: C(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height: 100%" : ""}`),
-      onMouseenter: o[14] || (o[14] = () => i(Ye)(!0)),
-      onMouseleave: o[15] || (o[15] = () => i(Ye)(!1))
+      style: S(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height: 100%" : ""}`),
+      onMouseenter: a[14] || (a[14] = () => i(Ye)(!0)),
+      onMouseleave: a[15] || (a[15] = () => i(Ye)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (s(), X(i(ft), {
+      e.value.userOptions.buttons.annotator ? (s(), Y(i(pt), {
         key: 0,
-        svgRef: i(he),
+        svgRef: i(be),
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        active: ue.value,
+        active: re.value,
         onClose: me
       }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : h("", !0),
-      $t.value ? (s(), n("div", {
+      kt.value ? (s(), n("div", {
         key: 1,
         ref_key: "noTitle",
-        ref: Se,
+        ref: Ce,
         class: "vue-data-ui-no-title-space",
         style: "height:36px; width: 100%;background:transparent"
       }, null, 512)) : h("", !0),
@@ -835,7 +852,7 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         ref: we,
         style: "width:100%;background:transparent;padding-bottom:12px"
       }, [
-        (s(), X(nl, {
+        (s(), Y(cl, {
           key: `table_${qe.value}`,
           config: {
             title: {
@@ -851,10 +868,10 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
       ], 512)) : h("", !0),
       d("div", {
         id: `legend-top-${w.value}`
-      }, null, 8, bl),
-      e.value.userOptions.show && ke.value && (i(Me) || i(de)) ? (s(), X(i(pt), {
+      }, null, 8, gl),
+      e.value.userOptions.show && ke.value && (i(Me) || i(ye)) ? (s(), Y(i(gt), {
         ref_key: "userOptionsRef",
-        ref: ce,
+        ref: he,
         key: `user_options_${Le.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
@@ -872,30 +889,30 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         isFullscreen: D.value,
         isTooltip: x.value.showTooltip,
         titles: { ...e.value.userOptions.buttonTitles },
-        chartElement: A.value,
+        chartElement: W.value,
         position: e.value.userOptions.position,
         hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: ue.value,
+        isAnnotation: re.value,
         callbacks: e.value.userOptions.callbacks,
         printScale: e.value.userOptions.print.scale,
         tableDialog: e.value.table.useDialog,
-        onToggleFullscreen: Qe,
+        onToggleFullscreen: Je,
         onGeneratePdf: i(Fe),
         onGenerateCsv: ge,
         onGenerateImage: i(Re),
-        onGenerateSvg: et,
-        onToggleTable: Je,
-        onToggleLabels: je,
-        onToggleTooltip: Ze,
+        onGenerateSvg: tt,
+        onToggleTable: je,
+        onToggleLabels: Ze,
+        onToggleTooltip: Ke,
         onToggleAnnotator: me,
-        style: C({
-          visibility: i(Me) ? i(de) ? "visible" : "hidden" : "visible"
+        style: S({
+          visibility: i(Me) ? i(ye) ? "visible" : "hidden" : "visible"
         })
-      }, at({ _: 2 }, [
+      }, ot({ _: 2 }, [
         l.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: g(({ isOpen: a, color: u }) => [
-            $(l.$slots, "menuIcon", U(G({ isOpen: a, color: u })), void 0, !0)
+          fn: g(({ isOpen: o, color: u }) => [
+            $(l.$slots, "menuIcon", E(Q({ isOpen: o, color: u })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
@@ -950,29 +967,29 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         } : void 0,
         l.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: g(({ toggleFullscreen: a, isFullscreen: u }) => [
-            $(l.$slots, "optionFullscreen", U(G({ toggleFullscreen: a, isFullscreen: u })), void 0, !0)
+          fn: g(({ toggleFullscreen: o, isFullscreen: u }) => [
+            $(l.$slots, "optionFullscreen", E(Q({ toggleFullscreen: o, isFullscreen: u })), void 0, !0)
           ]),
           key: "8"
         } : void 0,
         l.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: g(({ toggleAnnotator: a, isAnnotator: u }) => [
-            $(l.$slots, "optionAnnotator", U(G({ toggleAnnotator: a, isAnnotator: u })), void 0, !0)
+          fn: g(({ toggleAnnotator: o, isAnnotator: u }) => [
+            $(l.$slots, "optionAnnotator", E(Q({ toggleAnnotator: o, isAnnotator: u })), void 0, !0)
           ]),
           key: "9"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasSvg", "hasXls", "hasTable", "hasLabel", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : h("", !0),
       (s(), n("svg", {
         ref_key: "svgRef",
-        ref: he,
-        xmlns: i(It),
-        class: z({ "vue-data-ui-fullscreen--on": D.value, "vue-data-ui-fulscreen--off": !D.value }),
+        ref: be,
+        xmlns: i(Qt),
+        class: A({ "vue-data-ui-fullscreen--on": D.value, "vue-data-ui-fulscreen--off": !D.value }),
         viewBox: `${v.value.startX} ${v.value.startY} ${v.value.width} ${v.value.height}`,
-        style: C(`max-width:100%;overflow:hidden;background:transparent;color:${e.value.style.chart.color}`),
+        style: S(`max-width:100%;overflow:hidden;background:transparent;color:${e.value.style.chart.color}`),
         id: `svg_${w.value}`
       }, [
-        se(i(gt)),
+        ne(i(mt)),
         l.$slots["chart-background"] ? (s(), n("foreignObject", {
           key: 0,
           x: v.value.startX,
@@ -984,9 +1001,9 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           }
         }, [
           $(l.$slots, "chart-background", {}, void 0, !0)
-        ], 8, pl)) : h("", !0),
+        ], 8, xl)) : h("", !0),
         d("defs", null, [
-          (s(!0), n(q, null, Y(T.value, (a, u) => (s(), n("radialGradient", {
+          (s(!0), n(q, null, M(T.value, (o, u) => (s(), n("radialGradient", {
             cx: "50%",
             cy: "50%",
             r: "50%",
@@ -996,25 +1013,25 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           }, [
             d("stop", {
               offset: "0%",
-              "stop-color": i(re)(i(Et)(a.color, 0.05), e.value.style.chart.layout.areas.opacity)
-            }, null, 8, ml),
+              "stop-color": i(ie)(i(Gt)(o.color, 0.05), e.value.style.chart.layout.areas.opacity)
+            }, null, 8, kl),
             d("stop", {
               offset: "100%",
-              "stop-color": i(re)(a.color, e.value.style.chart.layout.areas.opacity)
-            }, null, 8, xl)
-          ], 8, gl))), 256))
+              "stop-color": i(ie)(o.color, e.value.style.chart.layout.areas.opacity)
+            }, null, 8, Ll)
+          ], 8, $l))), 256))
         ]),
-        e.value.style.chart.layout.grid.graduations.show ? (s(), n("g", $l, [
-          (s(!0), n(q, null, Y(Lt.value, (a) => (s(), n("rect", {
-            fill: e.value.style.chart.layout.grid.graduations.fill ? i(re)(e.value.style.chart.layout.grid.graduations.color, a.opacity) : "none",
-            x: a.x,
-            y: a.y,
-            height: a.height <= 0 ? 1e-3 : a.height,
-            width: a.width <= 0 ? 1e-3 : a.width,
+        e.value.style.chart.layout.grid.graduations.show ? (s(), n("g", wl, [
+          (s(!0), n(q, null, M(wt.value, (o) => (s(), n("rect", {
+            fill: e.value.style.chart.layout.grid.graduations.fill ? i(ie)(e.value.style.chart.layout.grid.graduations.color, o.opacity) : "none",
+            x: o.x,
+            y: o.y,
+            height: o.height <= 0 ? 1e-3 : o.height,
+            width: o.width <= 0 ? 1e-3 : o.width,
             "stroke-width": e.value.style.chart.layout.grid.graduations.strokeWidth,
             stroke: e.value.style.chart.layout.grid.graduations.stroke,
             rx: e.value.style.chart.layout.grid.graduations.roundingForce
-          }, null, 8, kl))), 256))
+          }, null, 8, _l))), 256))
         ])) : h("", !0),
         d("line", {
           x1: t.value.left,
@@ -1023,7 +1040,7 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           y2: t.value.centerY,
           stroke: e.value.style.chart.layout.grid.stroke,
           "stroke-width": e.value.style.chart.layout.grid.strokeWidth
-        }, null, 8, Ll),
+        }, null, 8, Sl),
         d("line", {
           x1: t.value.centerX,
           y1: t.value.top,
@@ -1031,30 +1048,30 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           y2: t.value.bottom,
           stroke: e.value.style.chart.layout.grid.stroke,
           "stroke-width": e.value.style.chart.layout.grid.strokeWidth
-        }, null, 8, wl),
-        e.value.style.chart.layout.grid.showArrows ? (s(), n("g", _l, [
+        }, null, 8, Cl),
+        e.value.style.chart.layout.grid.showArrows ? (s(), n("g", ql, [
           d("polygon", {
             points: `${t.value.right - 8},${t.value.centerY - 6} ${t.value.right},${t.value.centerY} ${t.value.right - 8},${t.value.centerY + 6}`,
             fill: e.value.style.chart.layout.grid.stroke,
             stroke: "none"
-          }, null, 8, Cl),
+          }, null, 8, Tl),
           d("polygon", {
             points: `${t.value.left + 8},${t.value.centerY - 6} ${t.value.left},${t.value.centerY} ${t.value.left + 8},${t.value.centerY + 6}`,
             fill: e.value.style.chart.layout.grid.stroke,
             stroke: "none"
-          }, null, 8, Sl),
+          }, null, 8, zl),
           d("polygon", {
             points: `${t.value.centerX - 6},${t.value.top + 8} ${t.value.centerX},${t.value.top} ${t.value.centerX + 6},${t.value.top + 8}`,
             fill: e.value.style.chart.layout.grid.stroke,
             stroke: "none"
-          }, null, 8, ql),
+          }, null, 8, Al),
           d("polygon", {
             points: `${t.value.centerX - 6},${t.value.bottom - 8} ${t.value.centerX},${t.value.bottom} ${t.value.centerX + 6},${t.value.bottom - 8}`,
             fill: e.value.style.chart.layout.grid.stroke,
             stroke: "none"
-          }, null, 8, Tl)
+          }, null, 8, Wl)
         ])) : h("", !0),
-        e.value.style.chart.layout.labels.quadrantLabels.show && !m.value ? (s(), n("g", zl, [
+        e.value.style.chart.layout.labels.quadrantLabels.show && !m.value ? (s(), n("g", Xl, [
           e.value.style.chart.layout.labels.quadrantLabels.tl.text ? (s(), n("text", {
             key: 0,
             x: 0,
@@ -1062,9 +1079,9 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             "text-anchor": "start",
             fill: e.value.style.chart.layout.labels.quadrantLabels.tl.color,
             "font-size": e.value.style.chart.layout.labels.quadrantLabels.tl.fontSize,
-            style: C(`font-weight:${e.value.style.chart.layout.labels.quadrantLabels.tl.bold ? "bold" : ""}`),
-            onClick: o[0] || (o[0] = (a) => Z("tl"))
-          }, k(e.value.style.chart.layout.labels.quadrantLabels.tl.text), 13, Al)) : h("", !0),
+            style: S(`font-weight:${e.value.style.chart.layout.labels.quadrantLabels.tl.bold ? "bold" : ""}`),
+            onClick: a[0] || (a[0] = (o) => ee("tl"))
+          }, k(e.value.style.chart.layout.labels.quadrantLabels.tl.text), 13, Yl)) : h("", !0),
           e.value.style.chart.layout.labels.quadrantLabels.tr.text ? (s(), n("text", {
             key: 1,
             x: t.value.width,
@@ -1072,9 +1089,9 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             "text-anchor": "end",
             fill: e.value.style.chart.layout.labels.quadrantLabels.tr.color,
             "font-size": e.value.style.chart.layout.labels.quadrantLabels.tr.fontSize,
-            style: C(`font-weight:${e.value.style.chart.layout.labels.quadrantLabels.tr.bold ? "bold" : ""}`),
-            onClick: o[1] || (o[1] = (a) => Z("tr"))
-          }, k(e.value.style.chart.layout.labels.quadrantLabels.tr.text), 13, Wl)) : h("", !0),
+            style: S(`font-weight:${e.value.style.chart.layout.labels.quadrantLabels.tr.bold ? "bold" : ""}`),
+            onClick: a[1] || (a[1] = (o) => ee("tr"))
+          }, k(e.value.style.chart.layout.labels.quadrantLabels.tr.text), 13, Ml)) : h("", !0),
           e.value.style.chart.layout.labels.quadrantLabels.br.text ? (s(), n("text", {
             key: 2,
             x: t.value.width,
@@ -1082,9 +1099,9 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             "text-anchor": "end",
             fill: e.value.style.chart.layout.labels.quadrantLabels.br.color,
             "font-size": e.value.style.chart.layout.labels.quadrantLabels.br.fontSize,
-            style: C(`font-weight:${e.value.style.chart.layout.labels.quadrantLabels.br.bold ? "bold" : ""}`),
-            onClick: o[2] || (o[2] = (a) => Z("br"))
-          }, k(e.value.style.chart.layout.labels.quadrantLabels.br.text), 13, Xl)) : h("", !0),
+            style: S(`font-weight:${e.value.style.chart.layout.labels.quadrantLabels.br.bold ? "bold" : ""}`),
+            onClick: a[2] || (a[2] = (o) => ee("br"))
+          }, k(e.value.style.chart.layout.labels.quadrantLabels.br.text), 13, Ol)) : h("", !0),
           e.value.style.chart.layout.labels.quadrantLabels.bl.text ? (s(), n("text", {
             key: 3,
             x: 0,
@@ -1092,11 +1109,11 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             "text-anchor": "start",
             fill: e.value.style.chart.layout.labels.quadrantLabels.bl.color,
             "font-size": e.value.style.chart.layout.labels.quadrantLabels.bl.fontSize,
-            style: C(`font-weight:${e.value.style.chart.layout.labels.quadrantLabels.bl.bold ? "bold" : ""}`),
-            onClick: o[3] || (o[3] = (a) => Z("bl"))
-          }, k(e.value.style.chart.layout.labels.quadrantLabels.bl.text), 13, Yl)) : h("", !0)
+            style: S(`font-weight:${e.value.style.chart.layout.labels.quadrantLabels.bl.bold ? "bold" : ""}`),
+            onClick: a[3] || (a[3] = (o) => ee("bl"))
+          }, k(e.value.style.chart.layout.labels.quadrantLabels.bl.text), 13, Nl)) : h("", !0)
         ])) : h("", !0),
-        e.value.style.chart.layout.labels.axisLabels.show ? (s(), n("g", Ml, [
+        e.value.style.chart.layout.labels.axisLabels.show ? (s(), n("g", Bl, [
           d("text", {
             x: t.value.centerX,
             y: t.value.top - t.value.padding / 6,
@@ -1105,19 +1122,19 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             fill: e.value.style.chart.layout.labels.axisLabels.color.positive
           }, k(i(R)(
             e.value.style.chart.layout.labels.plotLabels.y.formatter,
-            S.value.y.max,
+            C.value.y.max,
             i(P)({
-              v: S.value.y.max,
+              v: C.value.y.max,
               r: e.value.style.chart.layout.labels.plotLabels.rounding
             })
-          )), 9, Ol),
+          )), 9, Fl),
           d("text", {
             x: t.value.centerX,
             y: t.value.top - t.value.padding / 2,
             "text-anchor": "middle",
             "font-size": e.value.style.chart.layout.labels.axisLabels.fontSize,
             fill: e.value.style.chart.layout.labels.axisLabels.color.positive
-          }, k(e.value.style.chart.layout.grid.yAxis.name), 9, Nl),
+          }, k(e.value.style.chart.layout.grid.yAxis.name), 9, Rl),
           d("text", {
             x: t.value.centerX,
             y: t.value.bottom + t.value.padding * 0.35,
@@ -1126,12 +1143,12 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             fill: e.value.style.chart.layout.labels.axisLabels.color.negative
           }, k(i(R)(
             e.value.style.chart.layout.labels.plotLabels.y.formatter,
-            S.value.y.min,
+            C.value.y.min,
             i(P)({
-              v: S.value.y.min,
+              v: C.value.y.min,
               r: e.value.style.chart.layout.labels.plotLabels.rounding
             })
-          )), 9, Bl),
+          )), 9, Pl),
           d("text", {
             id: `xLabelMin_${w.value}`,
             "text-anchor": "middle",
@@ -1140,12 +1157,12 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             fill: e.value.style.chart.layout.labels.axisLabels.color.negative
           }, k(i(R)(
             e.value.style.chart.layout.labels.plotLabels.x.formatter,
-            S.value.x.min,
+            C.value.x.min,
             i(P)({
-              v: S.value.x.min,
+              v: C.value.x.min,
               r: e.value.style.chart.layout.labels.plotLabels.rounding
             })
-          )), 9, Fl),
+          )), 9, Vl),
           d("text", {
             id: `xLabelMax_${w.value}`,
             "text-anchor": "middle",
@@ -1154,105 +1171,105 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             fill: e.value.style.chart.layout.labels.axisLabels.color.positive
           }, k(i(R)(
             e.value.style.chart.layout.labels.plotLabels.x.formatter,
-            S.value.x.max,
+            C.value.x.max,
             i(P)({
-              v: S.value.x.max,
+              v: C.value.x.max,
               r: e.value.style.chart.layout.labels.plotLabels.rounding
             })
-          )), 9, Rl),
+          )), 9, Dl),
           d("text", {
             id: `xLabelMaxName_${w.value}`,
             "text-anchor": "middle",
             "font-size": e.value.style.chart.layout.labels.axisLabels.fontSize,
             transform: `translate(${t.value.width - e.value.style.chart.layout.labels.axisLabels.fontSize}, ${t.value.height / 2}), rotate(90)`,
             fill: e.value.style.chart.layout.labels.axisLabels.color.positive
-          }, k(e.value.style.chart.layout.grid.xAxis.name), 9, Pl)
+          }, k(e.value.style.chart.layout.grid.xAxis.name), 9, Hl)
         ])) : h("", !0),
-        e.value.style.chart.layout.areas.show ? (s(), n("g", Vl, [
-          (s(!0), n(q, null, Y(T.value, (a, u) => (s(), n("g", null, [
-            a.series.length > 2 ? (s(), n("polygon", {
+        e.value.style.chart.layout.areas.show ? (s(), n("g", Il, [
+          (s(!0), n(q, null, M(T.value, (o, u) => (s(), n("g", null, [
+            o.series.length > 2 ? (s(), n("polygon", {
               key: 0,
               "data-cy-quadrant-area": "",
-              fill: e.value.style.chart.layout.areas.useGradient ? `url(#quadrant_gradient_${w.value}_${u})` : i(re)(a.color, e.value.style.chart.layout.areas.opacity),
-              points: i(Ut)(a)
-            }, null, 8, Dl)) : h("", !0)
+              fill: e.value.style.chart.layout.areas.useGradient ? `url(#quadrant_gradient_${w.value}_${u})` : i(ie)(o.color, e.value.style.chart.layout.areas.opacity),
+              points: i(Jt)(o)
+            }, null, 8, Ul)) : h("", !0)
           ]))), 256))
         ])) : h("", !0),
         d("g", null, [
           d("rect", {
-            onClick: o[4] || (o[4] = (a) => N("TL")),
+            onClick: a[4] || (a[4] = (o) => B("TL")),
             x: t.value.left,
             y: t.value.top,
             width: t.value.usableWidth / 2 <= 0 ? 1e-3 : t.value.usableWidth / 2,
             height: t.value.usableHeight / 2 <= 0 ? 1e-3 : t.value.usableHeight / 2,
             fill: "transparent",
-            class: z({ "vue-data-ui-zoom-plus": !m.value, "vue-data-ui-zoom-minus": m.value })
-          }, null, 10, Hl),
+            class: A({ "vue-data-ui-zoom-plus": !m.value, "vue-data-ui-zoom-minus": m.value })
+          }, null, 10, El),
           d("rect", {
-            onClick: o[5] || (o[5] = (a) => N("TR")),
+            onClick: a[5] || (a[5] = (o) => B("TR")),
             x: t.value.centerX,
             y: t.value.top,
             width: t.value.usableWidth / 2 <= 0 ? 1e-3 : t.value.usableWidth / 2,
             height: t.value.usableHeight / 2 <= 0 ? 1e-3 : t.value.usableHeight / 2,
             fill: "transparent",
-            class: z({ "vue-data-ui-zoom-plus": !m.value, "vue-data-ui-zoom-minus": m.value })
-          }, null, 10, Il),
+            class: A({ "vue-data-ui-zoom-plus": !m.value, "vue-data-ui-zoom-minus": m.value })
+          }, null, 10, Ql),
           d("rect", {
-            onClick: o[6] || (o[6] = (a) => N("BR")),
+            onClick: a[6] || (a[6] = (o) => B("BR")),
             x: t.value.centerX,
             y: t.value.centerY,
             width: t.value.usableWidth / 2 <= 0 ? 1e-3 : t.value.usableWidth / 2,
             height: t.value.usableHeight / 2 <= 0 ? 1e-3 : t.value.usableHeight / 2,
             fill: "transparent",
-            class: z({ "vue-data-ui-zoom-plus": !m.value, "vue-data-ui-zoom-minus": m.value })
-          }, null, 10, El),
+            class: A({ "vue-data-ui-zoom-plus": !m.value, "vue-data-ui-zoom-minus": m.value })
+          }, null, 10, Gl),
           d("rect", {
-            onClick: o[7] || (o[7] = (a) => N("BL")),
+            onClick: a[7] || (a[7] = (o) => B("BL")),
             x: t.value.left,
             y: t.value.centerY,
             width: t.value.usableWidth / 2 <= 0 ? 1e-3 : t.value.usableWidth / 2,
             height: t.value.usableHeight / 2 <= 0 ? 1e-3 : t.value.usableHeight / 2,
             fill: "transparent",
-            class: z({ "vue-data-ui-zoom-plus": !m.value, "vue-data-ui-zoom-minus": m.value })
-          }, null, 10, Ul)
+            class: A({ "vue-data-ui-zoom-plus": !m.value, "vue-data-ui-zoom-minus": m.value })
+          }, null, 10, Jl)
         ]),
         e.value.style.chart.layout.labels.plotLabels.showAsTag ? (s(), n(q, { key: 7 }, [
-          x.value.plotLabels.show ? (s(), n("g", jl, [
-            (s(!0), n(q, null, Y(T.value, (a, u) => (s(), n(q, null, [
-              (s(!0), n(q, null, Y(a.series, (r) => (s(), n("foreignObject", {
+          x.value.plotLabels.show ? (s(), n("g", ea, [
+            (s(!0), n(q, null, M(T.value, (o, u) => (s(), n(q, null, [
+              (s(!0), n(q, null, M(o.series, (r) => (s(), n("foreignObject", {
                 style: { overflow: "visible" },
                 height: "10",
                 width: "100",
                 x: r.x - 50,
                 y: r.y - e.value.style.chart.layout.labels.plotLabels.fontSize,
-                onMouseover: (b) => Ie(a, r, u),
+                onMouseover: (b) => Ue(o, r, u),
                 onMouseleave: (b) => Ee(r, u),
-                onClick: (b) => Ue(a, r, u)
+                onClick: (b) => Qe(o, r, u)
               }, [
                 d("div", {
-                  style: C(`color:${i(Qt)(a.color)};margin: 0 auto; font-size:${e.value.style.chart.layout.labels.plotLabels.fontSize}px; text-align:center;background:${a.color}; padding: 2px 4px; border-radius: 12px; height: fit-content;`)
+                  style: S(`color:${i(Zt)(o.color)};margin: 0 auto; font-size:${e.value.style.chart.layout.labels.plotLabels.fontSize}px; text-align:center;background:${o.color}; padding: 2px 4px; border-radius: 12px; height: fit-content;`)
                 }, k(r.name), 5)
-              ], 40, Zl))), 256))
+              ], 40, ta))), 256))
             ], 64))), 256))
           ])) : h("", !0)
         ], 64)) : (s(), n(q, { key: 6 }, [
-          (s(!0), n(q, null, Y(T.value, (a, u) => (s(), n("g", null, [
-            (s(!0), n(q, null, Y(a.series, (r) => (s(), X(nt, {
-              color: a.color,
-              isSelected: ae.value && r.uid === ae.value,
+          (s(!0), n(q, null, M(T.value, (o, u) => (s(), n("g", null, [
+            (s(!0), n(q, null, M(o.series, (r) => (s(), Y(it, {
+              color: o.color,
+              isSelected: ue.value && r.uid === ue.value,
               plot: r,
               radius: e.value.style.chart.layout.plots.radius / (m.value ? 1.5 : 1),
-              shape: a.shape,
+              shape: o.shape,
               stroke: e.value.style.chart.layout.plots.outline ? e.value.style.chart.layout.plots.outlineColor : "none",
               strokeWidth: e.value.style.chart.layout.plots.outlineWidth,
-              onMouseenter: (b) => Ie(a, r, u),
+              onMouseenter: (b) => Ue(o, r, u),
               onMouseleave: (b) => Ee(r, u),
-              onClick: (b) => Ue(a, r, u)
+              onClick: (b) => Qe(o, r, u)
             }, null, 8, ["color", "isSelected", "plot", "radius", "shape", "stroke", "strokeWidth", "onMouseenter", "onMouseleave", "onClick"]))), 256))
           ]))), 256)),
-          x.value.plotLabels.show ? (s(), n("g", Gl, [
-            (s(!0), n(q, null, Y(T.value, (a) => (s(), n("g", null, [
-              (s(!0), n(q, null, Y(a.series, (u) => (s(), n("g", null, [
+          x.value.plotLabels.show ? (s(), n("g", jl, [
+            (s(!0), n(q, null, M(T.value, (o) => (s(), n("g", null, [
+              (s(!0), n(q, null, M(o.series, (u) => (s(), n("g", null, [
                 String(u.name).includes(`
 `) ? (s(), n("text", {
                   key: 1,
@@ -1261,52 +1278,52 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
                   "text-anchor": "middle",
                   "font-size": e.value.style.chart.layout.labels.plotLabels.fontSize / (m.value ? 1.5 : 1),
                   fill: e.value.style.chart.layout.labels.plotLabels.color,
-                  innerHTML: i(Gt)({
+                  innerHTML: i(jt)({
                     content: String(u.name),
                     fontSize: e.value.style.chart.layout.labels.plotLabels.fontSize / (m.value ? 1.5 : 1),
                     fill: e.value.style.chart.layout.labels.plotLabels.color,
                     x: u.x,
                     y: u.y + e.value.style.chart.layout.labels.plotLabels.offsetY + e.value.style.chart.layout.plots.radius
                   })
-                }, null, 8, Jl)) : (s(), n("text", {
+                }, null, 8, Kl)) : (s(), n("text", {
                   key: 0,
                   x: u.x,
                   y: u.y + e.value.style.chart.layout.labels.plotLabels.offsetY + e.value.style.chart.layout.plots.radius,
                   "text-anchor": "middle",
                   "font-size": e.value.style.chart.layout.labels.plotLabels.fontSize / (m.value ? 1.5 : 1),
                   fill: e.value.style.chart.layout.labels.plotLabels.color
-                }, k(u.name), 9, Ql))
+                }, k(u.name), 9, Zl))
               ]))), 256))
             ]))), 256))
           ])) : h("", !0)
         ], 64)),
-        m.value ? (s(), n("g", Kl, [
+        m.value ? (s(), n("g", la, [
           c.value === "TL" ? (s(), n("polygon", {
             key: 0,
             points: `${t.value.left - 1},${t.value.centerY} ${t.value.centerX},${t.value.centerY} ${t.value.centerX},${t.value.top - 1} ${t.value.right},${t.value.top - 1} ${t.value.right},${t.value.bottom} ${t.value.left - 1},${t.value.bottom} ${t.value.left - 1},${t.value.centerY}`,
             fill: e.value.style.chart.backgroundColor,
             style: { opacity: "1" }
-          }, null, 8, ea)) : h("", !0),
+          }, null, 8, aa)) : h("", !0),
           c.value === "TR" ? (s(), n("polygon", {
             key: 1,
             points: `${t.value.left},${t.value.top - 1} ${t.value.centerX},${t.value.top - 1} ${t.value.centerX},${t.value.centerY} ${t.value.right + 1},${t.value.centerY} ${t.value.right + 1},${t.value.bottom} ${t.value.left},${t.value.bottom} ${t.value.left},${t.value.top - 1}`,
             fill: e.value.style.chart.backgroundColor,
             style: { opacity: "1" }
-          }, null, 8, ta)) : h("", !0),
+          }, null, 8, oa)) : h("", !0),
           c.value === "BR" ? (s(), n("polygon", {
             key: 2,
             points: `${t.value.left},${t.value.top} ${t.value.right + 1},${t.value.top} ${t.value.right + 1},${t.value.centerY} ${t.value.centerX},${t.value.centerY} ${t.value.centerX},${t.value.bottom + 1} ${t.value.left},${t.value.bottom + 1} ${t.value.left},${t.value.top}`,
             fill: e.value.style.chart.backgroundColor,
             style: { opacity: "1" }
-          }, null, 8, la)) : h("", !0),
+          }, null, 8, ua)) : h("", !0),
           c.value === "BL" ? (s(), n("polygon", {
             key: 3,
             points: `${t.value.left - 1},${t.value.top} ${t.value.right},${t.value.top} ${t.value.right},${t.value.bottom + 1} ${t.value.centerX},${t.value.bottom + 1} ${t.value.centerX},${t.value.centerY} ${t.value.left - 1},${t.value.centerY} ${t.value.left - 1},${t.value.top}`,
             fill: e.value.style.chart.backgroundColor,
             style: { opacity: "1" }
-          }, null, 8, aa)) : h("", !0)
+          }, null, 8, sa)) : h("", !0)
         ])) : h("", !0),
-        c.value && !ee.value ? (s(), n("g", oa, [
+        c.value && !le.value ? (s(), n("g", ra, [
           d("text", {
             x: V.value.x,
             y: V.value.y - V.value.fontSize / 1.5,
@@ -1314,71 +1331,71 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             fill: V.value.fill,
             "text-anchor": "middle",
             "font-weight": V.value.bold ? "bold" : "normal"
-          }, k(V.value.text), 9, ua)
+          }, k(V.value.text), 9, na)
         ])) : h("", !0),
-        m.value && c.value ? (s(), n("g", sa, [
+        m.value && c.value ? (s(), n("g", ia, [
           d("rect", {
             x: _.value[c.value].tl.x,
             y: _.value[c.value].tl.y,
             height: "20",
             width: "20",
             fill: _.value[c.value].tl.fill,
-            style: C(`cursor: pointer; opacity: ${c.value === "TL" ? 1 : 0.2}`),
-            onClick: o[8] || (o[8] = (a) => N("TL")),
-            class: z({ "vue-ui-quadrant-mini-map-cell": !0, "vue-ui-quadrant-mini-map-cell-selectable": c.value !== "TL" })
-          }, null, 14, ra),
+            style: S(`cursor: pointer; opacity: ${c.value === "TL" ? 1 : 0.2}`),
+            onClick: a[8] || (a[8] = (o) => B("TL")),
+            class: A({ "vue-ui-quadrant-mini-map-cell": !0, "vue-ui-quadrant-mini-map-cell-selectable": c.value !== "TL" })
+          }, null, 14, va),
           d("rect", {
             x: _.value[c.value].tr.x,
             y: _.value[c.value].tr.y,
             height: "20",
             width: "20",
             fill: _.value[c.value].tr.fill,
-            style: C(`cursor: pointer; opacity: ${c.value === "TR" ? 1 : 0.2}`),
-            onClick: o[9] || (o[9] = (a) => N("TR")),
-            class: z({ "vue-ui-quadrant-mini-map-cell": !0, "vue-ui-quadrant-mini-map-cell-selectable": c.value !== "TR" })
-          }, null, 14, na),
+            style: S(`cursor: pointer; opacity: ${c.value === "TR" ? 1 : 0.2}`),
+            onClick: a[9] || (a[9] = (o) => B("TR")),
+            class: A({ "vue-ui-quadrant-mini-map-cell": !0, "vue-ui-quadrant-mini-map-cell-selectable": c.value !== "TR" })
+          }, null, 14, ca),
           d("rect", {
             x: _.value[c.value].br.x,
             y: _.value[c.value].br.y,
             height: "20",
             width: "20",
             fill: _.value[c.value].br.fill,
-            style: C(`cursor: pointer; opacity: ${c.value === "BR" ? 1 : 0.2}`),
-            onClick: o[10] || (o[10] = (a) => N("BR")),
-            class: z({ "vue-ui-quadrant-mini-map-cell": !0, "vue-ui-quadrant-mini-map-cell-selectable": c.value !== "BR" })
-          }, null, 14, ia),
+            style: S(`cursor: pointer; opacity: ${c.value === "BR" ? 1 : 0.2}`),
+            onClick: a[10] || (a[10] = (o) => B("BR")),
+            class: A({ "vue-ui-quadrant-mini-map-cell": !0, "vue-ui-quadrant-mini-map-cell-selectable": c.value !== "BR" })
+          }, null, 14, da),
           d("rect", {
             x: _.value[c.value].bl.x,
             y: _.value[c.value].bl.y,
             height: "20",
             width: "20",
             fill: _.value[c.value].bl.fill,
-            style: C(`cursor: pointer; opacity: ${c.value === "BL" ? 1 : 0.2}`),
-            onClick: o[11] || (o[11] = (a) => N("BL")),
-            class: z({ "vue-ui-quadrant-mini-map-cell": !0, "vue-ui-quadrant-mini-map-cell-selectable": c.value !== "BL" })
-          }, null, 14, va),
+            style: S(`cursor: pointer; opacity: ${c.value === "BL" ? 1 : 0.2}`),
+            onClick: a[11] || (a[11] = (o) => B("BL")),
+            class: A({ "vue-ui-quadrant-mini-map-cell": !0, "vue-ui-quadrant-mini-map-cell-selectable": c.value !== "BL" })
+          }, null, 14, ha),
           d("path", {
             class: "vue-ui-quadrant-minimap-crosshairs",
             stroke: e.value.style.chart.backgroundColor,
             "stroke-width": 1,
             d: _.value[c.value].crosshairs.horizontal
-          }, null, 8, ca),
+          }, null, 8, ya),
           d("path", {
             class: "vue-ui-quadrant-minimap-crosshairs",
             stroke: e.value.style.chart.backgroundColor,
             "stroke-width": 1,
             d: _.value[c.value].crosshairs.vertical
-          }, null, 8, da)
+          }, null, 8, ba)
         ])) : h("", !0),
         $(l.$slots, "svg", { svg: t.value }, void 0, !0)
-      ], 14, fl)),
-      l.$slots.watermark ? (s(), n("div", ha, [
-        $(l.$slots, "watermark", U(G({ isPrinting: i(Ne) || i(Be) })), void 0, !0)
+      ], 14, ml)),
+      l.$slots.watermark ? (s(), n("div", fa, [
+        $(l.$slots, "watermark", E(Q({ isPrinting: i(Ne) || i(Be) })), void 0, !0)
       ])) : h("", !0),
       d("div", {
         id: `legend-bottom-${w.value}`
-      }, null, 8, ya),
-      Ae.value ? (s(), X(Ot, {
+      }, null, 8, pa),
+      Ae.value ? (s(), Y(Ft, {
         key: 5,
         to: e.value.style.chart.legend.position === "top" ? `#legend-top-${w.value}` : `#legend-bottom-${w.value}`
       }, [
@@ -1386,36 +1403,36 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
           ref_key: "chartLegend",
           ref: _e
         }, [
-          e.value.style.chart.legend.show ? (s(), X(vl, {
+          e.value.style.chart.legend.show ? (s(), Y(hl, {
             key: `legend_${ze.value}`,
-            legendSet: fe.value,
-            config: Ct.value,
-            onClickMarker: o[12] || (o[12] = ({ legend: a }) => be(a.id))
+            legendSet: K.value,
+            config: Tt.value,
+            onClickMarker: a[12] || (a[12] = ({ legend: o }) => Z(o.id))
           }, {
-            item: g(({ legend: a }) => [
+            item: g(({ legend: o }) => [
               i(We) ? h("", !0) : (s(), n("div", {
                 key: 0,
-                onClick: (u) => be(a.id),
-                style: C(`opacity:${B.value.includes(a.id) ? 0.5 : 1}`)
-              }, k(a.name), 13, ba))
+                onClick: (u) => Z(o.id),
+                style: S(`opacity:${z.value.includes(o.id) ? 0.5 : 1}`)
+              }, k(o.name), 13, ga))
             ]),
             _: 1
           }, 8, ["legendSet", "config"])) : $(l.$slots, "legend", {
             key: 1,
-            legend: fe.value
+            legend: K.value
           }, void 0, !0)
         ], 512)
       ], 8, ["to"])) : h("", !0),
       l.$slots.source ? (s(), n("div", {
         key: 6,
         ref_key: "source",
-        ref: Ce,
+        ref: Se,
         dir: "auto"
       }, [
         $(l.$slots, "source", {}, void 0, !0)
       ], 512)) : h("", !0),
-      se(i(dt), {
-        show: x.value.showTooltip && ie.value,
+      ne(i(ht), {
+        show: x.value.showTooltip && ce.value,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
         borderRadius: e.value.style.chart.tooltip.borderRadius,
@@ -1425,8 +1442,8 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
         position: e.value.style.chart.tooltip.position,
         offsetY: e.value.style.chart.tooltip.offsetY,
-        parent: A.value,
-        content: ve.value,
+        parent: W.value,
+        content: de.value,
         isFullscreen: D.value,
         isCustom: e.value.style.chart.tooltip.customFormat && typeof e.value.style.chart.tooltip.customFormat == "function",
         smooth: e.value.style.chart.tooltip.smooth,
@@ -1435,17 +1452,17 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         smoothSnapThreshold: e.value.style.chart.tooltip.smoothSnapThreshold
       }, {
         "tooltip-before": g(() => [
-          $(l.$slots, "tooltip-before", U(G({ ...pe.value })), void 0, !0)
+          $(l.$slots, "tooltip-before", E(Q({ ...pe.value })), void 0, !0)
         ]),
         "tooltip-after": g(() => [
-          $(l.$slots, "tooltip-after", U(G({ ...pe.value })), void 0, !0)
+          $(l.$slots, "tooltip-after", E(Q({ ...pe.value })), void 0, !0)
         ]),
         default: g(() => [
-          e.value.style.chart.tooltip.showShape ? (s(), n("svg", fa, [
-            se(nt, {
+          e.value.style.chart.tooltip.showShape ? (s(), n("svg", ma, [
+            ne(it, {
               plot: { x: 10, y: 10 },
-              shape: oe.value.shape,
-              color: oe.value.color,
+              shape: se.value.shape,
+              color: se.value.color,
               radius: 8,
               stroke: e.value.style.chart.layout.plots.outline ? e.value.style.chart.layout.plots.outlineColor : "none",
               "stroke-width": e.value.style.chart.layout.plots.outlineWidth
@@ -1454,29 +1471,29 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         ]),
         _: 3
       }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      ke.value && e.value.userOptions.buttons.table ? (s(), X(Nt(K.value.component), Bt({ key: 7 }, K.value.props, {
+      ke.value && e.value.userOptions.buttons.table ? (s(), Y(Rt(te.value.component), Pt({ key: 7 }, te.value.props, {
         ref_key: "tableUnit",
         ref: J,
-        onClose: Ke
-      }), at({
+        onClose: et
+      }), ot({
         content: g(() => [
-          (s(), X(i(bt), {
+          (s(), Y(i(ft), {
             key: `table_${Te.value}`,
-            colNames: le.value.colNames,
-            head: le.value.head,
-            body: le.value.body,
-            config: le.value.config,
-            title: e.value.table.useDialog ? "" : K.value.title,
+            colNames: oe.value.colNames,
+            head: oe.value.head,
+            body: oe.value.body,
+            config: oe.value.config,
+            title: e.value.table.useDialog ? "" : te.value.title,
             withCloseButton: !e.value.table.useDialog,
-            onClose: Ke
+            onClose: et
           }, {
-            th: g(({ th: a }) => [
-              ot(k(a), 1)
+            th: g(({ th: o }) => [
+              ut(k(o), 1)
             ]),
-            td: g(({ td: a }) => [
+            td: g(({ td: o }) => [
               d("div", {
-                innerHTML: a.name || a
-              }, null, 8, pa)
+                innerHTML: o.name || o
+              }, null, 8, xa)
             ]),
             _: 1
           }, 8, ["colNames", "head", "body", "config", "title", "withCloseButton"]))
@@ -1486,7 +1503,7 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
         e.value.table.useDialog ? {
           name: "title",
           fn: g(() => [
-            ot(k(K.value.title), 1)
+            ut(k(te.value.title), 1)
           ]),
           key: "0"
         } : void 0,
@@ -1496,21 +1513,21 @@ const yl = ["id"], bl = ["id"], fl = ["xmlns", "viewBox", "id"], pl = ["x", "y",
             d("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
-              onClick: o[13] || (o[13] = (a) => ge(e.value.userOptions.callbacks.csv))
+              onClick: a[13] || (a[13] = (o) => ge(e.value.userOptions.callbacks.csv))
             }, [
-              se(i(ht), {
+              ne(i(yt), {
                 name: "excel",
-                stroke: K.value.props.color
+                stroke: te.value.props.color
               }, null, 8, ["stroke"])
             ])
           ]),
           key: "1"
         } : void 0
       ]), 1040)) : h("", !0),
-      i(We) ? (s(), X(dl, { key: 8 })) : h("", !0)
-    ], 46, yl));
+      i(We) ? (s(), Y(bl, { key: 8 })) : h("", !0)
+    ], 46, pl));
   }
-}, Ya = /* @__PURE__ */ hl(ga, [["__scopeId", "data-v-fd15a06f"]]);
+}, Na = /* @__PURE__ */ fl($a, [["__scopeId", "data-v-1d2e9d35"]]);
 export {
-  Ya as default
+  Na as default
 };