vue-data-ui 2.4.62 → 2.4.64

package/dist/{vue-ui-donut-evolution-DGl_J0JB.js → vue-ui-donut-evolution-CK_0JI6T.js}

@@ -1,29 +1,29 @@
-import { computed as p, ref as b, onMounted as nt, watch as Me, openBlock as a, createElementBlock as o, normalizeClass as P, normalizeStyle as q, unref as c, createBlock as E, createCommentVNode as v, createSlots as rt, withCtx as F, renderSlot as S, normalizeProps as J, guardReactiveProps as Q, createVNode as it, createElementVNode as d, Fragment as k, renderList as _, toDisplayString as m, withKeys as ct, createTextVNode as He, nextTick as X } from "vue";
-import { u as vt, o as dt, e as Z, g as ht, c as Ue, t as yt, a as ft, p as ee, C as We, b as gt, J as bt, d as de, D as Re, m as he, X as mt, s as G, E as xt, i as ye, f as te, j as Xe, k as le, n as Ge, K as je, q as pt, r as kt } from "./index-B-k71vpj.js";
-import { _ as _t } from "./Title-DPefeOY7.js";
-import { u as Ct, U as wt } from "./usePrinter-BK-n-gRN.js";
-import { D as Lt } from "./DataTable-BANy6PnS.js";
-import { L as zt } from "./Legend-pWq2tKCl.js";
-import St from "./vue-ui-skeleton-DSXzxNMC.js";
-import { S as $t } from "./Slicer-p4IqkHkJ.js";
-import At from "./vue-ui-accordion-DWAg7tbw.js";
-import { u as Be } from "./useNestedProp-BeXDUo1v.js";
-import { _ as Nt } from "./PackageVersion-1NslmM8M.js";
-import { P as It } from "./PenAndPaper-CdXSbSZY.js";
+import { computed as p, ref as b, onMounted as nt, watch as He, openBlock as a, createElementBlock as o, normalizeClass as P, normalizeStyle as q, unref as c, createBlock as O, createCommentVNode as v, createSlots as rt, withCtx as F, renderSlot as S, normalizeProps as J, guardReactiveProps as Q, createVNode as it, createElementVNode as d, Fragment as k, renderList as _, toDisplayString as m, withKeys as ct, createTextVNode as Me, nextTick as X } from "vue";
+import { u as vt, o as dt, e as Z, g as ht, c as Re, t as yt, a as ft, p as ee, C as Ue, b as gt, J as bt, d as de, D as We, m as he, X as mt, s as G, E as xt, i as ye, f as te, j as Xe, k as le, n as Ge, K as je, q as pt, r as kt } from "./index-DjTPIx3R.js";
+import { _ as _t } from "./Title-DqZErnpZ.js";
+import { u as Ct, U as wt } from "./usePrinter-BFF1xn1s.js";
+import { D as zt } from "./DataTable-B2hVpPSW.js";
+import { L as Lt } from "./Legend-CzY3Yhr8.js";
+import St from "./vue-ui-skeleton-Dt9cA-wa.js";
+import { S as $t } from "./Slicer-BBolqweG.js";
+import At from "./vue-ui-accordion-CDTXGeL0.js";
+import { u as Be } from "./useNestedProp-BNmCbG1v.js";
+import { _ as Nt } from "./PackageVersion-B684aQUP.js";
+import { P as It } from "./PenAndPaper-mC0kh-S8.js";
 import { u as Ft } from "./useUserOptionState-BIvW1Kz7.js";
 import { _ as Pt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"], Dt = ["id"], Vt = ["stop-color"], Mt = ["stop-color"], Ht = ["id"], Ut = ["stop-color"], Wt = ["stop-color"], Rt = ["stop-color"], Xt = { key: 1 }, Gt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], jt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Bt = { key: 0 }, Yt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Kt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], qt = ["x", "y", "font-size", "fill", "font-weight"], Jt = ["text-anchor", "font-size", "fill", "transform"], Qt = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], Zt = { key: 1 }, el = ["cx", "cy", "r", "fill"], tl = { key: 0 }, ll = { key: 0 }, al = ["d", "stroke"], ol = ["text-anchor", "x", "y", "fill"], ul = ["cx", "cy", "r", "fill"], sl = { key: 0 }, nl = ["cx", "cy", "fill"], rl = { key: 1 }, il = ["d", "fill", "stroke"], cl = { key: 2 }, vl = ["d", "fill", "stroke"], dl = ["x", "y", "font-size", "fill"], hl = ["x", "y", "width", "fill", "onClick"], yl = ["x", "y", "width", "height", "onMouseenter", "onClick"], fl = {
+const Dt = ["id"], Ot = ["xmlns", "viewBox"], Et = ["x", "y", "width", "height"], Tt = ["id"], Vt = ["stop-color"], Ht = ["stop-color"], Mt = ["id"], Rt = ["stop-color"], Ut = ["stop-color"], Wt = ["stop-color"], Xt = { key: 1 }, Gt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], jt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Bt = { key: 0 }, Yt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Kt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], qt = ["x", "y", "font-size", "fill", "font-weight"], Jt = ["text-anchor", "font-size", "fill", "transform"], Qt = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], Zt = { key: 1 }, el = ["cx", "cy", "r", "fill"], tl = { key: 0 }, ll = { key: 0 }, al = ["d", "stroke"], ol = ["text-anchor", "x", "y", "fill"], ul = ["cx", "cy", "r", "fill"], sl = { key: 0 }, nl = ["cx", "cy", "fill"], rl = { key: 1 }, il = ["d", "fill", "stroke"], cl = { key: 2 }, vl = ["d", "fill", "stroke"], dl = ["x", "y", "font-size", "fill"], hl = ["x", "y", "width", "fill", "onClick"], yl = ["x", "y", "width", "height", "onMouseenter", "onClick"], fl = {
   key: 4,
   "data-cy-zoom": "",
   class: "vue-ui-donut-evolution-dialog"
-}, gl = ["x", "y", "width", "height", "fill"], bl = ["x1", "y1", "x2", "y2", "stroke"], ml = ["x1", "y2", "x2", "y1", "stroke"], xl = ["onKeypress", "cx", "cy", "r"], pl = ["d", "stroke"], kl = ["cx", "cy", "r", "fill"], _l = ["d", "fill", "stroke"], Cl = { class: "vue-ui-donut-evolution-focus" }, wl = ["text-anchor", "x", "y", "fill"], Ll = ["cx", "cy", "r", "fill"], zl = ["cx", "cy", "r", "fill"], Sl = ["x", "y", "fill"], $l = ["x", "y", "font-size", "fill"], Al = {
+}, gl = ["x", "y", "width", "height", "fill"], bl = ["x1", "y1", "x2", "y2", "stroke"], ml = ["x1", "y2", "x2", "y1", "stroke"], xl = ["onKeypress", "cx", "cy", "r"], pl = ["d", "stroke"], kl = ["cx", "cy", "r", "fill"], _l = ["d", "fill", "stroke"], Cl = { class: "vue-ui-donut-evolution-focus" }, wl = ["text-anchor", "x", "y", "fill"], zl = ["cx", "cy", "r", "fill"], Ll = ["cx", "cy", "r", "fill"], Sl = ["x", "y", "fill"], $l = ["x", "y", "font-size", "fill"], Al = {
   key: 5,
   class: "vue-data-ui-watermark"
 }, Nl = ["onClick"], Il = { key: 0 }, Fl = { key: 1 }, Pl = {
   key: 9,
   ref: "source",
   dir: "auto"
-}, Ol = { key: 0 }, El = { key: 1 }, Tl = {
+}, Dl = { key: 0 }, Ol = { key: 1 }, El = {
   __name: "vue-ui-donut-evolution",
   props: {
     config: {
@@ -52,11 +52,11 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
     async function be() {
       (e.value.style.chart.zoom.startIndex !== null || e.value.style.chart.zoom.endIndex !== null) && V.value ? (e.value.style.chart.zoom.startIndex !== null && (await X(), await X(), V.value && V.value.setStartValue(e.value.style.chart.zoom.startIndex)), e.value.style.chart.zoom.endIndex !== null && (await X(), await X(), V.value && V.value.setEndValue(Je(e.value.style.chart.zoom.endIndex + 1)))) : (h.value = {
         start: 0,
-        end: D.value
+        end: T.value
       }, pe.value += 1);
     }
     function Je(l) {
-      const u = D.value;
+      const u = T.value;
       return l > u ? u : l < 0 || e.value.style.chart.zoom.startIndex !== null && l < e.value.style.chart.zoom.startIndex ? e.value.style.chart.zoom.startIndex !== null ? e.value.style.chart.zoom.startIndex + 1 : 1 : l;
     }
     nt(() => {
@@ -80,11 +80,11 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         });
       }), be();
     }
