vue-data-ui 2.3.74 → 2.3.76

package/dist/{vue-ui-parallel-coordinate-plot-CyChE3NP.js → vue-ui-parallel-coordinate-plot-CTZY-pY8.js}

@@ -1,20 +1,20 @@
-import { computed as y, ref as f, onMounted as Pe, onBeforeUnmount as Ne, openBlock as u, createElementBlock as i, normalizeClass as E, normalizeStyle as _, createVNode as J, createCommentVNode as g, createBlock as D, unref as z, createSlots as Le, withCtx as b, renderSlot as x, normalizeProps as j, guardReactiveProps as R, Fragment as C, renderList as A, createElementVNode as I, toDisplayString as N, createTextVNode as Se } from "vue";
-import { u as Oe, c as K, t as De, a as We, p as U, o as Be, e as ye, g as Ee, b as je, d as Re, B as Ue, O as Ve, P as Ge, Q as He, X as Xe, x as fe, i as ge, f as be, y as Ye, q as qe, r as Qe, D as V } from "./index-C8SH0f2u.js";
-import { t as Je, u as Ke } from "./useResponsive-NZB-WLRF.js";
-import { _ as Ze } from "./Title-DZjnxQdN.js";
-import { L as et } from "./Legend-Cj7T-DqJ.js";
-import { _ as tt } from "./Tooltip--kgFEVZs.js";
-import { _ as at } from "./Shape-Bo8ZjViG.js";
-import { u as lt, U as ot } from "./usePrinter-Dj50NAxo.js";
-import { D as st } from "./DataTable-CKdV-L0e.js";
-import nt from "./vue-ui-accordion-YHleIgkV.js";
-import ut from "./vue-ui-skeleton-B4eWLjH3.js";
-import { u as xe } from "./useNestedProp-lS_T5lM3.js";
-import { _ as it } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events": "none" } }, dt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ht = ["x", "y", "fill", "font-size", "font-weight"], pt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], mt = ["x", "y", "fill", "font-size", "font-weight"], yt = { key: 0 }, ft = ["x", "y", "font-size", "fill"], gt = ["width", "x", "y"], bt = { style: { width: "100%" } }, xt = ["x", "y", "fill", "font-weight", "font-size", "onMouseenter"], kt = ["d", "stroke", "stroke-width", "onMouseenter"], Ct = {
+import { computed as f, ref as h, watch as Oe, onMounted as De, onBeforeUnmount as We, openBlock as u, createElementBlock as i, normalizeClass as E, normalizeStyle as _, createBlock as I, createCommentVNode as g, unref as A, createSlots as Be, withCtx as b, renderSlot as x, normalizeProps as j, guardReactiveProps as R, Fragment as C, renderList as M, createElementVNode as F, toDisplayString as S, createVNode as Ee, createTextVNode as je } from "vue";
+import { u as Re, c as J, t as Ue, a as Ve, p as U, o as Ge, e as xe, g as He, b as Xe, d as Ye, B as qe, O as Qe, P as Je, Q as Ke, X as Ze, x as ke, i as Ce, f as we, y as et, q as tt, r as at, D as V } from "./index-CaV1s-yZ.js";
+import { t as lt, u as ot } from "./useResponsive-NZB-WLRF.js";
+import { _ as st } from "./Title-gUz6GDA3.js";
+import { L as nt } from "./Legend-5cQ0xZjK.js";
+import { _ as ut } from "./Tooltip-DfSM1mNP.js";
+import { _ as it } from "./Shape-CiTElr_0.js";
+import { u as rt, U as ct } from "./usePrinter-rvJyT65A.js";
+import { D as vt } from "./DataTable-e2fnfjXV.js";
+import dt from "./vue-ui-accordion-CpzGQ63y.js";
+import ht from "./vue-ui-skeleton-CvFX_ExX.js";
+import { u as $e } from "./useNestedProp-tWCzZrLx.js";
+import { _ as pt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const mt = ["id"], yt = ["xmlns", "viewBox"], ft = { style: { "pointer-events": "none" } }, gt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], bt = ["x", "y", "fill", "font-size", "font-weight"], xt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], kt = ["x", "y", "fill", "font-size", "font-weight"], Ct = { key: 0 }, wt = ["x", "y", "font-size", "fill"], $t = ["width", "x", "y"], _t = { style: { width: "100%" } }, Tt = ["x", "y", "fill", "font-weight", "font-size", "onMouseenter"], zt = ["d", "stroke", "stroke-width", "onMouseenter"], At = {
   key: 3,
   class: "vue-data-ui-watermark"
-}, wt = ["onClick"], $t = ["innerHTML"], _t = {
+}, Mt = ["onClick"], It = ["innerHTML"], Ft = {
   __name: "vue-ui-parallel-coordinate-plot",
   props: {
     config: {
@@ -31,89 +31,101 @@ const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events":
     }
   },
   emits: ["selectLegend", "selectDatapoint"],
-  setup(ke, { expose: Ce, emit: Z }) {
-    const M = ke, { vue_ui_parallel_coordinate_plot: we } = Oe(), F = y({
+  setup(_e, { expose: Te, emit: K }) {
+    const T = _e, { vue_ui_parallel_coordinate_plot: ze } = Re(), P = f({
       get() {
-        return !!M.dataset && M.dataset.length;
+        return !!T.dataset && T.dataset.length;
       },
-      set(a) {
-        return a;
+      set(t) {
+        return t;
       }
-    }), ee = f(0), L = f(null), te = f(null), ae = f(null), G = f(K()), S = f(!1);
-    function $e(a) {
-      S.value = a, ee.value += 1;
+    }), Z = h(0), L = h(null), ee = h(null), te = h(null), ae = h(0), le = h(0), oe = h(0), G = h(J()), O = h(!1);
+    function Ae(t) {
+      O.value = t, Z.value += 1;
     }
-    const e = y(() => {
-      const a = xe({
-        userConfig: M.config,
-        defaultConfig: we
+    const e = f({
+      get: () => se(),
+      set: (t) => t
+    });
+    function se() {
+      const t = $e({
+        userConfig: T.config,
+        defaultConfig: ze
       });
-      return a.theme ? {
-        ...xe({
-          userConfig: De.vue_ui_parallel_coordinate_plot[a.theme] || M.config,
-          defaultConfig: a
+      return t.theme ? {
+        ...$e({
+          userConfig: Ue.vue_ui_parallel_coordinate_plot[t.theme] || T.config,
+          defaultConfig: t
         }),
-        customPalette: We[a.theme] || U
-      } : a;
-    }), W = f(null);
-    Pe(() => {
-      if (Be(M.dataset) ? ye({
+        customPalette: Ve[t.theme] || U
+      } : t;
+    }
+    Oe(() => T.config, (t) => {
+      e.value = se(), ne(), ae.value += 1, oe.value += 1, le.value += 1;
+    }, { deep: !0 });
+    const W = h(null);
+    De(() => {
+      ne();
+    });
+    function ne() {
+      if (Ge(T.dataset) ? xe({
         componentName: "VueUiParallelCoordinatePlot",
         type: "dataset"
-      }) : M.dataset.forEach((a, l) => {
-        Ee({
-          datasetObject: a,
+      }) : T.dataset.forEach((t, l) => {
+        He({
+          datasetObject: t,
           requiredAttributes: ["name", "series"]
-        }).forEach((t) => {
-          F.value = !1, ye({
+        }).forEach((a) => {
+          P.value = !1, xe({
             componentName: "VueUiParallelCoordinatePlot",
             type: "datasetSerieAttribute",
-            property: t,
+            property: a,
             index: l
           });
         });
       }), e.value.responsive) {
-        const a = Je(() => {
-          const { width: l, height: t } = Ke({
+        const t = lt(() => {
+          const { width: l, height: a } = ot({
             chart: L.value,
-            title: e.value.style.chart.title.text ? te.value : null,
-            legend: e.value.style.chart.legend.show ? ae.value : null
+            title: e.value.style.chart.title.text ? ee.value : null,
+            legend: e.value.style.chart.legend.show ? te.value : null
           });
-          c.value.width = l, c.value.height = t, c.value.plotSize = V({
-            relator: Math.min(l, t),
+          c.value.width = l, c.value.height = a, c.value.plotSize = V({
+            relator: Math.min(l, a),
             adjuster: 600,
             source: e.value.style.chart.plots.radius,
             threshold: 2,
             fallback: 2
           }), c.value.ticksFontSize = V({
-            relator: Math.min(l, t),
+            relator: Math.min(l, a),
             adjuster: 600,
             source: e.value.style.chart.yAxis.labels.ticks.fontSize,
             threshold: 10,
             fallback: 10
           }), c.value.datapointFontSize = V({
-            relator: Math.min(l, t),
+            relator: Math.min(l, a),
             adjuster: 600,
             source: e.value.style.chart.yAxis.labels.datapoints.fontSize,
             threshold: 10,
             fallback: 10
           }), c.value.axisNameFontSize = V({
-            relator: Math.min(l, t),
+            relator: Math.min(l, a),
             adjuster: 600,
             source: e.value.style.chart.yAxis.labels.axisNamesFontSize,
             threshold: 12,
             fallback: 12
           });
         });
-        W.value = new ResizeObserver(a), W.value.observe(L.value.parentNode);
+        W.value = new ResizeObserver(t), W.value.observe(L.value.parentNode);
       }
-    }), Ne(() => {
+    }
+    We(() => {
       W.value && W.value.disconnect();
     });
-    const { isPrinting: le, isImaging: oe, generatePdf: se, generateImage: ne } = lt({
+    const { isPrinting: ue, isImaging: ie, generatePdf: re, generateImage: ce } = rt({
       elementId: `pcp_${G.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-parallel-coordinate-plot"
-    }), c = f({
+    }), c = h({
       height: e.value.style.chart.height,
       width: e.value.style.chart.width,
       plotSize: e.value.style.chart.plots.radius,
@@ -122,161 +134,161 @@ const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events":
       // ratio 42.85
       datapointFontSize: e.value.style.chart.yAxis.labels.datapoints.fontSize,
       axisNameFontSize: e.value.style.chart.yAxis.labels.axisNamesFontSize
-    }), v = y(() => {
-      const { top: a, right: l, bottom: t, left: o } = e.value.style.chart.padding, n = c.value.height, s = c.value.width;
+    }), v = f(() => {
+      const { top: t, right: l, bottom: a, left: o } = e.value.style.chart.padding, n = c.value.height, s = c.value.width;
       return {
         chartHeight: n,
         chartWidth: s,
-        height: n - a - t,
+        height: n - t - a,
         width: s - o - l,
-        top: a,
+        top: t,
         left: o,
         right: s - l,
-        bottom: n - t
+        bottom: n - a
       };
-    }), _e = y(() => je(e.value.customPalette)), m = f({
+    }), Me = f(() => Xe(e.value.customPalette)), y = h({
       dataLabels: {
         show: e.value.style.chart.yAxis.labels.datapoints.show
       },
       showTable: e.value.table.show,
       showTooltip: e.value.style.chart.tooltip.show
-    }), w = f([]);
-    function ue(a) {
-      w.value.includes(a) ? w.value = w.value.filter((l) => l !== a) : w.value.push(a);
+    }), w = h([]);
+    function ve(t) {
+      w.value.includes(t) ? w.value = w.value.filter((l) => l !== t) : w.value.push(t);
     }
-    const T = y(() => M.dataset.map((a, l) => {
-      const t = Re(a.color) || _e.value[l] || U[l] || U[l % U.length];
+    const z = f(() => T.dataset.map((t, l) => {
+      const a = Ye(t.color) || Me.value[l] || U[l] || U[l % U.length];
       return {
-        ...a,
-        series: a.series.map((o) => ({
+        ...t,
+        series: t.series.map((o) => ({
           ...o,
-          id: K(),
-          color: t
+          id: J(),
+          color: a
         })),
         seriesIndex: l,
-        color: t,
-        id: K(),
-        shape: a.shape || "circle"
+        color: a,
+        id: J(),
+        shape: t.shape || "circle"
       };
-    })), Te = y(() => T.value.map((a) => ({
-      ...a,
-      opacity: w.value.includes(a.id) ? 0.5 : 1,
-      segregate: () => ue(a.id),
-      isSegregated: w.value.includes(a.id)
-    }))), ze = y(() => ({
+    })), Ie = f(() => z.value.map((t) => ({
+      ...t,
+      opacity: w.value.includes(t.id) ? 0.5 : 1,
+      segregate: () => ve(t.id),
+      isSegregated: w.value.includes(t.id)
+    }))), Fe = f(() => ({
       cy: "pcp-div-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
       fontSize: e.value.style.chart.legend.fontSize,
       paddingBottom: 12,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
-    })), ie = y(() => Math.max(
-      ...T.value.filter((a) => !w.value.includes(a.id)).map((a) => Math.max(...a.series.flatMap((l) => l.values.length)))
-    )), k = y(() => v.value.width / ie.value), H = y(() => T.value.filter((a) => !w.value.includes(a.id))), p = y(() => {
-      let a = [];
-      for (let l = 0; l < ie.value; l += 1) {
-        const t = Math.min(...H.value.flatMap((d) => d.series.map((B) => B.values[l] || 0) || 0)), o = Math.max(...H.value.flatMap((d) => d.series.map((B) => B.values[l] || 0) || 0)), n = o === t ? t / 4 : t, s = o === t ? o * 2 : o, r = Ue(n, s, e.value.style.chart.yAxis.scaleTicks), $ = r.ticks.map((d, B) => {
-          const Ie = r.min < 0 ? d + Math.abs(r.min) : d - Math.abs(r.min), Fe = r.min < 0 ? r.max + Math.abs(r.min) : r.max - Math.abs(r.min);
+    })), de = f(() => Math.max(
+      ...z.value.filter((t) => !w.value.includes(t.id)).map((t) => Math.max(...t.series.flatMap((l) => l.values.length)))
+    )), k = f(() => v.value.width / de.value), H = f(() => z.value.filter((t) => !w.value.includes(t.id))), m = f(() => {
+      let t = [];
+      for (let l = 0; l < de.value; l += 1) {
+        const a = Math.min(...H.value.flatMap((d) => d.series.map((B) => B.values[l] || 0) || 0)), o = Math.max(...H.value.flatMap((d) => d.series.map((B) => B.values[l] || 0) || 0)), n = o === a ? a / 4 : a, s = o === a ? o * 2 : o, r = qe(n, s, e.value.style.chart.yAxis.scaleTicks), $ = r.ticks.map((d, B) => {
+          const Se = r.min < 0 ? d + Math.abs(r.min) : d - Math.abs(r.min), Le = r.min < 0 ? r.max + Math.abs(r.min) : r.max - Math.abs(r.min);
           return {
-            y: v.value.bottom - v.value.height * (Ie / Fe),
+            y: v.value.bottom - v.value.height * (Se / Le),
             x: v.value.left + k.value * l + k.value / 2,
             value: d
           };
         });
-        a.push({
+        t.push({
           scale: r,
           ticks: $,
           name: e.value.style.chart.yAxis.labels.axisNames[l] || `Y-${l + 1}`
         });
       }
-      return a;
-    }), X = y(() => H.value.map((a, l) => ({
-      ...a,
-      series: a.series.map((t, o) => ({
-        ...t,
-        datapoints: t.values.map((n, s) => {
-          const r = p.value[s].scale.min < 0 ? (n || 0) + Math.abs(p.value[s].scale.min) : (n || 0) - Math.abs(p.value[s].scale.min), $ = p.value[s].scale.min < 0 ? p.value[s].scale.max + Math.abs(p.value[s].scale.min) : p.value[s].scale.max - Math.abs(p.value[s].scale.min);
+      return t;
+    }), X = f(() => H.value.map((t, l) => ({
+      ...t,
+      series: t.series.map((a, o) => ({
+        ...a,
+        datapoints: a.values.map((n, s) => {
+          const r = m.value[s].scale.min < 0 ? (n || 0) + Math.abs(m.value[s].scale.min) : (n || 0) - Math.abs(m.value[s].scale.min), $ = m.value[s].scale.min < 0 ? m.value[s].scale.max + Math.abs(m.value[s].scale.min) : m.value[s].scale.max - Math.abs(m.value[s].scale.min);
           return {
-            name: t.name,
-            seriesName: a.name,
+            name: a.name,
+            seriesName: t.name,
             axisIndex: s,
             datapointIndex: o,
             seriesIndex: l,
             value: n || 0,
             x: v.value.left + k.value * s + k.value / 2,
             y: v.value.bottom - v.value.height * (r / $),
-            comment: t.comments && t.comments[s] || ""
+            comment: a.comments && a.comments[s] || ""
           };
         })
       }))
-    })).map((a) => ({
-      ...a,
-      series: a.series.map((l) => {
-        const t = Ve(l.datapoints), o = Ge(l.datapoints, 0.12), n = He(e.value.style.chart.lines.smooth ? `M ${o}` : `M ${t}`);
+    })).map((t) => ({
+      ...t,
+      series: t.series.map((l) => {
+        const a = Qe(l.datapoints), o = Je(l.datapoints, 0.12), n = Ke(e.value.style.chart.lines.smooth ? `M ${o}` : `M ${a}`);
         return {
           ...l,
           smoothPath: o,
-          straightPath: t,
+          straightPath: a,
           pathLength: n
         };
       })
     })));
-    function re({ value: a, index: l, datapoint: t }) {
-      return ge(
+    function he({ value: t, index: l, datapoint: a }) {
+      return Ce(
         e.value.style.chart.yAxis.labels.formatters[l] || null,
-        a,
-        be({
+        t,
+        we({
           p: e.value.style.chart.yAxis.labels.prefixes[l] || "",
-          v: a,
+          v: t,
           s: e.value.style.chart.yAxis.labels.suffixes[l] || "",
           r: e.value.style.chart.yAxis.labels.roundings[l] || 0
         }),
-        { datapoint: t, seriesIndex: l }
+        { datapoint: a, seriesIndex: l }
       );
     }
-    const h = f(null), Y = f(null), O = f(!1), q = f("");
-    function Q({ shape: a, serieName: l, serie: t, relativeIndex: o, seriesIndex: n }) {
-      Y.value = { serie: t, relativeIndex: o, seriesIndex: n, series: T.value, scales: p.value }, O.value = !0, h.value = t.id;
+    const p = h(null), Y = h(null), D = h(!1), q = h("");
+    function Q({ shape: t, serieName: l, serie: a, relativeIndex: o, seriesIndex: n }) {
+      Y.value = { serie: a, relativeIndex: o, seriesIndex: n, series: z.value, scales: m.value }, D.value = !0, p.value = a.id;
       let s = "";
       const r = e.value.style.chart.tooltip.customFormat;
-      fe(r) && Ye(() => r({
-        serie: t,
-        seriesIndex: t.seriesIndex,
-        series: T.value,
+      ke(r) && et(() => r({
+        serie: a,
+        seriesIndex: a.seriesIndex,
+        series: z.value,
         config: e.value,
-        scales: p.value
+        scales: m.value
       })) ? q.value = r({
-        serie: t,
-        seriesIndex: t.seriesIndex,
-        series: T.value,
+        serie: a,
+        seriesIndex: a.seriesIndex,
+        series: z.value,
         config: e.value,
-        scales: p.value
-      }) : (s += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${l ? l + " - " : ""}${t.name}</div>`, p.value.map(($) => $.name).forEach(($, d) => {
+        scales: m.value
+      }) : (s += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${l ? l + " - " : ""}${a.name}</div>`, m.value.map(($) => $.name).forEach(($, d) => {
         s += `
                 <div class="vue-ui-tooltip-item" style="text-align:left">
                     <span>${$}: </span>
                     <span>
-                        ${ge(
+                        ${Ce(
           e.value.style.chart.yAxis.labels.formatters[d] || null,
-          t.datapoints[d].value,
-          be({
+          a.datapoints[d].value,
+          we({
             p: e.value.style.chart.yAxis.labels.prefixes[d] || "",
-            v: t.datapoints[d].value,
+            v: a.datapoints[d].value,
             s: e.value.style.chart.yAxis.labels.suffixes[d] || "",
             r: e.value.style.chart.yAxis.labels.roundings[d] || ""
           }),
-          { datapoint: t.datapoints[d], seriesIndex: d }
+          { datapoint: a.datapoints[d], seriesIndex: d }
         )}    
                     </span>
                 </div>
-            `, e.value.style.chart.comments.showInTooltip && t.datapoints[d].comment && (s += `<div class="vue-data-ui-tooltip-comment" style="background:${t.color}20; padding: 6px; margin-bottom: 6px; border-left: 1px solid ${t.color}">${t.datapoints[d].comment}</div>`);
+            `, e.value.style.chart.comments.showInTooltip && a.datapoints[d].comment && (s += `<div class="vue-data-ui-tooltip-comment" style="background:${a.color}20; padding: 6px; margin-bottom: 6px; border-left: 1px solid ${a.color}">${a.datapoints[d].comment}</div>`);
       }), q.value = `<div>${s}</div>`);
     }
-    function Ae() {
-      return T.value;
+    function Pe() {
+      return z.value;
     }
-    const P = y(() => {
-      const a = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(p.value.map((n) => n.name)), l = X.value.flatMap((n, s) => n.series.map((r) => [n.name].concat([r.name]).concat(r.values))), t = {
+    const N = f(() => {
+      const t = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(m.value.map((n) => n.name)), l = X.value.flatMap((n, s) => n.series.map((r) => [n.name].concat([r.name]).concat(r.values))), a = {
         th: {
           backgroundColor: e.value.table.th.backgroundColor,
           color: e.value.table.th.color,
@@ -288,62 +300,63 @@ const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events":
           outline: e.value.table.td.outline
         },
         breakpoint: e.value.table.responsiveBreakpoint
-      }, o = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(p.value.map((n) => n.name));
+      }, o = [e.value.table.columnNames.series].concat([e.value.table.columnNames.item]).concat(m.value.map((n) => n.name));
       return {
         body: l,
-        head: a,
-        config: t,
+        head: t,
+        config: a,
         colNames: o
       };
-    }), ce = y(() => X.value.length === 0 ? { head: [], body: [], config: {}, columnNames: [] } : {
-      head: P.value.head,
-      body: P.value.body
+    }), pe = f(() => X.value.length === 0 ? { head: [], body: [], config: {}, columnNames: [] } : {
+      head: N.value.head,
+      body: N.value.body
     });
-    function ve() {
-      const a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], l = ce.value.head, t = ce.value.body, o = a.concat([l]).concat(t), n = qe(o);
-      Qe({ csvContent: n, title: e.value.style.chart.title.text || "vue-ui-parallel-coordinate-plot" });
+    function me() {
+      const t = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], l = pe.value.head, a = pe.value.body, o = t.concat([l]).concat(a), n = tt(o);
+      at({ csvContent: n, title: e.value.style.chart.title.text || "vue-ui-parallel-coordinate-plot" });
     }
-    function Me(a) {
-      Z("selectDatapoint", a);
+    function Ne(t) {
+      K("selectDatapoint", t);
     }
-    function de(a) {
-      Z("selectLegend", {
-        ...a,
-        isSegregated: !a.isSegregated,
-        opacity: a.isSegregated ? 1 : 0.5
+    function ye(t) {
+      K("selectLegend", {
+        ...t,
+        isSegregated: !t.isSegregated,
+        opacity: t.isSegregated ? 1 : 0.5
       });
     }
-    function he() {
-      m.value.showTable = !m.value.showTable;
+    function fe() {
+      y.value.showTable = !y.value.showTable;
     }
-    function pe() {
-      m.value.dataLabels.show = !m.value.dataLabels.show;
+    function ge() {
+      y.value.dataLabels.show = !y.value.dataLabels.show;
     }
-    function me() {
-      m.value.showTooltip = !m.value.showTooltip;
+    function be() {
+      y.value.showTooltip = !y.value.showTooltip;
     }
-    return Ce({
-      getData: Ae,
-      generateCsv: ve,
-      generatePdf: se,
-      generateImage: ne,
-      toggleTable: he,
-      toggleLabels: pe,
-      toggleTooltip: me
-    }), (a, l) => (u(), i("div", {
+    return Te({
+      getData: Pe,
+      generateCsv: me,
+      generatePdf: re,
+      generateImage: ce,
+      toggleTable: fe,
+      toggleLabels: ge,
+      toggleTooltip: be
+    }), (t, l) => (u(), i("div", {
       ref_key: "pcpChart",
       ref: L,
-      class: E(`vue-ui-pcp ${S.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      class: E(`vue-ui-pcp ${O.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
       style: _(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;${e.value.style.chart.title.text ? "" : "padding-top:36px"};background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
       id: `pcp_${G.value}`
     }, [
       e.value.style.chart.title.text ? (u(), i("div", {
         key: 0,
         ref_key: "chartTitle",
-        ref: te,
+        ref: ee,
         style: _(`width:100%;background:${e.value.style.chart.backgroundColor};padding-bottom:24px`)
       }, [
-        J(Ze, {
+        (u(), I(st, {
+          key: `title_${ae.value}`,
           config: {
             title: {
               cy: "pcp-div-title",
@@ -354,15 +367,15 @@ const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events":
               ...e.value.style.chart.title.subtitle
             }
           }
-        }, null, 8, ["config"])
+        }, null, 8, ["config"]))
       ], 4)) : g("", !0),
-      e.value.userOptions.show && F.value ? (u(), D(ot, {
+      e.value.userOptions.show && P.value ? (u(), I(ct, {
         ref: "details",
-        key: `user_options_${ee.value}`,
+        key: `user_options_${Z.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        isPrinting: z(le),
-        isImaging: z(oe),
+        isPrinting: A(ue),
+        isImaging: A(ie),
         uid: G.value,
         hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
         hasPdf: e.value.userOptions.buttons.pdf,
@@ -371,141 +384,141 @@ const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events":
         hasTable: e.value.userOptions.buttons.table,
         hasLabel: e.value.userOptions.buttons.labels,
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: S.value,
-        isTooltip: m.value.showTooltip,
+        isFullscreen: O.value,
+        isTooltip: y.value.showTooltip,
         titles: { ...e.value.userOptions.buttonTitles },
         chartElement: L.value,
-        onToggleFullscreen: $e,
-        onGeneratePdf: z(se),
-        onGenerateCsv: ve,
-        onGenerateImage: z(ne),
-        onToggleTable: he,
-        onToggleLabels: pe,
-        onToggleTooltip: me
-      }, Le({ _: 2 }, [
-        a.$slots.optionPdf ? {
+        onToggleFullscreen: Ae,
+        onGeneratePdf: A(re),
+        onGenerateCsv: me,
+        onGenerateImage: A(ce),
+        onToggleTable: fe,
+        onToggleLabels: ge,
+        onToggleTooltip: be
+      }, Be({ _: 2 }, [
+        t.$slots.optionPdf ? {
           name: "optionPdf",
           fn: b(() => [
-            x(a.$slots, "optionPdf", {}, void 0, !0)
+            x(t.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "0"
         } : void 0,
-        a.$slots.optionCsv ? {
+        t.$slots.optionCsv ? {
           name: "optionCsv",
           fn: b(() => [
-            x(a.$slots, "optionCsv", {}, void 0, !0)
+            x(t.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
-        a.$slots.optionImg ? {
+        t.$slots.optionImg ? {
           name: "optionImg",
           fn: b(() => [
-            x(a.$slots, "optionImg", {}, void 0, !0)
+            x(t.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
-        a.$slots.optionTable ? {
+        t.$slots.optionTable ? {
           name: "optionTable",
           fn: b(() => [
-            x(a.$slots, "optionTable", {}, void 0, !0)
+            x(t.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
-        a.$slots.optionLabels ? {
+        t.$slots.optionLabels ? {
           name: "optionLabels",
           fn: b(() => [
-            x(a.$slots, "optionLabels", {}, void 0, !0)
+            x(t.$slots, "optionLabels", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
-        a.$slots.optionFullscreen ? {
+        t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: b(({ toggleFullscreen: t, isFullscreen: o }) => [
-            x(a.$slots, "optionFullscreen", j(R({ toggleFullscreen: t, isFullscreen: o })), void 0, !0)
+          fn: b(({ toggleFullscreen: a, isFullscreen: o }) => [
+            x(t.$slots, "optionFullscreen", j(R({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
           ]),
           key: "5"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasTable", "hasLabel", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "onGeneratePdf", "onGenerateImage"])) : g("", !0),
-      F.value ? (u(), i("svg", {
+      P.value ? (u(), i("svg", {
         key: 2,
-        xmlns: z(Xe),
-        class: E({ "vue-data-ui-fullscreen--on": S.value, "vue-data-ui-fulscreen--off": !S.value }),
+        xmlns: A(Ze),
+        class: E({ "vue-data-ui-fullscreen--on": O.value, "vue-data-ui-fulscreen--off": !O.value }),
         viewBox: `0 0 ${v.value.chartWidth <= 0 ? 10 : v.value.chartWidth} ${v.value.chartHeight <= 0 ? 10 : v.value.chartHeight}`,
         style: _(`max-width:100%; overflow: visible; background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color}`)
       }, [
-        (u(!0), i(C, null, A(p.value, (t, o) => (u(), i("g", vt, [
-          I("line", {
+        (u(!0), i(C, null, M(m.value, (a, o) => (u(), i("g", ft, [
+          F("line", {
             x1: v.value.left + k.value * o + k.value / 2,
             x2: v.value.left + k.value * o + k.value / 2,
             y1: v.value.top,
             y2: v.value.bottom,
             stroke: e.value.style.chart.yAxis.stroke,
             "stroke-width": e.value.style.chart.yAxis.strokeWidth
-          }, null, 8, dt),
-          I("text", {
+          }, null, 8, gt),
+          F("text", {
             x: v.value.left + k.value * o + k.value / 2,
             y: v.value.top - 24,
             fill: e.value.style.chart.yAxis.labels.axisNamesColor,
             "font-size": c.value.axisNameFontSize,
             "font-weight": e.value.style.chart.yAxis.labels.axisNamesBold ? "bold" : "",
             "text-anchor": "middle"
-          }, N(t.name), 9, ht),
+          }, S(a.name), 9, bt),
           e.value.style.chart.yAxis.labels.ticks.show ? (u(), i(C, { key: 0 }, [
-            (u(!0), i(C, null, A(t.ticks, (n) => (u(), i("line", {
+            (u(!0), i(C, null, M(a.ticks, (n) => (u(), i("line", {
               x1: n.x,
               x2: n.x - 10,
               y1: n.y,
               y2: n.y,
               stroke: e.value.style.chart.yAxis.stroke,
               "stroke-width": e.value.style.chart.yAxis.strokeWidth,
-              style: _(`opacity:${h.value && !m.value.showTooltip ? 0.2 : 1}`)
-            }, null, 12, pt))), 256)),
-            (u(!0), i(C, null, A(t.ticks, (n) => (u(), i("text", {
+              style: _(`opacity:${p.value && !y.value.showTooltip ? 0.2 : 1}`)
+            }, null, 12, xt))), 256)),
+            (u(!0), i(C, null, M(a.ticks, (n) => (u(), i("text", {
               x: n.x - 12 + e.value.style.chart.yAxis.labels.ticks.offsetX,
               y: n.y + e.value.style.chart.yAxis.labels.ticks.offsetY + c.value.ticksFontSize / 3,
               fill: e.value.style.chart.yAxis.labels.ticks.color,
               "text-anchor": "end",
               "font-size": c.value.ticksFontSize,
               "font-weight": e.value.style.chart.yAxis.labels.ticks.bold ? "bold" : "normal",
-              style: _(`opacity:${h.value && !m.value.showTooltip ? 0.2 : 1}`)
-            }, N(re({ value: n.value, index: o, datapoint: n })), 13, mt))), 256))
+              style: _(`opacity:${p.value && !y.value.showTooltip ? 0.2 : 1}`)
+            }, S(he({ value: n.value, index: o, datapoint: n })), 13, kt))), 256))
           ], 64)) : g("", !0)
         ]))), 256)),
-        (u(!0), i(C, null, A(X.value, (t) => (u(), i("g", null, [
-          (u(!0), i(C, null, A(t.series, (o, n) => (u(), i("g", null, [
-            e.value.style.chart.plots.show ? (u(), i("g", yt, [
-              (u(!0), i(C, null, A(o.datapoints, (s) => (u(), D(at, {
+        (u(!0), i(C, null, M(X.value, (a) => (u(), i("g", null, [
+          (u(!0), i(C, null, M(a.series, (o, n) => (u(), i("g", null, [
+            e.value.style.chart.plots.show ? (u(), i("g", Ct, [
+              (u(!0), i(C, null, M(o.datapoints, (s) => (u(), I(it, {
                 plot: { x: s.x, y: s.y },
-                color: t.color,
-                shape: t.shape,
-                radius: t.shape === "triangle" ? c.value.plotSize * 1.2 : c.value.plotSize,
+                color: a.color,
+                shape: a.shape,
+                radius: a.shape === "triangle" ? c.value.plotSize * 1.2 : c.value.plotSize,
                 stroke: e.value.style.chart.backgroundColor,
                 strokeWidth: 0.5,
                 onMouseenter: (r) => Q({
-                  shape: t.shape,
-                  serieName: t.name,
+                  shape: a.shape,
+                  serieName: a.name,
                   serie: o,
                   relativeIndex: n,
                   seriesIndex: o.seriesIndex
                 }),
                 onMouseleave: l[0] || (l[0] = (r) => {
-                  h.value = null, O.value = !1;
+                  p.value = null, D.value = !1;
                 }),
-                style: _(`opacity:${h.value ? h.value === o.id ? e.value.style.chart.plots.opacity : 0.2 : e.value.style.chart.plots.opacity}`),
-                onClick: () => Me(s)
+                style: _(`opacity:${p.value ? p.value === o.id ? e.value.style.chart.plots.opacity : 0.2 : e.value.style.chart.plots.opacity}`),
+                onClick: () => Ne(s)
               }, null, 8, ["plot", "color", "shape", "radius", "stroke", "onMouseenter", "style", "onClick"]))), 256)),
-              m.value.showTooltip ? g("", !0) : (u(), i(C, { key: 0 }, [
-                h.value && h.value === o.id && o.datapoints.length ? (u(), i("text", {
+              y.value.showTooltip ? g("", !0) : (u(), i(C, { key: 0 }, [
+                p.value && p.value === o.id && o.datapoints.length ? (u(), i("text", {
                   key: 0,
                   x: o.datapoints[0].x - c.value.ticksFontSize,
                   y: o.datapoints[0].y + c.value.ticksFontSize / 3,
                   "text-anchor": "end",
                   "font-size": c.value.ticksFontSize,
-                  fill: t.color,
+                  fill: a.color,
                   "font-weight": "bold"
-                }, N(o.name), 9, ft)) : g("", !0)
+                }, S(o.name), 9, wt)) : g("", !0)
               ], 64)),
-              e.value.style.chart.comments.show ? (u(!0), i(C, { key: 1 }, A(o.datapoints, (s) => (u(), i("g", null, [
+              e.value.style.chart.comments.show ? (u(!0), i(C, { key: 1 }, M(o.datapoints, (s) => (u(), i("g", null, [
                 s.comment ? (u(), i("foreignObject", {
                   key: 0,
                   style: { overflow: "visible" },
@@ -514,60 +527,60 @@ const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events":
                   x: s.x - e.value.style.chart.comments.width / 2 + e.value.style.chart.comments.offsetX,
                   y: s.y + e.value.style.chart.comments.offsetY + 6
                 }, [
-                  I("div", bt, [
-                    x(a.$slots, "plot-comment", {
-                      plot: { ...s, color: t.color }
+                  F("div", _t, [
+                    x(t.$slots, "plot-comment", {
+                      plot: { ...s, color: a.color }
                     }, void 0, !0)
                   ])
-                ], 8, gt)) : g("", !0)
+                ], 8, $t)) : g("", !0)
               ]))), 256)) : g("", !0)
             ])) : g("", !0),
-            m.value.dataLabels.show || h.value && h.value === o.id ? (u(!0), i(C, { key: 1 }, A(o.datapoints, (s, r) => (u(), i("text", {
+            y.value.dataLabels.show || p.value && p.value === o.id ? (u(!0), i(C, { key: 1 }, M(o.datapoints, (s, r) => (u(), i("text", {
               x: s.x + 12 + e.value.style.chart.yAxis.labels.datapoints.offsetX,
               y: s.y + e.value.style.chart.yAxis.labels.datapoints.offsetY + c.value.datapointFontSize / 3,
-              fill: e.value.style.chart.yAxis.labels.datapoints.useSerieColor ? t.color : e.value.style.chart.yAxis.labels.datapoints.color,
+              fill: e.value.style.chart.yAxis.labels.datapoints.useSerieColor ? a.color : e.value.style.chart.yAxis.labels.datapoints.color,
               "text-anchor": "start",
               "font-weight": e.value.style.chart.yAxis.labels.datapoints.bold ? "bold" : "normal",
               class: E({ "vue-ui-pcp-animated": !1, "vue-ui-pcp-transition": !0 }),
               "font-size": c.value.datapointFontSize,
               onMouseenter: ($) => Q({
-                shape: t.shape,
-                serieName: t.name,
+                shape: a.shape,
+                serieName: a.name,
                 serie: o,
                 relativeIndex: n,
                 seriesIndex: o.seriesIndex
               }),
               onMouseleave: l[1] || (l[1] = ($) => {
-                h.value = null, O.value = !1;
+                p.value = null, D.value = !1;
               }),
-              style: _(`opacity:${h.value ? h.value === o.id ? 1 : 0.2 : 1}`)
-            }, N(re({ value: s.value, index: r, datapoint: s })), 45, xt))), 256)) : g("", !0),
-            I("path", {
+              style: _(`opacity:${p.value ? p.value === o.id ? 1 : 0.2 : 1}`)
+            }, S(he({ value: s.value, index: r, datapoint: s })), 45, Tt))), 256)) : g("", !0),
+            F("path", {
               d: `M${e.value.style.chart.lines.smooth ? o.smoothPath : o.straightPath}`,
-              stroke: t.color,
+              stroke: a.color,
               "stroke-width": e.value.style.chart.lines.strokeWidth,
               fill: "none",
               class: E({ "vue-ui-pcp-animated vue-data-ui-line-animated": e.value.useCssAnimation, "vue-ui-pcp-transition": !0 }),
               onMouseenter: (s) => Q({
-                shape: t.shape,
-                serieName: t.name,
+                shape: a.shape,
+                serieName: a.name,
                 serie: o,
                 relativeIndex: n,
                 seriesIndex: o.seriesIndex
               }),
               onMouseleave: l[2] || (l[2] = (s) => {
-                h.value = null, O.value = !1;
+                p.value = null, D.value = !1;
               }),
-              style: _(`opacity:${h.value ? h.value === o.id ? e.value.style.chart.lines.opacity : 0.2 : e.value.style.chart.lines.opacity}; stroke-dasharray:${o.pathLength}; stroke-dashoffset: ${e.value.useCssAnimation ? o.pathLength : 0}`)
-            }, null, 46, kt)
+              style: _(`opacity:${p.value ? p.value === o.id ? e.value.style.chart.lines.opacity : 0.2 : e.value.style.chart.lines.opacity}; stroke-dasharray:${o.pathLength}; stroke-dashoffset: ${e.value.useCssAnimation ? o.pathLength : 0}`)
+            }, null, 46, zt)
           ]))), 256))
         ]))), 256)),
-        x(a.$slots, "svg", { svg: v.value }, void 0, !0)
-      ], 14, ct)) : g("", !0),
-      a.$slots.watermark ? (u(), i("div", Ct, [
-        x(a.$slots, "watermark", j(R({ isPrinting: z(le) || z(oe) })), void 0, !0)
+        x(t.$slots, "svg", { svg: v.value }, void 0, !0)
+      ], 14, yt)) : g("", !0),
+      t.$slots.watermark ? (u(), i("div", At, [
+        x(t.$slots, "watermark", j(R({ isPrinting: A(ue) || A(ie) })), void 0, !0)
       ])) : g("", !0),
-      F.value ? g("", !0) : (u(), D(ut, {
+      P.value ? g("", !0) : (u(), I(ht, {
         key: 4,
         config: {
           type: "parallelCoordinatePlot",
@@ -576,34 +589,34 @@ const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events":
           }
         }
       }, null, 8, ["config"])),
-      I("div", {
+      F("div", {
         ref_key: "chartLegend",
-        ref: ae
+        ref: te
       }, [
-        e.value.style.chart.legend.show && F.value ? (u(), D(et, {
-          key: 0,
-          legendSet: Te.value,
-          config: ze.value,
-          onClickMarker: l[3] || (l[3] = ({ legend: t }) => {
-            ue(t.id), de(t);
+        e.value.style.chart.legend.show && P.value ? (u(), I(nt, {
+          key: `legend_${le.value}`,
+          legendSet: Ie.value,
+          config: Fe.value,
+          onClickMarker: l[3] || (l[3] = ({ legend: a }) => {
+            ve(a.id), ye(a);
           })
         }, {
-          item: b(({ legend: t, index: o }) => [
-            I("div", {
+          item: b(({ legend: a, index: o }) => [
+            F("div", {
               onClick: (n) => {
-                t.segregate(), de(t);
+                a.segregate(), ye(a);
               },
-              style: _(`opacity:${w.value.includes(t.id) ? 0.5 : 1}`)
-            }, N(t.name), 13, wt)
+              style: _(`opacity:${w.value.includes(a.id) ? 0.5 : 1}`)
+            }, S(a.name), 13, Mt)
           ]),
           _: 1
-        }, 8, ["legendSet", "config"])) : x(a.$slots, "legend", {
+        }, 8, ["legendSet", "config"])) : x(t.$slots, "legend", {
           key: 1,
-          legend: T.value
+          legend: z.value
         }, void 0, !0)
       ], 512),
-      J(tt, {
-        show: m.value.showTooltip && O.value,
+      Ee(ut, {
+        show: y.value.showTooltip && D.value,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
         fontSize: e.value.style.chart.tooltip.fontSize,
@@ -615,21 +628,21 @@ const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events":
         offsetY: e.value.style.chart.tooltip.offsetY,
         parent: L.value,
         content: q.value,
-        isCustom: z(fe)(e.value.style.chart.tooltip.customFormat)
+        isCustom: A(ke)(e.value.style.chart.tooltip.customFormat)
       }, {
         "tooltip-before": b(() => [
-          x(a.$slots, "tooltip-before", j(R({ ...Y.value })), void 0, !0)
+          x(t.$slots, "tooltip-before", j(R({ ...Y.value })), void 0, !0)
         ]),
         "tooltip-after": b(() => [
-          x(a.$slots, "tooltip-after", j(R({ ...Y.value })), void 0, !0)
+          x(t.$slots, "tooltip-after", j(R({ ...Y.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom"]),
-      F.value ? (u(), D(nt, {
+      P.value ? (u(), I(dt, {
         key: 5,
         hideDetails: "",
         config: {
-          open: m.value.showTable,
+          open: y.value.showTable,
           maxHeight: 1e4,
           body: {
             backgroundColor: e.value.style.chart.backgroundColor,
@@ -642,28 +655,29 @@ const rt = ["id"], ct = ["xmlns", "viewBox"], vt = { style: { "pointer-events":
         }
       }, {
         content: b(() => [
-          J(st, {
-            colNames: P.value.colNames,
-            head: P.value.head,
-            body: P.value.body,
-            config: P.value.config,
+          (u(), I(vt, {
+            key: `table_${oe.value}`,
+            colNames: N.value.colNames,
+            head: N.value.head,
+            body: N.value.body,
+            config: N.value.config,
             title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
-            onClose: l[4] || (l[4] = (t) => m.value.showTable = !1)
+            onClose: l[4] || (l[4] = (a) => y.value.showTable = !1)
           }, {
-            th: b(({ th: t }) => [
-              I("div", { innerHTML: t }, null, 8, $t)
+            th: b(({ th: a }) => [
+              F("div", { innerHTML: a }, null, 8, It)
             ]),
-            td: b(({ td: t }) => [
-              Se(N(t), 1)
+            td: b(({ td: a }) => [
+              je(S(a), 1)
             ]),
             _: 1
-          }, 8, ["colNames", "head", "body", "config", "title"])
+          }, 8, ["colNames", "head", "body", "config", "title"]))
         ]),
         _: 1
       }, 8, ["config"])) : g("", !0)
-    ], 14, rt));
+    ], 14, mt));
   }
-}, Bt = /* @__PURE__ */ it(_t, [["__scopeId", "data-v-b44d373d"]]);
+}, Gt = /* @__PURE__ */ pt(Ft, [["__scopeId", "data-v-6fd42e86"]]);
 export {
-  Bt as default
+  Gt as default
 };