vue-data-ui 2.3.68 → 2.3.69

package/dist/{vue-ui-onion-CE4wSxPC.js → vue-ui-onion-CIp-ZmAw.js}

@@ -1,14 +1,14 @@
-import { computed as d, ref as u, onMounted as Pe, onBeforeUnmount as Oe, watch as Ie, openBlock as s, createElementBlock as n, normalizeClass as D, normalizeStyle as L, createVNode as j, createCommentVNode as b, createBlock as z, unref as v, createSlots as Fe, withCtx as h, renderSlot as f, normalizeProps as B, guardReactiveProps as V, Fragment as I, renderList as F, createElementVNode as C, toDisplayString as T, createTextVNode as Se, nextTick as Me } from "vue";
-import { u as Ne, c as Re, t as Ae, a as De, p as ie, b as Le, o as ze, e as q, d as Be, X as Ve, f as S, i as J, x as ce, q as Ye, r as Xe, y as Ge } from "./index-fMHmzYJu.js";
+import { computed as d, ref as u, onMounted as Pe, onBeforeUnmount as Oe, watch as Ie, openBlock as s, createElementBlock as n, normalizeClass as L, normalizeStyle as z, createVNode as j, createCommentVNode as b, createBlock as Y, unref as v, createSlots as Me, withCtx as h, renderSlot as g, normalizeProps as B, guardReactiveProps as V, Fragment as M, renderList as F, createElementVNode as C, toDisplayString as T, createTextVNode as Fe, nextTick as Se } from "vue";
+import { u as Ne, c as Re, t as Ae, a as De, p as ie, b as Le, o as ze, e as q, d as Ye, X as Be, f as S, i as J, x as ce, q as Ve, r as Xe, y as Ge } from "./index-b22AFna7.js";
 import { t as Ue, u as Ee } from "./useResponsive-NZB-WLRF.js";
