vue-data-ui 3.10.0 → 3.10.2

package/dist/{vue-ui-flow-CavJTxRY.js → vue-ui-flow-Cp2le1ur.js}

@@ -1,43 +1,47 @@
-import { defineAsyncComponent as j, ref as u, computed as f, onMounted as Bo, toRefs as Do, watch as xe, createElementBlock as m, openBlock as c, unref as r, normalizeStyle as U, normalizeClass as Ht, createBlock as Q, createCommentVNode as $, createElementVNode as W, createVNode as Oe, withCtx as v, renderSlot as h, normalizeProps as P, guardReactiveProps as I, createSlots as jt, Fragment as he, renderList as ge, withKeys as Je, withModifiers as Qe, toDisplayString as pe, Teleport as Po, resolveDynamicComponent as Io, mergeProps as Mo, createTextVNode as Ut, nextTick as Wt } from "vue";
-import { c as _e, t as zo, o as Gt, g as Lo, i as Ro, j as R, k as Yo, U as T, m as Ho, d as le, X as jo, a as Ne, x as Vt, G as Uo, v as Wo, r as Go, y as Vo } from "./lib-2iaAPQ_c.js";
-import { t as Xo, u as qo } from "./useResponsive-DfdjqQps.js";
-import { u as Ko, a as et } from "./useNestedProp-BCt4DMkT.js";
-import { u as Zo } from "./usePrinter-ChVMpU2f.js";
-import { u as Jo, B as Qo } from "./BaseScanner-BMpwQAfz.js";
-import { u as el } from "./useSvgExport-ByUukOZt.js";
-import { u as tl } from "./useThemeCheck-DGJ31Vi5.js";
-import { u as ol } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as ll } from "./useChartAccessibility-9icAAmYg.js";
-import al from "./Legend-D2xmnFPH.js";
-import nl from "./Title-B5L2jweB.js";
-import sl from "./img-CqYIrJ8I.js";
-import { _ as rl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" }, legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, nodes: { stroke: "#1A1A1A" }, links: { stroke: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, qt = { style: { chart: { backgroundColor: "#FFF8E1", color: "#424242", tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" }, legend: { backgroundColor: "#FFF8E1", color: "#424242" }, title: { color: "#424242", subtitle: { color: "#757575" } }, nodes: { stroke: "#3A3A3A" }, links: { stroke: "#3A3A3A" } } }, table: { th: { backgroundColor: "#FFF8E1", color: "#424242" }, td: { backgroundColor: "#FFF8E1", color: "#424242" } } }, Kt = { style: { chart: { backgroundColor: "#1E1E1E", color: "#BDBDBD", tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, legend: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, nodes: { stroke: "#1E1E1E" }, links: { stroke: "#1E1E1E" } } }, table: { th: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, td: { backgroundColor: "#1E1E1E", color: "#BDBDBD" } } }, Zt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#99AA99", tooltip: { backgroundColor: "#2A2F2A", color: "#AACCAA", borderColor: "#66CC66" }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, legend: { backgroundColor: "#1A1A1A", color: "#99AA99" }, nodes: { stroke: "#1A1A1A" }, links: { stroke: "#1A1A1A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#99AA99" }, td: { backgroundColor: "#1A1A1A", color: "#AACCAA" } } }, Jt = { style: { chart: { backgroundColor: "#fbfafa", color: "#8A9892", tooltip: { backgroundColor: "#fbfafa", color: "#8A9892" }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, legend: { backgroundColor: "#fbfafa", color: "#99AA99" }, nodes: { stroke: "#fbfafa" }, links: { stroke: "#fbfafa" } } }, table: { th: { backgroundColor: "#fbfafa", color: "#8F837A" }, td: { backgroundColor: "#fbfafa", color: "#8F837A" } } }, Qt = { style: { chart: { backgroundColor: "#f6f6fb", color: "#50606C", tooltip: { backgroundColor: "#f6f6fb", color: "#50606C" }, title: { color: "#50606C", subtitle: { color: "#718890" } }, legend: { backgroundColor: "#f6f6fb", color: "#61747E" }, nodes: { stroke: "#f6f6fb" }, links: { stroke: "#f6f6fb" } } }, table: { th: { backgroundColor: "#f6f6fb", color: "#50606C" }, td: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, eo = {
+import { defineAsyncComponent as j, ref as u, computed as f, onMounted as Po, toRefs as Io, watch as xe, createElementBlock as C, openBlock as c, unref as r, normalizeStyle as U, normalizeClass as Ht, createBlock as Q, createCommentVNode as $, createElementVNode as W, createVNode as Oe, withCtx as v, renderSlot as h, normalizeProps as P, guardReactiveProps as I, createSlots as jt, Fragment as he, renderList as ge, withKeys as Je, withModifiers as Qe, toDisplayString as pe, Teleport as Mo, resolveDynamicComponent as zo, mergeProps as Lo, createTextVNode as Ut, nextTick as Wt } from "vue";
+import { c as _e, t as Ro, o as Gt, g as Yo, i as Ho, j as R, k as jo, U as T, m as Uo, d as le, X as Wo, a as Ne, x as Vt, G as Go, v as Vo, r as Xo, y as qo } from "./lib-CVHM9FhP.js";
+import { t as Ko, u as Zo } from "./useResponsive-DfdjqQps.js";
+import { u as Jo, a as et } from "./useNestedProp-Ckf_2P_V.js";
+import { u as Qo } from "./usePrinter-1NmjuP-i.js";
+import { u as el, B as tl } from "./BaseScanner-BMpwQAfz.js";
+import { u as ol } from "./useSvgExport-ByUukOZt.js";
+import { u as ll } from "./useThemeCheck-D1ZYXUwG.js";
+import { u as al } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as nl } from "./useChartAccessibility-9icAAmYg.js";
+import sl from "./Legend-DN5UJOBH.js";
+import rl from "./Title-NgeRXqRA.js";
+import ul from "./img-6fNF_rG0.js";
+import { _ as il } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const Xt = { userOptions: { show: !1 } }, qt = { userOptions: { show: !1 }, style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#3A3A3A" }, legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, nodes: { stroke: "#1A1A1A" }, links: { stroke: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, Kt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" }, legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, nodes: { stroke: "#1A1A1A" }, links: { stroke: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, Zt = { style: { chart: { backgroundColor: "#FFF8E1", color: "#424242", tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" }, legend: { backgroundColor: "#FFF8E1", color: "#424242" }, title: { color: "#424242", subtitle: { color: "#757575" } }, nodes: { stroke: "#3A3A3A" }, links: { stroke: "#3A3A3A" } } }, table: { th: { backgroundColor: "#FFF8E1", color: "#424242" }, td: { backgroundColor: "#FFF8E1", color: "#424242" } } }, Jt = { style: { chart: { backgroundColor: "#1E1E1E", color: "#BDBDBD", tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, legend: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, nodes: { stroke: "#1E1E1E" }, links: { stroke: "#1E1E1E" } } }, table: { th: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, td: { backgroundColor: "#1E1E1E", color: "#BDBDBD" } } }, Qt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#99AA99", tooltip: { backgroundColor: "#2A2F2A", color: "#AACCAA", borderColor: "#66CC66" }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, legend: { backgroundColor: "#1A1A1A", color: "#99AA99" }, nodes: { stroke: "#1A1A1A" }, links: { stroke: "#1A1A1A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#99AA99" }, td: { backgroundColor: "#1A1A1A", color: "#AACCAA" } } }, eo = { style: { chart: { backgroundColor: "#fbfafa", color: "#8A9892", tooltip: { backgroundColor: "#fbfafa", color: "#8A9892" }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, legend: { backgroundColor: "#fbfafa", color: "#99AA99" }, nodes: { stroke: "#fbfafa" }, links: { stroke: "#fbfafa" } } }, table: { th: { backgroundColor: "#fbfafa", color: "#8F837A" }, td: { backgroundColor: "#fbfafa", color: "#8F837A" } } }, to = { style: { chart: { backgroundColor: "#f6f6fb", color: "#50606C", tooltip: { backgroundColor: "#f6f6fb", color: "#50606C" }, title: { color: "#50606C", subtitle: { color: "#718890" } }, legend: { backgroundColor: "#f6f6fb", color: "#61747E" }, nodes: { stroke: "#f6f6fb" }, links: { stroke: "#f6f6fb" } } }, table: { th: { backgroundColor: "#f6f6fb", color: "#50606C" }, td: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, oo = {
   default: {},
-  dark: Xt,
-  celebration: qt,
-  celebrationNight: Kt,
-  hack: Zt,
-  zen: Jt,
-  concrete: Qt
-}, Yl = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  minimal: Xt,
+  minimalDark: qt,
+  dark: Kt,
+  celebration: Zt,
+  celebrationNight: Jt,
+  hack: Qt,
+  zen: eo,
+  concrete: to
+}, jl = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  celebration: qt,
-  celebrationNight: Kt,
-  concrete: Qt,
-  dark: Xt,
-  default: eo,
-  hack: Zt,
-  zen: Jt
-}, Symbol.toStringTag, { value: "Module" })), ul = ["id"], il = {
+  celebration: Zt,
+  celebrationNight: Jt,
+  concrete: to,
+  dark: Kt,
+  default: oo,
+  hack: Qt,
+  minimal: Xt,
+  minimalDark: qt,
+  zen: eo
+}, Symbol.toStringTag, { value: "Module" })), cl = ["id"], dl = {
   key: 1,
   ref: "noTitle",
   class: "vue-data-ui-no-title-space",
   style: "height:36px; width: 100%;background:transparent"
-}, cl = ["id"], dl = ["xmlns", "viewBox"], vl = ["width", "height"], fl = ["id"], hl = ["stop-color"], gl = ["stop-color"], pl = ["d", "fill", "stroke", "stroke-width"], bl = ["x", "y", "height", "width", "fill", "stroke", "stroke-width", "rx", "aria-label", "onMouseenter", "onMouseleave", "onClick", "onKeydown", "onFocus", "onBlur"], ml = { key: 1 }, yl = ["x", "y", "font-size", "fill"], Cl = ["x", "y", "font-size", "fill"], kl = {
+}, vl = ["id"], fl = ["xmlns", "viewBox"], hl = ["width", "height"], gl = ["id"], pl = ["stop-color"], bl = ["stop-color"], Cl = ["d", "fill", "stroke", "stroke-width"], ml = ["x", "y", "height", "width", "fill", "stroke", "stroke-width", "rx", "aria-label", "onMouseenter", "onMouseleave", "onClick", "onKeydown", "onFocus", "onBlur"], yl = { key: 1 }, kl = ["x", "y", "font-size", "fill"], Al = ["x", "y", "font-size", "fill"], wl = {
   key: 4,
   class: "vue-data-ui-watermark"
-}, Al = ["id"], wl = ["onClick"], $l = ["innerHTML"], Tl = {
+}, $l = ["id"], Tl = ["onClick"], Fl = ["innerHTML"], Sl = {
   __name: "vue-ui-flow",
   props: {
     config: {
@@ -53,17 +57,17 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       }
     }
   },
