vue-data-ui 3.4.9 → 3.5.1

package/dist/{vue-ui-bullet-Bybo0xK2.js → vue-ui-bullet-BWEBeYV5.js}

@@ -1,5 +1,5 @@
-import { defineAsyncComponent as G, ref as v, computed as c, onMounted as ze, toRefs as Ne, watch as ce, onBeforeUnmount as Ee, createElementBlock as n, openBlock as o, unref as r, normalizeStyle as V, normalizeClass as he, createBlock as _, createCommentVNode as u, createElementVNode as C, createSlots as Ue, withCtx as b, renderSlot as m, normalizeProps as F, guardReactiveProps as T, createVNode as We, Fragment as j, renderList as q, toDisplayString as H, Teleport as De } from "vue";
-import { u as Ge, a as de } from "./useNestedProp-BjZe1Y85.js";
+import { defineAsyncComponent as G, ref as c, computed as h, onMounted as ze, toRefs as Ne, watch as ce, onBeforeUnmount as Ee, createElementBlock as r, openBlock as o, unref as n, normalizeStyle as V, normalizeClass as he, createBlock as A, createCommentVNode as u, createElementVNode as _, withCtx as f, renderSlot as i, normalizeProps as p, guardReactiveProps as b, createSlots as Ue, createVNode as We, Fragment as j, renderList as q, toDisplayString as H, Teleport as De } from "vue";
+import { u as Ge, a as de } from "./useNestedProp-DjGXw6S9.js";
 import { c as Ve, t as je, S as qe, m as Xe, h as Ye, a as M, d as R, X as Je, o as ge, f as fe, g as Ke } from "./lib-C_mNZmhD.js";
 import { t as Qe, u as Ze } from "./useResponsive-DfdjqQps.js";
 import { u as et } from "./usePrinter-DTzqpYKF.js";
@@ -7,9 +7,9 @@ import { u as tt } from "./useUserOptionState-BIvW1Kz7.js";
 import { u as at } from "./useChartAccessibility-9icAAmYg.js";
 import { t as lt } from "./themes-AUNCOb2G.js";
 import st from "./Legend-G6GMcdAc.js";