-    const T = b(Ue()), C = b([]), g = b(null), ae = b(null), $ = b(!1), A = b(null), oe = b(null), Qe = b(null), xe = b(0), pe = b(0), ke = b(0), _e = b(0), Ce = b(0), e = p({
-      get: () => ze(),
+    const E = b(Re()), C = b([]), g = b(null), ae = b(null), $ = b(!1), A = b(null), oe = b(null), Qe = b(null), xe = b(0), pe = b(0), ke = b(0), _e = b(0), Ce = b(0), e = p({
+      get: () => Le(),
       set: (l) => l
-    }), { userOptionsVisible: ue, setUserOptionsVisibility: we, keepUserOptionState: Le } = Ft({ config: e.value });
-    function ze() {
+    }), { userOptionsVisible: ue, setUserOptionsVisibility: we, keepUserOptionState: ze } = Ft({ config: e.value });
+    function Le() {
       const l = Be({
         userConfig: x.config,
         defaultConfig: qe
@@ -96,15 +96,15 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
           defaultConfig: l
         }),
         customPalette: ft[l.theme] || ee
-      } : u = l, x.config && We(x.config, "style.chart.zoom.startIndex") ? u.style.chart.zoom.startIndex = x.config.style.chart.zoom.startIndex : u.style.chart.zoom.startIndex = null, x.config && We(x.config, "style.chart.zoom.endIndex") ? u.style.chart.zoom.endIndex = x.config.style.chart.zoom.endIndex : u.style.chart.zoom.endIndex = null, u;
+      } : u = l, x.config && Ue(x.config, "style.chart.zoom.startIndex") ? u.style.chart.zoom.startIndex = x.config.style.chart.zoom.startIndex : u.style.chart.zoom.startIndex = null, x.config && Ue(x.config, "style.chart.zoom.endIndex") ? u.style.chart.zoom.endIndex = x.config.style.chart.zoom.endIndex : u.style.chart.zoom.endIndex = null, u;
     }
