vue-data-ui 3.16.5 → 3.17.0

package/dist/{vue-ui-sparkstackbar-RU8zQLfe.js → vue-ui-sparkstackbar-bqKzIKSg.js}

@@ -1,21 +1,21 @@
-import { defineAsyncComponent as ge, useSlots as Ye, onMounted as pe, ref as d, computed as C, toRefs as Ge, watch as he, openBlock as r, createElementBlock as i, normalizeStyle as b, createElementVNode as f, toDisplayString as K, createBlock as Z, createCommentVNode as m, unref as g, createVNode as ye, Fragment as L, renderList as V, normalizeClass as H, renderSlot as R, normalizeProps as ee, guardReactiveProps as te, withCtx as me } from "vue";
-import { j as be, t as ke, m as We, p as c, s as N, n as qe, o as Xe, q as _e, r as Je, l as Y, k as le, X as Qe, u as we, v as xe, T as Ze } from "./lib-DBptbyyI.js";
-import { u as et } from "./useConfig-CpJA0VZa.js";
+import { defineAsyncComponent as ge, useSlots as Ye, onMounted as he, ref as d, computed as C, toRefs as Ge, watch as ye, openBlock as r, createElementBlock as i, normalizeStyle as b, createElementVNode as f, toDisplayString as K, createBlock as te, createCommentVNode as m, unref as p, createVNode as me, Fragment as L, renderList as R, normalizeClass as Y, renderSlot as N, normalizeProps as G, guardReactiveProps as W, withCtx as le } from "vue";
+import { j as be, t as ke, m as We, p as c, s as z, n as qe, o as Xe, q as we, r as Je, l as q, k as oe, X as Qe, u as _e, v as xe, T as Ze } from "./lib-DBptbyyI.js";
+import { u as et } from "./useConfig-ChRble71.js";
 import { u as tt, B as lt } from "./BaseScanner-BhhkKVoj.js";