-import ot from "./Title-l36lOBMx.js";
-import rt from "./img-BecE5qXd.js";
-import { u as nt, B as ut } from "./BaseScanner-BgWxam9d.js";
+import ot from "./Title-isbiM8i8.js";
+import nt from "./img-BecE5qXd.js";
+import { u as rt, B as ut } from "./BaseScanner-BgWxam9d.js";
 import { u as it } from "./useSvgExport-DrjCWun4.js";
 import { _ as vt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const ct = ["id"], ht = {
@@ -17,10 +17,10 @@ const ct = ["id"], ht = {
   ref: "noTitle",
   class: "vue-data-ui-no-title-space",
   style: "height:36px; width: 100%;background:transparent"
-}, dt = ["id"], gt = ["xmlns", "viewBox"], ft = ["width", "height"], mt = { key: 1 }, yt = ["x", "y", "height", "width", "fill", "stroke"], pt = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], bt = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], kt = ["x", "y", "font-size", "font-weight", "fill"], wt = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], xt = { key: 3 }, _t = ["x", "y", "fill", "font-size", "font-weight"], Ct = { key: 4 }, At = ["x1", "x2", "y1", "y2", "stroke"], Lt = {
+}, dt = ["id"], gt = ["xmlns", "viewBox"], ft = ["width", "height"], mt = { key: 1 }, yt = ["x", "y", "height", "width", "fill", "stroke"], pt = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], bt = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], kt = ["x", "y", "font-size", "font-weight", "fill"], wt = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], xt = { key: 3 }, Ct = ["x", "y", "fill", "font-size", "font-weight"], $t = { key: 4 }, At = ["x1", "x2", "y1", "y2", "stroke"], _t = {
   key: 4,
   class: "vue-data-ui-watermark"
-}, $t = ["id"], St = {
+}, Lt = ["id"], St = {
   key: 0,
   class: "vue-ui-bullet-legend-item",
   dir: "auto"
@@ -41,10 +41,10 @@ const ct = ["id"], ht = {
     }
   },
   setup(me, { expose: ye }) {
-    const pe = G(() => import("./PackageVersion-CTUqGqWV.js")), be = G(() => import("./PenAndPaper-DSvu9dwa.js")), ke = G(() => import("./UserOptions-CGnQt6Fd.js")), { vue_ui_bullet: we } = Ge(), S = me, y = v(null), X = v(null), Y = v(0), J = v(null), K = v(null), xe = v(0), A = v(null), O = v(null), Q = v(!1), k = c({
-      get: () => i.value.hasOwnProperty("value"),
+    const pe = G(() => import("./PackageVersion-DQvyATVa.js")), be = G(() => import("./PenAndPaper-SZQIAgkg.js")), ke = G(() => import("./UserOptions-CGnQt6Fd.js")), { vue_ui_bullet: we } = Ge(), B = me, k = c(null), X = c(null), Y = c(0), J = c(null), K = c(null), xe = c(0), L = c(null), I = c(null), Q = c(!1), x = h({
+      get: () => v.value.hasOwnProperty("value"),
       set: (t) => t
-    }), L = c(() => i.value.segments ? Array.isArray(i.value.segments) ? i.value.segments.length ? !0 : (console.warn(`VueUiBullet: dataset segments is empty. Provide segments with this datastructure:
+    }), S = h(() => 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:
 
 segments: [
     {
@@ -55,7 +55,7 @@ segments: [
     },
     {...}
 ]
-        `), k.value = !1, !1) : (console.warn(`VueUiBullet: dataset segments must be an array of objects with this datastructure:
+        `), x.value = !1, !1) : (console.warn(`VueUiBullet: dataset segments must be an array of objects with this datastructure:
 
 segments: [
     {
@@ -66,7 +66,7 @@ segments: [
     },
     {...}
 ] 
-        `), k.value = !1, !1) : (console.warn(`VueUiBullet: dataset segments is empty. Provide segments with this datastructure:
+        `), x.value = !1, !1) : (console.warn(`VueUiBullet: dataset segments is empty. Provide segments with this datastructure:
 
 segments: [
     {
@@ -77,18 +77,18 @@ segments: [
     },
     {...}
 ]
-        `), k.value = !1, !1)), Z = c(() => !!e.value.debug);
+        `), x.value = !1, !1)), Z = h(() => !!e.value.debug);
     function ee() {
-      if (ge(i.value) ? (fe({
+      if (ge(v.value) ? (fe({
         componentName: "VueUiBullet",
         type: "dataset",
         debug: Z.value
-      }), B.value = !0) : L.value ? i.value.segments.forEach((t, s) => {
+      }), P.value = !0) : S.value ? v.value.segments.forEach((t, s) => {
         Ke({
           datasetObject: t,
           requiredAttributes: ["name", "from", "to"]
         }).forEach((a) => {
-          k.value = !1, fe({
+          x.value = !1, fe({
             componentName: "VueUiBullet segment",
             type: "datasetSerieAttribute",
             property: a,
@@ -96,40 +96,40 @@ segments: [
             debug: Z.value
           });
         });
-      }) : (k.value = !1, B.value = !0), ge(i.value) || (B.value = e.value.loading), e.value.responsive) {
+      }) : (x.value = !1, P.value = !0), ge(v.value) || (P.value = e.value.loading), e.value.responsive) {
         const t = Qe(() => {
           const { width: s, height: a } = Ze({
-            chart: y.value,
+            chart: k.value,
             title: e.value.style.chart.title.text ? X.value : null,
             legend: e.value.style.chart.legend.show ? J.value : null,
             source: K.value
           });
           requestAnimationFrame(() => {
-            I.value.width = s, I.value.height = a - 12;
+            F.value.width = s, F.value.height = a - 12;
           });
         });
-        A.value && (O.value && A.value.unobserve(O.value), A.value.disconnect()), A.value = new ResizeObserver(t), O.value = y.value.parentNode, A.value.observe(O.value);
+        L.value && (I.value && L.value.unobserve(I.value), L.value.disconnect()), L.value = new ResizeObserver(t), I.value = k.value.parentNode, L.value.observe(I.value);
       }
-      e.value.style.chart.animation.show && !w.value && se(i.value.value || 0);
+      e.value.style.chart.animation.show && !C.value && se(v.value.value || 0);
     }
     ze(() => {
       Q.value = !0, ee();
     });
-    const p = v(Ve());
+    const w = c(Ve());
     function z() {
       const t = de({
-        userConfig: S.config,
+        userConfig: B.config,
         defaultConfig: we
       });
       return t.theme ? {
         ...de({
-          userConfig: lt.vue_ui_bullet[t.theme] || S.config,
+          userConfig: lt.vue_ui_bullet[t.theme] || B.config,
           defaultConfig: t
         })
       } : t;
     }
-    const e = v(z()), { loading: w, FINAL_DATASET: i, manualLoading: B } = nt({
-      ...Ne(S),
+    const e = c(z()), { loading: C, FINAL_DATASET: v, manualLoading: P } = rt({
+      ...Ne(B),
       FINAL_CONFIG: e,
       prepareConfig: z,
       skeletonDataset: {
@@ -177,78 +177,78 @@ segments: [
         }
       })
     }), { userOptionsVisible: N, setUserOptionsVisibility: te, keepUserOptionState: ae } = tt({ config: e.value }), { svgRef: E } = at({ config: e.value.style.chart.title });
-    ce(() => S.config, (t) => {
-      w.value || (e.value = z()), N.value = !e.value.userOptions.showOnChartHover, ee(), Y.value += 1;
+    ce(() => B.config, (t) => {
+      C.value || (e.value = z()), N.value = !e.value.userOptions.showOnChartHover, ee(), Y.value += 1;
     }, { deep: !0 });
-    const I = v({
+    const F = c({
       width: e.value.style.chart.width,
       height: e.value.style.chart.height
-    }), _e = c(() => I.value.width), Ce = c(() => I.value.height), l = c(() => {
-      const t = Ce.value, s = _e.value, a = e.value.style.chart.padding.left, h = s - e.value.style.chart.padding.right, x = e.value.style.chart.padding.top, d = t - e.value.style.chart.padding.bottom;
+    }), Ce = h(() => F.value.width), $e = h(() => F.value.height), l = h(() => {
+      const t = $e.value, s = Ce.value, a = e.value.style.chart.padding.left, d = s - e.value.style.chart.padding.right, $ = 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, s),
         left: a,
-        right: h,
-        top: x,
-        bottom: d,
-        chartWidth: Math.max(1e-3, h - a),
-        chartHeight: Math.max(1e-3, d - x)
+        right: d,
+        top: $,
+        bottom: g,
+        chartWidth: Math.max(1e-3, d - a),
+        chartHeight: Math.max(1e-3, g - $)
       };
-    }), Ae = c(() => {
-      if (!L.value) return [];
+    }), Ae = h(() => {
+      if (!S.value) return [];
       const t = [];
-      for (let s = 0; s < i.value.segments.length; s += 1)
-        t.push(qe(e.value.style.chart.segments.baseColor, s / i.value.segments.length));
+      for (let s = 0; s < v.value.segments.length; s += 1)
+        t.push(qe(e.value.style.chart.segments.baseColor, s / v.value.segments.length));
       return t;
-    }), U = c(() => L.value ? {
-      min: Math.min(...i.value.segments.map((t) => t.from)),
-      max: Math.max(...i.value.segments.map((t) => t.to))
-    } : { min: 0, max: 1 }), g = v(Le());
-    ce(() => i.value, (t) => {
-      t.hasOwnProperty("value") && (B.value = !1), e.value.style.chart.animation.show && !w.value ? se(t.value || 0) : g.value = t.value || 0;
+    }), U = h(() => S.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 = c(_e());
+    ce(() => v.value, (t) => {
+      t.hasOwnProperty("value") && (P.value = !1), e.value.style.chart.animation.show && !C.value ? se(t.value || 0) : m.value = t.value || 0;
     }, { deep: !0 });
-    function Le() {
-      return e.value.style.chart.animation.show && !w.value ? U.value.min : i.value.value || 0;
+    function _e() {
+      return e.value.style.chart.animation.show && !C.value ? U.value.min : v.value.value || 0;
     }
-    const le = v(null);
+    const le = c(null);
     function se(t) {
-      const s = Math.abs(t - g.value) / e.value.style.chart.animation.animationFrames;
+      const s = Math.abs(t - m.value) / e.value.style.chart.animation.animationFrames;
       function a() {
-        g.value < t ? g.value = Math.min(g.value + s, t) : g.value > t && (g.value = Math.max(g.value - s, t)), g.value !== t && (le.value = requestAnimationFrame(a));
+        m.value < t ? m.value = Math.min(m.value + s, t) : m.value > t && (m.value = Math.max(m.value - s, t)), m.value !== t && (le.value = requestAnimationFrame(a));
       }
       a();
     }
     Ee(() => {
       cancelAnimationFrame(le.value);
     });
-    const f = c(() => {
-      if (!L.value)
+    const y = h(() => {
+      if (!S.value)
         return [];
       const t = Xe(U.value.min, U.value.max, e.value.style.chart.segments.ticks.divisions), s = t.min >= 0 ? 0 : Math.abs(t.min), a = {
-        x: l.value.left + (i.value.target + s) / (t.max + s) * l.value.chartWidth - e.value.style.chart.target.width / 2
-      }, h = {
-        width: (g.value + s) / (t.max + s) * l.value.chartWidth
-      }, x = t.ticks.map((d) => ({
-        value: d,
+        x: l.value.left + (v.value.target + s) / (t.max + s) * l.value.chartWidth - e.value.style.chart.target.width / 2
+      }, d = {
+        width: (m.value + s) / (t.max + s) * l.value.chartWidth
+      }, $ = t.ticks.map((g) => ({
+        value: g,
         y: l.value.bottom + e.value.style.chart.segments.dataLabels.fontSize + 3 + e.value.style.chart.segments.dataLabels.offsetY,
-        x: l.value.left + (d + s) / (t.max + s) * l.value.chartWidth
+        x: l.value.left + (g + s) / (t.max + s) * l.value.chartWidth
       }));
       return {
         scale: t,
         target: a,
-        value: h,
-        ticks: x,
-        chunks: i.value.segments.map((d, Re) => ({
-          ...d,
-          color: d.color ? Ye(d.color) : Ae.value[Re],
-          x: l.value.left + l.value.chartWidth * ((d.from + s) / (t.max + s)),
+        value: d,
+        ticks: $,
+        chunks: v.value.segments.map((g, Re) => ({
+          ...g,
+          color: g.color ? Ye(g.color) : Ae.value[Re],
+          x: l.value.left + l.value.chartWidth * ((g.from + s) / (t.max + s)),
           y: l.value.top,
           height: l.value.chartHeight,
-          width: l.value.chartWidth * (Math.abs(d.to - d.from) / (t.max + s))
+          width: l.value.chartWidth * (Math.abs(g.to - g.from) / (t.max + s))
         }))
       };
-    }), W = c(() => !f.value || !f.value.chunks || !f.value.chunks.length ? [] : f.value.chunks.map((t) => {
+    }), W = h(() => !y.value || !y.value.chunks || !y.value.chunks.length ? [] : y.value.chunks.map((t) => {
       const s = M(
         e.value.style.chart.segments.dataLabels.formatter,
         t.from,
@@ -267,51 +267,51 @@ segments: [
           s: e.value.style.chart.segments.dataLabels.suffix,
           r: e.value.style.chart.segments.dataLabels.rounding
         })
-      ), h = `${s} — ${a}`;
+      ), d = `${s} — ${a}`;
       return {
         ...t,
         shape: "square",
-        value: h,
-        display: `${t.name}: ${h}`
+        value: d,
+        display: `${t.name}: ${d}`
       };
-    })), $e = c(() => ({
+    })), Le = h(() => ({
       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: oe, isImaging: re, generatePdf: ne, generateImage: ue } = et({
-      elementId: `bullet_${p.value}`,
+    })), { isPrinting: oe, isImaging: ne, generatePdf: re, generateImage: ue } = et({
+      elementId: `bullet_${w.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-bullet",
       options: e.value.userOptions.print
-    }), Se = c(() => e.value.userOptions.show && !e.value.style.chart.title.text), $ = v(!1);
+    }), Se = h(() => e.value.userOptions.show && !e.value.style.chart.title.text), O = c(!1);
     function ie(t) {
-      $.value = t, xe.value += 1;
+      O.value = t, xe.value += 1;
     }
     function Oe() {
-      return f.value;
+      return y.value;
     }
