vue-data-ui 3.9.5 → 3.9.6

package/dist/{vue-ui-bullet-C0kz8F_R.js → vue-ui-bullet-BegRqWJR.js}

@@ -1,17 +1,17 @@
-import { defineAsyncComponent as j, ref as h, computed as d, onMounted as qe, toRefs as Xe, watch as he, onBeforeUnmount as Ye, createElementBlock as n, openBlock as s, unref as r, normalizeStyle as V, normalizeClass as de, createBlock as _, createCommentVNode as i, createElementVNode as $, withCtx as f, renderSlot as c, normalizeProps as b, guardReactiveProps as p, createSlots as Je, createVNode as Ke, Fragment as G, renderList as q, toDisplayString as T, Teleport as Qe } from "vue";
-import { u as Ze, a as X } from "./useNestedProp-QQOzuoZs.js";
-import { c as et, t as tt, n as at, M as lt, l as ot, a as P, d as M, X as st, o as ge, g as fe, k as rt } from "./lib-_nVZfi2t.js";
-import { t as nt, u as ut } from "./useResponsive-DfdjqQps.js";
-import { u as it } from "./usePrinter-DXIMGR61.js";
-import { u as ct, B as vt } from "./BaseScanner-BMpwQAfz.js";
-import { u as ht } from "./useSvgExport-DrjCWun4.js";
-import { u as dt } from "./useThemeCheck-DGJ31Vi5.js";
-import { u as gt } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as ft } from "./useChartAccessibility-9icAAmYg.js";
-import mt from "./Legend-PhhPyrZ0.js";
-import yt from "./Title-BMp0dt6A.js";
-import bt from "./img-C5q4A7ke.js";
-import { _ as pt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import { defineAsyncComponent as j, ref as d, computed as i, onMounted as Xe, toRefs as Ye, watch as he, onBeforeUnmount as Je, createElementBlock as n, openBlock as s, unref as r, normalizeStyle as V, normalizeClass as de, createBlock as _, createCommentVNode as c, createElementVNode as $, withCtx as f, renderSlot as v, normalizeProps as b, guardReactiveProps as p, createSlots as Ke, createVNode as Qe, Fragment as G, renderList as q, toDisplayString as T, Teleport as Ze } from "vue";
+import { u as et, a as X } from "./useNestedProp-J-ft0CnG.js";
+import { c as tt, t as at, n as lt, M as ot, l as st, a as P, d as M, X as rt, o as ge, g as fe, k as nt } from "./lib-W9waxHL3.js";
+import { t as ut, u as it } from "./useResponsive-DfdjqQps.js";
+import { u as ct } from "./usePrinter-DhoMn87n.js";
+import { u as vt, B as ht } from "./BaseScanner-BMpwQAfz.js";
+import { u as dt } from "./useSvgExport-DrjCWun4.js";
+import { u as gt } from "./useThemeCheck-DGJ31Vi5.js";
+import { u as ft } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as mt } from "./useChartAccessibility-9icAAmYg.js";
+import yt from "./Legend-Dxz13z4E.js";
+import bt from "./Title-BcXW_dzC.js";
+import pt from "./img-BJzUSmkm.js";
+import { _ as kt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const me = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, segments: { baseColor: "#5A5A5A", dataLabels: { color: "#CCCCCC" }, ticks: { stroke: "#5A5A5A" } }, target: { color: "#1A1A1A" }, valueBar: { color: "#CCCCCC", stroke: "#5A5A5A", label: { color: "#CCCCCC" } } } } }, ye = { style: { chart: { backgroundColor: "#FFF8E1", color: "#424242", legend: { backgroundColor: "#FFF8E1", color: "#424242" }, title: { color: "#424242", subtitle: { color: "#757575" } }, segments: { baseColor: "#D32F2F", dataLabels: { color: "#424242" }, ticks: { stroke: "#424242" } }, target: { color: "#3A3A3A" }, valueBar: { color: "#3A3A3A", stroke: "#FFF8E1", label: { color: "#424242" } } } } }, be = { style: { chart: { backgroundColor: "#1E1E1E", color: "#BDBDBD", legend: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, segments: { baseColor: "#D32F2F", dataLabels: { color: "#BDBDBD" }, ticks: { stroke: "#BDBDBD" } }, target: { color: "#3A3A3A" }, valueBar: { color: "#3A3A3A", stroke: "#1E1E1E", label: { color: "#BDBDBD" } } } } }, pe = { style: { chart: { backgroundColor: "#1A1A1A", color: "#99AA99", legend: { backgroundColor: "#1A1A1A", color: "#99AA99" }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, segments: { baseColor: "#00AA00", dataLabels: { color: "#66CC66" }, ticks: { stroke: "#00AA00" } }, target: { color: "#023602" }, valueBar: { color: "#1b291b", stroke: "#1A1A1A", label: { color: "#66CC66" } } } } }, ke = { style: { chart: { backgroundColor: "#fbfafa", color: "#8A9892", legend: { backgroundColor: "#fbfafa", color: "#99AA99" }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, segments: { baseColor: "#8F837A", dataLabels: { color: "#8A9892" }, ticks: { stroke: "#8F837A" } }, target: { color: "#40403a" }, valueBar: { color: "#8F837A", stroke: "#fbfafa", label: { color: "#8A9892" } } } } }, Ce = { style: { chart: { backgroundColor: "#f6f6fb", color: "#50606C", legend: { backgroundColor: "#fbfafa", color: "#50606C" }, title: { color: "#50606C", subtitle: { color: "#718890" } }, segments: { baseColor: "#718890", dataLabels: { color: "#50606C" }, ticks: { stroke: "#50606C" } }, target: { color: "#50606C" }, valueBar: { color: "#50606C", stroke: "#fbfafa", label: { color: "#50606C" } } } } }, Ae = {
   default: {},
   dark: me,
@@ -20,7 +20,7 @@ const me = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
   hack: pe,
   zen: ke,
   concrete: Ce
-}, ta = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, aa = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   celebration: ye,
   celebrationNight: be,