-import { u as oe } from "./useNestedProp-Bf5XFbs8.js";
+import { u as ae } from "./useNestedProp-Bf5XFbs8.js";
 import { u as ot } from "./useThemeCheck-D1ZYXUwG.js";
 import { u as at } from "./useChartAccessibility-9icAAmYg.js";
 import st from "./vue_ui_sparkstackbar-BSexvOuM.js";
 import { B as nt } from "./BaseLegendToggle-BQVIawmA.js";
 import { A as rt } from "./A11yDataTable-KcVAX2cP.js";
 import { _ as ut } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "viewBox", "aria-describedby"], dt = ["id"], ft = ["stop-color"], gt = ["stop-color"], pt = ["stop-color"], ht = {
+const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "viewBox", "aria-describedby"], dt = ["id"], ft = ["stop-color"], pt = ["stop-color"], gt = ["stop-color"], ht = {
   id: "stackPill",
   clipPathUnits: "objectBoundingBox"
 }, yt = ["fill"], mt = {
   key: 0,
   "clip-path": "url(#stackPill)"
-}, bt = ["x", "width", "height", "fill"], kt = ["x", "width", "height", "fill", "stroke"], _t = ["x", "width", "height", "onClick", "onMouseenter", "onMouseleave"], wt = ["width", "height", "rx"], xt = {
+}, bt = ["x", "width", "height", "fill"], kt = ["x", "width", "height", "fill", "stroke"], wt = ["x", "width", "height", "onClick", "onMouseenter", "onMouseleave"], _t = ["width", "height", "rx"], xt = {
   key: 0,
   style: { position: "absolute", top: "100%", left: "0", width: "100%" },
   "data-dom-to-png-ignore": "",
@@ -42,11 +42,11 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
   },
   emits: ["selectDatapoint"],
   setup(Ce, { expose: $e, emit: Se }) {
-    const Ae = ge(() => import("./PackageVersion-CvtT2-UH.js")), Ie = ge(() => import("./Tooltip-Bf-kM3_A.js")), { vue_ui_sparkstackbar: Fe } = et(), { isThemeValid: Te, warnInvalidTheme: Pe } = ot(), $ = Ce, De = Ye();
-    pe(() => {
+    const Ae = ge(() => import("./PackageVersion-B3kmPxTR.js")), Ie = ge(() => import("./Tooltip-C8KGyqQk.js")), { vue_ui_sparkstackbar: Fe } = et(), { isThemeValid: Te, warnInvalidTheme: Pe } = ot(), $ = Ce, De = Ye();
+    he(() => {
       De["chart-background"] && console.warn("VueUiSparkStackbar does not support the #chart-background slot.");
     });
-    const ae = d(null), S = d(be()), A = d(!1), G = d(""), W = d(null), z = d(!1), k = d(null), se = d({ x: 0, y: 0 }), I = d("pointer"), q = d(!1), _ = d(null), Le = d([]), t = d(X()), ne = C(() => t.value.useCursorPointer), Be = C(() => ke({
+    const se = d(null), S = d(be()), A = d(!1), X = d(""), U = d(null), M = d(!1), k = d(null), ne = d({ x: 0, y: 0 }), I = d("pointer"), J = d(!1), w = d(null), Le = d([]), t = d(Q()), re = C(() => t.value.useCursorPointer), Be = C(() => ke({
       defaultConfig: {
         style: {
           backgroundColor: "#99999930",
@@ -61,7 +61,7 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
     })), { loading: F, FINAL_DATASET: x } = tt({
       ...Ge($),
       FINAL_CONFIG: t,
-      prepareConfig: X,
+      prepareConfig: Q,
       skeletonDataset: $.config?.skeletonDataset ?? [
         { name: "_", value: 8, color: "#808080" },
         { name: "_", value: 5, color: "#ADADAD" },
@@ -71,19 +71,19 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
         defaultConfig: t.value,
         userConfig: Be.value
       })
-    }), { svgRef: M } = at({ config: t.value.style.title });
-    function X() {
-      const e = oe({
+    }), { svgRef: V } = at({ config: t.value.style.title });
+    function Q() {
+      const e = ae({
         userConfig: $.config,
         defaultConfig: Fe
       }), l = e.theme;
       if (!l) return e;
       if (!Te.value(e))
         return Pe(e), e;
-      const o = oe({
+      const o = ae({
         userConfig: st[l] || $.config,
         defaultConfig: e
-      }), a = oe({
+      }), a = ae({
         userConfig: $.config,
         defaultConfig: o
       });
@@ -92,20 +92,20 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
         customPalette: a.customPalette.length ? a.customPalette : We[l] || c
       };
     }
-    he(() => $.config, (e) => {
-      t.value = X(), ie();
-    }, { deep: !0 }), he(() => x.value, (e) => {
+    ye(() => $.config, (e) => {
+      t.value = Q(), ce();
+    }, { deep: !0 }), ye(() => x.value, (e) => {
       T.value = x.value.map((l, o) => ({
         ...l,
-        color: l.color ? N(l.color) : B.value[o] || c[o] || c[o % c.length]
-      })), re();
+        color: l.color ? z(l.color) : B.value[o] || c[o] || c[o % c.length]
+      })), ue();
     }, { deep: !0 });
     const B = C(() => qe(t.value.customPalette)), T = d(x.value.map((e, l) => ({
       ...e,
       value: t.value.style.animation.show ? 0 : e.value || 0,
-      color: e.color ? N(e.color) : B.value[l] || c[l] || c[l % c.length]
+      color: e.color ? z(e.color) : B.value[l] || c[l] || c[l % c.length]
     }))), P = d(!0);
-    function re() {
+    function ue() {
       if (!t.value.style.animation.show) {
         P.value = !1;
         return;
@@ -115,107 +115,107 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
       P.value = !0, T.value = x.value.map((u, s) => ({
         ...u,
         value: 0,
-        color: u.color ? N(u.color) : B.value[s] || c[s] || c[s % c.length]
+        color: u.color ? z(u.color) : B.value[s] || c[s] || c[s % c.length]
       }));
-      function w() {
+      function _() {
         n += a / e, n < a ? (T.value = T.value.map((u, s) => ({
           ...u,
           value: Math.min(u.value + o[s], l[s]),
-          color: u.color ? N(u.color) : B.value[s] || c[s] || c[s % c.length]
-        })), requestAnimationFrame(w)) : (P.value = !1, T.value = x.value.map((u, s) => ({
+          color: u.color ? z(u.color) : B.value[s] || c[s] || c[s % c.length]
+        })), requestAnimationFrame(_)) : (P.value = !1, T.value = x.value.map((u, s) => ({
           ...u,
           value: l[s],
-          color: u.color ? N(u.color) : B.value[s] || c[s] || c[s % c.length],
+          color: u.color ? z(u.color) : B.value[s] || c[s] || c[s % c.length],
           id: be()
         })));
       }
-      w();
+      _();
     }
-    pe(() => {
-      ie();
+    he(() => {
+      ce();
     });
-    const ue = C(() => t.value.debug);
-    function ie() {
-      Xe($.dataset) ? _e({
+    const ie = C(() => t.value.debug);
+    function ce() {
+      Xe($.dataset) ? we({
         componentName: "VueUiSparkStackbar",
         type: "dataset",
-        debug: ue.value
+        debug: ie.value
       }) : $.dataset.forEach((e, l) => {
         Je({
           datasetObject: e,
           requiredAttributes: ["name", "value"]
         }).forEach((o) => {
-          _e({
+          we({
             componentName: "VueUiSparkStackbar",
             type: "datasetSerieAttribute",
             property: o,
             index: l,
-            debug: ue.value
+            debug: ie.value
           });
         });
-      }), re();
+      }), ue();
     }
     const h = d({
       width: 500,
       height: 16
-    }), v = d([]), ce = C(() => x.value.map((e) => e.value || 0).filter((e, l) => !v.value.includes(l)).reduce((e, l) => e + l, 0)), y = C(() => T.value.map((e, l) => {
-      const o = e.value || 0, a = o / ce.value, n = isNaN(a) ? 0 : a, w = n * h.value.width;
+    }), v = d([]), ve = C(() => x.value.map((e) => e.value || 0).filter((e, l) => !v.value.includes(l)).reduce((e, l) => e + l, 0)), y = C(() => T.value.map((e, l) => {
+      const o = e.value || 0, a = o / ve.value, n = isNaN(a) ? 0 : a, _ = n * h.value.width;
       return {
         ...e,
-        color: N(x.value[l]?.color ? x.value[l]?.color : B.value[l] || c[l] || c[l % c.length]),
+        color: z(x.value[l]?.color ? x.value[l]?.color : B.value[l] || c[l] || c[l % c.length]),
         value: o,
         proportion: n,
-        width: w,
+        width: _,
         seriesIndex: l,
-        proportionLabel: Y({
+        proportionLabel: q({
           v: n * 100,
           s: "%",
           r: t.value.style.legend.percentage.rounding
         })
       };
-    })), J = C(() => y.value.filter((e, l) => !v.value.includes(l)));
+    })), Z = C(() => y.value.filter((e, l) => !v.value.includes(l)));
     function Ee() {
       v.value.length ? v.value = [] : y.value.forEach((e, l) => {
         v.value.push(l);
       });
     }
-    function U(e) {
+    function O(e) {
       v.value.includes(e) ? v.value = v.value.filter((l) => l !== e) : v.value.length < T.value.length - 1 && v.value.push(e);
     }
-    function ve(e) {
+    function de(e) {
       if (!y.value.length)
         return t.value.debug && console.warn("VueUiSparkStackbar - There are no series to show."), null;
       const l = y.value.find((o) => o.name === e);
       return l || (t.value.debug && console.warn(`VueUiSparkStackbar - Series name not found "${e}"`), null);
     }
     function Ke(e) {
-      const l = ve(e);
-      l !== null && v.value.includes(l.id) && U(l.seriesIndex);
+      const l = de(e);
+      l !== null && v.value.includes(l.id) && O(l.seriesIndex);
     }
     function Ne(e) {
-      const l = ve(e);
-      l !== null && (v.value.includes(l.id) || U(l.seriesIndex));
+      const l = de(e);
+      l !== null && (v.value.includes(l.id) || O(l.seriesIndex));
     }
-    const p = C(() => {
+    const g = C(() => {
       let e = 0;
       const l = [];
-      for (let o = 0; o < J.value.length; o += 1)
+      for (let o = 0; o < Z.value.length; o += 1)
         l.push({
-          ...J.value[o],
+          ...Z.value[o],
           start: e
-        }), e += J.value[o].width;
+        }), e += Z.value[o].width;
       return l;
     }), ze = Se;
-    function O(e, l, o = !1) {
+    function j(e, l, o = !1) {
       ze("selectDatapoint", { datapoint: e, index: l }), t.value.events.datapointClick && !o && t.value.events.datapointClick({ datapoint: e, seriesIndex: e.seriesIndex });
     }
     function Me({ datapoint: e, seriesIndex: l }) {
-      A.value = !1, _.value = null, k.value = null, I.value = "pointer", t.value.events.datapointLeave && t.value.events.datapointLeave({ datapoint: e, seriesIndex: e.seriesIndex });
+      A.value = !1, w.value = null, k.value = null, I.value = "pointer", t.value.events.datapointLeave && t.value.events.datapointLeave({ datapoint: e, seriesIndex: e.seriesIndex });
     }
-    function de({ datapoint: e, seriesIndex: l, triggerMode: o = "pointer" }) {
-      if (z.value = !1, t.value.events.datapointEnter && t.value.events.datapointEnter({ datapoint: e, seriesIndex: e.seriesIndex }), !t.value.style.tooltip.show)
+    function fe({ datapoint: e, seriesIndex: l, triggerMode: o = "pointer" }) {
+      if (M.value = !1, t.value.events.datapointEnter && t.value.events.datapointEnter({ datapoint: e, seriesIndex: e.seriesIndex }), !t.value.style.tooltip.show)
         return;
-      I.value = o, W.value = { datapoint: e, seriesIndex: l, config: t.value, series: y.value }, A.value = !0, _.value = l;
+      I.value = o, U.value = { datapoint: e, seriesIndex: l, config: t.value, series: y.value }, A.value = !0, w.value = l;
       const a = t.value.style.tooltip.customFormat;
       if (Ze(a))
         try {
@@ -225,16 +225,16 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
             series: y.value,
             config: t.value
           });
-          typeof n == "string" && (G.value = n, z.value = !0);
+          typeof n == "string" && (X.value = n, M.value = !0);
         } catch {
-          console.warn("Custom format cannot be applied."), z.value = !1;
+          console.warn("Custom format cannot be applied."), M.value = !1;
         }
-      if (!z.value) {
+      if (!M.value) {
         let n = "";
-        n += `<div style="width:100%;text-align:center;border-bottom:1px solid ${t.value.style.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${e.name}</div>`, n += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${e.color}"/></svg>`, n += `<b>${e.proportionLabel}</b>`, n += `<span>(${le(
+        n += `<div style="width:100%;text-align:center;border-bottom:1px solid ${t.value.style.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${e.name}</div>`, n += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${e.color}"/></svg>`, n += `<b>${e.proportionLabel}</b>`, n += `<span>(${oe(
           t.value.style.legend.value.formatter,
           e.value,
-          Y({
+          q({
             p: t.value.style.legend.value.prefix,
             v: e.value,
             s: t.value.style.legend.value.suffix,
@@ -244,91 +244,91 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
             datapoint: e,
             seriesIndex: l
           }
-        )})</span>`, G.value = `<div>${n}</div>`;
+        )})</span>`, X.value = `<div>${n}</div>`;
       }
     }
-    function j(e) {
+    function H(e) {
       const l = Le.value[e];
       l && typeof l.focus == "function" && l.focus();
     }
     function Ve(e) {
-      if (!Number.isFinite(e) || !M.value) return;
-      const l = p.value[e];
+      if (!Number.isFinite(e) || !V.value) return;
+      const l = g.value[e];
       if (!l) return;
-      const o = M.value.getBoundingClientRect(), a = l.start + l.width / 2, n = h.value.height / 2;
-      se.value = {
+      const o = V.value.getBoundingClientRect(), a = l.start + l.width / 2, n = h.value.height / 2;
+      ne.value = {
         x: o.left + a / h.value.width * o.width,
         y: o.top + n / h.value.height * o.height
       };
     }
     function Re() {
-      k.value = null, q.value = !0;
+      k.value = null, J.value = !0;
     }
     function Ue() {
-      k.value = null, I.value = "pointer", A.value = !1, _.value = null, q.value = !1;
+      k.value = null, I.value = "pointer", A.value = !1, w.value = null, J.value = !1;
     }
     function Oe(e) {
-      if (!M.value || document.activeElement !== M.value || !p.value.length) return;
-      const l = e.key === "ArrowLeft", o = e.key === "ArrowRight", a = e.key === "Enter" || e.key === " ", n = e.key === "Escape", w = e.key === "Home", u = e.key === "End";
-      if (!l && !o && !a && !n && !w && !u)
+      if (!V.value || document.activeElement !== V.value || !g.value.length) return;
+      const l = e.key === "ArrowLeft", o = e.key === "ArrowRight", a = e.key === "Enter" || e.key === " ", n = e.key === "Escape", _ = e.key === "Home", u = e.key === "End";
+      if (!l && !o && !a && !n && !_ && !u)
         return;
       if (e.preventDefault(), e.stopPropagation(), n) {
-        k.value = null, I.value = "pointer", A.value = !1, _.value = null;
+        k.value = null, I.value = "pointer", A.value = !1, w.value = null;
         return;
       }
       if (a) {
         if (k.value === null) return;
-        const D = p.value[k.value];
+        const D = g.value[k.value];
         if (!D) return;
-        O(D, D.seriesIndex);
+        j(D, D.seriesIndex);
         return;
       }
       let s = k.value;
-      w ? s = 0 : u ? s = p.value.length - 1 : s === null || s < 0 || s >= p.value.length ? s = o ? 0 : p.value.length - 1 : o ? (s += 1, s >= p.value.length && (s = 0)) : l && (s -= 1, s < 0 && (s = p.value.length - 1));
-      const E = p.value[s];
-      E && (k.value = s, Ve(s), de({
+      _ ? s = 0 : u ? s = g.value.length - 1 : s === null || s < 0 || s >= g.value.length ? s = o ? 0 : g.value.length - 1 : o ? (s += 1, s >= g.value.length && (s = 0)) : l && (s -= 1, s < 0 && (s = g.value.length - 1));
+      const E = g.value[s];
+      E && (k.value = s, Ve(s), fe({
         datapoint: E,
         seriesIndex: E.seriesIndex,
         triggerMode: "keyboard"
       }));
     }
     function je(e) {
-      A.value = !1, k.value = null, I.value = "pointer", _.value = e.seriesIndex;
+      A.value = !1, k.value = null, I.value = "pointer", w.value = e.seriesIndex;
     }
-    function fe() {
-      k.value = null, I.value = "pointer", A.value = !1, _.value = null;
+    function pe() {
+      k.value = null, I.value = "pointer", A.value = !1, w.value = null;
     }
     function He(e, l, o) {
-      const a = e.key === "Enter" || e.key === " ", n = e.key === "ArrowLeft" || e.key === "ArrowUp", w = e.key === "ArrowRight" || e.key === "ArrowDown", u = e.key === "Home", s = e.key === "End", E = e.key === "Escape";
-      if (!(!a && !n && !w && !u && !s && !E)) {
+      const a = e.key === "Enter" || e.key === " ", n = e.key === "ArrowLeft" || e.key === "ArrowUp", _ = e.key === "ArrowRight" || e.key === "ArrowDown", u = e.key === "Home", s = e.key === "End", E = e.key === "Escape";
+      if (!(!a && !n && !_ && !u && !s && !E)) {
         if (e.preventDefault(), e.stopPropagation(), E) {
-          fe();
+          pe();
           return;
         }
         if (a) {
-          U(o), O(l, o, !0);
+          O(o), j(l, o, !0);
           return;
         }
         if (u) {
-          j(0);
+          H(0);
           return;
         }
         if (s) {
-          j(y.value.length - 1);
+          H(y.value.length - 1);
           return;
         }
         if (n) {
           const D = o <= 0 ? y.value.length - 1 : o - 1;
-          j(D);
+          H(D);
           return;
         }
-        if (w) {
+        if (_) {
           const D = o >= y.value.length - 1 ? 0 : o + 1;
-          j(D);
+          H(D);
         }
       }
     }
-    const Q = C(() => ({
+    const ee = C(() => ({
       headers: [
         t.value.a11y.translations.series,
         t.value.a11y.translations.percentage,
@@ -337,10 +337,10 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
       rows: y.value.map((e, l) => [
         e.name,
         v.value.includes(l) ? " - " : e.proportionLabel,
-        le(
+        oe(
           t.value.style.legend.value.formatter,
           e.value,
-          Y({
+          q({
             p: t.value.style.legend.value.prefix,
             v: e.value,
             s: t.value.style.legend.value.suffix,
@@ -359,7 +359,7 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
     }), (e, l) => (r(), i("div", {
       class: "vue-data-ui-component vue-ui-spark-stackbar",
       ref_key: "sparkstackbarChart",
-      ref: ae,
+      ref: se,
       style: b(`width:100%; background:${t.value.style.backgroundColor}`)
     }, [
       f("div", {
@@ -368,11 +368,11 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
       }, [
         f("p", null, K(t.value.a11y.translations.keyboardNavigation), 1)
       ], 8, it),
-      Q.value?.rows?.length ? (r(), Z(rt, {
+      ee.value?.rows?.length ? (r(), te(rt, {
         key: 0,
         uid: S.value,
-        head: Q.value.headers,
-        body: Q.value.rows,
+        head: ee.value.headers,
+        body: ee.value.rows,
         notice: t.value.a11y.translations.tableAvailable,
         caption: t.value.a11y.translations.tableCaption
       }, null, 8, ["uid", "head", "body", "notice", "caption"])) : m("", !0),
@@ -393,8 +393,8 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
       f("div", ct, [
         (r(), i("svg", {
           ref_key: "svgRef",
-          ref: M,
-          xmlns: g(Qe),
+          ref: V,
+          xmlns: p(Qe),
           width: "100%",
           viewBox: `0 0 ${h.value.width} ${h.value.height}`,
           "aria-describedby": `chart-instructions-${S.value}`,
@@ -403,9 +403,9 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
           onBlur: Ue,
           onKeydown: Oe
         }, [
-          ye(g(Ae)),
+          me(p(Ae)),
           f("defs", null, [
-            (r(!0), i(L, null, V(p.value, (o, a) => (r(), i("linearGradient", {
+            (r(!0), i(L, null, R(g.value, (o, a) => (r(), i("linearGradient", {
               key: `stack_gradient_${a}`,
               gradientTransform: "rotate(90)",
               id: `stack_gradient_${a}_${S.value}`
@@ -416,12 +416,12 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
               }, null, 8, ft),
               f("stop", {
                 offset: "50%",
-                "stop-color": g(we)(g(xe)(o.color, 0.05), 100 - t.value.style.bar.gradient.intensity)
-              }, null, 8, gt),
+                "stop-color": p(_e)(p(xe)(o.color, 0.05), 100 - t.value.style.bar.gradient.intensity)
+              }, null, 8, pt),
               f("stop", {
                 offset: "100%",
                 "stop-color": o.color
-              }, null, 8, pt)
+              }, null, 8, gt)
             ], 8, dt))), 128)),
             f("clipPath", ht, [
               f("rect", {
@@ -435,20 +435,20 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
               }, null, 8, yt)
             ])
           ]),
-          ce.value > 0 ? (r(), i("g", mt, [
-            (r(!0), i(L, null, V(p.value, (o, a) => (r(), i("rect", {
+          ve.value > 0 ? (r(), i("g", mt, [
+            (r(!0), i(L, null, R(g.value, (o, a) => (r(), i("rect", {
               key: `stack_underlayer_${a}`,
               x: o.start,
               y: 0,
               width: o.width,
               height: h.value.height,
               fill: t.value.style.bar.gradient.underlayerColor,
-              class: H({ animated: !P.value && !g(F) }),
+              class: Y({ animated: !P.value && !p(F) }),
               style: b({
-                opacity: _.value !== null && t.value.style.tooltip.show ? _.value === a ? 1 : 0.5 : 1
+                opacity: w.value !== null && t.value.style.tooltip.show ? w.value === a ? 1 : 0.5 : 1
               })
             }, null, 14, bt))), 128)),
-            (r(!0), i(L, null, V(p.value, (o, a) => (r(), i("rect", {
+            (r(!0), i(L, null, R(g.value, (o, a) => (r(), i("rect", {
               key: `stack_${a}`,
               x: o.start,
               y: 0,
@@ -457,12 +457,12 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
               fill: t.value.style.bar.gradient.show ? `url(#stack_gradient_${a}_${S.value})` : o.color,
               stroke: t.value.style.backgroundColor,
               "stroke-linecap": "round",
-              class: H({ animated: !P.value && !g(F) }),
+              class: Y({ animated: !P.value && !p(F) }),
               style: b({
-                opacity: _.value !== null && t.value.style.tooltip.show ? _.value === a ? 1 : 0.5 : 1
+                opacity: w.value !== null && t.value.style.tooltip.show ? w.value === a ? 1 : 0.5 : 1
               })
             }, null, 14, kt))), 128)),
-            (r(!0), i(L, null, V(p.value, (o, a) => (r(), i("rect", {
+            (r(!0), i(L, null, R(g.value, (o, a) => (r(), i("rect", {
               key: `stack_trap_${a}`,
               x: o.start,
               y: 0,
@@ -470,11 +470,11 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
               height: h.value.height,
               fill: "transparent",
               stroke: "none",
-              class: H({ animated: !P.value && !g(F) }),
-              onClick: () => O(o, a),
-              onMouseenter: () => de({ datapoint: o, seriesIndex: a }),
+              class: Y({ animated: !P.value && !p(F) }),
+              onClick: () => j(o, a),
+              onMouseenter: () => fe({ datapoint: o, seriesIndex: a }),
               onMouseleave: (n) => Me({ datapoint: o, seriesIndex: a })
-            }, null, 42, _t))), 128))
+            }, null, 42, wt))), 128))
           ])) : (r(), i("rect", {
             key: 1,
             x: 2,
@@ -485,10 +485,10 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
             "stroke-width": "2",
             fill: "transparent",
             rx: (h.value.height - 4) / 2
-          }, null, 8, wt))
+          }, null, 8, _t))
         ], 40, vt)),
         e.$slots.hint ? (r(), i("div", xt, [
-          R(e.$slots, "hint", ee(te({ hint: t.value.a11y.translations.keyboardNavigation, isVisible: q.value })), void 0, !0)
+          N(e.$slots, "hint", G(W({ hint: t.value.a11y.translations.keyboardNavigation, isVisible: J.value })), void 0, !0)
         ])) : m("", !0)
       ]),
       t.value.style.legend.show ? (r(), i("div", {
@@ -498,27 +498,27 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
         "aria-label": "legend",
         role: "toolbar"
       }, [
-        t.value.style.legend.selectAllToggle.show && y.value.length > 2 && !g(F) ? (r(), Z(nt, {
+        t.value.style.legend.selectAllToggle.show && y.value.length > 2 && !p(F) ? (r(), te(nt, {
           key: 0,
           backgroundColor: t.value.style.legend.selectAllToggle.backgroundColor,
           color: t.value.style.legend.selectAllToggle.color,
           fontSize: t.value.style.legend.fontSize,
           checked: v.value.length > 0,
-          isCursorPointer: ne.value,
+          isCursorPointer: re.value,
           onToggle: Ee
         }, null, 8, ["backgroundColor", "color", "fontSize", "checked", "isCursorPointer"])) : m("", !0),
-        (r(!0), i(L, null, V(y.value, (o, a) => (r(), i("div", {
+        (r(!0), i(L, null, R(y.value, (o, a) => (r(), i("div", {
           role: "button",
           tabindex: "0",
           "aria-pressed": v.value.includes(a),
           "aria-label": `${o.name}, ${v.value.includes(a) ? "hidden" : "visible"}, ${o.proportionLabel}`,
-          style: b(`font-size:${t.value.style.legend.fontSize}px;cursor:${ne.value ? "pointer" : "default"}`),
-          class: H({ "vue-ui-sparkstackbar-legend-item": !0, "vue-ui-sparkstackbar-legend-item-unselected": v.value.includes(a) }),
+          style: b(`font-size:${t.value.style.legend.fontSize}px;cursor:${re.value ? "pointer" : "default"}`),
+          class: Y({ "vue-ui-sparkstackbar-legend-item": !0, "vue-ui-sparkstackbar-legend-item-unselected": v.value.includes(a) }),
           onClick: (n) => {
-            U(a), O(o, a, !0);
+            O(a), j(o, a, !0);
           },
           onFocus: (n) => je(o),
-          onBlur: fe,
+          onBlur: pe,
           onKeydown: (n) => He(n, o, a)
         }, [
           f("div", $t, [
@@ -533,7 +533,7 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
                 }, [
                   f("stop", {
                     offset: "0%",
-                    "stop-color": g(F) ? "#FFFFFF" : g(we)(g(xe)(o.color, 0.05), 100 - t.value.style.bar.gradient.intensity)
+                    "stop-color": p(F) ? "#FFFFFF" : p(_e)(p(xe)(o.color, 0.05), 100 - t.value.style.bar.gradient.intensity)
                   }, null, 8, It),
                   f("stop", {
                     offset: "100%",
@@ -548,7 +548,7 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
                 fill: t.value.style.bar.gradient.show ? `url(#legend_grad_${a}-${S.value})` : o.color
               }, null, 8, Tt)
             ], 8, St)),
-            g(F) ? m("", !0) : (r(), i(L, { key: 0 }, [
+            p(F) ? m("", !0) : (r(), i(L, { key: 0 }, [
               f("span", {
                 style: b(`color:${t.value.style.legend.name.color}; font-weight:${t.value.style.legend.name.bold ? "bold" : "normal"}`)
               }, K(o.name), 5),
@@ -560,10 +560,10 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
                 t.value.style.legend.value.show ? (r(), i("span", {
                   key: 1,
                   style: b(`font-weight:${t.value.style.legend.value.bold ? "bold" : "normal"};color:${t.value.style.legend.value.color}`)
-                }, " (" + K(g(le)(
+                }, " (" + K(p(oe)(
                   t.value.style.legend.value.formatter,
                   o.value,
-                  g(Y)({
+                  p(q)({
                     p: t.value.style.legend.value.prefix,
                     v: o.value,
                     s: t.value.style.legend.value.suffix,
@@ -576,10 +576,10 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
           ])
         ], 46, Ct))), 256))
       ], 4)) : m("", !0),
-      ye(g(Ie), {
+      me(p(Ie), {
         teleportTo: t.value.style.tooltip.teleportTo,
         show: A.value && t.value.style.tooltip.show,
-        parent: ae.value,
+        parent: se.value,
         backgroundColor: t.value.style.tooltip.backgroundColor,
         color: t.value.style.tooltip.color,
         fontSize: t.value.style.tooltip.fontSize,
@@ -588,8 +588,8 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
         borderWidth: t.value.style.tooltip.borderWidth,
         backgroundOpacity: t.value.style.tooltip.backgroundOpacity,
         position: t.value.style.tooltip.position,
-        content: G.value,
-        isCustom: z.value,
+        content: X.value,
+        isCustom: M.value,
         offsetY: -124 + t.value.style.tooltip.offsetY,
         blockShiftY: !0,
         smooth: t.value.style.tooltip.smooth,
@@ -597,25 +597,28 @@ const it = ["id"], ct = { style: { position: "relative" } }, vt = ["xmlns", "vie
         smoothForce: t.value.style.tooltip.smoothForce,
         smoothSnapThreshold: t.value.style.tooltip.smoothSnapThreshold,
         isA11yMode: I.value === "keyboard",
-        a11yPosition: se.value
+        a11yPosition: ne.value
       }, {
-        "tooltip-before": me(() => [
-          R(e.$slots, "tooltip-before", ee(te({ ...W.value })), void 0, !0)
+        "tooltip-before": le(() => [
+          N(e.$slots, "tooltip-before", G(W({ ...U.value })), void 0, !0)
         ]),
-        "tooltip-after": me(() => [
-          R(e.$slots, "tooltip-after", ee(te({ ...W.value })), void 0, !0)
+        tooltip: le(() => [
+          N(e.$slots, "tooltip", G(W({ ...U.value })), void 0, !0)
+        ]),
+        "tooltip-after": le(() => [
+          N(e.$slots, "tooltip-after", G(W({ ...U.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["teleportTo", "show", "parent", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "content", "isCustom", "offsetY", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold", "isA11yMode", "a11yPosition"]),
       e.$slots.source ? (r(), i("div", Pt, [
-        R(e.$slots, "source", {}, void 0, !0)
+        N(e.$slots, "source", {}, void 0, !0)
       ], 512)) : m("", !0),
-      R(e.$slots, "skeleton", {}, () => [
-        g(F) ? (r(), Z(lt, { key: 0 })) : m("", !0)
+      N(e.$slots, "skeleton", {}, () => [
+        p(F) ? (r(), te(lt, { key: 0 })) : m("", !0)
       ], !0)
     ], 4));
   }
-}, jt = /* @__PURE__ */ ut(Dt, [["__scopeId", "data-v-29f119a6"]]);
+}, jt = /* @__PURE__ */ ut(Dt, [["__scopeId", "data-v-85267d41"]]);
 export {
   jt as default
 };