vue-data-ui 3.10.1 → 3.10.3

package/dist/{vue-ui-sparkstackbar-DYz-Vson.js → vue-ui-sparkstackbar-CFGsSf1p.js}

@@ -1,24 +1,24 @@
-import { defineAsyncComponent as Q, useSlots as Pe, onMounted as Z, ref as v, toRefs as ze, watch as ee, computed as F, createElementBlock as s, openBlock as r, normalizeStyle as g, createCommentVNode as h, createVNode as te, createBlock as Oe, createElementVNode as d, toDisplayString as S, unref as c, Fragment as _, renderList as D, normalizeClass as z, withCtx as oe, renderSlot as U, normalizeProps as le, guardReactiveProps as ae } from "vue";
-import { c as re, t as Le, i as Ne, j as i, m as B, k as je, o as Ve, g as se, l as Me, d as R, X as Ue, s as ne, h as ue, a as ie, y as Re } from "./lib-CVHM9FhP.js";
+import { defineAsyncComponent as Q, useSlots as Pe, onMounted as Z, ref as v, toRefs as ze, watch as ee, computed as $, createElementBlock as s, openBlock as r, normalizeStyle as p, createCommentVNode as y, createVNode as te, createBlock as Oe, createElementVNode as d, toDisplayString as D, unref as c, Fragment as _, renderList as B, normalizeClass as z, withCtx as oe, renderSlot as U, normalizeProps as le, guardReactiveProps as ae } from "vue";
+import { c as re, t as Le, i as Ne, j as n, m as S, k as je, o as Ve, g as se, l as Me, d as R, X as Ue, s as ne, h as ue, a as ie, y as Re } from "./lib-CVHM9FhP.js";
 import { u as Ge, a as G } from "./useNestedProp-Ckf_2P_V.js";
 import { u as We, B as Ye } from "./BaseScanner-BMpwQAfz.js";
 import { u as qe } from "./useThemeCheck-D1ZYXUwG.js";
 import { u as He } from "./useChartAccessibility-9icAAmYg.js";
 import { _ as Xe } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor: "#1A1A1A", bar: { gradient: { underlayerColor: "#FFFFFF" } }, legend: { show: !1, name: { color: "#CCCCCC" }, value: { color: "#CCCCCC" }, percentage: { color: "#CCCCCC" } }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#3A3A3A" } } }, ve = { style: { backgroundColor: "#1A1A1A", bar: { gradient: { underlayerColor: "#FFFFFF" } }, legend: { name: { color: "#CCCCCC" }, value: { color: "#CCCCCC" }, percentage: { color: "#CCCCCC" } }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" } } }, pe = { style: { backgroundColor: "#FFF8E1", bar: { gradient: { underlayerColor: "#FFF8E1" } }, legend: { name: { color: "#424242" }, value: { color: "#424242" }, percentage: { color: "#424242" } }, title: { color: "#424242", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" } } }, ge = { style: { backgroundColor: "#1E1E1E", bar: { gradient: { underlayerColor: "#FFF8E1" } }, legend: { name: { color: "#BDBDBD" }, value: { color: "#BDBDBD" }, percentage: { color: "#BDBDBD" } }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" } } }, fe = { style: { backgroundColor: "#1A1A1A", bar: { gradient: { underlayerColor: "#1A1A1A" } }, legend: { name: { color: "#99AA99" }, value: { color: "#AACCAA" }, percentage: { color: "#99CC99" } }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } } } }, he = { style: { backgroundColor: "#fbfafa", bar: { gradient: { underlayerColor: "#fbfafa" } }, legend: { name: { color: "#8A9892" }, value: { color: "#A0AC94" }, percentage: { color: "#8A9892" } }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } } } }, ye = { style: { backgroundColor: "#f6f6fb", bar: { gradient: { underlayerColor: "#f6f6fb" } }, legend: { name: { color: "#50606C" }, value: { color: "#8A9892" }, percentage: { color: "#61747E" } }, title: { color: "#50606C", subtitle: { color: "#718890" } } } }, Ce = {
+const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor: "#1A1A1A", bar: { gradient: { underlayerColor: "#FFFFFF" } }, legend: { show: !1, name: { color: "#CCCCCC" }, value: { color: "#CCCCCC" }, percentage: { color: "#CCCCCC" } }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#3A3A3A" } } }, ve = { style: { backgroundColor: "#1A1A1A", bar: { gradient: { underlayerColor: "#FFFFFF" } }, legend: { name: { color: "#CCCCCC" }, value: { color: "#CCCCCC" }, percentage: { color: "#CCCCCC" } }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" } } }, ge = { style: { backgroundColor: "#FFF8E1", bar: { gradient: { underlayerColor: "#FFF8E1" } }, legend: { name: { color: "#424242" }, value: { color: "#424242" }, percentage: { color: "#424242" } }, title: { color: "#424242", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" } } }, pe = { style: { backgroundColor: "#1E1E1E", bar: { gradient: { underlayerColor: "#FFF8E1" } }, legend: { name: { color: "#BDBDBD" }, value: { color: "#BDBDBD" }, percentage: { color: "#BDBDBD" } }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" } } }, fe = { style: { backgroundColor: "#1A1A1A", bar: { gradient: { underlayerColor: "#1A1A1A" } }, legend: { name: { color: "#99AA99" }, value: { color: "#AACCAA" }, percentage: { color: "#99CC99" } }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#2A2F2A", color: "#AACCAA", borderColor: "#66CC66" } } }, he = { style: { backgroundColor: "#fbfafa", bar: { gradient: { underlayerColor: "#fbfafa" } }, legend: { name: { color: "#8A9892" }, value: { color: "#A0AC94" }, percentage: { color: "#8A9892" } }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#fbfafa", color: "#8A9892" } } }, ye = { style: { backgroundColor: "#f6f6fb", bar: { gradient: { underlayerColor: "#f6f6fb" } }, legend: { name: { color: "#50606C" }, value: { color: "#8A9892" }, percentage: { color: "#61747E" } }, title: { color: "#50606C", subtitle: { color: "#718890" } }, tooltip: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, Ce = {
   default: {},
   minimal: ce,
   minimalDark: de,
   dark: ve,