-import { _ as He } from "./Title-BxitYokc.js";
-import { u as We, U as je } from "./usePrinter-BEVwOH5x.js";
-import { L as qe } from "./Legend-C2DZGZN5.js";
-import { D as Je } from "./DataTable-CzvZIRDs.js";
-import { _ as Ke } from "./Tooltip-DTntJRyb.js";
-import Qe from "./vue-ui-skeleton-DiJmBrEY.js";
-import Ze from "./vue-ui-accordion-CVzTuENA.js";
-import { u as de } from "./useNestedProp-lzTC0cjC.js";
+import { _ as He } from "./Title-CzxknLI3.js";
+import { u as We, U as je } from "./usePrinter-C_wOlUXy.js";
+import { L as qe } from "./Legend-Cpk8DCWi.js";
+import { D as Je } from "./DataTable-Bwco5wF0.js";
+import { _ as Ke } from "./Tooltip-DYVjAqo-.js";
+import Qe from "./vue-ui-skeleton-c0TzbjC0.js";
+import Ze from "./vue-ui-accordion-H9MtAuZL.js";
+import { u as de } from "./useNestedProp-6FL791Qt.js";
 import { _ as et } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], ot = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], rt = ["id"], st = ["stdDeviation"], ut = ["filter"], nt = ["cx", "cy", "r", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], it = ["cx", "cy", "r", "stroke-width", "stroke-dasharray", "stroke-dashoffset", "onMouseenter"], ct = { key: 1 }, dt = ["onMouseenter"], vt = ["x", "y", "font-size", "fill", "font-weight"], ht = {
   key: 3,
@@ -31,7 +31,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
   },
   emits: ["selectLegend"],
   setup(ve, { expose: he, emit: fe }) {
-    const w = ve, { vue_ui_onion: ge } = Ne(), M = d(() => !!w.dataset && w.dataset.length), x = u(Re()), pe = u(null), K = u(0), N = u(!1), Y = u(""), g = u([]), _ = u(null), Q = u(null), Z = u(null), e = d(() => {
+    const w = ve, { vue_ui_onion: ge } = Ne(), N = d(() => !!w.dataset && w.dataset.length), x = u(Re()), pe = u(null), K = u(0), R = u(!1), X = u(""), p = u([]), _ = u(null), Q = u(null), Z = u(null), e = d(() => {
       const a = de({
         userConfig: w.config,
         defaultConfig: ge
@@ -59,7 +59,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
         bottom: 64
       },
       minRadius: 64
-    }), R = u(null);
+    }), A = u(null);
     Pe(() => {
       if (ze(w.dataset) && q({
         componentName: "VueUiOnion",
@@ -73,10 +73,10 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
           });
           r.value.width = t, r.value.height = l, r.value.padding.top = Math.max(t, l) * 0.125, r.value.padding.right = Math.max(t, l) * 0.125, r.value.padding.bottom = Math.max(t, l) * 0.125, r.value.padding.left = Math.max(t, l) * 0.125, r.value.minRadius = Math.min(t, l) * 0.125;
         });
-        R.value = new ResizeObserver(o), R.value.observe(_.value.parentNode);
+        A.value = new ResizeObserver(o), A.value.observe(_.value.parentNode);
       }
     }), Oe(() => {
-      R.value && R.value.disconnect();
+      A.value && A.value.disconnect();
     });
     const i = d(() => ({
       top: r.value.padding.top,
@@ -107,23 +107,23 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
         ...a,
         percentage: a.percentage || 0,
         targetPercentage: a.percentage || 0,
-        color: Be(a.color) || ye.value[o] || ie[o],
+        color: Ye(a.color) || ye.value[o] || ie[o],
         id: t,
         shape: "circle",
-        opacity: g.value.includes(t) ? 0.5 : 1,
+        opacity: p.value.includes(t) ? 0.5 : 1,
         absoluteIndex: o,
         segregate: () => oe(t),
-        isSegregated: g.value.includes(t)
+        isSegregated: p.value.includes(t)
       };
-    }))), P = u(c.value), me = d(() => e.value.useStartAnimation), be = u(null), ke = d(() => Math.max(...c.value.map((a) => a.percentage))), X = u(!1);
+    }))), P = u(c.value), me = d(() => e.value.useStartAnimation), be = u(null), ke = d(() => Math.max(...c.value.map((a) => a.percentage))), G = u(!1);
     Ie(() => c.value, we, { immediate: !0 });
     function we() {
-      if (me.value && !X.value) {
+      if (me.value && !G.value) {
         let o = function() {
-          a >= ke.value ? (cancelAnimationFrame(be.value), P.value = c.value, X.value = !0) : (P.value = c.value.map((t) => ({
+          a >= ke.value ? (cancelAnimationFrame(be.value), P.value = c.value, G.value = !0) : (P.value = c.value.map((t) => ({
             ...t,
             percentage: a < t.targetPercentage ? a : t.targetPercentage
-          })), a += 1, requestAnimationFrame(o), X.value = !0);
+          })), a += 1, requestAnimationFrame(o), G.value = !0);
         };
         P.value = c.value.map((t) => ({
           ...t,
@@ -141,13 +141,13 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
       fontSize: e.value.style.chart.legend.fontSize,
       paddingBottom: 12,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
-    })), xe = d(() => c.value.filter((a) => !g.value.includes(a.id)).length), $ = d(() => {
+    })), xe = d(() => c.value.filter((a) => !p.value.includes(a.id)).length), $ = d(() => {
       const a = Math.min(i.value.width, i.value.height) / 2 / c.value.length;
       return {
         gutter: (a > e.value.style.chart.layout.maxThickness ? e.value.style.chart.layout.maxThickness : a) * e.value.style.chart.layout.gutter.width,
         track: (a > e.value.style.chart.layout.maxThickness ? e.value.style.chart.layout.maxThickness : a) * e.value.style.chart.layout.track.width
       };
-    }), p = d(() => P.value.filter((a) => !g.value.includes(a.id)).map((a, o) => {
+    }), y = d(() => P.value.filter((a) => !p.value.includes(a.id)).map((a, o) => {
       const t = (i.value.maxRadius - $.value.track) / xe.value / 2 * (1 + o), l = i.value.centerY - t;
       return {
         percentage: a.percentage || 0,
@@ -158,31 +158,35 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
       };
     }));
     function Ce(a, o) {
-      const t = a * (1.5 + (o / 100 > 0.3333333333333333 ? 0 : 1 - o / 100)) * Math.PI, l = a * 1.5 * Math.PI;
+      const t = 2 * Math.PI * a, l = t * 0.75, f = `${l} ${t}`, I = l * (1 - o / 100);
       return {
-        bgDashArray: `${l} ${l}`,
-        bgDashOffset: l - o / 100 * l,
-        dashArray: `${t} ${t}`,
-        dashOffset: t - o / 100 * t,
+        bgDashArray: `${l} ${t}`,
+        bgDashOffset: 0,
+        dashArray: f,
+        dashOffset: I,
         fullOffset: 0,
-        active: `M${i.value.centerX},${i.value.centerY} A ${a},${a} 0 0 0 ${i.value.right},${i.value.top}`
+        active: `
+            M ${i.value.centerX},${i.value.centerY - a} 
+            A ${a},${a} 0 1 1 
+            ${i.value.centerX + a * Math.cos(Math.PI * 3 / 4)},${i.value.centerY + a * Math.sin(Math.PI * 3 / 4)}
+        `.trim()
       };
     }
     function oe(a) {
-      g.value.includes(a) ? g.value = g.value.filter((o) => o !== a) : g.value.push(a), fe("selectLegend", p.value);
+      p.value.includes(a) ? p.value = p.value.filter((o) => o !== a) : p.value.push(a), fe("selectLegend", y.value);
     }
     function Te() {
-      return p.value;
+      return y.value;
     }
-    const G = d(() => {
-      const a = [e.value.table.translations.serie, e.value.table.translations.percentage, e.value.table.translations.value], o = p.value.map((t) => [
+    const U = d(() => {
+      const a = [e.value.table.translations.serie, e.value.table.translations.percentage, e.value.table.translations.value], o = y.value.map((t) => [
         t.name,
         t.percentage,
         t.value
       ]);
       return { head: a, body: o };
-    }), A = d(() => {
-      const a = G.value.head, o = p.value.map((l) => [
+    }), D = d(() => {
+      const a = U.value.head, o = y.value.map((l) => [
         `<span style="color:${l.color}">⬤</span> ${l.name}`,
         `${Number(l.percentage ?? 0).toFixed(e.value.table.td.roundingPercentage).toLocaleString()}%`,
         `${l.prefix || ""}${[null, void 0, NaN, "NaN"].includes(l.value) ? "-" : l.value.toFixed(e.value.table.td.roundingValue).toLocaleString()}${l.suffix || ""}`
@@ -202,33 +206,33 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
       return { head: a, body: o, config: t, colNames: a };
     });
     function re() {
-      Me(() => {
-        const a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], o = G.value.head, t = G.value.body, l = a.concat([o]).concat(t), m = Ye(l);
-        Xe({ csvContent: m, title: e.value.style.chart.title.text || "vue-ui-onion" });
+      Se(() => {
+        const a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], o = U.value.head, t = U.value.body, l = a.concat([o]).concat(t), f = Ve(l);
+        Xe({ csvContent: f, title: e.value.style.chart.title.text || "vue-ui-onion" });
       });
     }
-    const y = u(void 0), O = u(!1);
+    const m = u(void 0), O = u(!1);
     function _e(a) {
       O.value = a, K.value += 1;
     }
-    const U = u(null);
+    const E = u(null);
     function se({ datapoint: a, seriesIndex: o, show: t = !0 }) {
       const l = a.absoluteIndex;
-      y.value = o, U.value = {
+      m.value = o, E.value = {
         datapoint: a,
         seriesIndex: l,
         series: c.value,
         config: e.value
-      }, N.value = t;
-      let m = "";
-      const E = e.value.style.chart.tooltip.customFormat;
-      if (ce(E) && Ge(() => E({
+      }, R.value = t;
+      let f = "";
+      const I = e.value.style.chart.tooltip.customFormat;
+      if (ce(I) && Ge(() => I({
         seriesIndex: l,
         datapoint: a,
         series: c.value,
         config: e.value
       })))
-        Y.value = E({
+        X.value = I({
           seriesIndex: l,
           datapoint: a,
           series: c.value,
@@ -236,7 +240,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
         });
       else {
         const H = e.value.style.chart.tooltip.showPercentage, W = e.value.style.chart.tooltip.showValue;
-        m += `<div style="width: 100%; border-bottom: 1px solid ${e.value.style.chart.tooltip.borderColor}; padding-bottom: 6px;margin-bottom:3px;display:flex;flex-direction:row;gap:3px;align-items:center"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${a.color}"/></svg><span></span>${a.name}</span></div>`, m += `<div style="width:100%;text-align:left;"><b>${H ? S({ p: "", v: a.percentage, s: "%", r: e.value.style.chart.tooltip.roundingPercentage }) : ""}</b> ${H && W ? "(" : ""}${W ? J(
+        f += `<div style="width: 100%; border-bottom: 1px solid ${e.value.style.chart.tooltip.borderColor}; padding-bottom: 6px;margin-bottom:3px;display:flex;flex-direction:row;gap:3px;align-items:center"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${a.color}"/></svg><span></span>${a.name}</span></div>`, f += `<div style="width:100%;text-align:left;"><b>${H ? S({ p: "", v: a.percentage, s: "%", r: e.value.style.chart.tooltip.roundingPercentage }) : ""}</b> ${H && W ? "(" : ""}${W ? J(
           e.value.style.chart.layout.labels.value.formatter,
           a.value,
           S({
@@ -246,7 +250,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
             r: e.value.style.chart.tooltip.roundingValue
           }),
           { datapoint: a, seriesIndex: o }
-        ) : ""}${H && W ? ")" : ""}</div>`, Y.value = `<div>${m}</div>`;
+        ) : ""}${H && W ? ")" : ""}</div>`, X.value = `<div>${f}</div>`;
       }
     }
     function ue() {
@@ -263,17 +267,17 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
       toggleTable: ue,
       toggleTooltip: ne
     }), (a, o) => (s(), n("div", {
-      class: D(`vue-ui-onion ${O.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      class: L(`vue-ui-onion ${O.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
       ref_key: "onionChart",
       ref: _,
       id: `vue-ui-onion_${x.value}`,
-      style: L(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height: 100%;" : ""} text-align:center;background:${e.value.style.chart.backgroundColor}`)
+      style: z(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height: 100%;" : ""} text-align:center;background:${e.value.style.chart.backgroundColor}`)
     }, [
       e.value.style.chart.title.text ? (s(), n("div", {
         key: 0,
         ref_key: "chartTitle",
         ref: Q,
-        style: L(`width:100%;background:${e.value.style.chart.backgroundColor}`)
+        style: z(`width:100%;background:${e.value.style.chart.backgroundColor}`)
       }, [
         j(He, {
           config: {
@@ -288,7 +292,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
           }
         }, null, 8, ["config"])
       ], 4)) : b("", !0),
-      e.value.userOptions.show && M.value ? (s(), z(je, {
+      e.value.userOptions.show && N.value ? (s(), Y(je, {
         ref_key: "details",
         ref: pe,
         key: `user_options${K.value}`,
@@ -313,58 +317,58 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
         onGenerateImage: v(le),
         onToggleTable: ue,
         onToggleTooltip: ne
-      }, Fe({ _: 2 }, [
+      }, Me({ _: 2 }, [
         a.$slots.optionTooltip ? {
           name: "optionTooltip",
           fn: h(() => [
-            f(a.$slots, "optionTooltip", {}, void 0, !0)
+            g(a.$slots, "optionTooltip", {}, void 0, !0)
           ]),
           key: "0"
         } : void 0,
         a.$slots.optionPdf ? {
           name: "optionPdf",
           fn: h(() => [
-            f(a.$slots, "optionPdf", {}, void 0, !0)
+            g(a.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         a.$slots.optionCsv ? {
           name: "optionCsv",
           fn: h(() => [
-            f(a.$slots, "optionCsv", {}, void 0, !0)
+            g(a.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         a.$slots.optionImg ? {
           name: "optionImg",
           fn: h(() => [
-            f(a.$slots, "optionImg", {}, void 0, !0)
+            g(a.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         a.$slots.optionTable ? {
           name: "optionTable",
           fn: h(() => [
-            f(a.$slots, "optionTable", {}, void 0, !0)
+            g(a.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         a.$slots.optionFullscreen ? {
           name: "optionFullscreen",
           fn: h(({ toggleFullscreen: t, isFullscreen: l }) => [
-            f(a.$slots, "optionFullscreen", B(V({ toggleFullscreen: t, isFullscreen: l })), void 0, !0)
+            g(a.$slots, "optionFullscreen", B(V({ toggleFullscreen: t, isFullscreen: l })), void 0, !0)
           ]),
           key: "5"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "onGeneratePdf", "onGenerateImage"])) : b("", !0),
-      M.value ? (s(), n("svg", {
+      N.value ? (s(), n("svg", {
         key: 2,
-        xmlns: v(Ve),
-        class: D({ "vue-data-ui-fullscreen--on": O.value, "vue-data-ui-fulscreen--off": !O.value }),
+        xmlns: v(Be),
+        class: L({ "vue-data-ui-fullscreen--on": O.value, "vue-data-ui-fulscreen--off": !O.value }),
         viewBox: `0 0 ${r.value.width <= 0 ? 1e-4 : r.value.width} ${r.value.height <= 0 ? 1e-4 : r.value.height}`,
-        style: L(`max-width:100%;overflow:visible;background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color}`)
+        style: z(`max-width:100%;overflow:visible;background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color}`)
       }, [
-        (s(!0), n(I, null, F(p.value, (t, l) => (s(), n("circle", {
+        (s(!0), n(M, null, F(y.value, (t, l) => (s(), n("circle", {
           cx: i.value.centerX,
           cy: i.value.centerY,
           r: t.radius <= 0 ? 1e-4 : t.radius,
@@ -374,10 +378,10 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
           "stroke-dasharray": t.path.bgDashArray,
           "stroke-dashoffset": t.path.fullOffset,
           "stroke-linecap": "round",
-          class: D({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(y.value) && y.value !== l }),
+          class: L({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(m.value) && m.value !== l }),
           style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
         }, null, 10, lt))), 256)),
-        (s(!0), n(I, null, F(p.value, (t, l) => (s(), n("circle", {
+        (s(!0), n(M, null, F(y.value, (t, l) => (s(), n("circle", {
           cx: i.value.centerX,
           cy: i.value.centerY,
           r: t.radius < 0 ? 1e-4 : t.radius,
@@ -386,7 +390,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
           fill: "none",
           "stroke-dasharray": t.path.dashArray,
           "stroke-dashoffset": t.path.dashOffset,
-          class: D({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(y.value) && y.value !== l }),
+          class: L({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(m.value) && m.value !== l }),
           "stroke-linecap": "round",
           style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
         }, null, 10, ot))), 256)),
@@ -408,7 +412,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
           key: 0,
           filter: `url(#blur_${x.value})`
         }, [
-          (s(!0), n(I, null, F(p.value, (t, l) => (s(), n("circle", {
+          (s(!0), n(M, null, F(y.value, (t, l) => (s(), n("circle", {
             cx: i.value.centerX,
             cy: i.value.centerY,
             r: t.radius <= 0 ? 1e-4 : t.radius,
@@ -421,7 +425,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
             style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
           }, null, 8, nt))), 256))
         ], 8, ut)) : b("", !0),
-        (s(!0), n(I, null, F(p.value, (t, l) => (s(), n("circle", {
+        (s(!0), n(M, null, F(y.value, (t, l) => (s(), n("circle", {
           "data-cy-trap": "",
           cx: i.value.centerX,
           cy: i.value.centerY,
@@ -434,33 +438,33 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
           "stroke-linecap": "round",
           class: "vue-ui-onion-path",
           style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" },
-          onMouseenter: (m) => se({
+          onMouseenter: (f) => se({
             datapoint: t,
             show: !0,
             seriesIndex: l
           }),
-          onMouseleave: o[0] || (o[0] = (m) => {
-            y.value = void 0, N.value = !1;
+          onMouseleave: o[0] || (o[0] = (f) => {
+            m.value = void 0, R.value = !1;
           })
         }, null, 40, it))), 256)),
         e.value.style.chart.layout.labels.show ? (s(), n("g", ct, [
-          (s(!0), n(I, null, F(p.value, (t, l) => (s(), n("g", {
-            onMouseenter: (m) => se({
+          (s(!0), n(M, null, F(y.value, (t, l) => (s(), n("g", {
+            onMouseenter: (f) => se({
               datapoint: t,
               show: !0,
               seriesIndex: l
             }),
-            onMouseleave: o[1] || (o[1] = (m) => {
-              y.value = void 0, N.value = !1;
+            onMouseleave: o[1] || (o[1] = (f) => {
+              m.value = void 0, R.value = !1;
             })
           }, [
-            g.value.includes(t.id) ? b("", !0) : (s(), n("text", {
+            p.value.includes(t.id) ? b("", !0) : (s(), n("text", {
               key: 0,
               x: r.value.width / 2 - $.value.gutter * 0.8 + e.value.style.chart.layout.labels.offsetX,
               y: t.labelY + e.value.style.chart.layout.labels.offsetY,
               "text-anchor": "end",
               "font-size": e.value.style.chart.layout.labels.fontSize,
-              fill: e.value.useBlurOnHover && ![null, void 0].includes(y.value) && y.value === l ? t.color : e.value.style.chart.layout.labels.color,
+              fill: e.value.useBlurOnHover && ![null, void 0].includes(m.value) && m.value === l ? t.color : e.value.style.chart.layout.labels.color,
               "font-weight": e.value.style.chart.layout.labels.bold ? "bold" : "normal"
             }, T(t.name ? t.name + ": " : "") + " " + T(e.value.style.chart.layout.labels.percentage.show ? v(S)({
               v: t.percentage,
@@ -489,12 +493,12 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
             )})` : ""}`), 9, vt))
           ], 40, dt))), 256))
         ])) : b("", !0),
-        f(a.$slots, "svg", { svg: r.value }, void 0, !0)
+        g(a.$slots, "svg", { svg: r.value }, void 0, !0)
       ], 14, at)) : b("", !0),
       a.$slots.watermark ? (s(), n("div", ht, [
-        f(a.$slots, "watermark", B(V({ isPrinting: v(ee) || v(te) })), void 0, !0)
+        g(a.$slots, "watermark", B(V({ isPrinting: v(ee) || v(te) })), void 0, !0)
       ])) : b("", !0),
-      M.value ? b("", !0) : (s(), z(Qe, {
+      N.value ? b("", !0) : (s(), Y(Qe, {
         key: 4,
         config: {
           type: "onion",
@@ -510,7 +514,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
         ref_key: "chartLegend",
         ref: Z
       }, [
-        e.value.style.chart.legend.show ? (s(), z(qe, {
+        e.value.style.chart.legend.show ? (s(), Y(qe, {
           key: 0,
           legendSet: c.value,
           config: $e.value,
@@ -520,17 +524,17 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
             C("div", {
               "data-cy-legend-item": "",
               onClick: (l) => t.segregate(),
-              style: L(`opacity:${g.value.includes(t.id) ? 0.5 : 1}`)
+              style: z(`opacity:${p.value.includes(t.id) ? 0.5 : 1}`)
             }, T(t.name ? t.name + ": " : "") + " " + T((t.percentage || 0).toFixed(e.value.style.chart.legend.roundingPercentage)) + "% ", 13, ft)
           ]),
           _: 1
-        }, 8, ["legendSet", "config"])) : f(a.$slots, "legend", {
+        }, 8, ["legendSet", "config"])) : g(a.$slots, "legend", {
           key: 1,
           legend: c.value
         }, void 0, !0)
       ], 512),
       j(Ke, {
-        show: k.value.showTooltip && N.value,
+        show: k.value.showTooltip && R.value,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
         borderRadius: e.value.style.chart.tooltip.borderRadius,
@@ -541,18 +545,18 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
         position: e.value.style.chart.tooltip.position,
         offsetY: e.value.style.chart.tooltip.offsetY,
         parent: _.value,
-        content: Y.value,
+        content: X.value,
         isCustom: v(ce)(e.value.style.chart.tooltip.customFormat)
       }, {
         "tooltip-before": h(() => [
-          f(a.$slots, "tooltip-before", B(V({ ...U.value })), void 0, !0)
+          g(a.$slots, "tooltip-before", B(V({ ...E.value })), void 0, !0)
         ]),
         "tooltip-after": h(() => [
-          f(a.$slots, "tooltip-after", B(V({ ...U.value })), void 0, !0)
+          g(a.$slots, "tooltip-after", B(V({ ...E.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom"]),
-      M.value ? (s(), z(Ze, {
+      N.value ? (s(), Y(Ze, {
         key: 5,
         hideDetails: "",
         config: {
@@ -570,15 +574,15 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
       }, {
         content: h(() => [
           j(Je, {
-            colNames: A.value.colNames,
-            head: A.value.head,
-            body: A.value.body,
-            config: A.value.config,
+            colNames: D.value.colNames,
+            head: D.value.head,
+            body: D.value.body,
+            config: D.value.config,
             title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
             onClose: o[3] || (o[3] = (t) => k.value.showTable = !1)
           }, {
             th: h(({ th: t }) => [
-              Se(T(t), 1)
+              Fe(T(t), 1)
             ]),
             td: h(({ td: t }) => [
               C("div", { innerHTML: t }, null, 8, gt)
@@ -590,7 +594,7 @@ const tt = ["id"], at = ["xmlns", "viewBox"], lt = ["cx", "cy", "r", "stroke", "
       }, 8, ["config"])) : b("", !0)
     ], 14, tt));
   }
-}, It = /* @__PURE__ */ et(pt, [["__scopeId", "data-v-92cdbc16"]]);
+}, It = /* @__PURE__ */ et(pt, [["__scopeId", "data-v-74ab3911"]]);
 export {
   It as default
 };

package/dist/vue-ui-onion-DX96edRH.cjs

@@ -0,0 +1,5 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),u=require("./index-DDwHKEGb.cjs"),X=require("./useResponsive-B3TrDDIG.cjs"),se=require("./Title-B6PVw0aK.cjs"),U=require("./usePrinter-CRKoRqbE.cjs"),ie=require("./Legend-CTlJpdAi.cjs"),ce=require("./DataTable-DkoeHXI5.cjs"),de=require("./Tooltip-Ci47DnuY.cjs"),ve=require("./vue-ui-skeleton-BeqLQi6X.cjs"),he=require("./vue-ui-accordion-BBDPcl3d.cjs"),G=require("./useNestedProp-BbpR9SM4.cjs"),pe=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),fe=["id"],ge=["xmlns","viewBox"],me=["cx","cy","r","stroke","stroke-width","stroke-dasharray","stroke-dashoffset"],ye=["cx","cy","r","stroke","stroke-width","stroke-dasharray","stroke-dashoffset"],be=["id"],ke=["stdDeviation"],we=["filter"],Ce=["cx","cy","r","stroke-width","stroke-dasharray","stroke-dashoffset"],xe=["cx","cy","r","stroke-width","stroke-dasharray","stroke-dashoffset","onMouseenter"],$e={key:1},Be=["onMouseenter"],Te=["x","y","font-size","fill","font-weight"],Se={key:3,class:"vue-data-ui-watermark"},Pe=["onClick"],_e=["innerHTML"],Ne={__name:"vue-ui-onion",props:{config:{type:Object,default(){return{}}},dataset:{type:Array,default(){return[]}}},emits:["selectLegend"],setup(H,{expose:W,emit:j}){const f=H,{vue_ui_onion:J}=u.useConfig(),C=e.computed(()=>!!f.dataset&&f.dataset.length),m=e.ref(u.createUid()),K=e.ref(null),F=e.ref(0),x=e.ref(!1),T=e.ref(""),d=e.ref([]),y=e.ref(null),I=e.ref(null),V=e.ref(null),t=e.computed(()=>{const a=G.useNestedProp({userConfig:f.config,defaultConfig:J});return a.theme?{...G.useNestedProp({userConfig:u.themes.vue_ui_onion[a.theme]||f.config,defaultConfig:a}),customPalette:u.themePalettes[a.theme]||u.palette}:a}),{isPrinting:E,isImaging:L,generatePdf:M,generateImage:D}=U.usePrinter({elementId:`vue-ui-onion_${m.value}`,fileName:t.value.style.chart.title.text||"vue-ui-onion"}),Q=e.computed(()=>u.convertCustomPalette(t.value.customPalette)),p=e.ref({showTable:t.value.table.show,showTooltip:t.value.style.chart.tooltip.show}),n=e.ref({height:512,width:512,padding:{top:64,left:64,right:64,bottom:64},minRadius:64}),$=e.ref(null);e.onMounted(()=>{if(u.objectIsEmpty(f.dataset)&&u.error({componentName:"VueUiOnion",type:"dataset"}),t.value.responsive){const r=X.throttle(()=>{const{width:l,height:o}=X.useResponsive({chart:y.value,title:t.value.style.chart.title.text?I.value:null,legend:t.value.style.chart.legend.show?V.value:null});n.value.width=l,n.value.height=o,n.value.padding.top=Math.max(l,o)*.125,n.value.padding.right=Math.max(l,o)*.125,n.value.padding.bottom=Math.max(l,o)*.125,n.value.padding.left=Math.max(l,o)*.125,n.value.minRadius=Math.min(l,o)*.125});$.value=new ResizeObserver(r),$.value.observe(y.value.parentNode)}}),e.onBeforeUnmount(()=>{$.value&&$.value.disconnect()});const s=e.computed(()=>({top:n.value.padding.top,left:n.value.padding.left,right:n.value.width-n.value.padding.right,bottom:n.value.height-n.value.padding.bottom,centerX:n.value.width/2,centerY:n.value.height/2,width:n.value.width-n.value.padding.right-n.value.padding.left,height:n.value.height-n.value.padding.bottom-n.value.padding.top,minRadius:n.value.minRadius,maxRadius:Math.min(n.value.width,n.value.height)-n.value.padding.top*2})),i=e.computed(()=>(f.dataset.forEach((a,r)=>{[null,void 0].includes(a.name)&&u.error({componentName:"VueUiOnion",type:"datasetSerieAttribute",property:"name",index:r}),[void 0].includes(a.percentage)&&u.error({componentName:"VueUiOnion",type:"datasetSerieAttribute",property:"percentage",index:r})}),f.dataset.map((a,r)=>{const l=`onion_serie_${r}_${m.value}`;return{...a,percentage:a.percentage||0,targetPercentage:a.percentage||0,color:u.convertColorToHex(a.color)||Q.value[r]||u.palette[r],id:l,shape:"circle",opacity:d.value.includes(l)?.5:1,absoluteIndex:r,segregate:()=>R(l),isSegregated:d.value.includes(l)}}))),b=e.ref(i.value),Z=e.computed(()=>t.value.useStartAnimation),ee=e.ref(null),te=e.computed(()=>Math.max(...i.value.map(a=>a.percentage))),S=e.ref(!1);e.watch(()=>i.value,le,{immediate:!0});function le(){if(Z.value&&!S.value){let r=function(){a>=te.value?(cancelAnimationFrame(ee.value),b.value=i.value,S.value=!0):(b.value=i.value.map(l=>({...l,percentage:a<l.targetPercentage?a:l.targetPercentage})),a+=1,requestAnimationFrame(r),S.value=!0)};b.value=i.value.map(l=>({...l,percentage:0}));let a=0;r()}else b.value=i.value}const ae=e.computed(()=>({cy:"onion-div-legend",backgroundColor:t.value.style.chart.legend.backgroundColor,color:t.value.style.chart.legend.color,fontSize:t.value.style.chart.legend.fontSize,paddingBottom:12,fontWeight:t.value.style.chart.legend.bold?"bold":""})),oe=e.computed(()=>i.value.filter(a=>!d.value.includes(a.id)).length),g=e.computed(()=>{const a=Math.min(s.value.width,s.value.height)/2/i.value.length;return{gutter:(a>t.value.style.chart.layout.maxThickness?t.value.style.chart.layout.maxThickness:a)*t.value.style.chart.layout.gutter.width,track:(a>t.value.style.chart.layout.maxThickness?t.value.style.chart.layout.maxThickness:a)*t.value.style.chart.layout.track.width}}),v=e.computed(()=>b.value.filter(a=>!d.value.includes(a.id)).map((a,r)=>{const l=(s.value.maxRadius-g.value.track)/oe.value/2*(1+r),o=s.value.centerY-l;return{percentage:a.percentage||0,...a,labelY:o,radius:l,path:re(l,a.percentage||0)}}));function re(a,r){const l=2*Math.PI*a,o=l*.75,c=`${o} ${l}`,w=o*(1-r/100);return{bgDashArray:`${o} ${l}`,bgDashOffset:0,dashArray:c,dashOffset:w,fullOffset:0,active:`
+            M ${s.value.centerX},${s.value.centerY-a} 
+            A ${a},${a} 0 1 1 
+            ${s.value.centerX+a*Math.cos(Math.PI*3/4)},${s.value.centerY+a*Math.sin(Math.PI*3/4)}
+        `.trim()}}function R(a){d.value.includes(a)?d.value=d.value.filter(r=>r!==a):d.value.push(a),j("selectLegend",v.value)}function ne(){return v.value}const P=e.computed(()=>{const a=[t.value.table.translations.serie,t.value.table.translations.percentage,t.value.table.translations.value],r=v.value.map(l=>[l.name,l.percentage,l.value]);return{head:a,body:r}}),B=e.computed(()=>{const a=P.value.head,r=v.value.map(o=>[`<span style="color:${o.color}">⬤</span> ${o.name}`,`${Number(o.percentage??0).toFixed(t.value.table.td.roundingPercentage).toLocaleString()}%`,`${o.prefix||""}${[null,void 0,NaN,"NaN"].includes(o.value)?"-":o.value.toFixed(t.value.table.td.roundingValue).toLocaleString()}${o.suffix||""}`]),l={th:{backgroundColor:t.value.table.th.backgroundColor,color:t.value.table.th.color,outline:t.value.table.th.outline},td:{backgroundColor:t.value.table.td.backgroundColor,color:t.value.table.td.color,outline:t.value.table.td.outline},breakpoint:t.value.table.responsiveBreakpoint};return{head:a,body:r,config:l,colNames:a}});function z(){e.nextTick(()=>{const a=[[t.value.style.chart.title.text],[t.value.style.chart.title.subtitle.text],[""]],r=P.value.head,l=P.value.body,o=a.concat([r]).concat(l),c=u.createCsvContent(o);u.downloadCsv({csvContent:c,title:t.value.style.chart.title.text||"vue-ui-onion"})})}const h=e.ref(void 0),k=e.ref(!1);function ue(a){k.value=a,F.value+=1}const _=e.ref(null);function A({datapoint:a,seriesIndex:r,show:l=!0}){const o=a.absoluteIndex;h.value=r,_.value={datapoint:a,seriesIndex:o,series:i.value,config:t.value},x.value=l;let c="";const w=t.value.style.chart.tooltip.customFormat;if(u.isFunction(w)&&u.functionReturnsString(()=>w({seriesIndex:o,datapoint:a,series:i.value,config:t.value})))T.value=w({seriesIndex:o,datapoint:a,series:i.value,config:t.value});else{const N=t.value.style.chart.tooltip.showPercentage,O=t.value.style.chart.tooltip.showValue;c+=`<div style="width: 100%; border-bottom: 1px solid ${t.value.style.chart.tooltip.borderColor}; padding-bottom: 6px;margin-bottom:3px;display:flex;flex-direction:row;gap:3px;align-items:center"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${a.color}"/></svg><span></span>${a.name}</span></div>`,c+=`<div style="width:100%;text-align:left;"><b>${N?u.dataLabel({p:"",v:a.percentage,s:"%",r:t.value.style.chart.tooltip.roundingPercentage}):""}</b> ${N&&O?"(":""}${O?u.applyDataLabel(t.value.style.chart.layout.labels.value.formatter,a.value,u.dataLabel({p:a.prefix||"",v:a.value,s:a.suffix||"",r:t.value.style.chart.tooltip.roundingValue}),{datapoint:a,seriesIndex:r}):""}${N&&O?")":""}</div>`,T.value=`<div>${c}</div>`}}function Y(){p.value.showTable=!p.value.showTable}function q(){p.value.showTooltip=!p.value.showTooltip}return W({getData:ne,generatePdf:M,generateCsv:z,generateImage:D,toggleTable:Y,toggleTooltip:q}),(a,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(`vue-ui-onion ${k.value?"vue-data-ui-wrapper-fullscreen":""} ${t.value.useCssAnimation?"":"vue-ui-dna"}`),ref_key:"onionChart",ref:y,id:`vue-ui-onion_${m.value}`,style:e.normalizeStyle(`font-family:${t.value.style.fontFamily};width:100%; ${t.value.responsive?"height: 100%;":""} text-align:center;background:${t.value.style.chart.backgroundColor}`)},[t.value.style.chart.title.text?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"chartTitle",ref:I,style:e.normalizeStyle(`width:100%;background:${t.value.style.chart.backgroundColor}`)},[e.createVNode(se._sfc_main,{config:{title:{cy:"onion-div-title",...t.value.style.chart.title},subtitle:{cy:"onion-div-subtitle",...t.value.style.chart.title.subtitle}}},null,8,["config"])],4)):e.createCommentVNode("",!0),t.value.userOptions.show&&C.value?(e.openBlock(),e.createBlock(U.UserOptions,{ref_key:"details",ref:K,key:`user_options${F.value}`,backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color,isImaging:e.unref(L),isPrinting:e.unref(E),uid:m.value,hasTooltip:t.value.userOptions.buttons.tooltip&&t.value.style.chart.tooltip.show,hasPdf:t.value.userOptions.buttons.pdf,hasImg:t.value.userOptions.buttons.img,hasXls:t.value.userOptions.buttons.csv,hasTable:t.value.userOptions.buttons.table,hasFullscreen:t.value.userOptions.buttons.fullscreen,isFullscreen:k.value,isTooltip:p.value.showTooltip,titles:{...t.value.userOptions.buttonTitles},chartElement:y.value,onToggleFullscreen:ue,onGeneratePdf:e.unref(M),onGenerateCsv:z,onGenerateImage:e.unref(D),onToggleTable:Y,onToggleTooltip:q},e.createSlots({_:2},[a.$slots.optionTooltip?{name:"optionTooltip",fn:e.withCtx(()=>[e.renderSlot(a.$slots,"optionTooltip",{},void 0,!0)]),key:"0"}:void 0,a.$slots.optionPdf?{name:"optionPdf",fn:e.withCtx(()=>[e.renderSlot(a.$slots,"optionPdf",{},void 0,!0)]),key:"1"}:void 0,a.$slots.optionCsv?{name:"optionCsv",fn:e.withCtx(()=>[e.renderSlot(a.$slots,"optionCsv",{},void 0,!0)]),key:"2"}:void 0,a.$slots.optionImg?{name:"optionImg",fn:e.withCtx(()=>[e.renderSlot(a.$slots,"optionImg",{},void 0,!0)]),key:"3"}:void 0,a.$slots.optionTable?{name:"optionTable",fn:e.withCtx(()=>[e.renderSlot(a.$slots,"optionTable",{},void 0,!0)]),key:"4"}:void 0,a.$slots.optionFullscreen?{name:"optionFullscreen",fn:e.withCtx(({toggleFullscreen:l,isFullscreen:o})=>[e.renderSlot(a.$slots,"optionFullscreen",e.normalizeProps(e.guardReactiveProps({toggleFullscreen:l,isFullscreen:o})),void 0,!0)]),key:"5"}:void 0]),1032,["backgroundColor","color","isImaging","isPrinting","uid","hasTooltip","hasPdf","hasImg","hasXls","hasTable","hasFullscreen","isFullscreen","isTooltip","titles","chartElement","onGeneratePdf","onGenerateImage"])):e.createCommentVNode("",!0),C.value?(e.openBlock(),e.createElementBlock("svg",{key:2,xmlns:e.unref(u.XMLNS),class:e.normalizeClass({"vue-data-ui-fullscreen--on":k.value,"vue-data-ui-fulscreen--off":!k.value}),viewBox:`0 0 ${n.value.width<=0?1e-4:n.value.width} ${n.value.height<=0?1e-4:n.value.height}`,style:e.normalizeStyle(`max-width:100%;overflow:visible;background:${t.value.style.chart.backgroundColor};color:${t.value.style.chart.color}`)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(l,o)=>(e.openBlock(),e.createElementBlock("circle",{cx:s.value.centerX,cy:s.value.centerY,r:l.radius<=0?1e-4:l.radius,stroke:t.value.style.chart.layout.gutter.color,"stroke-width":g.value.gutter,fill:"none","stroke-dasharray":l.path.bgDashArray,"stroke-dashoffset":l.path.fullOffset,"stroke-linecap":"round",class:e.normalizeClass({"vue-ui-onion-path":!0,"vue-ui-onion-blur":t.value.useBlurOnHover&&![null,void 0].includes(h.value)&&h.value!==o}),style:{transform:"rotate(-90deg)","transform-origin":"50% 50%"}},null,10,me))),256)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(l,o)=>(e.openBlock(),e.createElementBlock("circle",{cx:s.value.centerX,cy:s.value.centerY,r:l.radius<0?1e-4:l.radius,stroke:`${l.color}`,"stroke-width":g.value.track,fill:"none","stroke-dasharray":l.path.dashArray,"stroke-dashoffset":l.path.dashOffset,class:e.normalizeClass({"vue-ui-onion-path":!0,"vue-ui-onion-blur":t.value.useBlurOnHover&&![null,void 0].includes(h.value)&&h.value!==o}),"stroke-linecap":"round",style:{transform:"rotate(-90deg)","transform-origin":"50% 50%"}},null,10,ye))),256)),e.createElementVNode("defs",null,[e.createElementVNode("filter",{id:`blur_${m.value}`,x:"-50%",y:"-50%",width:"200%",height:"200%"},[e.createElementVNode("feGaussianBlur",{in:"SourceGraphic",stdDeviation:100/t.value.style.chart.gradientIntensity},null,8,ke)],8,be)]),t.value.style.chart.useGradient?(e.openBlock(),e.createElementBlock("g",{key:0,filter:`url(#blur_${m.value})`},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(l,o)=>(e.openBlock(),e.createElementBlock("circle",{cx:s.value.centerX,cy:s.value.centerY,r:l.radius<=0?1e-4:l.radius,stroke:"white","stroke-width":g.value.track/3,fill:"none","stroke-linecap":"round","stroke-dasharray":l.path.dashArray,"stroke-dashoffset":l.path.dashOffset,style:{transform:"rotate(-90deg)","transform-origin":"50% 50%"}},null,8,Ce))),256))],8,we)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(l,o)=>(e.openBlock(),e.createElementBlock("circle",{"data-cy-trap":"",cx:s.value.centerX,cy:s.value.centerY,r:l.radius<=0?1e-4:l.radius,stroke:"transparent","stroke-width":Math.max(g.value.track,g.value.gutter),fill:"none","stroke-dasharray":l.path.bgDashArray,"stroke-dashoffset":l.path.fullOffset,"stroke-linecap":"round",class:"vue-ui-onion-path",style:{transform:"rotate(-90deg)","transform-origin":"50% 50%"},onMouseenter:c=>A({datapoint:l,show:!0,seriesIndex:o}),onMouseleave:r[0]||(r[0]=c=>{h.value=void 0,x.value=!1})},null,40,xe))),256)),t.value.style.chart.layout.labels.show?(e.openBlock(),e.createElementBlock("g",$e,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(l,o)=>(e.openBlock(),e.createElementBlock("g",{onMouseenter:c=>A({datapoint:l,show:!0,seriesIndex:o}),onMouseleave:r[1]||(r[1]=c=>{h.value=void 0,x.value=!1})},[d.value.includes(l.id)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("text",{key:0,x:n.value.width/2-g.value.gutter*.8+t.value.style.chart.layout.labels.offsetX,y:l.labelY+t.value.style.chart.layout.labels.offsetY,"text-anchor":"end","font-size":t.value.style.chart.layout.labels.fontSize,fill:t.value.useBlurOnHover&&![null,void 0].includes(h.value)&&h.value===o?l.color:t.value.style.chart.layout.labels.color,"font-weight":t.value.style.chart.layout.labels.bold?"bold":"normal"},e.toDisplayString(l.name?l.name+": ":"")+" "+e.toDisplayString(t.value.style.chart.layout.labels.percentage.show?e.unref(u.dataLabel)({v:l.percentage,s:"%",r:t.value.style.chart.layout.labels.roundingPercentage}):"")+" "+e.toDisplayString(!t.value.style.chart.layout.labels.percentage.show&&t.value.style.chart.layout.labels.value.show?`: ${e.unref(u.applyDataLabel)(t.value.style.chart.layout.labels.value.formatter,l.value,e.unref(u.dataLabel)({p:l.prefix||"",v:l.value||0,s:l.suffix||"",r:t.value.style.chart.layout.labels.roundingValue}),{datapoint:l,seriesIndex:o})}`:`${t.value.style.chart.layout.labels.value.show&&l.value?`(${e.unref(u.applyDataLabel)(t.value.style.chart.layout.labels.value.formatter,l.value,e.unref(u.dataLabel)({p:l.prefix||"",v:l.value||0,s:l.suffix||"",r:t.value.style.chart.layout.labels.roundingValue}),{datapoint:l,seriesIndex:o})})`:""}`),9,Te))],40,Be))),256))])):e.createCommentVNode("",!0),e.renderSlot(a.$slots,"svg",{svg:n.value},void 0,!0)],14,ge)):e.createCommentVNode("",!0),a.$slots.watermark?(e.openBlock(),e.createElementBlock("div",Se,[e.renderSlot(a.$slots,"watermark",e.normalizeProps(e.guardReactiveProps({isPrinting:e.unref(E)||e.unref(L)})),void 0,!0)])):e.createCommentVNode("",!0),C.value?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(ve.default,{key:4,config:{type:"onion",style:{backgroundColor:t.value.style.chart.backgroundColor,onion:{color:t.value.style.chart.layout.gutter.color}}}},null,8,["config"])),e.createElementVNode("div",{ref_key:"chartLegend",ref:V},[t.value.style.chart.legend.show?(e.openBlock(),e.createBlock(ie.Legend,{key:0,legendSet:i.value,config:ae.value,onClickMarker:r[2]||(r[2]=({legend:l})=>R(l.id))},{item:e.withCtx(({legend:l})=>[e.createElementVNode("div",{"data-cy-legend-item":"",onClick:o=>l.segregate(),style:e.normalizeStyle(`opacity:${d.value.includes(l.id)?.5:1}`)},e.toDisplayString(l.name?l.name+": ":"")+" "+e.toDisplayString((l.percentage||0).toFixed(t.value.style.chart.legend.roundingPercentage))+"% ",13,Pe)]),_:1},8,["legendSet","config"])):e.renderSlot(a.$slots,"legend",{key:1,legend:i.value},void 0,!0)],512),e.createVNode(de._sfc_main,{show:p.value.showTooltip&&x.value,backgroundColor:t.value.style.chart.tooltip.backgroundColor,color:t.value.style.chart.tooltip.color,borderRadius:t.value.style.chart.tooltip.borderRadius,borderColor:t.value.style.chart.tooltip.borderColor,borderWidth:t.value.style.chart.tooltip.borderWidth,fontSize:t.value.style.chart.tooltip.fontSize,backgroundOpacity:t.value.style.chart.tooltip.backgroundOpacity,position:t.value.style.chart.tooltip.position,offsetY:t.value.style.chart.tooltip.offsetY,parent:y.value,content:T.value,isCustom:e.unref(u.isFunction)(t.value.style.chart.tooltip.customFormat)},{"tooltip-before":e.withCtx(()=>[e.renderSlot(a.$slots,"tooltip-before",e.normalizeProps(e.guardReactiveProps({..._.value})),void 0,!0)]),"tooltip-after":e.withCtx(()=>[e.renderSlot(a.$slots,"tooltip-after",e.normalizeProps(e.guardReactiveProps({..._.value})),void 0,!0)]),_:3},8,["show","backgroundColor","color","borderRadius","borderColor","borderWidth","fontSize","backgroundOpacity","position","offsetY","parent","content","isCustom"]),C.value?(e.openBlock(),e.createBlock(he.default,{key:5,hideDetails:"",config:{open:p.value.showTable,maxHeight:1e4,head:{backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color},body:{backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color}}},{content:e.withCtx(()=>[e.createVNode(ce.DataTable,{colNames:B.value.colNames,head:B.value.head,body:B.value.body,config:B.value.config,title:`${t.value.style.chart.title.text}${t.value.style.chart.title.subtitle.text?` : ${t.value.style.chart.title.subtitle.text}`:""}`,onClose:r[3]||(r[3]=l=>p.value.showTable=!1)},{th:e.withCtx(({th:l})=>[e.createTextVNode(e.toDisplayString(l),1)]),td:e.withCtx(({td:l})=>[e.createElementVNode("div",{innerHTML:l},null,8,_e)]),_:1},8,["colNames","head","body","config","title"])]),_:1},8,["config"])):e.createCommentVNode("",!0)],14,fe))}},Oe=pe._export_sfc(Ne,[["__scopeId","data-v-74ab3911"]]);exports.default=Oe;

package/dist/{vue-ui-parallel-coordinate-plot-D8LWLRdK.cjs → vue-ui-parallel-coordinate-plot-DLbub2s5.cjs}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),i=require("./index-DnCegWge.cjs"),K=require("./useResponsive-B3TrDDIG.cjs"),de=require("./Title-BYDRRvqX.cjs"),ve=require("./Legend-CkIdFaKE.cjs"),he=require("./Tooltip-CtRqM9Sw.cjs"),pe=require("./Shape-BfT5b6-S.cjs"),Q=require("./usePrinter-C94KiYaY.cjs"),me=require("./DataTable-Dr67tL_4.cjs"),ye=require("./vue-ui-accordion-CG_G9ock.cjs"),fe=require("./vue-ui-skeleton-Cey15-vY.cjs"),Z=require("./useNestedProp-18FTwhUW.cjs"),ge=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),be=["id"],ke=["xmlns","viewBox"],xe={style:{"pointer-events":"none"}},Ce=["x1","x2","y1","y2","stroke","stroke-width"],we=["x","y","fill","font-size","font-weight"],Be=["x1","x2","y1","y2","stroke","stroke-width"],ze=["x","y","fill","font-size","font-weight"],$e={key:0},Se=["x","y","font-size","fill"],Ne=["width","x","y"],Te={style:{width:"100%"}},Fe=["x","y","fill","font-weight","font-size","onMouseenter"],_e=["d","stroke","stroke-width","onMouseenter"],Pe={key:3,class:"vue-data-ui-watermark"},Ae=["onClick"],Me=["innerHTML"],Le={__name:"vue-ui-parallel-coordinate-plot",props:{config:{type:Object,default(){return{}}},dataset:{type:Array,default(){return[]}}},emits:["selectLegend","selectDatapoint"],setup(ee,{expose:te,emit:M}){const k=ee,{vue_ui_parallel_coordinate_plot:le}=i.useConfig(),x=e.computed({get(){return!!k.dataset&&k.dataset.length},set(a){return a}}),L=e.ref(0),w=e.ref(null),E=e.ref(null),I=e.ref(null),N=e.ref(i.createUid()),B=e.ref(!1);function ae(a){B.value=a,L.value+=1}const t=e.computed(()=>{const a=Z.useNestedProp({userConfig:k.config,defaultConfig:le});return a.theme?{...Z.useNestedProp({userConfig:i.themes.vue_ui_parallel_coordinate_plot[a.theme]||k.config,defaultConfig:a}),customPalette:i.themePalettes[a.theme]||i.palette}:a}),$=e.ref(null);e.onMounted(()=>{if(i.objectIsEmpty(k.dataset)?i.error({componentName:"VueUiParallelCoordinatePlot",type:"dataset"}):k.dataset.forEach((a,o)=>{i.getMissingDatasetAttributes({datasetObject:a,requiredAttributes:["name","series"]}).forEach(l=>{x.value=!1,i.error({componentName:"VueUiParallelCoordinatePlot",type:"datasetSerieAttribute",property:l,index:o})})}),t.value.responsive){const a=K.throttle(()=>{const{width:o,height:l}=K.useResponsive({chart:w.value,title:t.value.style.chart.title.text?E.value:null,legend:t.value.style.chart.legend.show?I.value:null});c.value.width=o,c.value.height=l,c.value.plotSize=i.translateSize({relator:Math.min(o,l),adjuster:600,source:t.value.style.chart.plots.radius,threshold:2,fallback:2}),c.value.ticksFontSize=i.translateSize({relator:Math.min(o,l),adjuster:600,source:t.value.style.chart.yAxis.labels.ticks.fontSize,threshold:10,fallback:10}),c.value.datapointFontSize=i.translateSize({relator:Math.min(o,l),adjuster:600,source:t.value.style.chart.yAxis.labels.datapoints.fontSize,threshold:10,fallback:10}),c.value.axisNameFontSize=i.translateSize({relator:Math.min(o,l),adjuster:600,source:t.value.style.chart.yAxis.labels.axisNamesFontSize,threshold:12,fallback:12})});$.value=new ResizeObserver(a),$.value.observe(w.value.parentNode)}}),e.onBeforeUnmount(()=>{$.value&&$.value.disconnect()});const{isPrinting:V,isImaging:D,generatePdf:O,generateImage:q}=Q.usePrinter({elementId:`pcp_${N.value}`,fileName:t.value.style.chart.title.text||"vue-ui-parallel-coordinate-plot"}),c=e.ref({height:t.value.style.chart.height,width:t.value.style.chart.width,plotSize:t.value.style.chart.plots.radius,ticksFontSize:t.value.style.chart.yAxis.labels.ticks.fontSize,datapointFontSize:t.value.style.chart.yAxis.labels.datapoints.fontSize,axisNameFontSize:t.value.style.chart.yAxis.labels.axisNamesFontSize}),d=e.computed(()=>{const{top:a,right:o,bottom:l,left:s}=t.value.style.chart.padding,r=c.value.height,n=c.value.width;return{chartHeight:r,chartWidth:n,height:r-a-l,width:n-s-o,top:a,left:s,right:n-o,bottom:r-l}}),oe=e.computed(()=>i.convertCustomPalette(t.value.customPalette)),m=e.ref({dataLabels:{show:t.value.style.chart.yAxis.labels.datapoints.show},showTable:t.value.table.show,showTooltip:t.value.style.chart.tooltip.show}),f=e.ref([]);function R(a){f.value.includes(a)?f.value=f.value.filter(o=>o!==a):f.value.push(a)}const b=e.computed(()=>k.dataset.map((a,o)=>{const l=i.convertColorToHex(a.color)||oe.value[o]||i.palette[o]||i.palette[o%i.palette.length];return{...a,series:a.series.map(s=>({...s,id:i.createUid(),color:l})),seriesIndex:o,color:l,id:i.createUid(),shape:a.shape||"circle"}})),se=e.computed(()=>b.value.map(a=>({...a,opacity:f.value.includes(a.id)?.5:1,segregate:()=>R(a.id),isSegregated:f.value.includes(a.id)}))),ne=e.computed(()=>({cy:"pcp-div-legend",backgroundColor:t.value.style.chart.legend.backgroundColor,color:t.value.style.chart.legend.color,fontSize:t.value.style.chart.legend.fontSize,paddingBottom:12,fontWeight:t.value.style.chart.legend.bold?"bold":""})),U=e.computed(()=>Math.max(...b.value.filter(a=>!f.value.includes(a.id)).map(a=>Math.max(...a.series.flatMap(o=>o.values.length))))),y=e.computed(()=>d.value.width/U.value),T=e.computed(()=>b.value.filter(a=>!f.value.includes(a.id))),p=e.computed(()=>{let a=[];for(let o=0;o<U.value;o+=1){const l=Math.min(...T.value.flatMap(v=>v.series.map(S=>S.values[o]||0)||0)),s=Math.max(...T.value.flatMap(v=>v.series.map(S=>S.values[o]||0)||0)),r=s===l?l/4:l,n=s===l?s*2:s,u=i.calculateNiceScale(r,n,t.value.style.chart.yAxis.scaleTicks),g=u.ticks.map((v,S)=>{const ue=u.min<0?v+Math.abs(u.min):v-Math.abs(u.min),ce=u.min<0?u.max+Math.abs(u.min):u.max-Math.abs(u.min);return{y:d.value.bottom-d.value.height*(ue/ce),x:d.value.left+y.value*o+y.value/2,value:v}});a.push({scale:u,ticks:g,name:t.value.style.chart.yAxis.labels.axisNames[o]||`Y-${o+1}`})}return a}),F=e.computed(()=>T.value.map((a,o)=>({...a,series:a.series.map((l,s)=>({...l,datapoints:l.values.map((r,n)=>{const u=p.value[n].scale.min<0?(r||0)+Math.abs(p.value[n].scale.min):(r||0)-Math.abs(p.value[n].scale.min),g=p.value[n].scale.min<0?p.value[n].scale.max+Math.abs(p.value[n].scale.min):p.value[n].scale.max-Math.abs(p.value[n].scale.min);return{name:l.name,seriesName:a.name,axisIndex:n,datapointIndex:s,seriesIndex:o,value:r||0,x:d.value.left+y.value*n+y.value/2,y:d.value.bottom-d.value.height*(u/g),comment:l.comments&&l.comments[n]||""}})}))})).map(a=>({...a,series:a.series.map(o=>{const l=i.createStraightPath(o.datapoints),s=i.createSmoothPath(o.datapoints,.12),r=i.getPathLengthFromCoordinates(t.value.style.chart.lines.smooth?`M ${s}`:`M ${l}`);return{...o,smoothPath:s,straightPath:l,pathLength:r}})})));function W({value:a,index:o,datapoint:l}){return i.applyDataLabel(t.value.style.chart.yAxis.labels.formatters[o]||null,a,i.dataLabel({p:t.value.style.chart.yAxis.labels.prefixes[o]||"",v:a,s:t.value.style.chart.yAxis.labels.suffixes[o]||"",r:t.value.style.chart.yAxis.labels.roundings[o]||0}),{datapoint:l,seriesIndex:o})}const h=e.ref(null),_=e.ref(null),z=e.ref(!1),P=e.ref("");function A({shape:a,serieName:o,serie:l,relativeIndex:s,seriesIndex:r}){_.value={serie:l,relativeIndex:s,seriesIndex:r,series:b.value,scales:p.value},z.value=!0,h.value=l.id;let n="";const u=t.value.style.chart.tooltip.customFormat;i.isFunction(u)&&i.functionReturnsString(()=>u({serie:l,seriesIndex:l.seriesIndex,series:b.value,config:t.value,scales:p.value}))?P.value=u({serie:l,seriesIndex:l.seriesIndex,series:b.value,config:t.value,scales:p.value}):(n+=`<div style="width:100%;text-align:center;border-bottom:1px solid ${t.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${o?o+" - ":""}${l.name}</div>`,p.value.map(g=>g.name).forEach((g,v)=>{n+=`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),i=require("./index-DDwHKEGb.cjs"),K=require("./useResponsive-B3TrDDIG.cjs"),de=require("./Title-B6PVw0aK.cjs"),ve=require("./Legend-CTlJpdAi.cjs"),he=require("./Tooltip-Ci47DnuY.cjs"),pe=require("./Shape-CbiBbFNX.cjs"),Q=require("./usePrinter-CRKoRqbE.cjs"),me=require("./DataTable-DkoeHXI5.cjs"),ye=require("./vue-ui-accordion-BBDPcl3d.cjs"),fe=require("./vue-ui-skeleton-BeqLQi6X.cjs"),Z=require("./useNestedProp-BbpR9SM4.cjs"),ge=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),be=["id"],ke=["xmlns","viewBox"],xe={style:{"pointer-events":"none"}},Ce=["x1","x2","y1","y2","stroke","stroke-width"],we=["x","y","fill","font-size","font-weight"],Be=["x1","x2","y1","y2","stroke","stroke-width"],ze=["x","y","fill","font-size","font-weight"],$e={key:0},Se=["x","y","font-size","fill"],Ne=["width","x","y"],Te={style:{width:"100%"}},Fe=["x","y","fill","font-weight","font-size","onMouseenter"],_e=["d","stroke","stroke-width","onMouseenter"],Pe={key:3,class:"vue-data-ui-watermark"},Ae=["onClick"],Me=["innerHTML"],Le={__name:"vue-ui-parallel-coordinate-plot",props:{config:{type:Object,default(){return{}}},dataset:{type:Array,default(){return[]}}},emits:["selectLegend","selectDatapoint"],setup(ee,{expose:te,emit:M}){const k=ee,{vue_ui_parallel_coordinate_plot:le}=i.useConfig(),x=e.computed({get(){return!!k.dataset&&k.dataset.length},set(a){return a}}),L=e.ref(0),w=e.ref(null),E=e.ref(null),I=e.ref(null),N=e.ref(i.createUid()),B=e.ref(!1);function ae(a){B.value=a,L.value+=1}const t=e.computed(()=>{const a=Z.useNestedProp({userConfig:k.config,defaultConfig:le});return a.theme?{...Z.useNestedProp({userConfig:i.themes.vue_ui_parallel_coordinate_plot[a.theme]||k.config,defaultConfig:a}),customPalette:i.themePalettes[a.theme]||i.palette}:a}),$=e.ref(null);e.onMounted(()=>{if(i.objectIsEmpty(k.dataset)?i.error({componentName:"VueUiParallelCoordinatePlot",type:"dataset"}):k.dataset.forEach((a,o)=>{i.getMissingDatasetAttributes({datasetObject:a,requiredAttributes:["name","series"]}).forEach(l=>{x.value=!1,i.error({componentName:"VueUiParallelCoordinatePlot",type:"datasetSerieAttribute",property:l,index:o})})}),t.value.responsive){const a=K.throttle(()=>{const{width:o,height:l}=K.useResponsive({chart:w.value,title:t.value.style.chart.title.text?E.value:null,legend:t.value.style.chart.legend.show?I.value:null});c.value.width=o,c.value.height=l,c.value.plotSize=i.translateSize({relator:Math.min(o,l),adjuster:600,source:t.value.style.chart.plots.radius,threshold:2,fallback:2}),c.value.ticksFontSize=i.translateSize({relator:Math.min(o,l),adjuster:600,source:t.value.style.chart.yAxis.labels.ticks.fontSize,threshold:10,fallback:10}),c.value.datapointFontSize=i.translateSize({relator:Math.min(o,l),adjuster:600,source:t.value.style.chart.yAxis.labels.datapoints.fontSize,threshold:10,fallback:10}),c.value.axisNameFontSize=i.translateSize({relator:Math.min(o,l),adjuster:600,source:t.value.style.chart.yAxis.labels.axisNamesFontSize,threshold:12,fallback:12})});$.value=new ResizeObserver(a),$.value.observe(w.value.parentNode)}}),e.onBeforeUnmount(()=>{$.value&&$.value.disconnect()});const{isPrinting:V,isImaging:D,generatePdf:O,generateImage:q}=Q.usePrinter({elementId:`pcp_${N.value}`,fileName:t.value.style.chart.title.text||"vue-ui-parallel-coordinate-plot"}),c=e.ref({height:t.value.style.chart.height,width:t.value.style.chart.width,plotSize:t.value.style.chart.plots.radius,ticksFontSize:t.value.style.chart.yAxis.labels.ticks.fontSize,datapointFontSize:t.value.style.chart.yAxis.labels.datapoints.fontSize,axisNameFontSize:t.value.style.chart.yAxis.labels.axisNamesFontSize}),d=e.computed(()=>{const{top:a,right:o,bottom:l,left:s}=t.value.style.chart.padding,r=c.value.height,n=c.value.width;return{chartHeight:r,chartWidth:n,height:r-a-l,width:n-s-o,top:a,left:s,right:n-o,bottom:r-l}}),oe=e.computed(()=>i.convertCustomPalette(t.value.customPalette)),m=e.ref({dataLabels:{show:t.value.style.chart.yAxis.labels.datapoints.show},showTable:t.value.table.show,showTooltip:t.value.style.chart.tooltip.show}),f=e.ref([]);function R(a){f.value.includes(a)?f.value=f.value.filter(o=>o!==a):f.value.push(a)}const b=e.computed(()=>k.dataset.map((a,o)=>{const l=i.convertColorToHex(a.color)||oe.value[o]||i.palette[o]||i.palette[o%i.palette.length];return{...a,series:a.series.map(s=>({...s,id:i.createUid(),color:l})),seriesIndex:o,color:l,id:i.createUid(),shape:a.shape||"circle"}})),se=e.computed(()=>b.value.map(a=>({...a,opacity:f.value.includes(a.id)?.5:1,segregate:()=>R(a.id),isSegregated:f.value.includes(a.id)}))),ne=e.computed(()=>({cy:"pcp-div-legend",backgroundColor:t.value.style.chart.legend.backgroundColor,color:t.value.style.chart.legend.color,fontSize:t.value.style.chart.legend.fontSize,paddingBottom:12,fontWeight:t.value.style.chart.legend.bold?"bold":""})),U=e.computed(()=>Math.max(...b.value.filter(a=>!f.value.includes(a.id)).map(a=>Math.max(...a.series.flatMap(o=>o.values.length))))),y=e.computed(()=>d.value.width/U.value),T=e.computed(()=>b.value.filter(a=>!f.value.includes(a.id))),p=e.computed(()=>{let a=[];for(let o=0;o<U.value;o+=1){const l=Math.min(...T.value.flatMap(v=>v.series.map(S=>S.values[o]||0)||0)),s=Math.max(...T.value.flatMap(v=>v.series.map(S=>S.values[o]||0)||0)),r=s===l?l/4:l,n=s===l?s*2:s,u=i.calculateNiceScale(r,n,t.value.style.chart.yAxis.scaleTicks),g=u.ticks.map((v,S)=>{const ue=u.min<0?v+Math.abs(u.min):v-Math.abs(u.min),ce=u.min<0?u.max+Math.abs(u.min):u.max-Math.abs(u.min);return{y:d.value.bottom-d.value.height*(ue/ce),x:d.value.left+y.value*o+y.value/2,value:v}});a.push({scale:u,ticks:g,name:t.value.style.chart.yAxis.labels.axisNames[o]||`Y-${o+1}`})}return a}),F=e.computed(()=>T.value.map((a,o)=>({...a,series:a.series.map((l,s)=>({...l,datapoints:l.values.map((r,n)=>{const u=p.value[n].scale.min<0?(r||0)+Math.abs(p.value[n].scale.min):(r||0)-Math.abs(p.value[n].scale.min),g=p.value[n].scale.min<0?p.value[n].scale.max+Math.abs(p.value[n].scale.min):p.value[n].scale.max-Math.abs(p.value[n].scale.min);return{name:l.name,seriesName:a.name,axisIndex:n,datapointIndex:s,seriesIndex:o,value:r||0,x:d.value.left+y.value*n+y.value/2,y:d.value.bottom-d.value.height*(u/g),comment:l.comments&&l.comments[n]||""}})}))})).map(a=>({...a,series:a.series.map(o=>{const l=i.createStraightPath(o.datapoints),s=i.createSmoothPath(o.datapoints,.12),r=i.getPathLengthFromCoordinates(t.value.style.chart.lines.smooth?`M ${s}`:`M ${l}`);return{...o,smoothPath:s,straightPath:l,pathLength:r}})})));function W({value:a,index:o,datapoint:l}){return i.applyDataLabel(t.value.style.chart.yAxis.labels.formatters[o]||null,a,i.dataLabel({p:t.value.style.chart.yAxis.labels.prefixes[o]||"",v:a,s:t.value.style.chart.yAxis.labels.suffixes[o]||"",r:t.value.style.chart.yAxis.labels.roundings[o]||0}),{datapoint:l,seriesIndex:o})}const h=e.ref(null),_=e.ref(null),z=e.ref(!1),P=e.ref("");function A({shape:a,serieName:o,serie:l,relativeIndex:s,seriesIndex:r}){_.value={serie:l,relativeIndex:s,seriesIndex:r,series:b.value,scales:p.value},z.value=!0,h.value=l.id;let n="";const u=t.value.style.chart.tooltip.customFormat;i.isFunction(u)&&i.functionReturnsString(()=>u({serie:l,seriesIndex:l.seriesIndex,series:b.value,config:t.value,scales:p.value}))?P.value=u({serie:l,seriesIndex:l.seriesIndex,series:b.value,config:t.value,scales:p.value}):(n+=`<div style="width:100%;text-align:center;border-bottom:1px solid ${t.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${o?o+" - ":""}${l.name}</div>`,p.value.map(g=>g.name).forEach((g,v)=>{n+=`
                 <div class="vue-ui-tooltip-item" style="text-align:left">
                     <span>${g}: </span>
                     <span>

package/dist/{vue-ui-parallel-coordinate-plot-DVqDX4Xb.js → vue-ui-parallel-coordinate-plot-m3xZjFsy.js}

@@ -1,15 +1,15 @@
 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-fMHmzYJu.js";
+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-b22AFna7.js";
 import { t as Je, u as Ke } from "./useResponsive-NZB-WLRF.js";
-import { _ as Ze } from "./Title-BxitYokc.js";
-import { L as et } from "./Legend-C2DZGZN5.js";
-import { _ as tt } from "./Tooltip-DTntJRyb.js";
-import { _ as at } from "./Shape-qXMEmkXY.js";
-import { u as lt, U as ot } from "./usePrinter-BEVwOH5x.js";
-import { D as st } from "./DataTable-CzvZIRDs.js";
-import nt from "./vue-ui-accordion-CVzTuENA.js";
-import ut from "./vue-ui-skeleton-DiJmBrEY.js";
-import { u as xe } from "./useNestedProp-lzTC0cjC.js";
+import { _ as Ze } from "./Title-CzxknLI3.js";
+import { L as et } from "./Legend-Cpk8DCWi.js";
+import { _ as tt } from "./Tooltip-DYVjAqo-.js";
+import { _ as at } from "./Shape-Bfeh9GpX.js";
+import { u as lt, U as ot } from "./usePrinter-C_wOlUXy.js";
+import { D as st } from "./DataTable-Bwco5wF0.js";
+import nt from "./vue-ui-accordion-H9MtAuZL.js";
+import ut from "./vue-ui-skeleton-c0TzbjC0.js";
+import { u as xe } from "./useNestedProp-6FL791Qt.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 = {
   key: 3,