@@ -29,19 +29,19 @@ const me = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
   default: Ae,
   hack: pe,
   zen: ke
-}, Symbol.toStringTag, { value: "Module" })), kt = ["id"], Ct = {
+}, Symbol.toStringTag, { value: "Module" })), Ct = ["id"], At = {
   key: 1,
   ref: "noTitle",
   class: "vue-data-ui-no-title-space",
   style: "height:36px; width: 100%;background:transparent"
-}, At = ["id"], wt = ["xmlns", "viewBox"], Bt = ["width", "height"], xt = { key: 1 }, _t = ["x", "y", "height", "width", "fill", "stroke"], $t = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], Lt = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], Ft = ["x", "y", "font-size", "font-weight", "fill"], Ot = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], St = { key: 3 }, Dt = ["x", "y", "fill", "font-size", "font-weight"], Et = { key: 4 }, It = ["x1", "x2", "y1", "y2", "stroke"], Tt = {
+}, wt = ["id"], Bt = ["xmlns", "viewBox"], xt = ["width", "height"], _t = { key: 1 }, $t = ["x", "y", "height", "width", "fill", "stroke"], Lt = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], Ft = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], Ot = ["x", "y", "font-size", "font-weight", "fill"], St = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], Dt = { key: 3 }, Et = ["x", "y", "fill", "font-size", "font-weight"], It = { key: 4 }, Tt = ["x1", "x2", "y1", "y2", "stroke"], Pt = {
   key: 4,
   class: "vue-data-ui-watermark"
-}, Pt = ["id"], Mt = {
+}, Mt = ["id"], zt = {
   key: 0,
   class: "vue-ui-bullet-legend-item",
   dir: "auto"
-}, zt = { style: { "margin-right": "2px" } }, Ht = {
+}, Ht = { style: { "margin-right": "2px" } }, Rt = {
   __name: "vue-ui-bullet",
   props: {
     config: {
@@ -58,10 +58,10 @@ const me = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
     }
   },
   setup(we, { expose: Be }) {
-    const xe = j(() => import("./PackageVersion-BuFi5-eQ.js")), _e = j(() => import("./PenAndPaper-Cjiyv0O9.js")), $e = j(() => import("./UserOptions-DKK-Opvk.js")), { vue_ui_bullet: Le } = Ze(), { isThemeValid: Fe, warnInvalidTheme: Oe } = dt(), L = we, C = h(null), Y = h(null), J = h(0), K = h(null), Q = h(null), Se = h(0), F = h(null), D = h(null), Z = h(!1), w = d({
-      get: () => v.value.hasOwnProperty("value"),
+    const xe = j(() => import("./PackageVersion-CDhRWUpB.js")), _e = j(() => import("./PenAndPaper-Cev8qhhR.js")), $e = j(() => import("./UserOptions-wm9VwdlI.js")), { vue_ui_bullet: Le } = et(), { isThemeValid: Fe, warnInvalidTheme: Oe } = gt(), L = we, C = d(null), Y = d(null), J = d(0), K = d(null), Q = d(null), Se = d(0), F = d(null), D = d(null), Z = d(!1), w = i({
+      get: () => h.value.hasOwnProperty("value"),
       set: (t) => t
-    }), O = d(() => v.value.segments ? Array.isArray(v.value.segments) ? v.value.segments.length ? !0 : (console.warn(`VueUiBullet: dataset segments is empty. Provide segments with this datastructure:
+    }), O = i(() => h.value.segments ? Array.isArray(h.value.segments) ? h.value.segments.length ? !0 : (console.warn(`VueUiBullet: dataset segments is empty. Provide segments with this datastructure:
 
 segments: [
     {
@@ -94,14 +94,22 @@ segments: [
     },
     {...}
 ]
-        `), w.value = !1, !1)), ee = d(() => !!e.value.debug);
+        `), w.value = !1, !1)), ee = i(() => !!e.value.debug), De = i(() => {
+      const { top: t, right: l, bottom: a, left: u } = e.value.style.chart.padding;
+      return {
+        top: t,
+        right: l,
+        bottom: a,
+        left: u
+      };
+    });
     function te() {
-      if (ge(v.value) ? (fe({
+      if (ge(h.value) ? (fe({
         componentName: "VueUiBullet",
         type: "dataset",
         debug: ee.value
-      }), E.value = !0) : O.value ? v.value.segments.forEach((t, l) => {
-        rt({
+      }), E.value = !0) : O.value ? h.value.segments.forEach((t, l) => {
+        nt({
           datasetObject: t,
           requiredAttributes: ["name", "from", "to"]
         }).forEach((a) => {
@@ -113,13 +121,14 @@ segments: [
             debug: ee.value
           });
         });
-      }) : (w.value = !1, E.value = !0), ge(v.value) || (E.value = e.value.loading), e.value.responsive) {
-        const t = nt(() => {
-          const { width: l, height: a } = ut({
+      }) : (w.value = !1, E.value = !0), ge(h.value) || (E.value = e.value.loading), e.value.responsive) {
+        const t = ut(() => {
+          const { width: l, height: a } = it({
             chart: C.value,
             title: e.value.style.chart.title.text ? Y.value : null,
             legend: e.value.style.chart.legend.show ? K.value : null,
-            source: Q.value
+            source: Q.value,
+            padding: De.value
           }), k = (e.value.style.chart.legend.show ? 24 : 0) || 12;
           requestAnimationFrame(() => {
             x.value.width = l, x.value.height = a - k;
@@ -127,12 +136,12 @@ segments: [
         });
         F.value && (D.value && F.value.unobserve(D.value), F.value.disconnect()), F.value = new ResizeObserver(t), D.value = C.value.parentNode, F.value.observe(D.value);
       }
-      e.value.style.chart.animation.show && !B.value && se(v.value.value || 0);
+      e.value.style.chart.animation.show && !B.value && se(h.value.value || 0);
     }
-    qe(() => {
+    Xe(() => {
       Z.value = !0, te();
     });
-    const A = h(et());
+    const A = d(tt());
     function z() {
       const t = X({
         userConfig: L.config,
@@ -150,8 +159,8 @@ segments: [
         defaultConfig: a
       });
     }
-    const e = h(z()), { loading: B, FINAL_DATASET: v, manualLoading: E } = ct({
-      ...Xe(L),
+    const e = d(z()), { loading: B, FINAL_DATASET: h, manualLoading: E } = vt({
+      ...Ye(L),
       FINAL_CONFIG: e,
       prepareConfig: z,
       skeletonDataset: {
@@ -178,7 +187,7 @@ segments: [
           }
         ]
       },
-      skeletonConfig: tt({
+      skeletonConfig: at({
         defaultConfig: e.value,
         userConfig: {
           userOptions: { show: !1 },
@@ -198,15 +207,15 @@ segments: [
           }
         }
       })
-    }), { userOptionsVisible: H, setUserOptionsVisibility: ae, keepUserOptionState: le } = gt({ config: e.value }), { svgRef: R } = ft({ config: e.value.style.chart.title }), x = h({
+    }), { userOptionsVisible: H, setUserOptionsVisibility: ae, keepUserOptionState: le } = ft({ config: e.value }), { svgRef: R } = mt({ config: e.value.style.chart.title }), x = d({
       width: e.value.style.chart.width,
       height: e.value.style.chart.height
-    }), De = d(() => x.value.width), Ee = d(() => x.value.height);
+    }), Ee = i(() => x.value.width), Ie = i(() => x.value.height);
     he(() => L.config, (t) => {
       B.value || (e.value = z()), H.value = !e.value.userOptions.showOnChartHover, x.value.width = e.value.style.chart.width, x.value.height = e.value.style.chart.height, te(), J.value += 1;
     }, { deep: !0 });
-    const o = d(() => {
-      const t = Ee.value, l = De.value, a = e.value.style.chart.padding.left, u = l - e.value.style.chart.padding.right, k = e.value.style.chart.padding.top, g = t - e.value.style.chart.padding.bottom;
+    const o = i(() => {
+      const t = Ie.value, l = Ee.value, a = e.value.style.chart.padding.left, u = l - e.value.style.chart.padding.right, k = e.value.style.chart.padding.top, g = t - e.value.style.chart.padding.bottom;
       return {
         height: Math.max(1e-3, t),
         width: Math.max(1e-3, l),
@@ -217,23 +226,23 @@ segments: [
         chartWidth: Math.max(1e-3, u - a),
         chartHeight: Math.max(1e-3, g - k)
       };
-    }), Ie = d(() => {
+    }), Te = i(() => {
       if (!O.value) return [];
       const t = [];
-      for (let l = 0; l < v.value.segments.length; l += 1)
-        t.push(at(e.value.style.chart.segments.baseColor, l / v.value.segments.length));
+      for (let l = 0; l < h.value.segments.length; l += 1)
+        t.push(lt(e.value.style.chart.segments.baseColor, l / h.value.segments.length));
       return t;
-    }), N = d(() => O.value ? {
-      min: Math.min(...v.value.segments.map((t) => t.from)),
-      max: Math.max(...v.value.segments.map((t) => t.to))
-    } : { min: 0, max: 1 }), m = h(Te());
-    he(() => v.value, (t) => {
+    }), N = i(() => O.value ? {
+      min: Math.min(...h.value.segments.map((t) => t.from)),
+      max: Math.max(...h.value.segments.map((t) => t.to))
+    } : { min: 0, max: 1 }), m = d(Pe());
+    he(() => h.value, (t) => {
       t.hasOwnProperty("value") && (E.value = !1), e.value.style.chart.animation.show && !B.value ? se(t.value || 0) : m.value = t.value || 0;
     }, { deep: !0 });
-    function Te() {
-      return e.value.style.chart.animation.show && !B.value ? N.value.min : v.value.value || 0;
+    function Pe() {
+      return e.value.style.chart.animation.show && !B.value ? N.value.min : h.value.value || 0;
     }
-    const oe = h(null);
+    const oe = d(null);
     function se(t) {
       const l = Math.abs(t - m.value) / e.value.style.chart.animation.animationFrames;
       function a() {
@@ -241,14 +250,14 @@ segments: [
       }
       a();
     }
-    Ye(() => {
+    Je(() => {
       cancelAnimationFrame(oe.value);
     });
-    const y = d(() => {
+    const y = i(() => {
       if (!O.value)
         return [];
-      const t = lt(N.value.min, N.value.max, e.value.style.chart.segments.ticks.divisions), l = t.min >= 0 ? 0 : Math.abs(t.min), a = {
-        x: o.value.left + (v.value.target + l) / (t.max + l) * o.value.chartWidth - e.value.style.chart.target.width / 2
+      const t = ot(N.value.min, N.value.max, e.value.style.chart.segments.ticks.divisions), l = t.min >= 0 ? 0 : Math.abs(t.min), a = {
+        x: o.value.left + (h.value.target + l) / (t.max + l) * o.value.chartWidth - e.value.style.chart.target.width / 2
       }, u = {
         width: (m.value + l) / (t.max + l) * o.value.chartWidth
       }, k = t.ticks.map((g) => ({
@@ -261,16 +270,16 @@ segments: [
         target: a,
         value: u,
         ticks: k,
-        chunks: v.value.segments.map((g, Ge) => ({
+        chunks: h.value.segments.map((g, qe) => ({
           ...g,
-          color: g.color ? ot(g.color) : Ie.value[Ge],
+          color: g.color ? st(g.color) : Te.value[qe],
           x: o.value.left + o.value.chartWidth * ((g.from + l) / (t.max + l)),
           y: o.value.top,
           height: o.value.chartHeight,
           width: o.value.chartWidth * (Math.abs(g.to - g.from) / (t.max + l))
         }))
       };
-    }), U = d(() => !y.value || !y.value.chunks || !y.value.chunks.length ? [] : y.value.chunks.map((t) => {
+    }), U = i(() => !y.value || !y.value.chunks || !y.value.chunks.length ? [] : y.value.chunks.map((t) => {
       const l = P(
         e.value.style.chart.segments.dataLabels.formatter,
         t.from,
@@ -296,31 +305,31 @@ segments: [
         value: u,
         display: `${t.name}: ${u}`
       };
-    })), Pe = d(() => ({
+    })), Me = i(() => ({
       cy: "bullet-div-legend",
       backgroundColor: "transparent",
       color: e.value.style.chart.legend.color,
       fontSize: e.value.style.chart.legend.fontSize,
       paddingBottom: 6,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
-    })), { isPrinting: re, isImaging: ne, generatePdf: ue, generateImage: ie } = it({
+    })), { isPrinting: re, isImaging: ne, generatePdf: ue, generateImage: ie } = ct({
       elementId: `bullet_${A.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-bullet",
       options: e.value.userOptions.print
-    }), Me = d(() => e.value.userOptions.show && !e.value.style.chart.title.text), S = h(!1);
+    }), ze = i(() => e.value.userOptions.show && !e.value.style.chart.title.text), S = d(!1);
     function ce(t) {
       S.value = t, Se.value += 1;
     }
-    function ze() {
+    function He() {
       return y.value;
     }
-    const I = h(!1);
+    const I = d(!1);
     function W() {
       I.value = !I.value;
     }
-    async function He({ scale: t = 2 } = {}) {
+    async function Re({ scale: t = 2 } = {}) {
       if (!C.value) return;
-      const { width: l, height: a } = C.value.getBoundingClientRect(), u = l / a, { imageUri: k, base64: g } = await bt({ domElement: C.value, base64: !0, img: !0, scale: t });
+      const { width: l, height: a } = C.value.getBoundingClientRect(), u = l / a, { imageUri: k, base64: g } = await pt({ domElement: C.value, base64: !0, img: !0, scale: t });
       return {
         imageUri: k,
         base64: g,
@@ -330,22 +339,22 @@ segments: [
         aspectRatio: u
       };
     }
-    const Re = d(() => U.value.map((t) => ({
+    const Ne = i(() => U.value.map((t) => ({
       ...t,
       name: t.display
-    }))), Ne = d(() => e.value.style.chart.backgroundColor), Ue = d(() => e.value.style.chart.legend), We = d(() => e.value.style.chart.title), { exportSvg: je, getSvg: Ve } = ht({
+    }))), Ue = i(() => e.value.style.chart.backgroundColor), We = i(() => e.value.style.chart.legend), je = i(() => e.value.style.chart.title), { exportSvg: Ve, getSvg: Ge } = dt({
       svg: R,
-      title: We,
-      legend: Ue,
-      legendItems: Re,
-      backgroundColor: Ne
+      title: je,
+      legend: We,
+      legendItems: Ne,
+      backgroundColor: Ue
     });
     function ve({ isCb: t }) {
-      t ? e.value.userOptions.callbacks.svg(Ve()) : je();
+      t ? e.value.userOptions.callbacks.svg(Ge()) : Ve();
     }
     return Be({
-      getData: ze,
-      getImage: He,
+      getData: He,
+      getImage: Re,
       generatePdf: ue,
       generateImage: ie,
       generateSvg: ve,
@@ -369,33 +378,33 @@ segments: [
         onClose: W
       }, {
         "annotator-action-close": f(() => [
-          c(t.$slots, "annotator-action-close", {}, void 0, !0)
+          v(t.$slots, "annotator-action-close", {}, void 0, !0)
         ]),
         "annotator-action-color": f(({ color: a }) => [
-          c(t.$slots, "annotator-action-color", b(p({ color: a })), void 0, !0)
+          v(t.$slots, "annotator-action-color", b(p({ color: a })), void 0, !0)
         ]),
         "annotator-action-draw": f(({ mode: a }) => [
-          c(t.$slots, "annotator-action-draw", b(p({ mode: a })), void 0, !0)
+          v(t.$slots, "annotator-action-draw", b(p({ mode: a })), void 0, !0)
         ]),
         "annotator-action-undo": f(({ disabled: a }) => [
-          c(t.$slots, "annotator-action-undo", b(p({ disabled: a })), void 0, !0)
+          v(t.$slots, "annotator-action-undo", b(p({ disabled: a })), void 0, !0)
         ]),
         "annotator-action-redo": f(({ disabled: a }) => [
-          c(t.$slots, "annotator-action-redo", b(p({ disabled: a })), void 0, !0)
+          v(t.$slots, "annotator-action-redo", b(p({ disabled: a })), void 0, !0)
         ]),
         "annotator-action-delete": f(({ disabled: a }) => [
-          c(t.$slots, "annotator-action-delete", b(p({ disabled: a })), void 0, !0)
+          v(t.$slots, "annotator-action-delete", b(p({ disabled: a })), void 0, !0)
         ]),
         _: 3
-      }, 8, ["svgRef", "backgroundColor", "color", "active"])) : i("", !0),
-      Me.value ? (s(), n("div", Ct, null, 512)) : i("", !0),
+      }, 8, ["svgRef", "backgroundColor", "color", "active"])) : c("", !0),
+      ze.value ? (s(), n("div", At, null, 512)) : c("", !0),
       e.value.style.chart.title.text ? (s(), n("div", {
         key: 2,
         ref_key: "chartTitle",
         ref: Y,
         style: "width:100%;background:transparent;"
       }, [
-        (s(), _(yt, {
+        (s(), _(bt, {
           lineHeight: "1.3rem",
           key: `title_${J.value}`,
           config: {
@@ -409,10 +418,10 @@ segments: [
             }
           }
         }, null, 8, ["config"]))
-      ], 512)) : i("", !0),
+      ], 512)) : c("", !0),
       $("div", {
         id: `legend-top-${A.value}`
-      }, null, 8, At),
+      }, null, 8, wt),
       e.value.userOptions.show && w.value && (r(le) || r(H)) ? (s(), _(r($e), {
         key: 3,
         ref: "details",
@@ -445,59 +454,59 @@ segments: [
         style: V({
           visibility: r(le) ? r(H) ? "visible" : "hidden" : "visible"
         })
-      }, Je({ _: 2 }, [
+      }, Ke({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
           fn: f(({ isOpen: a, color: u }) => [
-            c(t.$slots, "menuIcon", b(p({ isOpen: a, color: u })), void 0, !0)
+            v(t.$slots, "menuIcon", b(p({ isOpen: a, color: u })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         t.$slots.optionPdf ? {
           name: "optionPdf",
           fn: f(() => [
-            c(t.$slots, "optionPdf", {}, void 0, !0)
+            v(t.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         t.$slots.optionImg ? {
           name: "optionImg",
           fn: f(() => [
-            c(t.$slots, "optionImg", {}, void 0, !0)
+            v(t.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         t.$slots.optionSvg ? {
           name: "optionSvg",
           fn: f(() => [
-            c(t.$slots, "optionSvg", {}, void 0, !0)
+            v(t.$slots, "optionSvg", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
           fn: f(({ toggleFullscreen: a, isFullscreen: u }) => [
-            c(t.$slots, "optionFullscreen", b(p({ toggleFullscreen: a, isFullscreen: u })), void 0, !0)
+            v(t.$slots, "optionFullscreen", b(p({ toggleFullscreen: a, isFullscreen: u })), void 0, !0)
           ]),
           key: "4"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
           fn: f(({ toggleAnnotator: a, isAnnotator: u }) => [
-            c(t.$slots, "optionAnnotator", b(p({ toggleAnnotator: a, isAnnotator: u })), void 0, !0)
+            v(t.$slots, "optionAnnotator", b(p({ toggleAnnotator: a, isAnnotator: u })), void 0, !0)
           ]),
           key: "5"
         } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasImg", "hasSvg", "hasFullscreen", "isFullscreen", "chartElement", "position", "titles", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "onGeneratePdf", "onGenerateImage", "style"])) : i("", !0),
+      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasImg", "hasSvg", "hasFullscreen", "isFullscreen", "chartElement", "position", "titles", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "onGeneratePdf", "onGenerateImage", "style"])) : c("", !0),
       (s(), n("svg", {
         ref_key: "svgRef",
         ref: R,
-        xmlns: r(st),
+        xmlns: r(rt),
         class: de({ "vue-data-ui-fullscreen--on": S.value, "vue-data-ui-fulscreen--off": !S.value, "vue-ui-bullet-svg": !0 }),
         viewBox: `0 0 ${o.value.width} ${o.value.height}`,
         style: V(`width: 100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
       }, [
-        Ke(r(xe)),
+        Qe(r(xe)),
         t.$slots["chart-background"] ? (s(), n("foreignObject", {
           key: 0,
           x: 0,
@@ -508,9 +517,9 @@ segments: [
             pointerEvents: "none"
           }
         }, [
-          c(t.$slots, "chart-background", {}, void 0, !0)
-        ], 8, Bt)) : i("", !0),
-        O.value ? (s(), n("g", xt, [
+          v(t.$slots, "chart-background", {}, void 0, !0)
+        ], 8, xt)) : c("", !0),
+        O.value ? (s(), n("g", _t, [
           (s(!0), n(G, null, q(y.value.chunks, (a) => (s(), n("rect", {
             x: a.x,
             y: a.y,
@@ -520,7 +529,7 @@ segments: [
             "stroke-width": 1,
             stroke: e.value.style.chart.backgroundColor,
             style: { transition: "x 0.3s ease-in-out, width 0.3s ease-in-out" }
-          }, null, 8, _t))), 256)),
+          }, null, 8, $t))), 256)),
           !e.value.style.chart.target.onTop && e.value.style.chart.target.show ? (s(), n("rect", {
             key: 0,
             x: y.value.target.x,
@@ -531,7 +540,7 @@ segments: [
             fill: e.value.style.chart.target.color,
             stroke: e.value.style.chart.target.stroke,
             "stroke-width": e.value.style.chart.target.strokeWidth
-          }, null, 8, $t)) : i("", !0),
+          }, null, 8, Lt)) : c("", !0),
           $("rect", {
             x: o.value.left,
             y: o.value.top + (o.value.chartHeight - o.value.chartHeight * e.value.style.chart.valueBar.heightRatio) / 2,
@@ -540,7 +549,7 @@ segments: [
             fill: e.value.style.chart.valueBar.color,
             stroke: e.value.style.chart.valueBar.stroke,
             "stroke-width": e.value.style.chart.valueBar.strokeWidth
-          }, null, 8, Lt),
+          }, null, 8, Ft),
           e.value.style.chart.valueBar.label.show ? (s(), n("text", {
             key: 1,
             x: o.value.left + y.value.value.width,
@@ -558,7 +567,7 @@ segments: [
               s: e.value.style.chart.segments.dataLabels.suffix,
               r: e.value.style.chart.segments.dataLabels.rounding
             })
-          )), 9, Ft)) : i("", !0),
+          )), 9, Ot)) : c("", !0),
           e.value.style.chart.target.onTop && e.value.style.chart.target.show ? (s(), n("rect", {
             key: 2,
             x: y.value.target.x,
@@ -570,8 +579,8 @@ segments: [
             stroke: e.value.style.chart.target.stroke,
             "stroke-width": e.value.style.chart.target.strokeWidth,
             style: { transition: "x 0.3s ease-in-out" }
-          }, null, 8, Ot)) : i("", !0),
-          e.value.style.chart.segments.dataLabels.show ? (s(), n("g", St, [
+          }, null, 8, St)) : c("", !0),
+          e.value.style.chart.segments.dataLabels.show ? (s(), n("g", Dt, [
             (s(!0), n(G, null, q(y.value.ticks, (a) => (s(), n("text", {
               x: a.x,
               y: a.y,
@@ -588,9 +597,9 @@ segments: [
                 s: e.value.style.chart.segments.dataLabels.suffix,
                 r: e.value.style.chart.segments.dataLabels.rounding
               })
-            )), 9, Dt))), 256))
-          ])) : i("", !0),
-          e.value.style.chart.segments.dataLabels.show && e.value.style.chart.segments.ticks.show ? (s(), n("g", Et, [
+            )), 9, Et))), 256))
+          ])) : c("", !0),
+          e.value.style.chart.segments.dataLabels.show && e.value.style.chart.segments.ticks.show ? (s(), n("g", It, [
             (s(!0), n(G, null, q(y.value.ticks, (a) => (s(), n("line", {
               x1: a.x,
               x2: a.x,
@@ -599,18 +608,18 @@ segments: [
               stroke: e.value.style.chart.segments.ticks.stroke,
               "stroke-width": 1,
               "stroke-linecap": "round"
-            }, null, 8, It))), 256))
-          ])) : i("", !0)
-        ])) : i("", !0),
-        c(t.$slots, "svg", { svg: o.value }, void 0, !0)
-      ], 14, wt)),
-      t.$slots.watermark ? (s(), n("div", Tt, [
-        c(t.$slots, "watermark", b(p({ isPrinting: r(re) || r(ne) })), void 0, !0)
-      ])) : i("", !0),
+            }, null, 8, Tt))), 256))
+          ])) : c("", !0)
+        ])) : c("", !0),
+        v(t.$slots, "svg", { svg: o.value }, void 0, !0)
+      ], 14, Bt)),
+      t.$slots.watermark ? (s(), n("div", Pt, [
+        v(t.$slots, "watermark", b(p({ isPrinting: r(re) || r(ne) })), void 0, !0)
+      ])) : c("", !0),
       $("div", {
         id: `legend-bottom-${A.value}`
-      }, null, 8, Pt),
-      Z.value ? (s(), _(Qe, {
+      }, null, 8, Mt),
+      Z.value ? (s(), _(Ze, {
         key: 5,
         to: e.value.style.chart.legend.position === "top" ? `#legend-top-${A.value}` : `#legend-bottom-${A.value}`
       }, [
@@ -618,40 +627,40 @@ segments: [
           ref_key: "chartLegend",
           ref: K
         }, [
-          e.value.style.chart.legend.show ? (s(), _(mt, {
+          e.value.style.chart.legend.show ? (s(), _(yt, {
             key: 0,
             clickable: !1,
             legendSet: U.value,
-            config: Pe.value
+            config: Me.value
           }, {
             item: f(({ legend: a }) => [
-              r(B) ? i("", !0) : (s(), n("div", Mt, [
-                $("span", zt, T(a.name) + ":", 1),
+              r(B) ? c("", !0) : (s(), n("div", zt, [
+                $("span", Ht, T(a.name) + ":", 1),
                 $("span", null, T(a.value), 1)
               ]))
             ]),
             _: 1
-          }, 8, ["legendSet", "config"])) : i("", !0),
-          c(t.$slots, "legend", { legend: U.value }, void 0, !0)
+          }, 8, ["legendSet", "config"])) : c("", !0),
+          v(t.$slots, "legend", { legend: U.value }, void 0, !0)
         ], 512)
-      ], 8, ["to"])) : i("", !0),
+      ], 8, ["to"])) : c("", !0),
       t.$slots.source ? (s(), n("div", {
         key: 6,
         ref_key: "source",
         ref: Q,
         dir: "auto"
       }, [
-        c(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : i("", !0),
-      r(B) ? (s(), _(vt, { key: 7 })) : i("", !0)
-    ], 46, kt));
+        v(t.$slots, "source", {}, void 0, !0)
+      ], 512)) : c("", !0),
+      r(B) ? (s(), _(ht, { key: 7 })) : c("", !0)
+    ], 46, Ct));
   }
-}, Rt = /* @__PURE__ */ pt(Ht, [["__scopeId", "data-v-f9c44926"]]), aa = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, Nt = /* @__PURE__ */ kt(Rt, [["__scopeId", "data-v-7902e6f9"]]), la = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: Rt
+  default: Nt
 }, Symbol.toStringTag, { value: "Module" }));
 export {
-  ta as a,
-  aa as b,
-  Rt as v
+  aa as a,
+  la as b,
+  Nt as v
 };