-  celebration: pe,
-  celebrationNight: ge,
+  celebration: ge,
+  celebrationNight: pe,
   hack: fe,
   zen: he,
   concrete: ye
-}, At = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, wt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  celebration: pe,
-  celebrationNight: ge,
+  celebration: ge,
+  celebrationNight: pe,
   concrete: ye,
   dark: ve,
   default: Ce,
@@ -32,7 +32,7 @@ const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor:
 }, ot = ["fill"], lt = {
   key: 0,
   "clip-path": "url(#stackPill)"
-}, at = ["x", "width", "height", "fill"], rt = ["x", "width", "height", "fill", "stroke"], st = ["x", "width", "height", "onClick", "onMouseenter", "onMouseleave"], nt = ["width", "height", "rx"], ut = ["onClick"], it = { style: { display: "flex", "flex-direction": "row", "align-items": "center", gap: "4px", "justify-content": "center" } }, ct = ["height", "width"], dt = ["id"], vt = ["stop-color"], pt = ["stop-color"], gt = ["fill"], ft = {
+}, at = ["x", "width", "height", "fill"], rt = ["x", "width", "height", "fill", "stroke"], st = ["x", "width", "height", "onClick", "onMouseenter", "onMouseleave"], nt = ["width", "height", "rx"], ut = ["onClick"], it = { style: { display: "flex", "flex-direction": "row", "align-items": "center", gap: "4px", "justify-content": "center" } }, ct = ["height", "width"], dt = ["id"], vt = ["stop-color"], gt = ["stop-color"], pt = ["fill"], ft = {
   key: 2,
   ref: "source",
   dir: "auto"
@@ -53,13 +53,13 @@ const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor:
     }
   },
   emits: ["selectDatapoint"],