-    Me(() => x.config, (l) => {
-      e.value = ze(), ue.value = !e.value.showOnChartHover, me(), ke.value += 1, _e.value += 1, Ce.value += 1;
-    }, { deep: !0 }), Me(() => x.dataset, (l) => {
+    He(() => x.config, (l) => {
+      e.value = Le(), ue.value = !e.value.showOnChartHover, me(), ke.value += 1, _e.value += 1, Ce.value += 1;
+    }, { deep: !0 }), He(() => x.dataset, (l) => {
       ge();
     }, { deep: !0 });
     const { isPrinting: Se, isImaging: $e, generatePdf: Ae, generateImage: Ne } = Ct({
-      elementId: T.value,
+      elementId: E.value,
       fileName: e.value.style.chart.title.text || "vue-ui-donut-evolution"
     }), Ze = p(() => e.value.userOptions.show && !e.value.style.chart.title.text), et = p(() => gt(e.value.customPalette)), B = b({
       showTable: e.value.table.show
@@ -123,7 +123,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         height: t,
         width: i
       };
-    }), O = p(() => (x.dataset.forEach((l, u) => {
+    }), D = p(() => (x.dataset.forEach((l, u) => {
       [null, void 0].includes(l.name) && Z({
         componentName: "VueUiDonutEvolution",
         type: "datasetSerieAttribute",
@@ -140,50 +140,50 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
       values: bt(l.values),
       color: de(l.color) || et.value[u] || ee[u] || ee[u % ee.length],
       length: (l.values || []).length,
-      uid: Ue()
-    })))), W = p(() => O.value.filter((l) => !C.value.includes(l.uid)).map((l) => ({
+      uid: Re()
+    })))), U = p(() => D.value.filter((l) => !C.value.includes(l.uid)).map((l) => ({
       ...l,
       values: l.values.filter((u, t) => t >= h.value.start && t <= h.value.end)
-    }))), D = p(() => Math.max(...W.value.map((l) => l.length))), L = p(() => r.value.width / (h.value.end - h.value.start)), w = p(() => {
+    }))), T = p(() => Math.max(...U.value.map((l) => l.length))), z = p(() => r.value.width / (h.value.end - h.value.start)), w = p(() => {
       const l = [];
       for (let s = 0; s < h.value.end - h.value.start; s += 1) {
-        const f = W.value.map((I) => I.values[s] ?? null), y = f.filter((I) => [void 0, null].includes(I)).length === f.length, N = f.reduce((I, z) => I + z, 0), ve = f.map((I) => I / N), U = n.value.left + L.value * s + L.value / 2;
+        const f = U.value.map((I) => I.values[s] ?? null), y = f.filter((I) => [void 0, null].includes(I)).length === f.length, N = f.reduce((I, L) => I + L, 0), ve = f.map((I) => I / N), R = n.value.left + z.value * s + z.value / 2;
         l.push({
           index: s,
           percentages: ve,
           subtotal: y || N < 0 ? null : N,
           values: f,
-          x: U
+          x: R
         });
       }
       const u = 0, t = Math.max(...l.map((s) => s.subtotal)), i = l.length === 1 ? t * 2 : t;
       return l.map((s, f) => {
-        const y = L.value / 2 * 0.7, N = y > r.value.width / 16 ? r.value.width / 16 : y, ve = g.value === s.index ? r.value.width / 16 : N, U = l.length > 4 ? y * 2 : y * 2 > L.value / 2 * 0.7 ? L.value / 2 * 0.7 : y * 2, I = r.value.absoluteHeight - n.value.bottom - r.value.height * s.subtotal / Re(u, i, e.value.style.chart.layout.grid.yAxis.dataLabels.steps).max;
+        const y = z.value / 2 * 0.7, N = y > r.value.width / 16 ? r.value.width / 16 : y, ve = g.value === s.index ? r.value.width / 16 : N, R = l.length > 4 ? y * 2 : y * 2 > z.value / 2 * 0.7 ? z.value / 2 * 0.7 : y * 2, I = r.value.absoluteHeight - n.value.bottom - r.value.height * s.subtotal / We(u, i, e.value.style.chart.layout.grid.yAxis.dataLabels.steps).max;
         return {
           ...s,
           y: I,
           radius: N,
           activeRadius: ve,
-          hoverRadius: U,
+          hoverRadius: R,
           donut: he({
-            series: W.value.map((z, Ve) => ({
-              color: z.color,
-              name: z.name,
-              value: z.values[f] ?? 0
+            series: U.value.map((L, Ve) => ({
+              color: L.color,
+              name: L.name,
+              value: L.values[f] ?? 0
             }))
           }, s.x, I, N, N, 1.99999, 2, 1, 360, 105.25, N / 2),
           donutHover: he({
-            series: W.value.map((z, Ve) => ({
-              color: z.color,
-              name: z.name,
-              value: z.values[f] ?? 0
+            series: U.value.map((L, Ve) => ({
+              color: L.color,
+              name: L.name,
+              value: L.values[f] ?? 0
             }))
-          }, s.x, I, U, U, 1.99999, 2, 1, 360, 105.25, U / 2),
+          }, s.x, I, R, R, 1.99999, 2, 1, 360, 105.25, R / 2),
           donutFocus: he({
-            series: W.value.map((z, Ve) => ({
-              color: z.color,
-              name: z.name,
-              value: z.values[f] ?? 0
+            series: U.value.map((L, Ve) => ({
+              color: L.color,
+              name: L.name,
+              value: L.values[f] ?? 0
             }))
           }, r.value.centerX, r.value.centerY, r.value.height / 3.6, r.value.height / 3.6, 1.99999, 2, 1, 360, 105.25, r.value.height / 6)
         };
@@ -205,14 +205,14 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
     const se = p(() => ({
       max: Math.max(...w.value.map((l) => l.subtotal)),
       min: 0
-    })), M = p(() => {
+    })), H = p(() => {
       const l = w.value.length === 1 ? se.value.max * 2 : se.value.max;
-      return Re(se.value.min, l, e.value.style.chart.layout.grid.yAxis.dataLabels.steps);
+      return We(se.value.min, l, e.value.style.chart.layout.grid.yAxis.dataLabels.steps);
     });
     function tt(l) {
-      return l / M.value.max;
+      return l / H.value.max;
     }
-    const lt = p(() => M.value.ticks.map((l) => ({
+    const lt = p(() => H.value.ticks.map((l) => ({
       y: r.value.absoluteHeight - n.value.bottom - r.value.height * tt(l),
       value: l
     })));
@@ -232,7 +232,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
     function Pe() {
       A.value = null, $.value = !1, ne.value = null;
     }
-    const Oe = p(() => O.value.map((l, u) => ({
+    const De = p(() => D.value.map((l, u) => ({
       name: l.name,
       value: l.values.slice(h.value.start, h.value.end).reduce((t, i) => t + i, 0),
       shape: "circle",
@@ -243,7 +243,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
       opacity: C.value.includes(l.uid) ? 0.5 : 1,
       segregate: () => ie(l.uid),
       isSegregated: C.value.includes(l.uid)
-    }))), Ee = p(() => w.value.map((l) => l.subtotal).reduce((l, u) => l + u, 0)), ot = p(() => ({
+    }))), Oe = p(() => w.value.map((l) => l.subtotal).reduce((l, u) => l + u, 0)), ot = p(() => ({
       cy: "donut-div-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
@@ -255,20 +255,20 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
       if (C.value.includes(l))
         C.value = C.value.filter((u) => u !== l), fe("selectLegend", null);
       else {
-        if (C.value.length === O.value.length - 1) return;
-        C.value.push(l), fe("selectLegend", O.value.find((u) => u.uid === l));
+        if (C.value.length === D.value.length - 1) return;
+        C.value.push(l), fe("selectLegend", D.value.find((u) => u.uid === l));
       }
       A.value && re(w.value.find((u, t) => t === ne.value));
     }
-    const H = p(() => {
-      const l = [""].concat(O.value.filter((s) => !C.value.includes(s.uid)).map((s) => ({
+    const M = p(() => {
+      const l = [""].concat(D.value.filter((s) => !C.value.includes(s.uid)).map((s) => ({
         name: s.name,
         color: s.color
       }))).concat(["Σ"]);
       let u = [];
-      for (let s = 0; s < D.value; s += 1) {
-        const f = O.value.filter((y) => !C.value.includes(y.uid)).map((y) => y.values[s] ?? 0).reduce((y, N) => y + N, 0);
-        u.push([e.value.style.chart.layout.grid.xAxis.dataLabels.values[s] ?? "-"].concat(O.value.filter((y) => !C.value.includes(y.uid)).map((y) => ({
+      for (let s = 0; s < T.value; s += 1) {
+        const f = D.value.filter((y) => !C.value.includes(y.uid)).map((y) => y.values[s] ?? 0).reduce((y, N) => y + N, 0);
+        u.push([e.value.style.chart.layout.grid.xAxis.dataLabels.values[s] ?? "-"].concat(D.value.filter((y) => !C.value.includes(y.uid)).map((y) => ({
           value: y.values[s] ?? 0,
           percentage: y.values[s] ? y.values[s] / f * 100 : 0
         }))).concat([`${e.value.style.chart.layout.dataLabels.prefix}${Number(f.toFixed(e.value.table.td.roundingValue))}${e.value.style.chart.layout.dataLabels.suffix}`]));
@@ -287,23 +287,23 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         breakpoint: e.value.table.responsiveBreakpoint
       }, i = [
         e.value.table.columnNames.period
-      ].concat(O.value.filter((s) => !C.value.includes(s.uid)).map((s) => s.name)).concat(e.value.table.columnNames.total);
+      ].concat(D.value.filter((s) => !C.value.includes(s.uid)).map((s) => s.name)).concat(e.value.table.columnNames.total);
       return { head: l, body: u, config: t, colNames: i };
     });
     function ut() {
-      return O.value;
+      return D.value;
     }
-    function Te() {
+    function Ee() {
       X(() => {
-        const l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], u = [...H.value.head.map((f) => f.name ?? f)], t = [...H.value.body.map((f) => f.map((y) => y.value ?? y))], i = l.concat([u]).concat(t), s = pt(i);
+        const l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], u = [...M.value.head.map((f) => f.name ?? f)], t = [...M.value.body.map((f) => f.map((y) => y.value ?? y))], i = l.concat([u]).concat(t), s = pt(i);
         kt({ csvContent: s, title: e.value.style.chart.title.text || "vue-ui-donut-evolution" });
       });
     }
-    const R = b(!1);
+    const W = b(!1);
     function st(l) {
-      R.value = l, xe.value += 1;
+      W.value = l, xe.value += 1;
     }
-    function De() {
+    function Te() {
       B.value.showTable = !B.value.showTable;
     }
     const K = b(!1);
@@ -313,20 +313,20 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
     return Ke({
       getData: ut,
       generatePdf: Ae,
-      generateCsv: Te,
+      generateCsv: Ee,
       generateImage: Ne,
-      toggleTable: De,
+      toggleTable: Te,
       toggleAnnotator: ce
     }), (l, u) => (a(), o("div", {
       ref_key: "donutEvolutionChart",
       ref: oe,
-      class: P(`vue-ui-donut-evolution ${R.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      class: P(`vue-ui-donut-evolution ${W.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
       style: q(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor}`),
-      id: T.value,
+      id: E.value,
       onMouseenter: u[4] || (u[4] = () => c(we)(!0)),
       onMouseleave: u[5] || (u[5] = () => c(we)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (a(), E(It, {
+      e.value.userOptions.buttons.annotator ? (a(), O(It, {
         key: 0,
         parent: oe.value,
         backgroundColor: e.value.style.chart.backgroundColor,
@@ -346,7 +346,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         style: "width:100%;background:transparent;padding-bottom:24px",
         onMouseleave: Fe
       }, [
-        (a(), E(_t, {
+        (a(), O(_t, {
           key: `title_${ke.value}`,
           config: {
             title: {
@@ -360,20 +360,20 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
           }
         }, null, 8, ["config"]))
       ], 32)) : v("", !0),
-      e.value.userOptions.show && j.value && (c(Le) || c(ue)) ? (a(), E(wt, {
+      e.value.userOptions.show && j.value && (c(ze) || c(ue)) ? (a(), O(wt, {
         ref: "details",
         key: `user_options_${xe.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
         isPrinting: c(Se),
         isImaging: c($e),
-        uid: T.value,
+        uid: E.value,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasImg: e.value.userOptions.buttons.img,
         hasXls: e.value.userOptions.buttons.csv,
         hasTable: e.value.userOptions.buttons.table,
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: R.value,
+        isFullscreen: W.value,
         titles: { ...e.value.userOptions.buttonTitles },
         chartElement: oe.value,
         position: e.value.userOptions.position,
@@ -381,12 +381,12 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         isAnnotation: K.value,
         onToggleFullscreen: st,
         onGeneratePdf: c(Ae),
-        onGenerateCsv: Te,
+        onGenerateCsv: Ee,
         onGenerateImage: c(Ne),
-        onToggleTable: De,
+        onToggleTable: Te,
         onToggleAnnotator: ce,
         style: q({
-          visibility: c(Le) ? c(ue) ? "visible" : "hidden" : "visible"
+          visibility: c(ze) ? c(ue) ? "visible" : "hidden" : "visible"
         })
       }, rt({ _: 2 }, [
         l.$slots.optionPdf ? {
@@ -435,7 +435,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
       j.value ? (a(), o("svg", {
         key: 4,
         xmlns: c(mt),
-        class: P({ "vue-data-ui-fullscreen--on": R.value, "vue-data-ui-fulscreen--off": !R.value }),
+        class: P({ "vue-data-ui-fullscreen--on": W.value, "vue-data-ui-fulscreen--off": !W.value }),
         viewBox: `0 0 ${r.value.absoluteWidth} ${r.value.absoluteHeight}`,
         style: q(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
       }, [
@@ -451,10 +451,10 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
           }
         }, [
           S(l.$slots, "chart-background", {}, void 0, !0)
-        ], 8, Tt)) : v("", !0),
+        ], 8, Et)) : v("", !0),
         d("defs", null, [
           d("linearGradient", {
-            id: `hover_${T.value}`,
+            id: `hover_${E.value}`,
             x1: "0%",
             y1: "0%",
             x2: "0%",
@@ -467,24 +467,24 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
             d("stop", {
               offset: "100%",
               "stop-color": c(G)(e.value.style.chart.layout.highlighter.color, e.value.style.chart.layout.highlighter.opacity)
-            }, null, 8, Mt)
-          ], 8, Dt),
+            }, null, 8, Ht)
+          ], 8, Tt),
           d("radialGradient", {
-            id: `focus_${T.value}`
+            id: `focus_${E.value}`
           }, [
             d("stop", {
               offset: "0%",
               "stop-color": c(G)(c(de)(e.value.style.chart.backgroundColor), 0)
-            }, null, 8, Ut),
+            }, null, 8, Rt),
             d("stop", {
               offset: "77%",
               "stop-color": c(G)("#FFFFFF", 30)
-            }, null, 8, Wt),
+            }, null, 8, Ut),
             d("stop", {
               offset: "100%",
               "stop-color": c(G)(c(de)(e.value.style.chart.backgroundColor), 0)
-            }, null, 8, Rt)
-          ], 8, Ht)
+            }, null, 8, Wt)
+          ], 8, Mt)
         ]),
         e.value.style.chart.layout.grid.show ? (a(), o("g", Xt, [
           d("line", {
@@ -507,8 +507,8 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
           }, null, 8, jt),
           e.value.style.chart.layout.grid.showVerticalLines ? (a(), o("g", Bt, [
             (a(!0), o(k, null, _(h.value.end - h.value.start, (t, i) => (a(), o("line", {
-              x1: n.value.left + (i + 1) * L.value,
-              x2: n.value.left + (i + 1) * L.value,
+              x1: n.value.left + (i + 1) * z.value,
+              x2: n.value.left + (i + 1) * z.value,
               y1: n.value.top,
               y2: r.value.absoluteHeight - n.value.bottom,
               stroke: e.value.style.chart.layout.grid.stroke,
@@ -522,7 +522,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
           class: P({ "donut-opacity": !0, "donut-behind": g.value !== null || $.value })
         }, [
           (a(!0), o(k, null, _(lt.value, (t, i) => (a(), o("g", null, [
-            t.value >= M.value.min && t.value <= M.value.max ? (a(), o("line", {
+            t.value >= H.value.min && t.value <= H.value.max ? (a(), o("line", {
               key: 0,
               x1: n.value.left,
               x2: n.value.left - 5,
@@ -531,7 +531,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
               stroke: e.value.style.chart.layout.grid.stroke,
               "stroke-width": e.value.style.chart.layout.grid.strokeWidth
             }, null, 8, Kt)) : v("", !0),
-            t.value >= M.value.min && t.value <= M.value.max ? (a(), o("text", {
+            t.value >= H.value.min && t.value <= H.value.max ? (a(), o("text", {
               key: 1,
               x: n.value.left - 8 + e.value.style.chart.layout.grid.yAxis.dataLabels.offsetX,
               y: t.y + e.value.style.chart.layout.grid.yAxis.dataLabels.fontSize / 3,
@@ -557,12 +557,12 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
           class: P({ "donut-opacity": !0, "donut-behind": $.value })
         }, [
           (a(!0), o(k, null, _(h.value.end - h.value.start, (t, i) => (a(), o("g", null, [
-            e.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast && (i === 0 || i === D.value - 1) || !e.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast ? (a(), o("text", {
+            e.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast && (i === 0 || i === T.value - 1) || !e.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast ? (a(), o("text", {
               key: 0,
               "text-anchor": e.value.style.chart.layout.grid.xAxis.dataLabels.rotation > 0 ? "start" : e.value.style.chart.layout.grid.xAxis.dataLabels.rotation < 0 ? "end" : "middle",
               "font-size": e.value.style.chart.layout.grid.xAxis.dataLabels.fontSize,
               fill: e.value.style.chart.layout.grid.xAxis.dataLabels.color,
-              transform: `translate(${n.value.left + L.value * i + L.value / 2}, ${e.value.style.chart.layout.grid.xAxis.dataLabels.offsetY + r.value.absoluteHeight - n.value.bottom + e.value.style.chart.layout.grid.xAxis.dataLabels.fontSize * 2}), rotate(${e.value.style.chart.layout.grid.xAxis.dataLabels.rotation})`
+              transform: `translate(${n.value.left + z.value * i + z.value / 2}, ${e.value.style.chart.layout.grid.xAxis.dataLabels.offsetY + r.value.absoluteHeight - n.value.bottom + e.value.style.chart.layout.grid.xAxis.dataLabels.fontSize * 2}), rotate(${e.value.style.chart.layout.grid.xAxis.dataLabels.rotation})`
             }, m(e.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(i) + Number(h.value.start)] ?? ""), 9, Jt)) : v("", !0)
           ]))), 256))
         ], 2)) : v("", !0),
@@ -667,19 +667,19 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
           }, m(Y(t.subtotal, t, i)), 9, dl)) : v("", !0)
         ], 2))), 256)),
         (a(!0), o(k, null, _(w.value, (t, i) => (a(), o("rect", {
-          x: n.value.left + i * L.value,
+          x: n.value.left + i * z.value,
           y: r.value.absoluteHeight - n.value.bottom - 10,
-          width: L.value,
+          width: z.value,
           height: 10,
-          fill: g.value === t.index ? `url(#hover_${T.value})` : "transparent",
+          fill: g.value === t.index ? `url(#hover_${E.value})` : "transparent",
           onClick: (s) => re(t, i),
           class: P({ "donut-hover": g.value === t.index && t.subtotal })
         }, null, 10, hl))), 256)),
         (a(!0), o(k, null, _(w.value, (t, i) => (a(), o("rect", {
           "data-cy-trap": "",
-          x: n.value.left + i * L.value,
+          x: n.value.left + i * z.value,
           y: n.value.top,
-          width: L.value,
+          width: z.value,
           height: r.value.height,
           fill: "transparent",
           onMouseenter: (s) => at(t),
@@ -767,14 +767,14 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
             cx: n.value.left + r.value.width / 2,
             cy: n.value.top + r.value.height / 2,
             r: r.value.height / 3.8,
-            fill: `url(#focus_${T.value})`
-          }, null, 8, Ll),
+            fill: `url(#focus_${E.value})`
+          }, null, 8, zl),
           d("circle", {
             cx: n.value.left + r.value.width / 2,
             cy: n.value.top + r.value.height / 2,
             r: r.value.height / 7.7,
             fill: e.value.style.chart.backgroundColor
-          }, null, 8, zl),
+          }, null, 8, Ll),
           d("text", {
             "text-anchor": "middle",
             x: n.value.left + r.value.width / 2,
@@ -793,11 +793,11 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
           }, m(e.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(A.value.index) + Number(h.value.start)]), 9, $l)) : v("", !0)
         ])) : v("", !0),
         S(l.$slots, "svg", { svg: r.value }, void 0, !0)
-      ], 14, Et)) : v("", !0),
+      ], 14, Ot)) : v("", !0),
       l.$slots.watermark ? (a(), o("div", Al, [
         S(l.$slots, "watermark", J(Q({ isPrinting: c(Se) || c($e) })), void 0, !0)
       ])) : v("", !0),
-      j.value ? v("", !0) : (a(), E(St, {
+      j.value ? v("", !0) : (a(), O(St, {
         key: 6,
         config: {
           type: "donutEvolution",
@@ -814,7 +814,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
           }
         }
       }, null, 8, ["config"])),
-      D.value > 1 && e.value.style.chart.zoom.show ? (a(), E($t, {
+      T.value > 1 && e.value.style.chart.zoom.show ? (a(), O($t, {
         ref_key: "slicerComponent",
         ref: V,
         key: `slicer_${pe.value}`,
@@ -827,7 +827,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         textColor: e.value.style.chart.color,
         inputColor: e.value.style.chart.zoom.color,
         selectColor: e.value.style.chart.zoom.highlightColor,
-        max: D.value,
+        max: T.value,
         min: 0,
         valueStart: h.value.start,
         valueEnd: h.value.end,
@@ -836,17 +836,19 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         end: h.value.end,
         "onUpdate:end": u[1] || (u[1] = (t) => h.value.end = t),
         refreshStartPoint: e.value.style.chart.zoom.startIndex !== null ? e.value.style.chart.zoom.startIndex : 0,
-        refreshEndPoint: e.value.style.chart.zoom.endIndex !== null ? e.value.style.chart.zoom.endIndex + 1 : D.value,
+        refreshEndPoint: e.value.style.chart.zoom.endIndex !== null ? e.value.style.chart.zoom.endIndex + 1 : T.value,
+        enableRangeHandles: e.value.style.chart.zoom.enableRangeHandles,
+        enableSelectionDrag: e.value.style.chart.zoom.enableSelectionDrag,
         onReset: ge
       }, {
         "reset-action": F(({ reset: t }) => [
           S(l.$slots, "reset-action", J(Q({ reset: t })), void 0, !0)
         ]),
         _: 3
-      }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "start", "end", "refreshStartPoint", "refreshEndPoint"])) : v("", !0),
-      e.value.style.chart.legend.show ? (a(), E(zt, {
+      }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "start", "end", "refreshStartPoint", "refreshEndPoint", "enableRangeHandles", "enableSelectionDrag"])) : v("", !0),
+      e.value.style.chart.legend.show ? (a(), O(Lt, {
         key: `legend_${Ce.value}`,
-        legendSet: Oe.value,
+        legendSet: De.value,
         config: ot.value,
         onClickMarker: u[2] || (u[2] = ({ legend: t }) => ie(t.uid))
       }, {
@@ -856,7 +858,7 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
             onClick: (s) => ie(t.uid),
             style: q(`opacity:${C.value.includes(t.uid) ? 0.5 : 1}`)
           }, [
-            He(m(t.name) + ": " + m(c(ye)(
+            Me(m(t.name) + ": " + m(c(ye)(
               e.value.style.chart.layout.dataLabels.formatter,
               t.value,
               c(te)({
@@ -867,8 +869,8 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
               }),
               { datapoint: t, seriesIndex: i }
             )) + " ", 1),
-            C.value.includes(t.uid) ? (a(), o("span", Fl, " ( - % ) ")) : (a(), o("span", Il, " (" + m(isNaN(t.value / Ee.value) ? "-" : c(te)({
-              v: t.value / Ee.value * 100,
+            C.value.includes(t.uid) ? (a(), o("span", Fl, " ( - % ) ")) : (a(), o("span", Il, " (" + m(isNaN(t.value / Oe.value) ? "-" : c(te)({
+              v: t.value / Oe.value * 100,
               s: "%",
               r: e.value.style.chart.legend.roundingPercentage
             })) + ") ", 1))
@@ -876,11 +878,11 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         ]),
         _: 1
       }, 8, ["legendSet", "config"])) : v("", !0),
-      S(l.$slots, "legend", { legend: Oe.value }, void 0, !0),
+      S(l.$slots, "legend", { legend: De.value }, void 0, !0),
       l.$slots.source ? (a(), o("div", Pl, [
         S(l.$slots, "source", {}, void 0, !0)
       ], 512)) : v("", !0),
-      j.value ? (a(), E(At, {
+      j.value ? (a(), O(At, {
         key: 10,
         hideDetails: "",
         config: {
@@ -897,20 +899,20 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         }
       }, {
         content: F(() => [
-          (a(), E(Lt, {
+          (a(), O(zt, {
             key: `table_${_e.value}`,
-            colNames: H.value.colNames,
-            head: H.value.head,
-            body: H.value.body,
-            config: H.value.config,
+            colNames: M.value.colNames,
+            head: M.value.head,
+            body: M.value.body,
+            config: M.value.config,
             title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
             onClose: u[3] || (u[3] = (t) => B.value.showTable = !1)
           }, {
             th: F(({ th: t }) => [
-              He(m(t.name ?? t), 1)
+              Me(m(t.name ?? t), 1)
             ]),
             td: F(({ td: t }) => [
-              t.value === null ? (a(), o("span", Ol, "-")) : (a(), o("b", El, m(isNaN(t.value) ? "" : e.value.style.chart.layout.dataLabels.prefix) + m(!isNaN(t.value) && t.value !== null ? Number(t.value.toFixed(e.value.table.td.roundingValue)).toLocaleString() : t) + m(isNaN(t.value) ? "" : e.value.style.chart.layout.dataLabels.suffix), 1)),
+              t.value === null ? (a(), o("span", Dl, "-")) : (a(), o("b", Ol, m(isNaN(t.value) ? "" : e.value.style.chart.layout.dataLabels.prefix) + m(!isNaN(t.value) && t.value !== null ? Number(t.value.toFixed(e.value.table.td.roundingValue)).toLocaleString() : t) + m(isNaN(t.value) ? "" : e.value.style.chart.layout.dataLabels.suffix), 1)),
               d("span", null, m(t.percentage && !isNaN(t.percentage) ? `(${Number(t.percentage.toFixed(e.value.table.td.roundingPercentage)).toLocaleString()}%)` : ""), 1)
             ]),
             _: 1
@@ -918,9 +920,9 @@ const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"]
         ]),
         _: 1
       }, 8, ["config"])) : v("", !0)
-    ], 46, Ot));
+    ], 46, Dt));
   }
-}, Jl = /* @__PURE__ */ Pt(Tl, [["__scopeId", "data-v-f941860c"]]);
+}, Jl = /* @__PURE__ */ Pt(El, [["__scopeId", "data-v-bfca0728"]]);
 export {
   Jl as default
 };