-    const P = v(!1);
+    const T = c(!1);
     function D() {
-      P.value = !P.value;
+      T.value = !T.value;
     }
     async function Be({ scale: t = 2 } = {}) {
-      if (!y.value) return;
-      const { width: s, height: a } = y.value.getBoundingClientRect(), h = s / a, { imageUri: x, base64: d } = await rt({ domElement: y.value, base64: !0, img: !0, scale: t });
+      if (!k.value) return;
+      const { width: s, height: a } = k.value.getBoundingClientRect(), d = s / a, { imageUri: $, base64: g } = await nt({ domElement: k.value, base64: !0, img: !0, scale: t });
       return {
-        imageUri: x,
-        base64: d,
+        imageUri: $,
+        base64: g,
         title: e.value.style.chart.title.text,
         width: s,
         height: a,
-        aspectRatio: h
+        aspectRatio: d
       };
     }
-    const Ie = c(() => W.value.map((t) => ({
+    const Ie = h(() => W.value.map((t) => ({
       ...t,
       name: t.display
-    }))), Pe = c(() => e.value.style.chart.backgroundColor), Fe = c(() => e.value.style.chart.legend), Te = c(() => e.value.style.chart.title), { exportSvg: He, getSvg: Me } = it({
+    }))), Pe = h(() => e.value.style.chart.backgroundColor), Fe = h(() => e.value.style.chart.legend), Te = h(() => e.value.style.chart.title), { exportSvg: He, getSvg: Me } = it({
       svg: E,
       title: Te,
       legend: Fe,
@@ -324,36 +324,56 @@ segments: [
     return ye({
       getData: Oe,
       getImage: Be,
-      generatePdf: ne,
+      generatePdf: re,
       generateImage: ue,
       generateSvg: ve,
       toggleAnnotator: D,
       toggleFullscreen: ie
-    }), (t, s) => (o(), n("div", {
+    }), (t, s) => (o(), r("div", {
       ref_key: "bulletChart",
-      ref: y,
-      class: he(`vue-data-ui-component vue-ui-bullet ${$.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
+      ref: k,
+      class: he(`vue-data-ui-component vue-ui-bullet ${O.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
       style: V(`font-family:${e.value.style.fontFamily};width:100%;background:${e.value.style.chart.backgroundColor}`),
-      id: `bullet_${p.value}`,
-      onMouseenter: s[0] || (s[0] = () => r(te)(!0)),
-      onMouseleave: s[1] || (s[1] = () => r(te)(!1))
+      id: `bullet_${w.value}`,
+      onMouseenter: s[0] || (s[0] = () => n(te)(!0)),
+      onMouseleave: s[1] || (s[1] = () => n(te)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (o(), _(r(be), {
+      e.value.userOptions.buttons.annotator ? (o(), A(n(be), {
         key: 0,
-        svgRef: r(E),
+        svgRef: n(E),
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        active: P.value,
+        active: T.value,
         onClose: D
-      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : u("", !0),
-      Se.value ? (o(), n("div", ht, null, 512)) : u("", !0),
-      e.value.style.chart.title.text ? (o(), n("div", {
+      }, {
+        "annotator-action-close": f(() => [
+          i(t.$slots, "annotator-action-close", {}, void 0, !0)
+        ]),
+        "annotator-action-color": f(({ color: a }) => [
+          i(t.$slots, "annotator-action-color", p(b({ color: a })), void 0, !0)
+        ]),
+        "annotator-action-draw": f(({ mode: a }) => [
+          i(t.$slots, "annotator-action-draw", p(b({ mode: a })), void 0, !0)
+        ]),
+        "annotator-action-undo": f(({ disabled: a }) => [
+          i(t.$slots, "annotator-action-undo", p(b({ disabled: a })), void 0, !0)
+        ]),
+        "annotator-action-redo": f(({ disabled: a }) => [
+          i(t.$slots, "annotator-action-redo", p(b({ disabled: a })), void 0, !0)
+        ]),
+        "annotator-action-delete": f(({ disabled: a }) => [
+          i(t.$slots, "annotator-action-delete", p(b({ disabled: a })), void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["svgRef", "backgroundColor", "color", "active"])) : u("", !0),
+      Se.value ? (o(), r("div", ht, null, 512)) : u("", !0),
+      e.value.style.chart.title.text ? (o(), r("div", {
         key: 2,
         ref_key: "chartTitle",
         ref: X,
         style: "width:100%;background:transparent;"
       }, [
-        (o(), _(ot, {
+        (o(), A(ot, {
           lineHeight: "1.3rem",
           key: `title_${Y.value}`,
           config: {
@@ -368,17 +388,17 @@ segments: [
           }
         }, null, 8, ["config"]))
       ], 512)) : u("", !0),
-      C("div", {
-        id: `legend-top-${p.value}`
+      _("div", {
+        id: `legend-top-${w.value}`
       }, null, 8, dt),
-      e.value.userOptions.show && k.value && (r(ae) || r(N)) ? (o(), _(r(ke), {
+      e.value.userOptions.show && x.value && (n(ae) || n(N)) ? (o(), A(n(ke), {
         key: 3,
         ref: "details",
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        isPrinting: r(oe),
-        isImaging: r(re),
-        uid: p.value,
+        isPrinting: n(oe),
+        isImaging: n(ne),
+        uid: w.value,
         hasTooltip: !1,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasImg: e.value.userOptions.buttons.img,
@@ -387,76 +407,76 @@ segments: [
         hasTable: !1,
         hasLabel: !1,
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: $.value,
-        chartElement: y.value,
+        isFullscreen: O.value,
+        chartElement: k.value,
         position: e.value.userOptions.position,
         titles: { ...e.value.userOptions.buttonTitles },
         hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: P.value,
+        isAnnotation: T.value,
         callbacks: e.value.userOptions.callbacks,
         printScale: e.value.userOptions.print.scale,
         onToggleFullscreen: ie,
-        onGeneratePdf: r(ne),
-        onGenerateImage: r(ue),
+        onGeneratePdf: n(re),
+        onGenerateImage: n(ue),
         onGenerateSvg: ve,
         onToggleAnnotator: D,
         style: V({
-          visibility: r(ae) ? r(N) ? "visible" : "hidden" : "visible"
+          visibility: n(ae) ? n(N) ? "visible" : "hidden" : "visible"
         })
       }, Ue({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: b(({ isOpen: a, color: h }) => [
-            m(t.$slots, "menuIcon", F(T({ isOpen: a, color: h })), void 0, !0)
+          fn: f(({ isOpen: a, color: d }) => [
+            i(t.$slots, "menuIcon", p(b({ isOpen: a, color: d })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         t.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: b(() => [
-            m(t.$slots, "optionPdf", {}, void 0, !0)
+          fn: f(() => [
+            i(t.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         t.$slots.optionImg ? {
           name: "optionImg",
-          fn: b(() => [
-            m(t.$slots, "optionImg", {}, void 0, !0)
+          fn: f(() => [
+            i(t.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         t.$slots.optionSvg ? {
           name: "optionSvg",
-          fn: b(() => [
-            m(t.$slots, "optionSvg", {}, void 0, !0)
+          fn: f(() => [
+            i(t.$slots, "optionSvg", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: b(({ toggleFullscreen: a, isFullscreen: h }) => [
-            m(t.$slots, "optionFullscreen", F(T({ toggleFullscreen: a, isFullscreen: h })), void 0, !0)
+          fn: f(({ toggleFullscreen: a, isFullscreen: d }) => [
+            i(t.$slots, "optionFullscreen", p(b({ toggleFullscreen: a, isFullscreen: d })), void 0, !0)
           ]),
           key: "4"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: b(({ toggleAnnotator: a, isAnnotator: h }) => [
-            m(t.$slots, "optionAnnotator", F(T({ toggleAnnotator: a, isAnnotator: h })), void 0, !0)
+          fn: f(({ toggleAnnotator: a, isAnnotator: d }) => [
+            i(t.$slots, "optionAnnotator", p(b({ toggleAnnotator: a, isAnnotator: d })), 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"])) : u("", !0),
-      (o(), n("svg", {
+      (o(), r("svg", {
         ref_key: "svgRef",
         ref: E,
-        xmlns: r(Je),
-        class: he({ "vue-data-ui-fullscreen--on": $.value, "vue-data-ui-fulscreen--off": !$.value, "vue-ui-bullet-svg": !0 }),
+        xmlns: n(Je),
+        class: he({ "vue-data-ui-fullscreen--on": O.value, "vue-data-ui-fulscreen--off": !O.value, "vue-ui-bullet-svg": !0 }),
         viewBox: `0 0 ${l.value.width} ${l.value.height}`,
         style: V(`width: 100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
       }, [
-        We(r(pe)),
-        t.$slots["chart-background"] ? (o(), n("foreignObject", {
+        We(n(pe)),
+        t.$slots["chart-background"] ? (o(), r("foreignObject", {
           key: 0,
           x: 0,
           y: 0,
@@ -466,10 +486,10 @@ segments: [
             pointerEvents: "none"
           }
         }, [
-          m(t.$slots, "chart-background", {}, void 0, !0)
+          i(t.$slots, "chart-background", {}, void 0, !0)
         ], 8, ft)) : u("", !0),
-        L.value ? (o(), n("g", mt, [
-          (o(!0), n(j, null, q(f.value.chunks, (a) => (o(), n("rect", {
+        S.value ? (o(), r("g", mt, [
+          (o(!0), r(j, null, q(y.value.chunks, (a) => (o(), r("rect", {
             x: a.x,
             y: a.y,
             height: a.height,
@@ -479,9 +499,9 @@ segments: [
             stroke: e.value.style.chart.backgroundColor,
             style: { transition: "x 0.3s ease-in-out, width 0.3s ease-in-out" }
           }, null, 8, yt))), 256)),
-          !e.value.style.chart.target.onTop && e.value.style.chart.target.show ? (o(), n("rect", {
+          !e.value.style.chart.target.onTop && e.value.style.chart.target.show ? (o(), r("rect", {
             key: 0,
-            x: f.value.target.x,
+            x: y.value.target.x,
             y: l.value.top + (l.value.chartHeight - l.value.chartHeight * e.value.style.chart.target.heightRatio) / 2,
             height: l.value.chartHeight * e.value.style.chart.target.heightRatio,
             width: e.value.style.chart.target.width,
@@ -490,36 +510,36 @@ segments: [
             stroke: e.value.style.chart.target.stroke,
             "stroke-width": e.value.style.chart.target.strokeWidth
           }, null, 8, pt)) : u("", !0),
-          C("rect", {
+          _("rect", {
             x: l.value.left,
             y: l.value.top + (l.value.chartHeight - l.value.chartHeight * e.value.style.chart.valueBar.heightRatio) / 2,
             height: l.value.chartHeight * e.value.style.chart.valueBar.heightRatio,
-            width: f.value.value.width,
+            width: y.value.value.width,
             fill: e.value.style.chart.valueBar.color,
             stroke: e.value.style.chart.valueBar.stroke,
             "stroke-width": e.value.style.chart.valueBar.strokeWidth
           }, null, 8, bt),
-          e.value.style.chart.valueBar.label.show ? (o(), n("text", {
+          e.value.style.chart.valueBar.label.show ? (o(), r("text", {
             key: 1,
-            x: l.value.left + f.value.value.width,
+            x: l.value.left + y.value.value.width,
             y: l.value.top - 6 + e.value.style.chart.valueBar.label.offsetY,
             "font-size": e.value.style.chart.valueBar.label.fontSize,
             "font-weight": e.value.style.chart.valueBar.label.bold ? "bold" : "normal",
             fill: e.value.style.chart.valueBar.label.color,
             "text-anchor": "middle"
-          }, H(r(M)(
+          }, H(n(M)(
             e.value.style.chart.segments.dataLabels.formatter,
-            g.value,
-            r(R)({
+            m.value,
+            n(R)({
               p: e.value.style.chart.segments.dataLabels.prefix,
-              v: g.value,
+              v: m.value,
               s: e.value.style.chart.segments.dataLabels.suffix,
               r: e.value.style.chart.segments.dataLabels.rounding
             })
           )), 9, kt)) : u("", !0),
-          e.value.style.chart.target.onTop && e.value.style.chart.target.show ? (o(), n("rect", {
+          e.value.style.chart.target.onTop && e.value.style.chart.target.show ? (o(), r("rect", {
             key: 2,
-            x: f.value.target.x,
+            x: y.value.target.x,
             y: l.value.top + (l.value.chartHeight - l.value.chartHeight * e.value.style.chart.target.heightRatio) / 2,
             height: l.value.chartHeight * e.value.style.chart.target.heightRatio,
             width: e.value.style.chart.target.width,
@@ -529,27 +549,27 @@ segments: [
             "stroke-width": e.value.style.chart.target.strokeWidth,
             style: { transition: "x 0.3s ease-in-out" }
           }, null, 8, wt)) : u("", !0),
-          e.value.style.chart.segments.dataLabels.show ? (o(), n("g", xt, [
-            (o(!0), n(j, null, q(f.value.ticks, (a) => (o(), n("text", {
+          e.value.style.chart.segments.dataLabels.show ? (o(), r("g", xt, [
+            (o(!0), r(j, null, q(y.value.ticks, (a) => (o(), r("text", {
               x: a.x,
               y: a.y,
               "text-anchor": "middle",
               fill: e.value.style.chart.segments.dataLabels.color,
               "font-size": e.value.style.chart.segments.dataLabels.fontSize + "px",
               "font-weight": e.value.style.chart.segments.dataLabels.bold ? "bold" : "normal"
-            }, H(r(M)(
+            }, H(n(M)(
               e.value.style.chart.segments.dataLabels.formatter,
               a.value,
-              r(R)({
+              n(R)({
                 p: e.value.style.chart.segments.dataLabels.prefix,
                 v: a.value,
                 s: e.value.style.chart.segments.dataLabels.suffix,
                 r: e.value.style.chart.segments.dataLabels.rounding
               })
-            )), 9, _t))), 256))
+            )), 9, Ct))), 256))
           ])) : u("", !0),
-          e.value.style.chart.segments.dataLabels.show && e.value.style.chart.segments.ticks.show ? (o(), n("g", Ct, [
-            (o(!0), n(j, null, q(f.value.ticks, (a) => (o(), n("line", {
+          e.value.style.chart.segments.dataLabels.show && e.value.style.chart.segments.ticks.show ? (o(), r("g", $t, [
+            (o(!0), r(j, null, q(y.value.ticks, (a) => (o(), r("line", {
               x1: a.x,
               x2: a.x,
               y1: l.value.bottom,
@@ -560,51 +580,51 @@ segments: [
             }, null, 8, At))), 256))
           ])) : u("", !0)
         ])) : u("", !0),
-        m(t.$slots, "svg", { svg: l.value }, void 0, !0)
+        i(t.$slots, "svg", { svg: l.value }, void 0, !0)
       ], 14, gt)),
-      t.$slots.watermark ? (o(), n("div", Lt, [
-        m(t.$slots, "watermark", F(T({ isPrinting: r(oe) || r(re) })), void 0, !0)
+      t.$slots.watermark ? (o(), r("div", _t, [
+        i(t.$slots, "watermark", p(b({ isPrinting: n(oe) || n(ne) })), void 0, !0)
       ])) : u("", !0),
-      C("div", {
-        id: `legend-bottom-${p.value}`
-      }, null, 8, $t),
-      Q.value ? (o(), _(De, {
+      _("div", {
+        id: `legend-bottom-${w.value}`
+      }, null, 8, Lt),
+      Q.value ? (o(), A(De, {
         key: 5,
-        to: e.value.style.chart.legend.position === "top" ? `#legend-top-${p.value}` : `#legend-bottom-${p.value}`
+        to: e.value.style.chart.legend.position === "top" ? `#legend-top-${w.value}` : `#legend-bottom-${w.value}`
       }, [
-        C("div", {
+        _("div", {
           ref_key: "chartLegend",
           ref: J
         }, [
-          e.value.style.chart.legend.show ? (o(), _(st, {
+          e.value.style.chart.legend.show ? (o(), A(st, {
             key: 0,
             clickable: !1,
             legendSet: W.value,
-            config: $e.value
+            config: Le.value
           }, {
-            item: b(({ legend: a }) => [
-              r(w) ? u("", !0) : (o(), n("div", St, [
-                C("span", Ot, H(a.name) + ":", 1),
-                C("span", null, H(a.value), 1)
+            item: f(({ legend: a }) => [
+              n(C) ? u("", !0) : (o(), r("div", St, [
+                _("span", Ot, H(a.name) + ":", 1),
+                _("span", null, H(a.value), 1)
               ]))
             ]),
             _: 1
           }, 8, ["legendSet", "config"])) : u("", !0),
-          m(t.$slots, "legend", { legend: W.value }, void 0, !0)
+          i(t.$slots, "legend", { legend: W.value }, void 0, !0)
         ], 512)
       ], 8, ["to"])) : u("", !0),
-      t.$slots.source ? (o(), n("div", {
+      t.$slots.source ? (o(), r("div", {
         key: 6,
         ref_key: "source",
         ref: K,
         dir: "auto"
       }, [
-        m(t.$slots, "source", {}, void 0, !0)
+        i(t.$slots, "source", {}, void 0, !0)
       ], 512)) : u("", !0),
-      r(w) ? (o(), _(ut, { key: 7 })) : u("", !0)
+      n(C) ? (o(), A(ut, { key: 7 })) : u("", !0)
     ], 46, ct));
   }
-}, Vt = /* @__PURE__ */ vt(Bt, [["__scopeId", "data-v-6daaa51f"]]);
+}, Vt = /* @__PURE__ */ vt(Bt, [["__scopeId", "data-v-ab4dd268"]]);
 export {
   Vt as default
 };