-  setup(me, { expose: be, emit: ke }) {
-    const _e = Q(() => import("./PackageVersion-D6MO5wwI.js")), xe = Q(() => import("./Tooltip-B6qvABDL.js")), { vue_ui_sparkstackbar: we } = Ge(), { isThemeValid: Ae, warnInvalidTheme: Fe } = qe(), C = me, $e = Pe();
+  setup(be, { expose: me, emit: ke }) {
+    const _e = Q(() => import("./PackageVersion-P4S5Z27M.js")), Ae = Q(() => import("./Tooltip-B6qvABDL.js")), { vue_ui_sparkstackbar: xe } = Ge(), { isThemeValid: we, warnInvalidTheme: Fe } = qe(), b = be, $e = Pe();
     Z(() => {
       $e["chart-background"] && console.warn("VueUiSparkStackbar does not support the #chart-background slot.");
     });
-    const W = v(null), T = v(re()), O = v(!1), L = v(""), e = v(N()), { loading: x, FINAL_DATASET: m } = We({
-      ...ze(C),
+    const W = v(null), T = v(re()), O = v(!1), L = v(""), e = v(N()), { loading: A, FINAL_DATASET: f } = We({
+      ...ze(b),
       FINAL_CONFIG: e,
       prepareConfig: N,
       skeletonDataset: [
@@ -83,58 +83,58 @@ const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor:
     }), { svgRef: Se } = He({ config: e.value.style.title });
     function N() {
       const t = G({
-        userConfig: C.config,
-        defaultConfig: we
-      }), l = t.theme;
-      if (!l) return t;
-      if (!Ae.value(t))
+        userConfig: b.config,
+        defaultConfig: xe
+      }), o = t.theme;
+      if (!o) return t;
+      if (!we.value(t))
         return Fe(t), t;
-      const o = G({
-        userConfig: Ce[l] || C.config,
+      const l = G({
+        userConfig: Ce[o] || b.config,
         defaultConfig: t
       }), a = G({
-        userConfig: C.config,
-        defaultConfig: o
+        userConfig: b.config,
+        defaultConfig: l
       });
       return {
         ...a,
-        customPalette: a.customPalette.length ? a.customPalette : Ne[l] || i
+        customPalette: a.customPalette.length ? a.customPalette : Ne[o] || n
       };
     }
-    ee(() => C.config, (t) => {
+    ee(() => b.config, (t) => {
       e.value = N(), H();
-    }, { deep: !0 }), ee(() => m.value, (t) => {
-      b.value = m.value.map((l, o) => ({
-        ...l,
-        color: l.color ? B(l.color) : $.value[o] || i[o] || i[o % i.length]
+    }, { deep: !0 }), ee(() => f.value, (t) => {
+      m.value = f.value.map((o, l) => ({
+        ...o,
+        color: o.color ? S(o.color) : x.value[l] || n[l] || n[l % n.length]
       })), Y();
     }, { deep: !0 });
-    const $ = F(() => je(e.value.customPalette)), b = v(m.value.map((t, l) => ({
+    const x = $(() => je(e.value.customPalette)), m = v(f.value.map((t, o) => ({
       ...t,
       value: e.value.style.animation.show ? 0 : t.value || 0,
-      color: t.color ? B(t.color) : $.value[l] || i[l] || i[l % i.length]
+      color: t.color ? S(t.color) : x.value[o] || n[o] || n[o % n.length]
     }))), k = v(!0);
     function Y() {
       if (!e.value.style.animation.show) {
         k.value = !1;
         return;
       }
-      const t = e.value.style.animation.animationFrames, l = m.value.map((n) => n.value || 0), o = l.map((n) => n / t), a = l.reduce((n, u) => n + u, 0);
-      let y = 0;
-      k.value = !0, b.value = m.value.map((n, u) => ({
-        ...n,
+      const t = e.value.style.animation.animationFrames, o = f.value.map((u) => u.value || 0), l = o.map((u) => u / t), a = o.reduce((u, i) => u + i, 0);
+      let C = 0;
+      k.value = !0, m.value = f.value.map((u, i) => ({
+        ...u,
         value: 0,
-        color: n.color ? B(n.color) : $.value[u] || i[u] || i[u % i.length]
+        color: u.color ? S(u.color) : x.value[i] || n[i] || n[i % n.length]
       }));
       function P() {
-        y += a / t, y < a ? (b.value = b.value.map((n, u) => ({
-          ...n,
-          value: Math.min(n.value + o[u], l[u]),
-          color: n.color ? B(n.color) : $.value[u] || i[u] || i[u % i.length]
-        })), requestAnimationFrame(P)) : (k.value = !1, b.value = m.value.map((n, u) => ({
-          ...n,
-          value: l[u],
-          color: n.color ? B(n.color) : $.value[u] || i[u] || i[u % i.length],
+        C += a / t, C < a ? (m.value = m.value.map((u, i) => ({
+          ...u,
+          value: Math.min(u.value + l[i], o[i]),
+          color: u.color ? S(u.color) : x.value[i] || n[i] || n[i % n.length]
+        })), requestAnimationFrame(P)) : (k.value = !1, m.value = f.value.map((u, i) => ({
+          ...u,
+          value: o[i],
+          color: u.color ? S(u.color) : x.value[i] || n[i] || n[i % n.length],
           id: re()
         })));
       }
@@ -143,87 +143,88 @@ const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor:
     Z(() => {
       H();
     });
-    const q = F(() => e.value.debug);
+    const q = $(() => e.value.debug);
     function H() {
-      Ve(C.dataset) ? se({
+      Ve(b.dataset) ? se({
         componentName: "VueUiSparkStackbar",
         type: "dataset",
         debug: q.value
-      }) : C.dataset.forEach((t, l) => {
+      }) : b.dataset.forEach((t, o) => {
         Me({
           datasetObject: t,
           requiredAttributes: ["name", "value"]
-        }).forEach((o) => {
+        }).forEach((l) => {
           se({
             componentName: "VueUiSparkStackbar",
             type: "datasetSerieAttribute",
-            property: o,
-            index: l,
+            property: l,
+            index: o,
             debug: q.value
           });
         });
       }), Y();
     }
-    const f = v({
+    const h = v({
       width: 500,
       height: 16
-    }), p = v([]), X = F(() => m.value.map((t) => t.value || 0).filter((t, l) => !p.value.includes(l)).reduce((t, l) => t + l, 0)), w = F(() => b.value.map((t, l) => {
-      const o = t.value || 0, a = o / X.value, y = isNaN(a) ? 0 : a, P = y * f.value.width;
+    }), g = v([]), X = $(() => f.value.map((t) => t.value || 0).filter((t, o) => !g.value.includes(o)).reduce((t, o) => t + o, 0)), w = $(() => m.value.map((t, o) => {
+      const l = t.value || 0, a = l / X.value, C = isNaN(a) ? 0 : a, P = C * h.value.width;
       return {
         ...t,
-        value: o,
-        proportion: y,
+        color: S(f.value[o]?.color ? f.value[o]?.color : x.value[o] || n[o] || n[o % n.length]),
+        value: l,
+        proportion: C,
         width: P,
-        seriesIndex: l,
+        seriesIndex: o,
         proportionLabel: R({
-          v: y * 100,
+          v: C * 100,
           s: "%",
           r: e.value.style.legend.percentage.rounding
         })
       };
-    })), j = F(() => w.value.filter((t, l) => !p.value.includes(l)));
+    })), j = $(() => w.value.filter((t, o) => !g.value.includes(o)));
     function V(t) {
-      p.value.includes(t) ? p.value = p.value.filter((l) => l !== t) : p.value.length < b.value.length - 1 && p.value.push(t);
+      g.value.includes(t) ? g.value = g.value.filter((o) => o !== t) : g.value.length < m.value.length - 1 && g.value.push(t);
     }
     function J(t) {
       if (!w.value.length)
         return e.value.debug && console.warn("VueUiSparkStackbar - There are no series to show."), null;
-      const l = w.value.find((o) => o.name === t);
-      return l || (e.value.debug && console.warn(`VueUiSparkStackbar - Series name not found "${t}"`), null);
+      const o = w.value.find((l) => l.name === t);
+      return o || (e.value.debug && console.warn(`VueUiSparkStackbar - Series name not found "${t}"`), null);
     }
     function De(t) {
-      const l = J(t);
-      l !== null && p.value.includes(l.id) && V(l.seriesIndex);
+      const o = J(t);
+      o !== null && g.value.includes(o.id) && V(o.seriesIndex);
     }
     function Be(t) {
-      const l = J(t);
-      l !== null && (p.value.includes(l.id) || V(l.seriesIndex));
+      const o = J(t);
+      o !== null && (g.value.includes(o.id) || V(o.seriesIndex));
     }
-    const E = F(() => {
+    const E = $(() => {
       let t = 0;
-      const l = [];
-      for (let o = 0; o < j.value.length; o += 1)
-        l.push({
-          ...j.value[o],
+      const o = [];
+      for (let l = 0; l < j.value.length; l += 1)
+        o.push({
+          ...j.value[l],
           start: t
-        }), t += j.value[o].width;
-      return l;
+        }), t += j.value[l].width;
+      return o;
     }), Te = ke;
-    function K(t, l, o = !1) {
-      Te("selectDatapoint", { datapoint: t, index: l }), e.value.events.datapointClick && !o && e.value.events.datapointClick({ datapoint: t, seriesIndex: t.seriesIndex });
+    function K(t, o, l = !1) {
+      Te("selectDatapoint", { datapoint: t, index: o }), e.value.events.datapointClick && !l && e.value.events.datapointClick({ datapoint: t, seriesIndex: t.seriesIndex });
     }
-    const M = v(null), I = v(!1), A = v(null);
-    function Ee({ datapoint: t, seriesIndex: l }) {
-      O.value = !1, A.value = null, e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: t.seriesIndex });
+    const M = v(null), I = v(!1), F = v(null);
+    function Ee({ datapoint: t, seriesIndex: o }) {
+      O.value = !1, F.value = null, e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: t.seriesIndex });
     }
-    function Ie({ datapoint: t, seriesIndex: l }) {
+    function Ie({ datapoint: t, seriesIndex: o }) {
       if (e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: t.seriesIndex }), !e.value.style.tooltip.show)
         return;
-      M.value = { datapoint: t, seriesIndex: l, config: e.value, series: w.value }, O.value = !0, A.value = l;
-      const o = e.value.style.tooltip.customFormat;
-      if (Re(o))
+      M.value = { datapoint: t, seriesIndex: o, config: e.value, series: w.value }, O.value = !0, F.value = o;
+      const l = e.value.style.tooltip.customFormat;
+      if (Re(l))
         try {
-          const a = o({
+          const a = l({
             seriesIndex: t.seriesIndex,
             datapoint: t,
             series: w.value,
@@ -246,59 +247,59 @@ const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor:
           }),
           {
             datapoint: t,
-            seriesIndex: l
+            seriesIndex: o
           }
         )})</span>`, L.value = `<div>${a}</div>`;
       }
     }
-    return be({
+    return me({
       hideSeries: Be,
       showSeries: De
-    }), (t, l) => (r(), s("div", {
+    }), (t, o) => (r(), s("div", {
       class: "vue-data-ui-component vue-ui-spark-stackbar",
       ref_key: "sparkstackbarChart",
       ref: W,
-      style: g(`width:100%; background:${e.value.style.backgroundColor}`)
+      style: p(`width:100%; background:${e.value.style.backgroundColor}`)
     }, [
       e.value.style.title.text ? (r(), s("div", {
         key: 0,
-        style: g(`width:calc(100% - 12px);background:transparent;margin:0 auto;margin:${e.value.style.title.margin};padding: 0 6px;text-align:${e.value.style.title.textAlign}`)
+        style: p(`width:calc(100% - 12px);background:transparent;margin:0 auto;margin:${e.value.style.title.margin};padding: 0 6px;text-align:${e.value.style.title.textAlign}`)
       }, [
         d("div", {
           class: "atom-title",
-          style: g(`font-size:${e.value.style.title.fontSize}px;color:${e.value.style.title.color};font-weight:${e.value.style.title.bold ? "bold" : "normal"}`)
-        }, S(e.value.style.title.text), 5),
+          style: p(`font-size:${e.value.style.title.fontSize}px;color:${e.value.style.title.color};font-weight:${e.value.style.title.bold ? "bold" : "normal"}`)
+        }, D(e.value.style.title.text), 5),
         e.value.style.title.subtitle.text ? (r(), s("div", {
           key: 0,
           class: "atom-subtitle",
-          style: g(`font-size:${e.value.style.title.subtitle.fontSize}px;color:${e.value.style.title.subtitle.color};font-weight:${e.value.style.title.subtitle.bold ? "bold" : "normal"}`)
-        }, S(e.value.style.title.subtitle.text), 5)) : h("", !0)
-      ], 4)) : h("", !0),
+          style: p(`font-size:${e.value.style.title.subtitle.fontSize}px;color:${e.value.style.title.subtitle.color};font-weight:${e.value.style.title.subtitle.bold ? "bold" : "normal"}`)
+        }, D(e.value.style.title.subtitle.text), 5)) : y("", !0)
+      ], 4)) : y("", !0),
       (r(), s("svg", {
         ref_key: "svgRef",
         ref: Se,
         xmlns: c(Ue),
         width: "100%",
-        viewBox: `0 0 ${f.value.width} ${f.value.height}`
+        viewBox: `0 0 ${h.value.width} ${h.value.height}`
       }, [
         te(c(_e)),
         d("defs", null, [
-          (r(!0), s(_, null, D(E.value, (o, a) => (r(), s("linearGradient", {
+          (r(!0), s(_, null, B(E.value, (l, a) => (r(), s("linearGradient", {
             key: `stack_gradient_${a}`,
             gradientTransform: "rotate(90)",
             id: `stack_gradient_${a}_${T.value}`
           }, [
             d("stop", {
               offset: "0%",
-              "stop-color": o.color
+              "stop-color": l.color
             }, null, 8, Qe),
             d("stop", {
               offset: "50%",
-              "stop-color": c(ne)(c(ue)(o.color, 0.05), 100 - e.value.style.bar.gradient.intensity)
+              "stop-color": c(ne)(c(ue)(l.color, 0.05), 100 - e.value.style.bar.gradient.intensity)
             }, null, 8, Ze),
             d("stop", {
               offset: "100%",
-              "stop-color": o.color
+              "stop-color": l.color
             }, null, 8, et)
           ], 8, Ke))), 128)),
           d("clipPath", tt, [
@@ -314,67 +315,67 @@ const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor:
           ])
         ]),
         X.value > 0 ? (r(), s("g", lt, [
-          (r(!0), s(_, null, D(E.value, (o, a) => (r(), s("rect", {
+          (r(!0), s(_, null, B(E.value, (l, a) => (r(), s("rect", {
             key: `stack_underlayer_${a}`,
-            x: o.start,
+            x: l.start,
             y: 0,
-            width: o.width,
-            height: f.value.height,
+            width: l.width,
+            height: h.value.height,
             fill: e.value.style.bar.gradient.underlayerColor,
-            class: z({ animated: !k.value && !c(x) }),
-            style: g({
-              opacity: A.value !== null && e.value.style.tooltip.show ? A.value === a ? 1 : 0.5 : 1
+            class: z({ animated: !k.value && !c(A) }),
+            style: p({
+              opacity: F.value !== null && e.value.style.tooltip.show ? F.value === a ? 1 : 0.5 : 1
             })
           }, null, 14, at))), 128)),
-          (r(!0), s(_, null, D(E.value, (o, a) => (r(), s("rect", {
+          (r(!0), s(_, null, B(E.value, (l, a) => (r(), s("rect", {
             key: `stack_${a}`,
-            x: o.start,
+            x: l.start,
             y: 0,
-            width: o.width,
-            height: f.value.height,
-            fill: e.value.style.bar.gradient.show ? `url(#stack_gradient_${a}_${T.value})` : o.color,
+            width: l.width,
+            height: h.value.height,
+            fill: e.value.style.bar.gradient.show ? `url(#stack_gradient_${a}_${T.value})` : l.color,
             stroke: e.value.style.backgroundColor,
             "stroke-linecap": "round",
-            class: z({ animated: !k.value && !c(x) }),
-            style: g({
-              opacity: A.value !== null && e.value.style.tooltip.show ? A.value === a ? 1 : 0.5 : 1
+            class: z({ animated: !k.value && !c(A) }),
+            style: p({
+              opacity: F.value !== null && e.value.style.tooltip.show ? F.value === a ? 1 : 0.5 : 1
             })
           }, null, 14, rt))), 128)),
-          (r(!0), s(_, null, D(E.value, (o, a) => (r(), s("rect", {
+          (r(!0), s(_, null, B(E.value, (l, a) => (r(), s("rect", {
             key: `stack_trap_${a}`,
-            x: o.start,
+            x: l.start,
             y: 0,
-            width: o.width,
-            height: f.value.height,
+            width: l.width,
+            height: h.value.height,
             fill: "transparent",
             stroke: "none",
-            class: z({ animated: !k.value && !c(x) }),
-            onClick: () => K(o, a),
-            onMouseenter: () => Ie({ datapoint: o, seriesIndex: a }),
-            onMouseleave: (y) => Ee({ datapoint: o, seriesIndex: a })
+            class: z({ animated: !k.value && !c(A) }),
+            onClick: () => K(l, a),
+            onMouseenter: () => Ie({ datapoint: l, seriesIndex: a }),
+            onMouseleave: (C) => Ee({ datapoint: l, seriesIndex: a })
           }, null, 42, st))), 128))
         ])) : (r(), s("rect", {
           key: 1,
           x: 2,
           y: 1,
-          width: f.value.width - 4,
-          height: f.value.height - 2,
+          width: h.value.width - 4,
+          height: h.value.height - 2,
           stroke: "#CCCCCC",
           "stroke-width": "2",
           fill: "transparent",
-          rx: (f.value.height - 4) / 2
+          rx: (h.value.height - 4) / 2
         }, null, 8, nt))
       ], 8, Je)),
       e.value.style.legend.show ? (r(), s("div", {
         key: 1,
-        style: g(`background:transparent;margin:0 auto;margin:${e.value.style.legend.margin};justify-content:${e.value.style.legend.textAlign === "left" ? "flex-start" : e.value.style.legend.textAlign === "right" ? "flex-end" : "center"}`),
+        style: p(`background:transparent;margin:0 auto;margin:${e.value.style.legend.margin};justify-content:${e.value.style.legend.textAlign === "left" ? "flex-start" : e.value.style.legend.textAlign === "right" ? "flex-end" : "center"}`),
         class: "vue-ui-sparkstackbar-legend"
       }, [
-        (r(!0), s(_, null, D(w.value, (o, a) => (r(), s("div", {
-          style: g(`font-size:${e.value.style.legend.fontSize}px;`),
-          class: z({ "vue-ui-sparkstackbar-legend-item": !0, "vue-ui-sparkstackbar-legend-item-unselected": p.value.includes(a) }),
-          onClick: (y) => {
-            V(a), K(o, a, !0);
+        (r(!0), s(_, null, B(w.value, (l, a) => (r(), s("div", {
+          style: p(`font-size:${e.value.style.legend.fontSize}px;`),
+          class: z({ "vue-ui-sparkstackbar-legend-item": !0, "vue-ui-sparkstackbar-legend-item-unselected": g.value.includes(a) }),
+          onClick: (C) => {
+            V(a), K(l, a, !0);
           }
         }, [
           d("div", it, [
@@ -389,50 +390,50 @@ const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor:
                 }, [
                   d("stop", {
                     offset: "0%",
-                    "stop-color": c(x) ? "#FFFFFF" : c(ne)(c(ue)(o.color, 0.05), 100 - e.value.style.bar.gradient.intensity)
+                    "stop-color": c(A) ? "#FFFFFF" : c(ne)(c(ue)(l.color, 0.05), 100 - e.value.style.bar.gradient.intensity)
                   }, null, 8, vt),
                   d("stop", {
                     offset: "100%",
-                    "stop-color": o.color
-                  }, null, 8, pt)
+                    "stop-color": l.color
+                  }, null, 8, gt)
                 ], 8, dt)
               ]),
               d("circle", {
                 cx: 5,
                 cy: 5,
                 r: 5,
-                fill: e.value.style.bar.gradient.show ? `url(#legend_grad_${a}-${T.value})` : o.color
-              }, null, 8, gt)
+                fill: e.value.style.bar.gradient.show ? `url(#legend_grad_${a}-${T.value})` : l.color
+              }, null, 8, pt)
             ], 8, ct)),
-            c(x) ? h("", !0) : (r(), s(_, { key: 0 }, [
+            c(A) ? y("", !0) : (r(), s(_, { key: 0 }, [
               d("span", {
-                style: g(`color:${e.value.style.legend.name.color}; font-weight:${e.value.style.legend.name.bold ? "bold" : "normal"}`)
-              }, S(o.name), 5),
-              k.value ? h("", !0) : (r(), s(_, { key: 0 }, [
+                style: p(`color:${e.value.style.legend.name.color}; font-weight:${e.value.style.legend.name.bold ? "bold" : "normal"}`)
+              }, D(l.name), 5),
+              k.value ? y("", !0) : (r(), s(_, { key: 0 }, [
                 e.value.style.legend.percentage.show ? (r(), s("span", {
                   key: 0,
-                  style: g(`font-weight:${e.value.style.legend.percentage.bold ? "bold" : "normal"};color:${e.value.style.legend.percentage.color}`)
-                }, S(p.value.includes(a) ? " - " : o.proportionLabel), 5)) : h("", !0),
+                  style: p(`font-weight:${e.value.style.legend.percentage.bold ? "bold" : "normal"};color:${e.value.style.legend.percentage.color}`)
+                }, D(g.value.includes(a) ? " - " : l.proportionLabel), 5)) : y("", !0),
                 e.value.style.legend.value.show ? (r(), s("span", {
                   key: 1,
-                  style: g(`font-weight:${e.value.style.legend.value.bold ? "bold" : "normal"};color:${e.value.style.legend.value.color}`)
-                }, " (" + S(c(ie)(
+                  style: p(`font-weight:${e.value.style.legend.value.bold ? "bold" : "normal"};color:${e.value.style.legend.value.color}`)
+                }, " (" + D(c(ie)(
                   e.value.style.legend.value.formatter,
-                  o.value,
+                  l.value,
                   c(R)({
                     p: e.value.style.legend.value.prefix,
-                    v: o.value,
+                    v: l.value,
                     s: e.value.style.legend.value.suffix,
                     r: e.value.style.legend.value.rounding
                   }),
-                  { datapoint: o, seriesIndex: a }
-                )) + ") ", 5)) : h("", !0)
+                  { datapoint: l, seriesIndex: a }
+                )) + ") ", 5)) : y("", !0)
               ], 64))
             ], 64))
           ])
         ], 14, ut))), 256))
-      ], 4)) : h("", !0),
-      te(c(xe), {
+      ], 4)) : y("", !0),
+      te(c(Ae), {
         teleportTo: e.value.style.tooltip.teleportTo,
         show: O.value && e.value.style.tooltip.show,
         parent: W.value,
@@ -463,16 +464,16 @@ const ce = { style: { legend: { show: !1 } } }, de = { style: { backgroundColor:
       }, 8, ["teleportTo", "show", "parent", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "content", "isCustom", "offsetY", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
       t.$slots.source ? (r(), s("div", ft, [
         U(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : h("", !0),
-      c(x) ? (r(), Oe(Ye, { key: 3 })) : h("", !0)
+      ], 512)) : y("", !0),
+      c(A) ? (r(), Oe(Ye, { key: 3 })) : y("", !0)
     ], 4));
   }
-}, yt = /* @__PURE__ */ Xe(ht, [["__scopeId", "data-v-aab967dc"]]), Ft = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, yt = /* @__PURE__ */ Xe(ht, [["__scopeId", "data-v-9f20728e"]]), Ft = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   default: yt
 }, Symbol.toStringTag, { value: "Module" }));
 export {
-  At as a,
+  wt as a,
   Ft as b,
   yt as v
 };

package/dist/{vue-ui-stackbar-C_Tl2URC.js → vue-ui-stackbar-CbEpDijK.js}

@@ -62,7 +62,7 @@ const xa = { userOptions: { show: !1 }, style: { chart: { legend: { show: !1 },
   },
   emits: ["selectDatapoint", "selectLegend", "selectTimeLabel", "selectX"],
   setup(Xe, { expose: Ma, emit: Ta }) {
-    const $a = j(() => import("./Tooltip-B6qvABDL.js")), Fa = j(() => import("./BaseIcon-4uOct8re.js")), Da = j(() => import("./vue-ui-accordion-DFKaB_05.js")), Na = j(() => import("./DataTable-DyoDzNNY.js")), Pa = j(() => import("./PenAndPaper-LTuSTmWE.js")), Oa = j(() => import("./UserOptions-CX7Xsusk.js")), Ea = j(() => import("./PackageVersion-D6MO5wwI.js")), Ra = j(() => import("./BaseDraggableDialog-BQYfVNu8.js")), { vue_ui_stackbar: Ia } = Ul(), { isThemeValid: Ba, warnInvalidTheme: Va } = uo(), Ua = El(), C = Xe, be = Ta, ye = b({
+    const $a = j(() => import("./Tooltip-B6qvABDL.js")), Fa = j(() => import("./BaseIcon-4uOct8re.js")), Da = j(() => import("./vue-ui-accordion-DFKaB_05.js")), Na = j(() => import("./DataTable-DyoDzNNY.js")), Pa = j(() => import("./PenAndPaper-LTuSTmWE.js")), Oa = j(() => import("./UserOptions-CX7Xsusk.js")), Ea = j(() => import("./PackageVersion-P4S5Z27M.js")), Ra = j(() => import("./BaseDraggableDialog-BQYfVNu8.js")), { vue_ui_stackbar: Ia } = Ul(), { isThemeValid: Ba, warnInvalidTheme: Va } = uo(), Ua = El(), C = Xe, be = Ta, ye = b({
       get() {
         return !!C.dataset && C.dataset.length;
       },

package/dist/{vue-ui-stackline-CXpElu5C.js → vue-ui-stackline-sSqBRjIV.js}

@@ -40,7 +40,7 @@ const Pa = { userOptions: { show: !1 }, style: { chart: { legend: { show: !1 },
 }, Symbol.toStringTag, { value: "Module" })), _o = ["id"], Do = ["id"], zo = ["xmlns", "viewBox"], Eo = { key: 0 }, Io = ["x", "y", "width", "height"], Po = { key: 1 }, Oo = ["id"], Ro = ["stop-color"], Vo = ["stop-color"], Bo = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Yo = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Uo = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ho = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Wo = ["x", "y", "font-size", "fill", "font-weight"], Xo = ["transform", "font-size", "fill", "font-weight"], qo = ["x", "y", "width", "height", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin", "stroke-dasharray"], Go = ["d", "fill", "opacity"], jo = ["d", "stroke", "stroke-width"], Jo = ["x1", "x2", "y1", "y2", "stroke"], Zo = ["x", "y", "font-size", "font-weight", "fill"], Qo = { key: 0 }, Ko = { key: 1 }, es = ["text-anchor", "font-size", "font-weight", "fill", "transform", "onClick"], ts = ["text-anchor", "font-size", "fill", "transform", "innerHTML", "onClick"], as = ["x", "y", "height", "width", "fill"], ls = { key: 0 }, os = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], ss = { key: 0 }, rs = ["x", "y", "font-size", "fill", "font-weight"], ns = ["x", "y", "font-size", "font-weight", "fill"], is = ["data-start", "data-end"], us = {
   key: 4,
   class: "vue-data-ui-watermark"
-}, cs = ["onClick"], hs = ["id"], vs = ["innerHTML"], ds = ["innerHTML"], ms = {
+}, cs = ["onClick"], hs = ["innerHTML"], vs = ["innerHTML"], ds = ["id"], ms = {
   __name: "vue-ui-stackline",
   props: {
     config: {
@@ -62,7 +62,7 @@ const Pa = { userOptions: { show: !1 }, style: { chart: { legend: { show: !1 },
   },
   emits: ["selectDatapoint", "selectLegend", "selectTimeLabel", "selectX"],
   setup(nt, { expose: Xa, emit: qa }) {
-    const Ga = ye(() => import("./Tooltip-B6qvABDL.js")), ja = ye(() => import("./BaseIcon-4uOct8re.js")), Ja = ye(() => import("./vue-ui-accordion-DFKaB_05.js")), Za = ye(() => import("./DataTable-DyoDzNNY.js")), Qa = ye(() => import("./PenAndPaper-LTuSTmWE.js")), Ka = ye(() => import("./UserOptions-CX7Xsusk.js")), el = ye(() => import("./PackageVersion-D6MO5wwI.js")), tl = ye(() => import("./BaseDraggableDialog-BQYfVNu8.js")), { vue_ui_stackline: al } = fo(), { isThemeValid: ll, warnInvalidTheme: ol } = Ao(), zt = Xl(), j = nt, Ne = qa, Fe = m({
+    const Ga = ye(() => import("./Tooltip-B6qvABDL.js")), ja = ye(() => import("./BaseIcon-4uOct8re.js")), Ja = ye(() => import("./vue-ui-accordion-DFKaB_05.js")), Za = ye(() => import("./DataTable-DyoDzNNY.js")), Qa = ye(() => import("./PenAndPaper-LTuSTmWE.js")), Ka = ye(() => import("./UserOptions-CX7Xsusk.js")), el = ye(() => import("./PackageVersion-P4S5Z27M.js")), tl = ye(() => import("./BaseDraggableDialog-BQYfVNu8.js")), { vue_ui_stackline: al } = fo(), { isThemeValid: ll, warnInvalidTheme: ol } = Ao(), zt = Xl(), j = nt, Ne = qa, Fe = m({
       get() {
         return !!j.dataset && j.dataset.length;
       },
@@ -1798,9 +1798,6 @@ const Pa = { userOptions: { show: !1 }, style: { chart: { legend: { show: !1 },
           }, void 0, !0)
         ], 512)
       ], 8, ["to"])) : A("", !0),
-      ue("div", {
-        id: `legend-bottom-${Q.value}`
-      }, null, 8, hs),
       Fe.value && e.value.userOptions.buttons.table ? (i(), ie(Ql(Ve.value.component), lt({ key: 6 }, Ve.value.props, {
         ref_key: "tableUnit",
         ref: ze,
@@ -1817,7 +1814,7 @@ const Pa = { userOptions: { show: !1 }, style: { chart: { legend: { show: !1 },
             onClose: pa
           }, {
             th: D(({ th: a }) => [
-              ue("div", { innerHTML: a }, null, 8, vs)
+              ue("div", { innerHTML: a }, null, 8, hs)
             ]),
             td: D(({ td: a }) => [
               Na(de(isNaN(Number(a)) ? a : M(Ce)({
@@ -1913,10 +1910,13 @@ const Pa = { userOptions: { show: !1 }, style: { chart: { legend: { show: !1 },
         slotMap: D(({ width: a, height: o, unitW: s }) => [
           ue("g", {
             innerHTML: Yl({ minimapH: o, unitW: s })
-          }, null, 8, ds)
+          }, null, 8, vs)
         ]),
         _: 3
       }, 8, ["allMinimaps", "background", "borderColor", "customFormat", "enableRangeHandles", "enableSelectionDrag", "end", "focusOnDrag", "focusRangeRatio", "fontSize", "immediate", "inputColor", "isPreview", "labelLeft", "labelRight", "max", "minimap", "minimapCompact", "minimapFrameColor", "minimapIndicatorColor", "minimapSelectedColor", "minimapSelectedColorOpacity", "minimapSelectedIndex", "preciseLabels", "refreshEndPoint", "refreshStartPoint", "selectColor", "selectedSeries", "start", "textColor", "timeLabels", "usePreciseLabels", "valueEnd", "valueStart", "verticalHandles"])) : A("", !0),
+      ue("div", {
+        id: `legend-bottom-${Q.value}`
+      }, null, 8, ds),
       He(M(Ga), {
         teleportTo: e.value.style.chart.tooltip.teleportTo,
         show: q.value.showTooltip && Et.value,
@@ -1957,7 +1957,7 @@ const Pa = { userOptions: { show: !1 }, style: { chart: { legend: { show: !1 },
       M(he) ? (i(), ie(xo, { key: 9 })) : A("", !0)
     ], 46, _o));
   }
-}, gs = /* @__PURE__ */ Fo(ms, [["__scopeId", "data-v-aa775689"]]), Es = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, gs = /* @__PURE__ */ Fo(ms, [["__scopeId", "data-v-ab0b274c"]]), Es = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   default: gs
 }, Symbol.toStringTag, { value: "Module" }));