vue-data-ui 2.12.8-beta.3 → 2.13.0

package/dist/{vue-ui-funnel-C2eqxh_8.js → vue-ui-funnel-CihunDsZ.js}

@@ -1,11 +1,11 @@
-import { useCssVars as Ie, computed as c, defineAsyncComponent as O, ref as v, shallowRef as ye, onMounted as De, onBeforeUnmount as Re, watch as Me, createElementBlock as u, openBlock as o, unref as s, normalizeStyle as _, normalizeClass as N, createBlock as z, createCommentVNode as f, createSlots as Ve, withCtx as g, renderSlot as m, normalizeProps as B, guardReactiveProps as E, createVNode as Be, createElementVNode as w, mergeProps as J, Fragment as U, renderList as G, toDisplayString as j, createTextVNode as Ee, nextTick as Ue } from "vue";
-import { u as Ge, c as je, o as He, e as ge, g as Xe, d as qe, l as Ye, i as H, f as X, X as We, G as Je, F as K, a as Ke, q as Qe, r as Ze } from "./index-CH_mJIWj.js";
-import { u as pe } from "./useNestedProp-rMR-JeOJ.js";
-import { u as et } from "./usePrinter-DJ7WfWUs.js";
+import { useCssVars as Ie, computed as v, defineAsyncComponent as O, ref as d, shallowRef as ye, onMounted as De, onBeforeUnmount as Re, watch as Me, createElementBlock as u, openBlock as o, unref as s, normalizeStyle as _, normalizeClass as N, createBlock as z, createCommentVNode as f, createSlots as Ve, withCtx as g, renderSlot as b, normalizeProps as B, guardReactiveProps as E, createVNode as Be, createElementVNode as w, mergeProps as J, Fragment as U, renderList as G, toDisplayString as j, createTextVNode as Ee, nextTick as Ue } from "vue";
+import { u as Ge, c as je, o as He, e as ge, g as Xe, d as qe, l as Ye, i as H, f as X, X as We, G as Je, F as K, a as Ke, q as Qe, r as Ze } from "./index-BXbyT0Qn.js";
+import { u as pe } from "./useNestedProp-DVZpeH84.js";
+import { u as et } from "./usePrinter-aKh5-HcK.js";
 import { t as tt, u as at } from "./useResponsive-JZ9xq-JV.js";
 import { u as lt } from "./useUserOptionState-BIvW1Kz7.js";
 import { u as st } from "./useChartAccessibility-9icAAmYg.js";