-  setup(to, { expose: oo }) {
-    const lo = j(() => import("./Tooltip-DpfUZbt7.js")), ao = j(() => import("./BaseIcon-B9bGT7HU.js")), no = j(() => import("./vue-ui-accordion-CAXPDm31.js")), so = j(() => import("./DataTable-DEwh__D8.js")), ro = j(() => import("./PenAndPaper-CulSakut.js")), uo = j(() => import("./UserOptions-5pXc4J-c.js")), io = j(() => import("./PackageVersion-C-JOGZBL.js")), co = j(() => import("./BaseDraggableDialog-O2XSymlZ.js")), { vue_ui_flow: vo } = Ko(), { isThemeValid: fo, warnInvalidTheme: ho } = tl(), F = to, G = u(_e()), B = u(null), tt = u(0), ot = u(0), Be = u(!1), De = u(""), lt = u(null), at = u(null), nt = u(null), ae = u(null), be = u(null), st = u(!1), ne = u(null), Pe = u(null), Ie = u(null), rt = f(() => !!F.dataset && F.dataset.length);
-    Bo(() => {
+  setup(lo, { expose: ao }) {
+    const no = j(() => import("./Tooltip-B6qvABDL.js")), so = j(() => import("./BaseIcon-4uOct8re.js")), ro = j(() => import("./vue-ui-accordion-DFKaB_05.js")), uo = j(() => import("./DataTable-DyoDzNNY.js")), io = j(() => import("./PenAndPaper-LTuSTmWE.js")), co = j(() => import("./UserOptions-CX7Xsusk.js")), vo = j(() => import("./PackageVersion-CQxJyGQr.js")), fo = j(() => import("./BaseDraggableDialog-BQYfVNu8.js")), { vue_ui_flow: ho } = Jo(), { isThemeValid: go, warnInvalidTheme: po } = ll(), F = lo, G = u(_e()), B = u(null), tt = u(0), ot = u(0), Be = u(!1), De = u(""), lt = u(null), at = u(null), nt = u(null), ae = u(null), be = u(null), st = u(!1), ne = u(null), Pe = u(null), Ie = u(null), rt = f(() => !!F.dataset && F.dataset.length);
+    Po(() => {
       st.value = !0, it();
     });
     const V = u(!1);
     function ut(o) {
       V.value = o, tt.value += 1;
     }
-    const e = u(Ye()), { loading: Me, FINAL_DATASET: me, manualLoading: ze } = Jo({
-      ...Do(F),
+    const e = u(Ye()), { loading: Me, FINAL_DATASET: Ce, manualLoading: ze } = el({
+      ...Io(F),
       FINAL_CONFIG: e,
       prepareConfig: Ye,
       skeletonDataset: [
@@ -74,7 +78,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
         ["F", "G", 0.5, "#AAAAAA"],
         ["G", "H", 0.25, "#AAAAAA"]
       ],
-      skeletonConfig: zo({
+      skeletonConfig: Ro({
         defaultConfig: e.value,
         userConfig: {
           userOptions: { show: !1 },
@@ -106,15 +110,15 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
           }
         }
       })
-    }), go = f(() => !!e.value.debug);
+    }), bo = f(() => !!e.value.debug);
     function it() {
-      if (Gt(F.dataset) && (Lo({
+      if (Gt(F.dataset) && (Yo({
         componentName: "VueUiFlow",
         type: "dataset",
-        debug: go.value
+        debug: bo.value
       }), ze.value = !0), Gt(F.dataset) || (ze.value = e.value.loading), e.value.responsive) {
-        const o = Xo(() => {
-          const { width: l, height: t } = qo({
+        const o = Ko(() => {
+          const { width: l, height: t } = Zo({
             chart: B.value,
             title: e.value.style.chart.title.text ? at.value : null,
             legend: e.value.style.chart.legend.show ? lt.value : null,
@@ -127,22 +131,22 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
         ae.value && (be.value && ae.value.unobserve(be.value), ae.value.disconnect()), ae.value = new ResizeObserver(o), be.value = B.value.parentNode, ae.value.observe(be.value);
       }
     }
-    const { userOptionsVisible: Le, setUserOptionsVisibility: ct, keepUserOptionState: dt } = ol({ config: e.value }), { svgRef: Re } = ll({
+    const { userOptionsVisible: Le, setUserOptionsVisibility: ct, keepUserOptionState: dt } = al({ config: e.value }), { svgRef: Re } = nl({
       config: e.value.style.chart.title
     });
     function Ye() {
       const o = et({
         userConfig: F.config,
-        defaultConfig: vo
+        defaultConfig: ho
       });
       let l = o;
       const t = o.theme;
       if (t)
-        if (!fo.value(o))
-          ho(o), l = o;
+        if (!go.value(o))
+          po(o), l = o;
         else {
           const a = et({
-            userConfig: eo[t] || F.config,
+            userConfig: oo[t] || F.config,
             defaultConfig: o
           });
           l = {
@@ -150,7 +154,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
               userConfig: F.config,
               defaultConfig: a
             }),
-            customPalette: o.customPalette.length ? o.customPalette : Ro[t] || R
+            customPalette: o.customPalette.length ? o.customPalette : Ho[t] || R
           };
         }
       else
@@ -167,11 +171,11 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
     ), xe(() => F.dataset, (o) => {
       Array.isArray(o) && o.length > 0 && (ze.value = !1);
     }, { deep: !0 });
-    const { isPrinting: ht, isImaging: gt, generatePdf: pt, generateImage: bt } = Zo({
+    const { isPrinting: ht, isImaging: gt, generatePdf: pt, generateImage: bt } = Qo({
       elementId: `flow_${G.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-flow",
       options: e.value.userOptions.print
-    }), po = f(() => e.value.userOptions.show && !e.value.style.chart.title.text), ye = f(() => Yo(e.value.customPalette)), Ce = f(() => e.value.style.chart.nodes.width), S = u({
+    }), Co = f(() => e.value.userOptions.show && !e.value.style.chart.title.text), me = f(() => jo(e.value.customPalette)), ye = f(() => e.value.style.chart.nodes.width), S = u({
       showTable: e.value.table.show,
       showTooltip: e.value.style.chart.tooltip.show
     });
@@ -181,13 +185,13 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
         showTooltip: e.value.style.chart.tooltip.show
       };
     }, { immediate: !0 });
-    const mt = f(() => !me.value || !me.value.length ? [] : me.value.map((o, l) => [
+    const Ct = f(() => !Ce.value || !Ce.value.length ? [] : Ce.value.map((o, l) => [
       o[0],
       o[1],
       T(o[2]),
-      o[3] ? Ho(o[3]) : ye.value[l] || ye.value[l % ye.value.length] || R[l] || R[l % R.length]
+      o[3] ? Uo(o[3]) : me.value[l] || me.value[l % me.value.length] || R[l] || R[l % R.length]
     ]));
-    function bo(o) {
+    function mo(o) {
       const l = {}, t = {};
       function a(n, i) {
         l[n] || (l[n] = {
@@ -205,7 +209,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       });
       const s = new Set(o.map(([n]) => n)), w = new Set(o.map(([, n]) => n)), te = Array.from(s).filter((n) => !w.has(n)), ce = {};
       te.forEach((n, i) => {
-        ce[n] = ye.value[i] || R[i % R.length];
+        ce[n] = me.value[i] || R[i % R.length];
       });
       const de = {};
       o.forEach(([n, i, g, p]) => {
@@ -216,7 +220,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       }), Object.keys(l).forEach((n) => {
         l[n].value = Math.max(l[n].inflow, l[n].outflow);
       });
-      const Fe = se.value, Ve = kt.value.width, oe = kt.value.height, z = Object.keys(t).map(Number).sort((n, i) => n - i), Se = z.length || 1, Xe = Se > 1 ? Ve / (Se - 1) : 0, x = Number(Ce.value), M = Number(
+      const Fe = se.value, Ve = kt.value.width, oe = kt.value.height, z = Object.keys(t).map(Number).sort((n, i) => n - i), Se = z.length || 1, Xe = Se > 1 ? Ve / (Se - 1) : 0, x = Number(ye.value), M = Number(
         e.value.style.chart.nodes.gapPx ?? e.value.style.chart.nodes.gap ?? 8
       ), ve = Number(
         e.value.style.chart.nodes.minHeight || 0
@@ -225,28 +229,28 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
         const i = t[n], g = i.length;
         if (!g) return 1 / 0;
         const p = Math.max(0, (g - 1) * M), D = Math.max(0, oe - p), Y = Math.min(ve, g ? D / g : 0);
-        let C = 0, O = i.map((b) => l[b].value || 0), k = O.reduce((b, _) => b + _, 0);
+        let y = 0, O = i.map((b) => l[b].value || 0), k = O.reduce((b, _) => b + _, 0);
         for (let b = 0; b < 12; b += 1) {
-          const _ = k > 0 ? (D - C) / k : 0, H = [];
+          const _ = k > 0 ? (D - y) / k : 0, H = [];
           for (let N = 0; N < O.length; N += 1) {
             const L = O[N];
             L < 0 || L * _ < Y && H.push(N);
           }
           if (!H.length) return Math.max(0, _);
           for (const N of H)
-            C += Y, k -= O[N], O[N] = -1;
+            y += Y, k -= O[N], O[N] = -1;
           if (k <= 0) return 0;
         }
-        return k > 0 ? Math.max(0, (D - C) / k) : 0;
+        return k > 0 ? Math.max(0, (D - y) / k) : 0;
       }
-      const y = z.map(d), q = y.length ? Math.min(...y) : 0, K = {};
+      const m = z.map(d), q = m.length ? Math.min(...m) : 0, K = {};
       z.forEach((n) => {
-        const i = t[n], g = i.length, p = Math.max(0, (g - 1) * M), D = Math.max(0, oe - p), Y = Math.min(ve, g ? D / g : 0), C = i.map(
+        const i = t[n], g = i.length, p = Math.max(0, (g - 1) * M), D = Math.max(0, oe - p), Y = Math.min(ve, g ? D / g : 0), y = i.map(
           (b) => Math.max(Y, (l[b].value || 0) * q)
-        ), O = C.reduce((b, _) => b + _, 0) + p;
+        ), O = y.reduce((b, _) => b + _, 0) + p;
         let k = Math.max(0, (oe - O) / 2);
         i.forEach((b, _) => {
-          const H = C[_], N = Fe.left + n * Xe, L = k;
+          const H = y[_], N = Fe.left + n * Xe, L = k;
           K[b] = {
             x: N,
             y: L,
@@ -263,23 +267,23 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       Object.keys(l).forEach((n) => {
         qe[n] = K[n]?.y ?? 0, Ke[n] = 0;
       });
-      const xo = 1e-6, Oo = 0.25, _o = !!e.value.style.chart.links.smooth, Ot = 0.5;
+      const _o = 1e-6, No = 0.25, Bo = !!e.value.style.chart.links.smooth, Ot = 0.5;
       return z.forEach((n) => {
         t[n].forEach((g) => {
           const p = l[g], D = K[g];
           if (!p.children || !p.children.length) return;
           let Y = D.y;
-          p.children.forEach(({ target: C, value: O }) => {
-            const k = K[C], b = l[C], _ = p.outflow > 0 ? O / p.outflow : 0, H = b.inflow > 0 ? O / b.inflow : 0, N = T(Y + fe), L = T(
+          p.children.forEach(({ target: y, value: O }) => {
+            const k = K[y], b = l[y], _ = p.outflow > 0 ? O / p.outflow : 0, H = b.inflow > 0 ? O / b.inflow : 0, N = T(Y + fe), L = T(
               Y + _ * D.height + fe
-            ), _t = qe[C];
+            ), _t = qe[y];
             let Ee = _t + H * k.height;
-            Ke[C] += O;
-            const No = b.inflow > 0 && Ke[C] >= b.inflow - xo, Nt = k.y + k.height;
-            (No || Ee > Nt - Oo) && (Ee = Nt);
+            Ke[y] += O;
+            const Do = b.inflow > 0 && Ke[y] >= b.inflow - _o, Nt = k.y + k.height;
+            (Do || Ee > Nt - No) && (Ee = Nt);
             const Bt = T(_t + fe), Dt = T(Ee + fe), Z = T(D.x + x), J = T(k.x);
             let Ze;
-            if (!_o || J <= Z)
+            if (!Bo || J <= Z)
               Ze = `M ${Z} ${N} L ${Z} ${L} L ${J} ${Dt} L ${J} ${Bt} Z`;
             else {
               const Pt = J - Z, It = T(Z + Pt * Ot), Mt = T(J - Pt * Ot), zt = N, Lt = Bt, Rt = L, Yt = Dt;
@@ -288,18 +292,18 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
             xt.push({
               id: _e(),
               source: g,
-              target: C,
+              target: y,
               path: Ze,
               value: O,
               sourceColor: p.color,
-              targetColor: l[C].color
-            }), Y = L - fe, qe[C] = Ee;
+              targetColor: l[y].color
+            }), Y = L - fe, qe[y] = Ee;
           });
         });
       }), { nodeCoordinates: K, links: xt };
     }
     const E = f(() => {
-      const o = bo(me.value);
+      const o = mo(Ce.value);
       return {
         nodes: Object.keys(o.nodeCoordinates).map((l, t) => ({
           ...o.nodeCoordinates[l],
@@ -307,29 +311,29 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
         })),
         links: o.links
       };
-    }), yt = f(() => vt.value), Ct = f(() => ft.value), se = f(() => e.value.style.chart.padding), kt = f(() => ({
-      width: Math.max(0, yt.value - 40 - se.value.right - se.value.left),
-      height: Math.max(0, Ct.value - se.value.top - se.value.bottom)
+    }), mt = f(() => vt.value), yt = f(() => ft.value), se = f(() => e.value.style.chart.padding), kt = f(() => ({
+      width: Math.max(0, mt.value - 40 - se.value.right - se.value.left),
+      height: Math.max(0, yt.value - se.value.top - se.value.bottom)
     })), re = f(() => ({
-      width: yt.value,
-      height: Ct.value
+      width: mt.value,
+      height: yt.value
     }));
-    function mo(o) {
+    function yo(o) {
       const l = {}, t = {}, a = /* @__PURE__ */ new Set();
-      return mt.value.forEach(([s, w, te]) => {
+      return Ct.value.forEach(([s, w, te]) => {
         l[s] || (l[s] = []), t[w] || (t[w] = []), l[s].push(w), t[w].push(s);
       }), l[o] && l[o].forEach((s) => a.add(s)), t[o] && t[o].forEach((s) => a.add(s)), Array.from(a).concat(o);
     }
     const A = u(null), ee = u(null), ue = u(null), ke = u(!1), Ae = u(null);
     function At(o, l) {
-      X.value = [], A.value = mo(o.name), ee.value = o.name, Ae.value = o.id;
-      const t = o.name, a = mt.value;
+      X.value = [], A.value = yo(o.name), ee.value = o.name, Ae.value = o.id;
+      const t = o.name, a = Ct.value;
       let s = 0, w = 0, te = [], ce = [];
-      const de = new Set(a.map(([d]) => d)), Fe = new Set(a.map(([, d]) => d)), Ve = Array.from(de).filter((d) => !Fe.has(d)), oe = a.filter(([d]) => Ve.includes(d)).reduce((d, [y, q, K]) => d + K, 0), z = {};
+      const de = new Set(a.map(([d]) => d)), Fe = new Set(a.map(([, d]) => d)), Ve = Array.from(de).filter((d) => !Fe.has(d)), oe = a.filter(([d]) => Ve.includes(d)).reduce((d, [m, q, K]) => d + K, 0), z = {};
       E.value.nodes.forEach((d) => {
         z[d.name] = d.color;
-      }), a.forEach(([d, y, q]) => {
-        y === t && (s += q, te.push({ source: d, value: q, color: z[d] })), d === t && (w += q, ce.push({ target: y, value: q, color: z[y] }));
+      }), a.forEach(([d, m, q]) => {
+        m === t && (s += q, te.push({ source: d, value: q, color: z[d] })), d === t && (w += q, ce.push({ target: m, value: q, color: z[m] }));
       });
       const Se = Math.max(s, w), Xe = oe > 0 ? Se / oe * 100 : 0, x = {
         name: t,
@@ -343,7 +347,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: x, seriesIndex: l }), ue.value = { datapoint: x }, Be.value = !0;
       let M = "";
       const ve = e.value.style.chart.tooltip.customFormat;
-      if (ke.value = !1, Vo(ve))
+      if (ke.value = !1, qo(ve))
         try {
           const d = ve({
             datapoint: x,
@@ -361,24 +365,24 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
           s: "%",
           r: e.value.style.chart.tooltip.roundingPercentage
         })}</div>` : "";
-        M += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;"><span style="margin-right:4px; color:${x.color}">⏹</span>${x.name}${d}</div>`, x.from.length && (M += `<div>${e.value.style.chart.tooltip.translations.from}</div>`, x.from.forEach((y) => {
-          M += `<div><span style="color:${y.color}">⏹←</span> ${y.source}: ${Ne(
+        M += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;"><span style="margin-right:4px; color:${x.color}">⏹</span>${x.name}${d}</div>`, x.from.length && (M += `<div>${e.value.style.chart.tooltip.translations.from}</div>`, x.from.forEach((m) => {
+          M += `<div><span style="color:${m.color}">⏹←</span> ${m.source}: ${Ne(
             e.value.style.chart.nodes.labels.formatter,
-            y.value,
+            m.value,
             le({
               p: e.value.style.chart.nodes.labels.prefix,
-              v: y.value,
+              v: m.value,
               s: e.value.style.chart.nodes.labels.suffix,
               r: e.value.style.chart.nodes.labels.rounding
             })
           )}</div>`;
-        })), x.to.length && (M += `<div style="margin-top:6px;">${e.value.style.chart.tooltip.translations.to}</div>`, x.to.forEach((y) => {
-          M += `<div><span style="color:${y.color}">⏹→</span> ${y.target}: ${Ne(
+        })), x.to.length && (M += `<div style="margin-top:6px;">${e.value.style.chart.tooltip.translations.to}</div>`, x.to.forEach((m) => {
+          M += `<div><span style="color:${m.color}">⏹→</span> ${m.target}: ${Ne(
             e.value.style.chart.nodes.labels.formatter,
-            y.value,
+            m.value,
             le({
               p: e.value.style.chart.nodes.labels.prefix,
-              v: y.value,
+              v: m.value,
               s: e.value.style.chart.nodes.labels.suffix,
               r: e.value.style.chart.nodes.labels.rounding
             })
@@ -414,8 +418,8 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
             [e.value.table.columnNames.target],
             [e.value.table.columnNames.value]
           ]
-        ].concat(l), a = Wo(t);
-        o ? o(a) : Go({
+        ].concat(l), a = Vo(t);
+        o ? o(a) : Xo({
           csvContent: a,
           title: e.value.style.chart.title.text || "vue-ui-flow"
         });
@@ -467,7 +471,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
         config: t
       };
     });
-    function yo() {
+    function ko() {
       return E.value;
     }
     function $t() {
@@ -512,7 +516,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       }
       X.value = [l], A.value = E.value.nodes.filter((a) => e.value.nodeCategories[a.name] === t).map((a) => a.name), ee.value = null;
     }
-    const Co = f(() => ({
+    const Ao = f(() => ({
       cy: "flow-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
@@ -520,9 +524,9 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       paddingBottom: e.value.style.chart.legend.paddingBottom,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : "normal"
     }));
-    async function ko({ scale: o = 2 } = {}) {
+    async function wo({ scale: o = 2 } = {}) {
       if (!B.value) return;
-      const { width: l, height: t } = B.value.getBoundingClientRect(), a = l / t, { imageUri: s, base64: w } = await sl({ domElement: B.value, base64: !0, img: !0, scale: o });
+      const { width: l, height: t } = B.value.getBoundingClientRect(), a = l / t, { imageUri: s, base64: w } = await ul({ domElement: B.value, base64: !0, img: !0, scale: o });
       return {
         imageUri: s,
         base64: w,
@@ -535,7 +539,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
     const ie = f(() => {
       const o = e.value.table.useDialog && !e.value.table.show, l = S.value.showTable;
       return {
-        component: o ? co : no,
+        component: o ? fo : ro,
         title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
         props: o ? {
           backgroundColor: e.value.table.th.backgroundColor,
@@ -568,32 +572,32 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
     function St() {
       S.value.showTable = !1, Pe.value && Pe.value.setTableIconState(!1);
     }
-    const Ao = f(() => We.value.map((o) => ({
+    const $o = f(() => We.value.map((o) => ({
       ...o,
       name: o.display
-    }))), wo = f(() => e.value.style.chart.backgroundColor), $o = f(() => e.value.style.chart.legend), To = f(() => e.value.style.chart.title), { exportSvg: Fo, getSvg: So } = el({
+    }))), To = f(() => e.value.style.chart.backgroundColor), Fo = f(() => e.value.style.chart.legend), So = f(() => e.value.style.chart.title), { exportSvg: Eo, getSvg: xo } = ol({
       svg: Re,
-      title: To,
-      legend: $o,
-      legendItems: Ao,
-      backgroundColor: wo
+      title: So,
+      legend: Fo,
+      legendItems: $o,
+      backgroundColor: To
     });
     async function Et({ isCb: o }) {
       if (o) {
-        const { blob: l, url: t, text: a, dataUrl: s } = await So();
+        const { blob: l, url: t, text: a, dataUrl: s } = await xo();
         e.value.userOptions.callbacks.svg({ blob: l, url: t, text: a, dataUrl: s });
       } else
-        Fo();
+        Eo();
     }
-    async function Eo(o, l) {
+    async function Oo(o, l) {
       if (At(o, l), S.value.showTooltip && (await Wt(), B.value && Ie.value)) {
         const { left: t, top: a } = B.value.getBoundingClientRect();
         Ie.value.placeTooltip({ x: (t ?? 0) + 12, y: (a ?? 0) + 12 });
       }
     }
-    return oo({
-      getData: yo,
-      getImage: ko,
+    return ao({
+      getData: ko,
+      getImage: wo,
       generateCsv: je,
       generateImage: bt,
       generateSvg: Et,
@@ -604,7 +608,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       drillCategory: Ge,
       unselectNode: we,
       toggleFullscreen: ut
-    }), (o, l) => (c(), m("div", {
+    }), (o, l) => (c(), C("div", {
       ref_key: "flowChart",
       ref: B,
       class: Ht(`vue-data-ui-component vue-ui-flow ${V.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
@@ -613,7 +617,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       onMouseenter: l[2] || (l[2] = () => r(ct)(!0)),
       onMouseleave: l[3] || (l[3] = () => r(ct)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (c(), Q(r(ro), {
+      e.value.userOptions.buttons.annotator ? (c(), Q(r(io), {
         key: 0,
         svgRef: r(Re),
         backgroundColor: e.value.style.chart.backgroundColor,
@@ -641,14 +645,14 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
         ]),
         _: 3
       }, 8, ["svgRef", "backgroundColor", "color", "active"])) : $("", !0),
-      po.value ? (c(), m("div", il, null, 512)) : $("", !0),
-      e.value.style.chart.title.text ? (c(), m("div", {
+      Co.value ? (c(), C("div", dl, null, 512)) : $("", !0),
+      e.value.style.chart.title.text ? (c(), C("div", {
         key: 2,
         ref_key: "chartTitle",
         ref: at,
         style: "width:100%;background:transparent;padding-bottom:24px"
       }, [
-        (c(), Q(nl, {
+        (c(), Q(rl, {
           key: `title_${ot.value}`,
           config: {
             title: {
@@ -664,8 +668,8 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       ], 512)) : $("", !0),
       W("div", {
         id: `legend-top-${G.value}`
-      }, null, 8, cl),
-      e.value.userOptions.show && rt.value && (r(dt) || r(Le)) ? (c(), Q(r(uo), {
+      }, null, 8, vl),
+      e.value.userOptions.show && rt.value && (r(dt) || r(Le)) ? (c(), Q(r(co), {
         ref_key: "userOptionsRef",
         ref: Pe,
         key: `user_option_${tt.value}`,
@@ -767,10 +771,10 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
           key: "8"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasXls", "hasImg", "hasSvg", "hasTable", "callbacks", "hasFullscreen", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "printScale", "isAnnotation", "hasTooltip", "isTooltip", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : $("", !0),
-      (c(), m("svg", {
+      (c(), C("svg", {
         ref_key: "svgRef",
         ref: Re,
-        xmlns: r(jo),
+        xmlns: r(Wo),
         viewBox: `0 0 ${re.value.width} ${re.value.height}`,
         class: Ht({
           "vue-data-ui-fullscreen--on": V.value,
@@ -783,8 +787,8 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
           color: e.value.style.chart.color
         })
       }, [
-        Oe(r(io)),
-        o.$slots["chart-background"] ? (c(), m("foreignObject", {
+        Oe(r(vo)),
+        o.$slots["chart-background"] ? (c(), C("foreignObject", {
           key: 0,
           x: 0,
           y: 0,
@@ -795,9 +799,9 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
           }
         }, [
           h(o.$slots, "chart-background", {}, void 0, !0)
-        ], 8, vl)) : $("", !0),
+        ], 8, hl)) : $("", !0),
         W("defs", null, [
-          (c(!0), m(he, null, ge(E.value.links, (t, a) => (c(), m("linearGradient", {
+          (c(!0), C(he, null, ge(E.value.links, (t, a) => (c(), C("linearGradient", {
             id: t.id,
             x1: "0%",
             y1: "0%",
@@ -807,14 +811,14 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
             W("stop", {
               offset: "0%",
               "stop-color": t.sourceColor
-            }, null, 8, hl),
+            }, null, 8, pl),
             W("stop", {
               offset: "100%",
               "stop-color": t.targetColor
-            }, null, 8, gl)
-          ], 8, fl))), 256))
+            }, null, 8, bl)
+          ], 8, gl))), 256))
         ]),
-        (c(!0), m(he, null, ge(E.value.links, (t) => (c(), m("path", {
+        (c(!0), C(he, null, ge(E.value.links, (t) => (c(), C("path", {
           class: "vue-ui-flow-link",
           d: t.path,
           "stroke-linejoin": "round",
@@ -825,13 +829,13 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
           style: U(`
                     opacity:${A.value ? A.value.includes(t.source) && A.value.includes(t.target) ? 1 : 0.3 : ee.value ? [t.target, t.source].includes(ee.value) ? 1 : 0.3 : e.value.style.chart.links.opacity}
                 `)
-        }, null, 12, pl))), 256)),
-        (c(!0), m(he, null, ge(E.value.nodes, (t, a) => (c(), m("rect", {
+        }, null, 12, Cl))), 256)),
+        (c(!0), C(he, null, ge(E.value.nodes, (t, a) => (c(), C("rect", {
           class: "vue-ui-flow-node",
           x: t.x,
           y: r(T)(t.absoluteY) + e.value.style.chart.padding.top,
           height: r(T)(t.height),
-          width: Ce.value,
+          width: ye.value,
           fill: t.color,
           stroke: e.value.style.chart.nodes.stroke,
           "stroke-width": e.value.style.chart.nodes.strokeWidth,
@@ -860,12 +864,12 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
             Je(Qe((s) => He(a), ["prevent"]), ["space"]),
             Je(Qe((s) => we(a), ["prevent"]), ["esc"])
           ],
-          onFocus: (s) => Eo(t, a),
+          onFocus: (s) => Oo(t, a),
           onBlur: (s) => we(a)
-        }, null, 44, bl))), 256)),
-        e.value.style.chart.nodes.labels.show ? (c(), m("g", ml, [
-          (c(!0), m(he, null, ge(E.value.nodes, (t, a) => (c(), m("text", {
-            x: t.x + Ce.value / 2,
+        }, null, 44, ml))), 256)),
+        e.value.style.chart.nodes.labels.show ? (c(), C("g", yl, [
+          (c(!0), C(he, null, ge(E.value.nodes, (t, a) => (c(), C("text", {
+            x: t.x + ye.value / 2,
             y: (e.value.style.chart.nodes.labels.showValue ? r(T)(
               t.absoluteY + t.height / 2 - e.value.style.chart.nodes.labels.fontSize / 4
             ) : t.absoluteY + t.height / 2 + e.value.style.chart.nodes.labels.fontSize / 3) + e.value.style.chart.padding.top,
@@ -873,12 +877,12 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
             fill: r(Vt)(t.color),
             "text-anchor": "middle",
             style: U(`pointer-events: none; opacity:${A.value ? A.value.includes(t.name) ? 1 : 0 : 1}`)
-          }, pe(e.value.style.chart.nodes.labels.abbreviation.use ? r(Uo)({
+          }, pe(e.value.style.chart.nodes.labels.abbreviation.use ? r(Go)({
             source: t.name,
             length: e.value.style.chart.nodes.labels.abbreviation.length
-          }) : t.name), 13, yl))), 256)),
-          e.value.style.chart.nodes.labels.showValue ? (c(!0), m(he, { key: 0 }, ge(E.value.nodes, (t, a) => (c(), m("text", {
-            x: t.x + Ce.value / 2,
+          }) : t.name), 13, kl))), 256)),
+          e.value.style.chart.nodes.labels.showValue ? (c(!0), C(he, { key: 0 }, ge(E.value.nodes, (t, a) => (c(), C("text", {
+            x: t.x + ye.value / 2,
             y: r(T)(
               t.absoluteY + t.height / 2 + e.value.style.chart.nodes.labels.fontSize / 1.3
             ) + e.value.style.chart.padding.top,
@@ -896,17 +900,17 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
               r: e.value.style.chart.nodes.labels.rounding
             }),
             { datapoint: t, seriesIndex: a }
-          )), 13, Cl))), 256)) : $("", !0)
+          )), 13, Al))), 256)) : $("", !0)
         ])) : $("", !0),
         h(o.$slots, "svg", { svg: re.value }, void 0, !0)
-      ], 14, dl)),
-      o.$slots.watermark ? (c(), m("div", kl, [
+      ], 14, fl)),
+      o.$slots.watermark ? (c(), C("div", wl, [
         h(o.$slots, "watermark", P(I({ isPrinting: r(ht) || r(gt) })), void 0, !0)
       ])) : $("", !0),
       W("div", {
         id: `legend-bottom-${G.value}`
-      }, null, 8, Al),
-      st.value ? (c(), Q(Po, {
+      }, null, 8, $l),
+      st.value ? (c(), Q(Mo, {
         key: 5,
         to: e.value.style.chart.legend.position === "top" ? `#legend-top-${G.value}` : `#legend-bottom-${G.value}`
       }, [
@@ -914,25 +918,25 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
           ref_key: "chartLegend",
           ref: lt
         }, [
-          e.value.style.chart.legend.show && We.value.length ? (c(), Q(al, {
+          e.value.style.chart.legend.show && We.value.length ? (c(), Q(sl, {
             key: 0,
             legendSet: We.value,
-            config: Co.value,
+            config: Ao.value,
             onClickMarker: l[0] || (l[0] = (t) => Ge(t))
           }, {
             item: v(({ legend: t, index: a }) => [
-              r(Me) ? $("", !0) : (c(), m("div", {
+              r(Me) ? $("", !0) : (c(), C("div", {
                 key: 0,
                 onClick: (s) => t.segregate(),
                 style: U(`opacity:${X.value.length ? X.value.includes(a) ? 1 : 0.5 : 1}`)
-              }, pe(t.display), 13, wl))
+              }, pe(t.display), 13, Tl))
             ]),
             _: 1
           }, 8, ["legendSet", "config"])) : $("", !0),
           h(o.$slots, "legend", { legend: Ft.value }, void 0, !0)
         ], 512)
       ], 8, ["to"])) : $("", !0),
-      o.$slots.source ? (c(), m("div", {
+      o.$slots.source ? (c(), C("div", {
         key: 6,
         ref_key: "source",
         ref: nt,
@@ -940,7 +944,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
       }, [
         h(o.$slots, "source", {}, void 0, !0)
       ], 512)) : $("", !0),
-      Oe(r(lo), {
+      Oe(r(no), {
         ref_key: "tooltip",
         ref: Ie,
         teleportTo: e.value.style.chart.tooltip.teleportTo,
@@ -971,13 +975,13 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
         ]),
         _: 3
       }, 8, ["teleportTo", "show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom", "isFullscreen", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      rt.value && e.value.userOptions.buttons.table ? (c(), Q(Io(ie.value.component), Mo({ key: 7 }, ie.value.props, {
+      rt.value && e.value.userOptions.buttons.table ? (c(), Q(zo(ie.value.component), Lo({ key: 7 }, ie.value.props, {
         ref_key: "tableUnit",
         ref: ne,
         onClose: St
       }), jt({
         content: v(() => [
-          Oe(r(so), {
+          Oe(r(uo), {
             colNames: $e.value.colNames,
             head: $e.value.head,
             body: $e.value.body,
@@ -990,7 +994,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
               W("div", {
                 innerHTML: t,
                 style: { display: "flex", "align-items": "center" }
-              }, null, 8, $l)
+              }, null, 8, Fl)
             ]),
             td: v(({ td: t }) => [
               Ut(pe(t.name || t), 1)
@@ -1015,7 +1019,7 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
               class: "vue-ui-user-options-button",
               onClick: l[1] || (l[1] = (t) => je(e.value.userOptions.callbacks.csv))
             }, [
-              Oe(r(ao), {
+              Oe(r(so), {
                 name: "excel",
                 stroke: ie.value.props.color
               }, null, 8, ["stroke"])
@@ -1024,15 +1028,15 @@ const Xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", too
           key: "1"
         } : void 0
       ]), 1040)) : $("", !0),
-      r(Me) ? (c(), Q(Qo, { key: 8 })) : $("", !0)
-    ], 46, ul));
+      r(Me) ? (c(), Q(tl, { key: 8 })) : $("", !0)
+    ], 46, cl));
   }
-}, Fl = /* @__PURE__ */ rl(Tl, [["__scopeId", "data-v-d6feacee"]]), Hl = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, El = /* @__PURE__ */ il(Sl, [["__scopeId", "data-v-d6feacee"]]), Ul = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: Fl
+  default: El
 }, Symbol.toStringTag, { value: "Module" }));
 export {
-  Yl as a,
-  Hl as b,
-  Fl as v
+  jl as a,
+  Ul as b,
+  El as v
 };