-import ot from "./Title-apr_T9tg.js";
+import ot from "./Title-DoWqzga-.js";
 import { _ as nt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["id"], vt = ["stop-color"], dt = ["stop-color"], ht = ["stop-color"], ft = ["stroke", "stroke-width"], bt = ["stroke", "stroke-width"], mt = ["x", "y", "font-size", "fill", "font-weight"], yt = ["points", "fill"], gt = ["stroke", "stroke-width", "rx"], pt = ["x", "y", "font-size", "fill", "font-weight"], kt = ["x", "y", "font-size", "fill", "font-weight"], Ct = {
   key: 5,
@@ -28,15 +28,15 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
   },
   setup(ke, { expose: Ce }) {
     Ie((t) => ({
-      "304c9121": Pe.value
+      "0918d580": Pe.value
     }));
-    const we = O(() => import("./vue-ui-accordion-Ds4zkPIx.js")), $e = O(() => import("./DataTable-BBqbcutV.js")), xe = O(() => import("./PackageVersion-ClpqQxYT.js")), _e = O(() => import("./PenAndPaper-B-T7XvxF.js")), Le = O(() => import("./vue-ui-skeleton-C6PWt_m5.js")), Ae = O(() => import("./UserOptions-OVNxxnq5.js")), { vue_ui_funnel: Te } = Ge(), y = ke, R = v(null), S = v(je()), Q = v(0), Z = v(0), ee = v(0), te = v(null), ae = v(null), le = v(null), C = ye(null), L = ye(null), $ = v(!1), A = c(() => !!y.dataset && y.dataset.length);
+    const we = O(() => import("./vue-ui-accordion-CXsjHe1y.js")), $e = O(() => import("./DataTable-DBkfb6pd.js")), xe = O(() => import("./PackageVersion-C5fpg4GN.js")), _e = O(() => import("./PenAndPaper-BRkuVFb4.js")), Le = O(() => import("./vue-ui-skeleton-Fxr752Oi.js")), Ae = O(() => import("./UserOptions-B3q-xfQV.js")), { vue_ui_funnel: Te } = Ge(), m = ke, R = d(null), S = d(je()), Q = d(0), Z = d(0), ee = d(0), te = d(null), ae = d(null), le = d(null), C = ye(null), L = ye(null), $ = d(!1), A = v(() => !!m.dataset && m.dataset.length);
     De(se);
     function se() {
-      if (He(y.dataset) ? ge({
+      if (He(m.dataset) ? ge({
         componentName: "VueUiFunnel",
         type: "dataset"
-      }) : y.dataset.forEach((t, l) => {
+      }) : m.dataset.forEach((t, l) => {
         Xe({
           datasetObject: t,
           requiredAttributes: ["name", "value"]
@@ -57,19 +57,19 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
             noTitle: te.value
           });
           requestAnimationFrame(() => {
-            i.value.height = a, i.value.width = l, k.value = he(), e.value.responsiveProportionalSizing && (d.value.circles = K({
+            i.value.height = a, i.value.width = l, k.value = he(), e.value.responsiveProportionalSizing && (h.value.circles = K({
               relator: Math.min(l, a),
               adjuster: 600,
               source: e.value.style.chart.circles.dataLabels.fontSize,
               threshold: 10,
               fallback: 10
-            }), d.value.names = K({
+            }), h.value.names = K({
               relator: Math.min(l, a),
               adjuster: 600,
               source: e.value.style.chart.bars.dataLabels.name.fontSize,
               threshold: 10,
               fallback: 10
-            }), d.value.values = K({
+            }), h.value.values = K({
               relator: Math.min(l, a),
               adjuster: 600,
               source: e.value.style.chart.bars.dataLabels.value.fontSize,
@@ -86,42 +86,42 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
     });
     function oe() {
       const t = pe({
-        userConfig: y.config,
+        userConfig: m.config,
         defaultConfig: Te
       });
       return t.theme ? {
         ...pe({
-          userConfig: Ke.vue_ui_funnel[t.theme] || y.config,
+          userConfig: Ke.vue_ui_funnel[t.theme] || m.config,
           defaultConfig: t
         })
       } : t;
     }
-    const e = c({
+    const e = v({
       get: () => oe(),
       set: (t) => t
     }), { userOptionsVisible: q, setUserOptionsVisibility: ne, keepUserOptionState: re } = lt({ config: e.value }), { svgRef: ue } = st({ config: e.value.style.chart.title });
-    Me(() => y.config, (t) => {
-      e.value = oe(), q.value = !e.value.userOptions.showOnChartHover, se(), Z.value += 1, ee.value += 1, d.value.circles = e.value.style.chart.circles.dataLabels.fontSize, d.value.names = e.value.style.chart.bars.dataLabels.name.fontSize, d.value.values = e.value.style.chart.bars.dataLabels.value.fontSize, P.value.showTable = e.value.table.show;
+    Me(() => m.config, (t) => {
+      e.value = oe(), q.value = !e.value.userOptions.showOnChartHover, se(), Z.value += 1, ee.value += 1, h.value.circles = e.value.style.chart.circles.dataLabels.fontSize, h.value.names = e.value.style.chart.bars.dataLabels.name.fontSize, h.value.values = e.value.style.chart.bars.dataLabels.value.fontSize, P.value.showTable = e.value.table.show;
     }, { deep: !0 });
     const { isPrinting: ie, isImaging: ce, generatePdf: ve, generateImage: de } = et({
       elementId: `funnel_${S.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-funnel",
       options: e.value.userOptions.print
-    }), Oe = c(() => e.value.userOptions.show && !e.value.style.chart.title.text), P = v({
+    }), Oe = v(() => e.value.userOptions.show && !e.value.style.chart.title.text), P = d({
       showTable: e.value.table.show
-    }), d = v({
+    }), h = d({
       circles: e.value.style.chart.circles.dataLabels.fontSize,
       names: e.value.style.chart.bars.dataLabels.name.fontSize,
       values: e.value.style.chart.bars.dataLabels.value.fontSize
-    }), i = c({
+    }), i = v({
       get: () => ({
         height: e.value.style.chart.height,
         width: e.value.style.chart.width
       }),
       set: (t) => t
-    }), p = c(() => A.value ? y.dataset.map((t, l) => ({
+    }), p = v(() => A.value ? m.dataset.map((t, l) => ({
       ...t,
-      color: t.color ? qe(t.color) : Ye(e.value.style.chart.bars.defaultColor, l / y.dataset.length)
+      color: t.color ? qe(t.color) : Ye(e.value.style.chart.bars.defaultColor, l / m.dataset.length)
     })) : []);
     setTimeout(() => {
       $.value = !0;
@@ -137,8 +137,8 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
         height: i.value.height - l - e.value.style.chart.padding.bottom
       };
     }
-    const k = v(he()), T = c(() => k.value.height / y.dataset.length), x = c(() => T.value * e.value.style.chart.bars.gapRatio), fe = c(() => k.value.width * e.value.style.chart.barCircleSpacingRatio), r = c(() => p.value.map((t, l) => {
-      const a = T.value - x.value, n = k.value.top + x.value / 2 * l + (T.value - x.value / 2) * l + x.value / 2, b = t.value / p.value[0].value, h = (k.value.width - a - fe.value) * (t.value / p.value[0].value);
+    const k = d(he()), T = v(() => k.value.height / m.dataset.length), x = v(() => T.value * e.value.style.chart.bars.gapRatio), fe = v(() => k.value.width * e.value.style.chart.barCircleSpacingRatio), r = v(() => p.value.map((t, l) => {
+      const a = T.value - x.value, n = k.value.top + x.value / 2 * l + (T.value - x.value / 2) * l + x.value / 2, y = t.value / p.value[0].value, c = (k.value.width - a - fe.value) * (t.value / p.value[0].value);
       return {
         ...t,
         cx: k.value.left + a / 2,
@@ -146,65 +146,65 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
         datapointIndex: l,
         fill: t.color,
         height: Math.max(a, 0),
-        proportion: b,
+        proportion: y,
         r: Math.max(a / 2, 0),
-        width: Math.max(h, 0),
+        width: Math.max(c, 0),
         x: k.value.left + a + fe.value,
         y: n
       };
-    })), Ne = c(() => {
+    })), Ne = v(() => {
       const t = r.value.map((l) => `${l.x + l.width},${l.y + (T.value - x.value) / 2}`);
       return `${r.value[0].x},${r.value[0].y + (T.value - x.value) / 2} ${t.toString()} ${r.value.at(-1).x},${r.value.at(-1).y + (T.value - x.value) / 2}`;
-    }), ze = c(() => ({
+    }), ze = v(() => ({
       x1: r.value[0].cx,
       y1: r.value[0].cy,
       x2: r.value.at(-1).cx,
       y2: r.value.at(-1).cy
-    })), F = v(!1);
+    })), F = d(!1);
     function Se(t) {
       F.value = t, Q.value += 1;
     }
-    const Pe = c(() => `${p.value.length * 150}ms`), M = v(!1);
+    const Pe = v(() => `${p.value.length * 150}ms`), M = d(!1);
     function Y() {
       M.value = !M.value;
     }
     function be() {
       P.value.showTable = !P.value.showTable;
     }
-    const I = c(() => {
+    const I = v(() => {
       const t = p.value.map((a) => ({
         name: a.name,
         color: a.color
       })), l = p.value.map((a) => a.value);
       return { head: t, body: l };
-    }), V = c(() => {
+    }), V = v(() => {
       const t = [
         e.value.table.columnNames.series,
         e.value.table.columnNames.value,
         e.value.table.columnNames.percentage
-      ], l = I.value.head.map((b, h) => {
+      ], l = I.value.head.map((y, c) => {
         const D = H(
           e.value.style.chart.bars.dataLabels.value.formatter,
-          I.value.body[h],
+          I.value.body[c],
           X({
             p: e.value.style.chart.bars.dataLabels.value.prefix,
-            v: I.value.body[h],
+            v: I.value.body[c],
             s: e.value.style.chart.bars.dataLabels.value.suffix,
             r: e.value.table.td.roundingValue
           }),
-          { datapoint: r.value[h] }
+          { datapoint: r.value[c] }
         ), W = H(
           e.value.style.chart.circles.dataLabels.formatter,
-          r.value[h].proportion * 100,
+          r.value[c].proportion * 100,
           X({
-            v: r.value[h].proportion * 100,
+            v: r.value[c].proportion * 100,
             s: "%",
             r: e.value.table.td.roundingPercentage
           }),
-          { datapoint: r.value[h] }
+          { datapoint: r.value[c] }
         );
         return [
-          { color: b.color, name: b.name },
+          { color: y.color, name: y.name },
           D,
           W
         ];
@@ -232,12 +232,12 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
         config: a
       };
     });
-    function me() {
+    function me(t = null) {
       Ue(() => {
-        const t = I.value.head.map((n, b) => [[
-          n.name
-        ], [I.value.body[b]], [r.value[b].proportion * 100]]), l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[e.value.table.columnNames.series], [e.value.table.columnNames.value], ["%"]]].concat(t), a = Qe(l);
-        Ze({ csvContent: a, title: e.value.style.chart.title.text || "vue-ui-funnel" });
+        const l = I.value.head.map((y, c) => [[
+          y.name
+        ], [I.value.body[c]], [r.value[c].proportion * 100]]), a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[e.value.table.columnNames.series], [e.value.table.columnNames.value], ["%"]]].concat(l), n = Qe(a);
+        t ? t(n) : Ze({ csvContent: n, title: e.value.style.chart.title.text || "vue-ui-funnel" });
       });
     }
     function Fe() {
@@ -329,49 +329,49 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
         t.$slots.menuIcon ? {
           name: "menuIcon",
           fn: g(({ isOpen: a, color: n }) => [
-            m(t.$slots, "menuIcon", B(E({ isOpen: a, color: n })), void 0, !0)
+            b(t.$slots, "menuIcon", B(E({ isOpen: a, color: n })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         t.$slots.optionPdf ? {
           name: "optionPdf",
           fn: g(() => [
-            m(t.$slots, "optionPdf", {}, void 0, !0)
+            b(t.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         t.$slots.optionCsv ? {
           name: "optionCsv",
           fn: g(() => [
-            m(t.$slots, "optionCsv", {}, void 0, !0)
+            b(t.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         t.$slots.optionImg ? {
           name: "optionImg",
           fn: g(() => [
-            m(t.$slots, "optionImg", {}, void 0, !0)
+            b(t.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         t.$slots.optionTable ? {
           name: "optionTable",
           fn: g(() => [
-            m(t.$slots, "optionTable", {}, void 0, !0)
+            b(t.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
           fn: g(({ toggleFullscreen: a, isFullscreen: n }) => [
-            m(t.$slots, "optionFullscreen", B(E({ toggleFullscreen: a, isFullscreen: n })), void 0, !0)
+            b(t.$slots, "optionFullscreen", B(E({ toggleFullscreen: a, isFullscreen: n })), void 0, !0)
           ]),
           key: "5"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
           fn: g(({ toggleAnnotator: a, isAnnotator: n }) => [
-            m(t.$slots, "optionAnnotator", B(E({ toggleAnnotator: a, isAnnotator: n })), void 0, !0)
+            b(t.$slots, "optionAnnotator", B(E({ toggleAnnotator: a, isAnnotator: n })), void 0, !0)
           ]),
           key: "6"
         } : void 0
@@ -396,7 +396,7 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
             pointerEvents: "none"
           }
         }, [
-          m(t.$slots, "chart-background", {}, void 0, !0)
+          b(t.$slots, "chart-background", {}, void 0, !0)
         ], 8, it)) : f("", !0),
         w("defs", null, [
           w("linearGradient", {
@@ -433,7 +433,7 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
             strokeDashoffset: e.value.useCssAnimation ? k.value.height : 0
           }
         }), null, 16, ft)) : f("", !0),
-        (o(!0), u(U, null, G(r.value, ({ cx: a, cy: n, r: b, fill: h }, D) => (o(), u("circle", J({ ref_for: !0 }, { cx: a, cy: n, r: b, fill: h }, {
+        (o(!0), u(U, null, G(r.value, ({ cx: a, cy: n, r: y, fill: c }, D) => (o(), u("circle", J({ ref_for: !0 }, { cx: a, cy: n, r: y, fill: c }, {
           stroke: e.value.style.chart.circles.stroke,
           "stroke-width": e.value.style.chart.circles.strokeWidth,
           class: {
@@ -445,9 +445,9 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
         }), null, 16, bt))), 256)),
         (o(!0), u(U, null, G(r.value, (a, n) => (o(), u("text", {
           x: a.cx,
-          y: a.cy + d.value.circles / 3 + e.value.style.chart.circles.dataLabels.offsetY,
+          y: a.cy + h.value.circles / 3 + e.value.style.chart.circles.dataLabels.offsetY,
           "text-anchor": "middle",
-          "font-size": d.value.circles,
+          "font-size": h.value.circles,
           fill: e.value.style.chart.circles.dataLabels.adaptColorToBackground ? s(Je)(a.color) : e.value.style.chart.circles.dataLabels.color,
           "font-weight": e.value.style.chart.circles.dataLabels.bold ? "bold" : "normal",
           class: N({
@@ -477,7 +477,7 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
             transition: e.value.useCssAnimation ? `all ${150 * p.value.length}ms ease-in` : "none"
           })
         }, null, 14, yt)) : f("", !0),
-        (o(!0), u(U, null, G(r.value, ({ x: a, y: n, height: b, width: h, fill: D }, W) => (o(), u("rect", J({ ref_for: !0 }, { x: a, y: n, height: b, width: h, fill: D }, {
+        (o(!0), u(U, null, G(r.value, ({ x: a, y: n, height: y, width: c, fill: D }, W) => (o(), u("rect", J({ ref_for: !0 }, { x: a, y: n, height: y, width: c, fill: D }, {
           stroke: e.value.style.chart.bars.stroke,
           "stroke-width": e.value.style.chart.bars.strokeWidth,
           rx: e.value.style.chart.bars.borderRadius,
@@ -491,9 +491,9 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
         (o(!0), u(U, null, G(r.value, (a, n) => (o(), u("g", null, [
           w("text", {
             x: a.x + a.width + e.value.style.chart.bars.dataLabels.name.offsetX + 12,
-            y: a.cy - d.value.names / 2 + e.value.style.chart.bars.dataLabels.name.offsetY,
+            y: a.cy - h.value.names / 2 + e.value.style.chart.bars.dataLabels.name.offsetY,
             "text-anchor": "start",
-            "font-size": d.value.names,
+            "font-size": h.value.names,
             fill: e.value.style.chart.bars.dataLabels.name.color,
             "font-weight": e.value.style.chart.bars.dataLabels.name.bold ? "bold" : "normal",
             class: N({
@@ -505,9 +505,9 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
           }, j(a.name), 15, pt),
           w("text", {
             x: a.x + a.width + e.value.style.chart.bars.dataLabels.value.offsetX + 12,
-            y: a.cy + d.value.values + e.value.style.chart.bars.dataLabels.value.offsetY,
+            y: a.cy + h.value.values + e.value.style.chart.bars.dataLabels.value.offsetY,
             "text-anchor": "start",
-            "font-size": d.value.values,
+            "font-size": h.value.values,
             fill: e.value.style.chart.bars.dataLabels.value.color,
             "font-weight": e.value.style.chart.bars.dataLabels.value.bold ? "bold" : "normal",
             class: N({
@@ -528,10 +528,10 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
             { datapoint: a }
           )), 15, kt)
         ]))), 256)),
-        m(t.$slots, "svg", { svg: i.value }, void 0, !0)
+        b(t.$slots, "svg", { svg: i.value }, void 0, !0)
       ], 14, ut)) : f("", !0),
       t.$slots.watermark ? (o(), u("div", Ct, [
-        m(t.$slots, "watermark", B(E({ isPrinting: s(ie) || s(ce) })), void 0, !0)
+        b(t.$slots, "watermark", B(E({ isPrinting: s(ie) || s(ce) })), void 0, !0)
       ])) : f("", !0),
       A.value ? f("", !0) : (o(), z(s(Le), {
         key: 6,
@@ -554,7 +554,7 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
         ref: ae,
         dir: "auto"
       }, [
-        m(t.$slots, "source", {}, void 0, !0)
+        b(t.$slots, "source", {}, void 0, !0)
       ], 512)) : f("", !0),
       A.value ? (o(), z(s(we), {
         key: 8,
@@ -598,7 +598,7 @@ const rt = ["id"], ut = ["xmlns", "viewBox"], it = ["width", "height"], ct = ["i
       }, 8, ["config"])) : f("", !0)
     ], 46, rt));
   }
-}, Pt = /* @__PURE__ */ nt($t, [["__scopeId", "data-v-546b87bd"]]);
+}, Pt = /* @__PURE__ */ nt($t, [["__scopeId", "data-v-f6eb5104"]]);
 export {
   Pt as default
 };