vue-data-ui 3.2.7 → 3.3.0

package/dist/{vue-ui-ridgeline-C6UdClMT.js → vue-ui-ridgeline-ahOApbEC.js}

@@ -1,23 +1,24 @@
-import { defineAsyncComponent as O, computed as d, ref as i, shallowRef as nt, toRefs as Zt, onBeforeUnmount as rt, watch as Q, nextTick as $e, watchEffect as ea, createElementBlock as r, openBlock as n, unref as u, normalizeStyle as w, normalizeClass as ae, createBlock as T, createCommentVNode as v, renderSlot as p, createElementVNode as y, createSlots as _e, withCtx as f, normalizeProps as le, guardReactiveProps as oe, createVNode as Te, Fragment as m, renderList as k, mergeProps as Pe, toDisplayString as R, resolveDynamicComponent as ta, createTextVNode as Se } from "vue";
-import { c as Me, t as aa, e as la, h as oa, p as se, aa as ut, ab as sa, T as it, U as na, V as ra, X as ua, E as ia, L as ca, a as ne, d as re, b as va, f as Oe, g as ct, o as ha, x as da, y as ya, N as fa } from "./lib-BEpWEyMm.js";
-import { t as vt, u as ga } from "./useResponsive-DfdjqQps.js";
-import { u as ma, a as ht } from "./useNestedProp-BOk-tPdu.js";
-import { u as pa, B as ba } from "./BaseScanner-BgWxam9d.js";
-import { u as xa } from "./usePrinter-w23K-ezx.js";
-import { u as ka } from "./useTimeLabels-BGFjWgrv.js";
-import { u as Aa } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as Ca } from "./useChartAccessibility-9icAAmYg.js";
-import { u as wa } from "./useTimeLabelCollider-CIsgDrl9.js";
-import { t as $a } from "./themes-Dw-dDudK.js";
-import _a from "./Legend-BpoFJ8fc.js";
-import Ta from "./Title-DG2nloSB.js";
-import { _ as Pa } from "./Shape-C_C_OmqR.js";
-import Sa from "./img-DjWwQXVS.js";
-import { _ as Ma } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"], Ia = ["stop-color"], Na = ["stop-color"], Fa = ["stop-color"], Ra = ["id"], Ea = ["stop-color"], Ha = ["stop-color"], Xa = ["stop-color"], Ba = ["stop-color"], Ua = { key: 0 }, Va = ["fill", "d"], Wa = ["stroke", "stroke-width", "d"], Ga = ["fill", "d"], Ya = ["stroke", "stroke-dasharray", "stroke-width", "d"], ja = ["x1", "y1", "x2", "y2", "stroke", "stroke-width", "stroke-dasharray"], qa = ["cx", "cy", "stroke", "stroke-width", "r", "fill"], Ja = ["x", "y", "font-size", "font-weight", "fill", "text-decoration", "onMouseenter", "onClick"], Ka = { key: 0 }, Qa = ["font-size", "fill", "font-weight", "transform", "text-anchor"], Za = ["font-size", "fill", "font-weight", "transform", "text-anchor", "innerHTML"], el = ["x", "y", "width", "height", "onMouseenter", "onMouseleave", "onClick"], tl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], al = ["cx", "cy", "stroke", "stroke-width", "r", "fill"], ll = ["x", "y", "text-anchor", "font-size", "fill"], ol = {
+import { defineAsyncComponent as L, computed as c, ref as i, shallowRef as rt, toRefs as sa, onBeforeUnmount as ut, watch as Q, nextTick as $e, watchEffect as na, createElementBlock as r, openBlock as n, unref as u, normalizeStyle as w, normalizeClass as oe, createBlock as T, createCommentVNode as h, renderSlot as p, createElementVNode as y, createSlots as _e, withCtx as g, normalizeProps as se, guardReactiveProps as ne, createVNode as Te, Fragment as m, renderList as k, mergeProps as Se, toDisplayString as R, resolveDynamicComponent as ra, createTextVNode as Pe } from "vue";
+import { c as Oe, t as ua, e as ia, h as ca, p as re, aa as it, ab as va, T as ct, U as ha, V as da, X as ya, E as ga, L as fa, a as ue, d as ie, b as ma, f as Le, g as vt, o as pa, x as ba, y as xa, N as ka } from "./lib-GIYcnm0E.js";
+import { t as ht, u as Aa } from "./useResponsive-DfdjqQps.js";
+import { u as Ca, a as dt } from "./useNestedProp-mxyyqd0B.js";
+import { u as wa, B as $a } from "./BaseScanner-BgWxam9d.js";
+import { u as _a } from "./usePrinter-DYRFiw7X.js";
+import { u as Ta } from "./useSvgExport-B7-Vrjtu.js";
+import { u as Sa } from "./useTimeLabels-BGFjWgrv.js";
+import { u as Pa } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as Oa } from "./useChartAccessibility-9icAAmYg.js";
+import { u as La } from "./useTimeLabelCollider-CIsgDrl9.js";
+import { t as Ma } from "./themes-Dw-dDudK.js";
+import za from "./Legend-DsogCeTb.js";
+import Da from "./Title-D17CJXko.js";
+import { _ as Ia } from "./Shape-DJG2zW7b.js";
+import Na from "./img-6wPuVVtk.js";
+import { _ as Fa } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const Ra = ["id"], Ea = ["xmlns", "viewBox"], Ha = ["id"], Xa = ["stop-color"], Ba = ["stop-color"], Ua = ["stop-color"], Va = ["stop-color"], Ga = ["id"], Wa = ["stop-color"], Ya = ["stop-color"], ja = ["stop-color"], qa = ["stop-color"], Ja = { key: 0 }, Ka = ["fill", "d"], Qa = ["stroke", "stroke-width", "d"], Za = ["fill", "d"], el = ["stroke", "stroke-dasharray", "stroke-width", "d"], tl = ["x1", "y1", "x2", "y2", "stroke", "stroke-width", "stroke-dasharray"], al = ["cx", "cy", "stroke", "stroke-width", "r", "fill"], ll = ["x", "y", "font-size", "font-weight", "fill", "text-decoration", "onMouseenter", "onClick"], ol = { key: 0 }, sl = ["font-size", "fill", "font-weight", "transform", "text-anchor"], nl = ["font-size", "fill", "font-weight", "transform", "text-anchor", "innerHTML"], rl = ["x", "y", "width", "height", "onMouseenter", "onMouseleave", "onClick"], ul = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], il = ["cx", "cy", "stroke", "stroke-width", "r", "fill"], cl = ["x", "y", "text-anchor", "font-size", "fill"], vl = {
   key: 4,
   class: "vue-data-ui-watermark"
-}, sl = ["onClick"], nl = ["innerHTML"], rl = {
+}, hl = ["onClick"], dl = ["innerHTML"], yl = {
   __name: "vue-ui-ridgeline",
   props: {
     config: {
@@ -34,32 +35,32 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
     }
   },
   emits: ["selectLegend", "selectDatapoint", "selectX"],
-  setup(dt, { expose: yt, emit: ft }) {
-    const gt = O(() => import("./vue-ui-xy-BxpuE9Ng.js")), mt = O(() => import("./BaseIcon-Bz-1GQhu.js")), pt = O(() => import("./vue-ui-accordion-CeMTgpl0.js")), bt = O(() => import("./DataTable-BvjacRbw.js")), xt = O(() => import("./PenAndPaper-CR8q353D.js")), kt = O(() => import("./UserOptions-DsTgvAok.js")), At = O(() => import("./PackageVersion-Cwrh45ON.js")), Le = O(() => import("./BaseDraggableDialog-CHhZIht2.js")), { vue_ui_ridgeline: Ct } = ma(), E = dt, U = d({
+  setup(yt, { expose: gt, emit: ft }) {
+    const mt = L(() => import("./vue-ui-xy-B2fjTYMJ.js")), pt = L(() => import("./BaseIcon-CtqN7W_g.js")), bt = L(() => import("./vue-ui-accordion-Dch9YrCi.js")), xt = L(() => import("./DataTable-BeI6gYJX.js")), kt = L(() => import("./PenAndPaper-BxbYiPy4.js")), At = L(() => import("./UserOptions-B3vCIe-u.js")), Ct = L(() => import("./PackageVersion-C9oklnuy.js")), Me = L(() => import("./BaseDraggableDialog-q3pgSDTz.js")), { vue_ui_ridgeline: wt } = Ca(), E = yt, U = c({
       get() {
         return Array.isArray(z.value) && z.value.length > 0;
       },
       set(t) {
         return t;
       }
-    }), ue = ft, $ = i(null), ze = i(null), De = i(null), P = nt(null), L = nt(null), Ie = i(null), Ne = i(null), ie = i(0), wt = i(0), ce = i(0), A = i(Me()), Fe = i(0), $t = i(0), Re = i(512), h = i(null), H = i(null), ve = i(null), Ee = i(0), he = i(null), V = i(null), de = i(null);
-    function ye() {
-      const t = ht({
+    }), ce = ft, $ = i(null), ze = i(null), De = i(null), S = rt(null), M = rt(null), Ie = i(null), Ne = i(null), ve = i(0), $t = i(0), he = i(0), A = i(Oe()), Fe = i(0), _t = i(0), Re = i(512), d = i(null), H = i(null), de = i(null), Ee = i(0), ye = i(null), V = i(null), ge = i(null);
+    function fe() {
+      const t = dt({
         userConfig: E.config,
-        defaultConfig: Ct
+        defaultConfig: wt
       });
       return t.theme ? {
-        ...ht({
-          userConfig: $a.vue_ui_ridgeline[t.theme] || E.config,
+        ...dt({
+          userConfig: Ma.vue_ui_ridgeline[t.theme] || E.config,
           defaultConfig: t
         }),
-        customPalette: va[t.theme] || se
+        customPalette: ma[t.theme] || re
       } : t;
     }
-    const e = i(ye()), { loading: W, FINAL_DATASET: z, manualLoading: fe } = pa({
-      ...Zt(E),
+    const e = i(fe()), { loading: G, FINAL_DATASET: z, manualLoading: me } = wa({
+      ...sa(E),
       FINAL_CONFIG: e,
-      prepareConfig: ye,
+      prepareConfig: fe,
       skeletonDataset: [
         {
           name: "_",
@@ -152,7 +153,7 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
           ]
         }
       ],
-      skeletonConfig: aa({
+      skeletonConfig: ua({
         defaultConfig: e.value,
         userConfig: {
           userOptions: { show: !1 },
@@ -198,45 +199,45 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
       userOptionsVisible: Z,
       setUserOptionsVisibility: He,
       keepUserOptionState: Xe
-    } = Aa({ config: e.value }), { svgRef: ge } = Ca({ config: e.value.style.chart.title }), me = d(() => !!e.value.debug);
+    } = Pa({ config: e.value }), { svgRef: ee } = Oa({ config: e.value.style.chart.title }), pe = c(() => !!e.value.debug);
     function Be() {
       const t = z.value || [];
       if (!Array.isArray(t) || t.length === 0) {
-        Oe({ componentName: "VueUiRidgeline", type: "dataset", debug: me.value }), fe.value = !0;
+        Le({ componentName: "VueUiRidgeline", type: "dataset", debug: pe.value }), me.value = !0;
         return;
       }
       if (t.forEach((o, a) => {
-        ct({
+        vt({
           datasetObject: o,
           requiredAttributes: ["name", "datapoints"]
         }).forEach((s) => {
-          U.value = !1, Oe({
+          U.value = !1, Le({
             componentName: "VueUiRidgeline",
             type: "datasetSerieAttribute",
             property: s,
             index: a,
-            debug: me.value
+            debug: pe.value
           });
         }), Array.isArray(o.datapoints) && o.datapoints.length && o.datapoints.forEach((s, l) => {
-          ct({
+          vt({
             datasetObject: s,
             requiredAttributes: ["name", "values"]
-          }).forEach((c) => {
-            U.value = !1, Oe({
+          }).forEach((v) => {
+            U.value = !1, Le({
               componentName: "VueUiRidgeline",
               type: "datasetSerieAttribute",
-              property: `datapoint.${c}`,
+              property: `datapoint.${v}`,
               index: `${a}-${l}`,
-              debug: me.value
+              debug: pe.value
             });
           });
         });
-      }), $t.value = t.length, C.value = Math.min(
+      }), _t.value = t.length, C.value = Math.min(
         e.value.style.chart.areas.height,
         e.value.style.chart.areas.rowHeight
-      ), ha(E.dataset) || (fe.value = e.value.loading), e.value.responsive) {
-        const o = vt(() => {
-          const { width: a, height: s } = ga({
+      ), pa(E.dataset) || (me.value = e.value.loading), e.value.responsive) {
+        const o = ht(() => {
+          const { width: a, height: s } = Aa({
             chart: $.value,
             title: e.value.style.chart.title.text ? ze.value : null,
             legend: e.value.style.chart.legend.show ? De.value : null,
@@ -248,29 +249,29 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
             Re.value = a, C.value = t.length ? s / t.length : 0, Ee.value = s - 12;
           });
         });
-        P.value && (L.value && P.value.unobserve(L.value), P.value.disconnect()), P.value = new ResizeObserver(o), L.value = $.value?.parentNode || null, L.value && P.value.observe(L.value);
+        S.value && (M.value && S.value.unobserve(M.value), S.value.disconnect()), S.value = new ResizeObserver(o), M.value = $.value?.parentNode || null, M.value && S.value.observe(M.value);
       }
     }
-    rt(() => {
-      P.value && (L.value && P.value.unobserve(L.value), P.value.disconnect());
+    ut(() => {
+      S.value && (M.value && S.value.unobserve(M.value), S.value.disconnect());
     });
-    const { isPrinting: Ue, isImaging: Ve, generatePdf: We, generateImage: Ge } = xa({
+    const { isPrinting: Ue, isImaging: Ve, generatePdf: Ge, generateImage: We } = _a({
       elementId: `vue-ui-ridgeline_${A.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-ridgeline",
       options: e.value.userOptions.print
-    }), _t = d(() => e.value.userOptions.show && !e.value.style.chart.title.text), Tt = d(() => la(e.value.customPalette)), D = i({
+    }), Tt = c(() => e.value.userOptions.show && !e.value.style.chart.title.text), St = c(() => ia(e.value.customPalette)), D = i({
       showTable: e.value.table.show
     });
     Q(
       () => z.value,
       async (t) => {
-        Array.isArray(t) && t.length && (Z.value = !e.value.userOptions.showOnChartHover, await $e(), Be(), ie.value += 1, ce.value += 1, D.value.showTable = e.value.table.show);
+        Array.isArray(t) && t.length && (Z.value = !e.value.userOptions.showOnChartHover, await $e(), Be(), ve.value += 1, he.value += 1, D.value.showTable = e.value.table.show);
       },
       { deep: !0, immediate: !0 }
     ), Q(() => E.dataset, (t) => {
-      Array.isArray(t) && t.length > 0 && (fe.value = !1);
+      Array.isArray(t) && t.length > 0 && (me.value = !1);
     }, { deep: !0 }), Q(
-      () => W.value,
+      () => G.value,
       async (t) => {
         t || (await $e(), Be());
       },
@@ -278,58 +279,58 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
     ), Q(
       () => E.config,
       () => {
-        e.value = ye(z.value || null), Z.value = !e.value.userOptions.showOnChartHover, C.value = Math.min(e.value.style.chart.areas.height, e.value.style.chart.areas.rowHeight), D.value.showTable = e.value.table.show, ie.value += 1, ce.value += 1;
+        e.value = fe(z.value || null), Z.value = !e.value.userOptions.showOnChartHover, C.value = Math.min(e.value.style.chart.areas.height, e.value.style.chart.areas.rowHeight), D.value.showTable = e.value.table.show, ve.value += 1, he.value += 1;
       },
       { deep: !0 }
     );
-    const pe = d(() => e.value.style.chart.areas.height / e.value.style.chart.areas.rowHeight);
+    const be = c(() => e.value.style.chart.areas.height / e.value.style.chart.areas.rowHeight);
     function Ye(t) {
-      M.value.includes(t) ? M.value = M.value.filter((o) => o !== t) : M.value.push(t), ue("selectLegend", B.value);
+      O.value.includes(t) ? O.value = O.value.filter((o) => o !== t) : O.value.push(t), ce("selectLegend", B.value);
     }
-    const S = d(() => U.value ? (z.value || []).map((t) => ({
+    const P = c(() => U.value ? (z.value || []).map((t) => ({
       ...t,
-      labelLen: It(t.name, e.value.style.chart.yAxis.labels.fontSize),
-      uid: Me(),
+      labelLen: Nt(t.name, e.value.style.chart.yAxis.labels.fontSize),
+      uid: Oe(),
       datapoints: t.datapoints.map((o, a) => {
-        const s = o.color ? oa(o.color) : Tt.value[a] || se[a] || se[a % se.length], l = ut(o.name);
+        const s = o.color ? ca(o.color) : St.value[a] || re[a] || re[a % re.length], l = it(o.name);
         return { ...o, color: s, id: l };
       })
-    })) : []), je = d(() => e.value.style.chart.padding.top + C.value * (z.value || []).length + C.value * pe.value + e.value.style.chart.padding.bottom), g = d(() => {
+    })) : []), je = c(() => e.value.style.chart.padding.top + C.value * (z.value || []).length + C.value * be.value + e.value.style.chart.padding.bottom), f = c(() => {
       const t = e.value.style.chart.padding;
       return {
         width: Re.value,
         height: je.value,
         padding: t
       };
-    }), Pt = d(() => g.value.width), St = d(() => g.value.height), be = i(0), Mt = vt((t) => {
-      be.value = t;
+    }), Pt = c(() => f.value.width), Ot = c(() => f.value.height), xe = i(0), Lt = ht((t) => {
+      xe.value = t;
     }, 100);
-    ea((t) => {
-      const o = he.value;
+    na((t) => {
+      const o = ye.value;
       if (!o) return;
       const a = new ResizeObserver((s) => {
-        Mt(s[0].contentRect.height);
+        Lt(s[0].contentRect.height);
       });
       a.observe(o), t(() => a.disconnect());
-    }), rt(() => {
-      be.value = 0;
+    }), ut(() => {
+      xe.value = 0;
     });
-    const b = d(() => ({
-      fullHeight: g.value.height + be.value,
-      top: g.value.padding.top,
-      left: g.value.padding.left,
-      right: g.value.width - g.value.padding.right,
-      bottom: g.value.height - e.value.style.chart.padding.bottom,
-      width: g.value.width - (g.value.padding.left + g.value.padding.right)
-    })), G = d(() => Math.max(...S.value.flatMap((t) => t.datapoints.map((o) => o.values.length)))), Y = d(() => ka({
+    const b = c(() => ({
+      fullHeight: f.value.height + xe.value,
+      top: f.value.padding.top,
+      left: f.value.padding.left,
+      right: f.value.width - f.value.padding.right,
+      bottom: f.value.height - e.value.style.chart.padding.bottom,
+      width: f.value.width - (f.value.padding.left + f.value.padding.right)
+    })), W = c(() => Math.max(...P.value.flatMap((t) => t.datapoints.map((o) => o.values.length)))), Y = c(() => Sa({
       values: e.value.style.chart.xAxis.labels.values,
-      maxDatapoints: G.value,
+      maxDatapoints: W.value,
       formatter: e.value.style.chart.xAxis.labels.datetimeFormatter,
       start: 0,
       end: e.value.style.chart.xAxis.labels.values.length
-    })), X = d(() => {
-      const t = Math.max(...S.value.map((l) => l.labelLen)), o = g.value.padding.left + t + 16 + e.value.style.chart.yAxis.labels.offsetX, a = (b.value.width - o) / G.value, s = [];
-      for (let l = 0; l < G.value; l += 1)
+    })), X = c(() => {
+      const t = Math.max(...P.value.map((l) => l.labelLen)), o = f.value.padding.left + t + 16 + e.value.style.chart.yAxis.labels.offsetX, a = (b.value.width - o) / W.value, s = [];
+      for (let l = 0; l < W.value; l += 1)
         s.push({
           selectorX: o + a * l,
           x: o + a * l - a / 2,
@@ -341,45 +342,45 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
         });
       return s;
     });
-    function xe(t) {
-      return S.value.map((o) => o.datapoints.map((a) => ({
+    function ke(t) {
+      return P.value.map((o) => o.datapoints.map((a) => ({
         dp: a,
         selected: a.values[t.index]
       })));
     }
-    function Ot(t) {
-      h.value = t;
-      const o = xe(t);
+    function Mt(t) {
+      d.value = t;
+      const o = ke(t);
       e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: o, seriesIndex: t.index });
     }
-    function Lt(t) {
-      h.value = null;
-      const o = xe(t);
+    function zt(t) {
+      d.value = null;
+      const o = ke(t);
       e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: o, seriesIndex: t.index });
     }
-    function zt(t) {
-      const o = xe(t);
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: o, seriesIndex: t.index }), ue("selectX", o);
+    function Dt(t) {
+      const o = ke(t);
+      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: o, seriesIndex: t.index }), ce("selectX", o);
     }
-    function Dt(t, o) {
+    function It(t, o) {
       return t.length * o / 2 + o;
     }
     function qe(t, o, a) {
-      const s = Dt(o, a);
+      const s = It(o, a);
       return t + s > b.value.right;
     }
-    function It(t, o, a = "sans-serif") {
-      const l = document.createElement("canvas").getContext("2d"), c = typeof o == "number" ? `${o}px` : o;
-      return l.font = `${c} ${a}`, l.measureText(t).width;
+    function Nt(t, o, a = "sans-serif") {
+      const l = document.createElement("canvas").getContext("2d"), v = typeof o == "number" ? `${o}px` : o;
+      return l.font = `${v} ${a}`, l.measureText(t).width;
     }
-    const B = d(() => {
+    const B = c(() => {
       C.value;
-      const t = Math.max(...S.value.map((x) => x.labelLen)), o = Math.max(...S.value.flatMap((x) => x.datapoints.flatMap((q) => q.values))), a = Math.min(...S.value.flatMap((x) => x.datapoints.flatMap((q) => q.values))), s = g.value.padding.left + t + 16 + e.value.style.chart.yAxis.labels.offsetX, l = (b.value.width - s) / G.value, c = Math.abs(Math.min(a, 0)), _ = o + c;
-      function at(x) {
+      const t = Math.max(...P.value.map((x) => x.labelLen)), o = Math.max(...P.value.flatMap((x) => x.datapoints.flatMap((q) => q.values))), a = Math.min(...P.value.flatMap((x) => x.datapoints.flatMap((q) => q.values))), s = f.value.padding.left + t + 16 + e.value.style.chart.yAxis.labels.offsetX, l = (b.value.width - s) / W.value, v = Math.abs(Math.min(a, 0)), _ = o + v;
+      function lt(x) {
         return isNaN(x / _) ? 0 : x / _;
       }
-      return S.value.map((x, q) => {
-        const lt = b.value.top + C.value * q, N = b.value.top + lt + C.value * pe.value * (1 - at(c));
+      return P.value.map((x, q) => {
+        const ot = b.value.top + C.value * q, N = b.value.top + ot + C.value * be.value * (1 - lt(v));
         return {
           ...x,
           label: {
@@ -387,51 +388,51 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
             y: N
           },
           datapoints: x.datapoints.map((J) => {
-            const F = J.values.map((K, jt) => {
-              const qt = isNaN(K) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(K) ? 0 : K || 0, Jt = s + l * jt, Kt = b.value.top + lt + C.value * pe.value * (1 - at(qt + c)), Qt = K === Math.max(...J.values);
+            const F = J.values.map((K, ea) => {
+              const ta = isNaN(K) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(K) ? 0 : K || 0, aa = s + l * ea, la = b.value.top + ot + C.value * be.value * (1 - lt(ta + v)), oa = K === Math.max(...J.values);
               return {
-                x: Jt,
-                y: Kt,
+                x: aa,
+                y: la,
                 value: K,
-                isMaxPoint: Qt,
+                isMaxPoint: oa,
                 zero: N
               };
-            }), Vt = `${sa(F, N, !1, !1)}`, Wt = `M ${s},${N} ${it(F)} ${F.at(-1).x},${N}`, Gt = `M ${s},${N} ${F.at(-1).x},${N}`, ot = `M ${na(F)}`, st = `M ${it(F)}`, Yt = ra(
-              e.value.style.chart.areas.smooth ? ot : st
+            }), Jt = `${va(F, N, !1, !1)}`, Kt = `M ${s},${N} ${ct(F)} ${F.at(-1).x},${N}`, Qt = `M ${s},${N} ${F.at(-1).x},${N}`, st = `M ${ha(F)}`, nt = `M ${ct(F)}`, Zt = da(
+              e.value.style.chart.areas.smooth ? st : nt
             );
             return {
               ...J,
-              uid: Me(),
+              uid: Oe(),
               plots: F,
-              smoothPath: Vt,
-              straightPath: Wt,
-              zeroPath: Gt,
-              pathLength: Yt,
-              smoothPathRidge: ot,
-              straightPathRidge: st
+              smoothPath: Jt,
+              straightPath: Kt,
+              zeroPath: Qt,
+              pathLength: Zt,
+              smoothPathRidge: st,
+              straightPathRidge: nt
             };
-          }).filter((J) => !M.value.includes(J.id))
+          }).filter((J) => !O.value.includes(J.id))
         };
       });
-    }), M = i([]);
-    function Nt(t) {
+    }), O = i([]);
+    function Ft(t) {
       const o = /* @__PURE__ */ new Map();
       return t.forEach((a) => {
         a.datapoints.forEach((s, l) => {
-          const c = ut(s.name);
-          o.has(c) || o.set(c, {
-            id: c,
+          const v = it(s.name);
+          o.has(v) || o.set(v, {
+            id: v,
             name: s.name,
             color: s.color,
             shape: "circle",
-            segregate: () => Ye(c),
-            isSegregated: M.value.includes(c),
-            opacity: M.value.includes(c) ? 0.5 : 1
+            segregate: () => Ye(v),
+            isSegregated: O.value.includes(v),
+            opacity: O.value.includes(v) ? 0.5 : 1
           });
         });
       }), Array.from(o.values());
     }
-    const ke = d(() => Nt(S.value)), Ft = d(() => ({
+    const te = c(() => Ft(P.value)), Rt = c(() => ({
       cy: "donut-div-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
@@ -443,15 +444,15 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
       I.value = t, Fe.value += 1;
     }
     const Ke = i({}), Qe = i([]);
-    function Rt(t) {
-      ue("selectDatapoint", t), e.value.style.chart.dialog.show && (Qe.value = t.datapoints.map((o) => ({
+    function Et(t) {
+      ce("selectDatapoint", t), e.value.style.chart.dialog.show && (Qe.value = t.datapoints.map((o) => ({
         name: o.name,
         color: o.color,
         type: "line",
         useArea: !0,
         smooth: e.value.style.chart.areas.smooth,
         series: o.values
-      })), H.value = t, Ke.value = fa({
+      })), H.value = t, Ke.value = ka({
         ...e.value.style.chart.dialog.xyChart,
         responsive: !0,
         // Overriding 
@@ -481,23 +482,23 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
             // Overriding
           }
         }
-      }), ve.value && ve.value.open());
+      }), de.value && de.value.open());
     }
     const Ae = i(null);
-    function Et(t) {
+    function Ht(t) {
       Ae.value = t;
     }
-    function Ht() {
+    function Xt() {
       Ae.value = null;
     }
-    const ee = i(!1);
+    const ae = i(!1);
     function Ce() {
-      ee.value = !ee.value;
+      ae.value = !ae.value;
     }
     function Ze() {
       D.value.showTable = !D.value.showTable;
     }
-    const et = d(() => ({ body: B.value.flatMap((a) => a.datapoints.flatMap((s) => ({
+    const et = c(() => ({ body: B.value.flatMap((a) => a.datapoints.flatMap((s) => ({
       ...s,
       rowName: `${a.name}: ${s.name}`
     }))).map((a) => [
@@ -506,7 +507,7 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
         color: a.color
       },
       ...a.values
-    ]) })), te = d(() => {
+    ]) })), le = c(() => {
       const t = [
         e.value.table.columnNames.series,
         ...Y.value.map((s) => s.text)
@@ -537,50 +538,50 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
       $e(() => {
         const o = [
           [e.value.table.columnNames.series, ...Y.map((l) => [l.text])],
-          ...et.value.body.map((l, c) => [l[0].name, ...l.slice(1)])
+          ...et.value.body.map((l, v) => [l[0].name, ...l.slice(1)])
         ], a = [
           [e.value.style.chart.title.text],
           [e.value.style.chart.title.subtitle.text]
-        ].concat(o), s = da(a);
-        t ? t(s) : ya({
+        ].concat(o), s = ba(a);
+        t ? t(s) : xa({
           csvContent: s,
           title: e.value.style.chart.title.text || "vue-ui-ridgeline"
         });
       });
     }
-    function Xt() {
+    function Bt() {
       return B.value;
     }
-    async function Bt({ scale: t = 2 } = {}) {
+    async function Ut({ scale: t = 2 } = {}) {
       if (!$.value) return;
-      const { width: o, height: a } = $.value.getBoundingClientRect(), s = o / a, { imageUri: l, base64: c } = await Sa({ domElement: $.value, base64: !0, img: !0, scale: t });
+      const { width: o, height: a } = $.value.getBoundingClientRect(), s = o / a, { imageUri: l, base64: v } = await Na({ domElement: $.value, base64: !0, img: !0, scale: t });
       return {
         imageUri: l,
-        base64: c,
+        base64: v,
         title: e.value.style.chart.title.text,
         width: o,
         height: a,
         aspectRatio: s
       };
     }
-    const Ut = d(() => ({ min: 0, max: G.value }));
-    wa({
-      timeLabelsEls: he,
+    const Vt = c(() => ({ min: 0, max: W.value }));
+    La({
+      timeLabelsEls: ye,
       timeLabels: Y,
-      slicer: Ut,
+      slicer: Vt,
       configRef: e,
       rotationPath: ["style", "chart", "xAxis", "labels", "rotation"],
       autoRotatePath: ["style", "chart", "xAxis", "labels", "autoRotate", "enable"],
       isAutoSize: !1,
       width: Pt,
-      height: St,
+      height: Ot,
       targetClass: ".vue-ui-ridgeline-x-axis-label",
       angle: e.value.style.chart.xAxis.labels.autoRotate.angle
     });
-    const j = d(() => {
+    const j = c(() => {
       const t = e.value.table.useDialog && !e.value.table.show, o = D.value.showTable;
       return {
-        component: t ? Le : pt,
+        component: t ? Me : bt,
         title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
         props: t ? {
           backgroundColor: e.value.table.th.backgroundColor,
@@ -611,13 +612,31 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
       e.value.table.show || (t && e.value.table.useDialog && V.value ? V.value.open() : "close" in V.value && V.value.close());
     });
     function tt() {
-      D.value.showTable = !1, de.value && de.value.setTableIconState(!1);
+      D.value.showTable = !1, ge.value && ge.value.setTableIconState(!1);
     }
-    return yt({
-      getData: Xt,
-      getImage: Bt,
-      generateImage: Ge,
-      generatePdf: We,
+    const Gt = c(() => e.value.style.chart.backgroundColor), Wt = c(() => ({
+      ...e.value.style.chart.legend,
+      position: "bottom"
+    })), Yt = c(() => e.value.style.chart.title), { exportSvg: jt, getSvg: qt } = Ta({
+      svg: ee,
+      title: Yt,
+      legend: Wt,
+      legendItems: te,
+      backgroundColor: Gt
+    });
+    async function at({ isCb: t }) {
+      if (t) {
+        const { blob: o, url: a, text: s, dataUrl: l } = await qt();
+        e.value.userOptions.callbacks.svg({ blob: o, url: a, text: s, dataUrl: l });
+      } else
+        jt();
+    }
+    return gt({
+      getData: Bt,
+      getImage: Ut,
+      generateImage: We,
+      generateSvg: at,
+      generatePdf: Ge,
       generateCsv: we,
       toggleAnnotator: Ce,
       toggleTable: Ze,
@@ -625,7 +644,7 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
     }), (t, o) => (n(), r("div", {
       ref_key: "ridgelineChart",
       ref: $,
-      class: ae(`vue-ui-ridgeline ${I.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
+      class: oe(`vue-data-ui-component vue-ui-ridgeline ${I.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
       id: `vue-ui-ridgeline_${A.value}`,
       style: w({
         fontFamily: e.value.style.fontFamily,
@@ -637,30 +656,30 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
       onMouseenter: o[3] || (o[3] = () => u(He)(!0)),
       onMouseleave: o[4] || (o[4] = () => u(He)(!1))
     }, [
-      e.value.userOptions.buttons.annotator && u(ge) ? (n(), T(u(xt), {
+      e.value.userOptions.buttons.annotator && u(ee) ? (n(), T(u(kt), {
         key: 0,
         color: e.value.style.chart.color,
         backgroundColor: e.value.style.chart.backgroundColor,
-        active: ee.value,
-        svgRef: u(ge),
+        active: ae.value,
+        svgRef: u(ee),
         onClose: Ce
-      }, null, 8, ["color", "backgroundColor", "active", "svgRef"])) : v("", !0),
+      }, null, 8, ["color", "backgroundColor", "active", "svgRef"])) : h("", !0),
       p(t.$slots, "userConfig", {}, void 0, !0),
-      _t.value ? (n(), r("div", {
+      Tt.value ? (n(), r("div", {
         key: 1,
         ref_key: "noTitle",
         ref: Ne,
         class: "vue-data-ui-no-title-space",
         style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : v("", !0),
+      }, null, 512)) : h("", !0),
       e.value.style.chart.title.text ? (n(), r("div", {
         key: 2,
         ref_key: "chartTitle",
         ref: ze,
         style: "width:100%;background:transparent;padding-bottom:24px"
       }, [
-        (n(), T(Ta, {
-          key: `title_${ie.value}`,
+        (n(), T(Da, {
+          key: `title_${ve.value}`,
           config: {
             title: {
               cy: "ridgeline-div-title",
@@ -672,10 +691,10 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
             }
           }
         }, null, 8, ["config"]))
-      ], 512)) : v("", !0),
-      e.value.userOptions.show && U.value && (u(Xe) || u(Z)) ? (n(), T(u(kt), {
+      ], 512)) : h("", !0),
+      e.value.userOptions.show && U.value && (u(Xe) || u(Z)) ? (n(), T(u(At), {
         ref_key: "userOptionsRef",
-        ref: de,
+        ref: ge,
         key: `user_option_${Fe.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
@@ -686,6 +705,7 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
         callbacks: e.value.userOptions.callbacks,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasImg: e.value.userOptions.buttons.img,
+        hasSvg: e.value.userOptions.buttons.svg,
         hasXls: e.value.userOptions.buttons.csv,
         hasTable: e.value.userOptions.buttons.table,
         hasLabel: !1,
@@ -697,84 +717,85 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
         isTooltip: !1,
         titles: { ...e.value.userOptions.buttonTitles },
         hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: ee.value,
+        isAnnotation: ae.value,
         tableDialog: e.value.table.useDialog,
         style: w({ visibility: u(Xe) ? u(Z) ? "visible" : "hidden" : "visible" }),
         onToggleFullscreen: Je,
-        onGeneratePdf: u(We),
+        onGeneratePdf: u(Ge),
         onGenerateCsv: we,
-        onGenerateImage: u(Ge),
+        onGenerateImage: u(We),
+        onGenerateSvg: at,
         onToggleTable: Ze,
         onToggleAnnotator: Ce
       }, _e({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: f(({ isOpen: a, color: s }) => [
-            p(t.$slots, "menuIcon", le(oe({ isOpen: a, color: s })), void 0, !0)
+          fn: g(({ isOpen: a, color: s }) => [
+            p(t.$slots, "menuIcon", se(ne({ isOpen: a, color: s })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         t.$slots.optionTooltip ? {
           name: "optionTooltip",
-          fn: f(() => [
+          fn: g(() => [
             p(t.$slots, "optionTooltip", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         t.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: f(() => [
+          fn: g(() => [
             p(t.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         t.$slots.optionCsv ? {
           name: "optionCsv",
-          fn: f(() => [
+          fn: g(() => [
             p(t.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         t.$slots.optionImg ? {
           name: "optionImg",
-          fn: f(() => [
+          fn: g(() => [
             p(t.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         t.$slots.optionTable ? {
           name: "optionTable",
-          fn: f(() => [
+          fn: g(() => [
             p(t.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "5"
         } : void 0,
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: f(({ toggleFullscreen: a, isFullscreen: s }) => [
-            p(t.$slots, "optionFullscreen", le(oe({ toggleFullscreen: a, isFullscreen: s })), void 0, !0)
+          fn: g(({ toggleFullscreen: a, isFullscreen: s }) => [
+            p(t.$slots, "optionFullscreen", se(ne({ toggleFullscreen: a, isFullscreen: s })), void 0, !0)
           ]),
           key: "6"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: f(({ toggleAnnotator: a, isAnnotator: s }) => [
-            p(t.$slots, "optionAnnotator", le(oe({ toggleAnnotator: a, isAnnotator: s })), void 0, !0)
+          fn: g(({ toggleAnnotator: a, isAnnotator: s }) => [
+            p(t.$slots, "optionAnnotator", se(ne({ toggleAnnotator: a, isAnnotator: s })), void 0, !0)
           ]),
           key: "7"
         } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "callbacks", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "printScale", "chartElement", "position", "titles", "hasAnnotator", "isAnnotation", "tableDialog", "style", "onGeneratePdf", "onGenerateImage"])) : v("", !0),
+      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "callbacks", "hasPdf", "hasImg", "hasSvg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "printScale", "chartElement", "position", "titles", "hasAnnotator", "isAnnotation", "tableDialog", "style", "onGeneratePdf", "onGenerateImage"])) : h("", !0),
       (n(), r("svg", {
         ref_key: "svgRef",
-        ref: ge,
-        xmlns: u(ua),
-        class: ae({ "vue-data-ui-fullscreen--on": I.value, "vue-data-ui-fulscreen--off": !I.value }),
-        viewBox: `0 0 ${g.value.width <= 0 ? 10 : g.value.width} ${b.value.fullHeight <= 0 ? 10 : b.value.fullHeight}`,
+        ref: ee,
+        xmlns: u(ya),
+        class: oe({ "vue-data-ui-fullscreen--on": I.value, "vue-data-ui-fulscreen--off": !I.value }),
+        viewBox: `0 0 ${f.value.width <= 0 ? 10 : f.value.width} ${b.value.fullHeight <= 0 ? 10 : b.value.fullHeight}`,
         style: w(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color};${e.value.responsive ? `height: ${Ee.value}px; width: 100%;` : ""}`)
       }, [
-        Te(u(At)),
+        Te(u(Ct)),
         y("defs", null, [
-          (n(!0), r(m, null, k(ke.value, (a, s) => (n(), r("linearGradient", {
+          (n(!0), r(m, null, k(te.value, (a, s) => (n(), r("linearGradient", {
             id: `gradient-${a.id}-${A.value}`,
             x1: "50%",
             y1: "0%",
@@ -785,25 +806,25 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
               offset: "0%",
               "stop-color": a.color,
               "stop-opacity": "1"
-            }, null, 8, Da),
+            }, null, 8, Xa),
             y("stop", {
               offset: "30%",
               "stop-color": a.color,
               "stop-opacity": "0.7"
-            }, null, 8, Ia),
+            }, null, 8, Ba),
             y("stop", {
               offset: "70%",
               "stop-color": a.color,
               "stop-opacity": "0.3"
-            }, null, 8, Na),
+            }, null, 8, Ua),
             y("stop", {
               offset: "100%",
               "stop-color": a.color,
               "stop-opacity": "0.1"
-            }, null, 8, Fa)
-          ], 8, za))), 256)),
+            }, null, 8, Va)
+          ], 8, Ha))), 256)),
           (n(!0), r(m, null, k(B.value, (a, s) => (n(), r(m, null, [
-            (n(!0), r(m, null, k(a.datapoints, (l, c) => (n(), r("linearGradient", {
+            (n(!0), r(m, null, k(a.datapoints, (l, v) => (n(), r("linearGradient", {
               key: `grad${l.id}`,
               id: `gradient-single-${A.value}-${l.uid}`,
               x1: "50%",
@@ -815,36 +836,36 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
                 offset: "0%",
                 "stop-color": l.color,
                 "stop-opacity": "1"
-              }, null, 8, Ea),
+              }, null, 8, Wa),
               y("stop", {
                 offset: "30%",
                 "stop-color": l.color,
                 "stop-opacity": "0.7"
-              }, null, 8, Ha),
+              }, null, 8, Ya),
               y("stop", {
                 offset: "70%",
                 "stop-color": l.color,
                 "stop-opacity": "0.3"
-              }, null, 8, Xa),
+              }, null, 8, ja),
               y("stop", {
                 offset: "100%",
                 "stop-color": l.color,
                 "stop-opacity": "0.1"
-              }, null, 8, Ba)
-            ], 8, Ra))), 128))
+              }, null, 8, qa)
+            ], 8, Ga))), 128))
           ], 64))), 256))
         ]),
         (n(!0), r(m, null, k(B.value, (a, s) => (n(), r("g", {
           key: `ds-${s}`
         }, [
-          (n(!0), r(m, null, k(a.datapoints, (l, c) => (n(), r("g", {
+          (n(!0), r(m, null, k(a.datapoints, (l, v) => (n(), r("g", {
             key: l.id
           }, [
-            t.$slots.pattern ? (n(), r("g", Ua, [
+            t.$slots.pattern ? (n(), r("g", Ja, [
               y("defs", null, [
-                p(t.$slots, "pattern", Pe({ ref_for: !0 }, { datapointIndex: s, seriesIndex: c, patternId: `pattern_${A.value}_${l.uid}` }), void 0, !0)
+                p(t.$slots, "pattern", Se({ ref_for: !0 }, { datapointIndex: s, seriesIndex: v, patternId: `pattern_${A.value}_${l.uid}` }), void 0, !0)
               ])
-            ])) : v("", !0),
+            ])) : h("", !0),
             y("path", {
               fill: t.$slots.pattern ? `url(#pattern_${A.value}_${l.uid})` : e.value.style.chart.backgroundColor,
               stroke: "none",
@@ -853,7 +874,7 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
               style: w({
                 opacity: e.value.style.chart.areas.opacity
               })
-            }, null, 12, Va),
+            }, null, 12, Ka),
             y("path", {
               fill: "none",
               stroke: e.value.style.chart.areas.stroke.useSerieColor ? l.color : e.value.style.chart.areas.stroke.color,
@@ -861,24 +882,24 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
               d: e.value.style.chart.areas.smooth ? l.smoothPathRidge : l.straightPathRidge,
               "stroke-linecap": "round",
               "stroke-linejoin": "round",
-              class: ae({ "vue-ui-ridgeline-animate": e.value.useCssAnimation && !u(W) }),
+              class: oe({ "vue-ui-ridgeline-animate": e.value.useCssAnimation && !u(G) }),
               style: w({
                 strokeDasharray: l.pathLength,
                 strokeDashoffset: e.value.useCssAnimation ? l.pathLength : 0
               })
-            }, null, 14, Wa),
+            }, null, 14, Qa),
             y("path", {
               fill: e.value.style.chart.areas.useGradient ? e.value.style.chart.areas.useCommonColor ? `url(#gradient-${l.id}-${A.value})` : `url(#gradient-single-${A.value}-${l.uid})` : l.color,
               stroke: "none",
               d: e.value.style.chart.areas.smooth ? l.smoothPath : l.straightPath,
               "stroke-linecap": "round",
               "stroke-linejoin": "round",
-              class: ae({ "vue-ui-ridgeline-animate": e.value.useCssAnimation && !u(W) }),
+              class: oe({ "vue-ui-ridgeline-animate": e.value.useCssAnimation && !u(G) }),
               style: w({
                 strokeDasharray: l.pathLength,
                 strokeDashoffset: e.value.useCssAnimation ? l.pathLength : 0
               })
-            }, null, 14, Ga),
+            }, null, 14, Za),
             e.value.style.chart.zeroLine.show ? (n(), r("path", {
               key: 1,
               stroke: e.value.style.chart.zeroLine.useSerieColor ? l.color : e.value.style.chart.zeroLine.stroke,
@@ -886,7 +907,7 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
               "stroke-width": e.value.style.chart.zeroLine.strokeWidth,
               d: l.zeroPath,
               "stroke-linecap": "round"
-            }, null, 8, Ya)) : v("", !0),
+            }, null, 8, el)) : h("", !0),
             e.value.style.chart.areas.maxPoint.show && l.plots.length > 1 ? (n(!0), r(m, { key: 2 }, k(l.plots, (_) => (n(), r(m, null, [
               _.isMaxPoint ? (n(), r("line", {
                 key: 0,
@@ -894,12 +915,12 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
                 y1: _.y,
                 x2: _.x,
                 y2: _.zero,
-                stroke: e.value.style.chart.areas.maxPoint.adaptStrokeToBackground ? u(ia)(l.color) : e.value.style.chart.areas.maxPoint.stroke,
+                stroke: e.value.style.chart.areas.maxPoint.adaptStrokeToBackground ? u(ga)(l.color) : e.value.style.chart.areas.maxPoint.stroke,
                 "stroke-width": e.value.style.chart.areas.maxPoint.strokeWidth,
                 "stroke-linecap": "round",
                 "stroke-dasharray": e.value.style.chart.areas.maxPoint.strokeDasharray
-              }, null, 8, ja)) : v("", !0)
-            ], 64))), 256)) : v("", !0),
+              }, null, 8, tl)) : h("", !0)
+            ], 64))), 256)) : h("", !0),
             l.plots.length === 1 ? (n(), r("circle", {
               key: 3,
               cx: l.plots[0].x,
@@ -911,7 +932,7 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
               style: {
                 pointerEvents: "none"
               }
-            }, null, 8, qa)) : v("", !0)
+            }, null, 8, al)) : h("", !0)
           ]))), 128)),
           y("text", {
             x: a.label.x,
@@ -924,18 +945,18 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
               cursor: e.value.style.chart.dialog.show ? "pointer" : "default"
             }),
             "text-decoration": e.value.style.chart.dialog.show && (Ae.value === s || H.value && a.uid === H.value.uid) ? "underline" : "",
-            onMouseenter: (l) => Et(s),
-            onMouseleave: Ht,
-            onClick: (l) => Rt(a)
-          }, R(a.name), 45, Ja)
+            onMouseenter: (l) => Ht(s),
+            onMouseleave: Xt,
+            onClick: (l) => Et(a)
+          }, R(a.name), 45, ll)
         ]))), 128)),
         e.value.style.chart.xAxis.labels.values.length ? (n(), r("g", {
           key: 0,
           ref_key: "timeLabelsEls",
-          ref: he
+          ref: ye
         }, [
-          (n(!0), r(m, null, k(X.value, (a, s) => p(t.$slots, "time-label", Pe({ ref_for: !0 }, {
-            show: a && !e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && !e.value.style.chart.xAxis.labels.showOnlyAtModulo || a && e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && (s === 0 || s === X.value.length - 1) || a && h.value && h.value.index === s || a && !e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && e.value.style.chart.xAxis.labels.showOnlyAtModulo && s % Math.floor(X.value.length / e.value.style.chart.xAxis.labels.modulo) === 0,
+          (n(!0), r(m, null, k(X.value, (a, s) => p(t.$slots, "time-label", Se({ ref_for: !0 }, {
+            show: a && !e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && !e.value.style.chart.xAxis.labels.showOnlyAtModulo || a && e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && (s === 0 || s === X.value.length - 1) || a && d.value && d.value.index === s || a && !e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && e.value.style.chart.xAxis.labels.showOnlyAtModulo && s % Math.floor(X.value.length / e.value.style.chart.xAxis.labels.modulo) === 0,
             fontSize: e.value.style.chart.xAxis.labels.fontSize,
             content: a.label,
             textAnchor: e.value.style.chart.xAxis.labels.rotation > 0 ? "start" : e.value.style.chart.xAxis.labels.rotation < 0 ? "end" : "middle",
@@ -944,7 +965,7 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
             x: a.selectorX,
             y: b.value.bottom + e.value.style.chart.xAxis.labels.offsetY
           }), () => [
-            a && !e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && !e.value.style.chart.xAxis.labels.showOnlyAtModulo || a && e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && (s === 0 || s === X.value.length - 1) || a && h.value && h.value.index === s || a && !e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && e.value.style.chart.xAxis.labels.showOnlyAtModulo && s % Math.floor(X.value.length / e.value.style.chart.xAxis.labels.modulo) === 0 ? (n(), r("g", Ka, [
+            a && !e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && !e.value.style.chart.xAxis.labels.showOnlyAtModulo || a && e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && (s === 0 || s === X.value.length - 1) || a && d.value && d.value.index === s || a && !e.value.style.chart.xAxis.labels.showOnlyFirstAndLast && e.value.style.chart.xAxis.labels.showOnlyAtModulo && s % Math.floor(X.value.length / e.value.style.chart.xAxis.labels.modulo) === 0 ? (n(), r("g", ol, [
               String(a.label).includes(`
 `) ? (n(), r("text", {
                 key: 1,
@@ -955,16 +976,16 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
                 transform: `translate(${a.selectorX}, ${b.value.bottom + e.value.style.chart.xAxis.labels.offsetY}), rotate(${e.value.style.chart.xAxis.labels.rotation})`,
                 "text-anchor": e.value.style.chart.xAxis.labels.rotation > 0 ? "start" : e.value.style.chart.xAxis.labels.rotation < 0 ? "end" : "middle",
                 style: w({
-                  opacity: h.value ? h.value.index === s ? 1 : 0.2 : 1
+                  opacity: d.value ? d.value.index === s ? 1 : 0.2 : 1
                 }),
-                innerHTML: u(ca)({
+                innerHTML: u(fa)({
                   content: String(a.label),
                   fontSize: e.value.style.chart.xAxis.labels.fontSize,
                   fill: e.value.style.chart.xAxis.labels.color,
                   x: 0,
                   y: 0
                 })
-              }, null, 12, Za)) : (n(), r("text", {
+              }, null, 12, nl)) : (n(), r("text", {
                 key: 0,
                 class: "vue-ui-ridgeline-x-axis-label",
                 "font-size": e.value.style.chart.xAxis.labels.fontSize,
@@ -973,12 +994,12 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
                 transform: `translate(${a.selectorX}, ${b.value.bottom + e.value.style.chart.xAxis.labels.offsetY}), rotate(${e.value.style.chart.xAxis.labels.rotation})`,
                 "text-anchor": e.value.style.chart.xAxis.labels.rotation > 0 ? "start" : e.value.style.chart.xAxis.labels.rotation < 0 ? "end" : "middle",
                 style: w({
-                  opacity: h.value ? h.value.index === s ? 1 : 0.2 : 1
+                  opacity: d.value ? d.value.index === s ? 1 : 0.2 : 1
                 })
-              }, R(a.label), 13, Qa))
-            ])) : v("", !0)
+              }, R(a.label), 13, sl))
+            ])) : h("", !0)
           ], !0)), 256))
-        ], 512)) : v("", !0),
+        ], 512)) : h("", !0),
         y("g", null, [
           (n(!0), r(m, null, k(X.value, (a, s) => (n(), r("rect", {
             x: a.x,
@@ -986,26 +1007,26 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
             width: a.width < 0 ? 0.1 : a.width,
             height: a.height < 0 ? 0.1 : a.height,
             fill: "transparent",
-            onMouseenter: (l) => Ot(a),
-            onMouseleave: (l) => Lt(a),
-            onClick: () => zt(a)
-          }, null, 40, el))), 256)),
-          e.value.style.chart.selector.show && h.value ? (n(), r("line", {
+            onMouseenter: (l) => Mt(a),
+            onMouseleave: (l) => zt(a),
+            onClick: () => Dt(a)
+          }, null, 40, rl))), 256)),
+          e.value.style.chart.selector.show && d.value ? (n(), r("line", {
             key: 0,
-            x1: h.value.selectorX,
-            x2: h.value.selectorX,
-            y1: h.value.y,
-            y2: h.value.y + h.value.height - C.value / 2,
+            x1: d.value.selectorX,
+            x2: d.value.selectorX,
+            y1: d.value.y,
+            y2: d.value.y + d.value.height - C.value / 2,
             stroke: e.value.style.chart.selector.stroke,
             "stroke-width": e.value.style.chart.selector.strokeWidth,
             "stroke-dasharray": e.value.style.chart.selector.strokeDasharray,
             "stroke-linecap": "round",
             style: { pointerEvents: "none" }
-          }, null, 8, tl)) : v("", !0),
-          h.value ? (n(!0), r(m, { key: 1 }, k(B.value, (a) => (n(), r(m, null, [
+          }, null, 8, ul)) : h("", !0),
+          d.value ? (n(!0), r(m, { key: 1 }, k(B.value, (a) => (n(), r(m, null, [
             (n(!0), r(m, null, k(a.datapoints, (s) => (n(), r(m, null, [
-              (n(!0), r(m, null, k(s.plots, (l, c) => (n(), r(m, null, [
-                h.value && h.value.index === c ? (n(), r("circle", {
+              (n(!0), r(m, null, k(s.plots, (l, v) => (n(), r(m, null, [
+                d.value && d.value.index === v ? (n(), r("circle", {
                   key: 0,
                   cx: l.x,
                   cy: l.y,
@@ -1016,15 +1037,15 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
                   style: {
                     pointerEvents: "none"
                   }
-                }, null, 8, al)) : v("", !0),
-                h.value && h.value.index === c ? (n(), r("text", {
+                }, null, 8, il)) : h("", !0),
+                d.value && d.value.index === v ? (n(), r("text", {
                   key: 1,
                   x: qe(
                     l.x,
-                    u(ne)(
+                    u(ue)(
                       e.value.style.chart.selector.labels.formatter,
                       l.value,
-                      u(re)({
+                      u(ie)({
                         p: e.value.style.chart.xAxis.labels.prefix,
                         v: l.value,
                         s: e.value.style.chart.xAxis.labels.suffix,
@@ -1036,10 +1057,10 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
                   y: l.y + e.value.style.chart.selector.labels.fontSize / 3,
                   "text-anchor": qe(
                     l.x,
-                    u(ne)(
+                    u(ue)(
                       e.value.style.chart.selector.labels.formatter,
                       l.value,
-                      u(re)({
+                      u(ie)({
                         p: e.value.style.chart.xAxis.labels.prefix,
                         v: l.value,
                         s: e.value.style.chart.xAxis.labels.suffix,
@@ -1053,48 +1074,48 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
                   style: {
                     pointerEvents: "none"
                   }
-                }, R(u(ne)(
+                }, R(u(ue)(
                   e.value.style.chart.selector.labels.formatter,
                   l.value,
-                  u(re)({
+                  u(ie)({
                     p: e.value.style.chart.xAxis.labels.prefix,
                     v: l.value,
                     s: e.value.style.chart.xAxis.labels.suffix,
                     r: e.value.style.chart.selector.labels.rounding
                   })
-                )), 9, ll)) : v("", !0)
+                )), 9, cl)) : h("", !0)
               ], 64))), 256))
             ], 64))), 256))
-          ], 64))), 256)) : v("", !0)
+          ], 64))), 256)) : h("", !0)
         ]),
-        p(t.$slots, "svg", { svg: g.value }, void 0, !0)
-      ], 14, La)),
-      t.$slots.watermark ? (n(), r("div", ol, [
-        p(t.$slots, "watermark", le(oe({ isPrinting: u(Ue) || u(Ve) })), void 0, !0)
-      ])) : v("", !0),
+        p(t.$slots, "svg", { svg: f.value }, void 0, !0)
+      ], 14, Ea)),
+      t.$slots.watermark ? (n(), r("div", vl, [
+        p(t.$slots, "watermark", se(ne({ isPrinting: u(Ue) || u(Ve) })), void 0, !0)
+      ])) : h("", !0),
       y("div", {
         ref_key: "chartLegend",
         ref: De
       }, [
-        e.value.style.chart.legend.show ? (n(), T(_a, {
-          key: `legend_${ce.value}`,
-          legendSet: ke.value,
-          config: Ft.value,
+        e.value.style.chart.legend.show ? (n(), T(za, {
+          key: `legend_${he.value}`,
+          legendSet: te.value,
+          config: Rt.value,
           onClickMarker: o[0] || (o[0] = ({ legend: a }) => Ye(a.id))
         }, _e({
-          item: f(({ legend: a }) => [
-            u(W) ? v("", !0) : (n(), r("div", {
+          item: g(({ legend: a }) => [
+            u(G) ? h("", !0) : (n(), r("div", {
               key: 0,
-              style: w(`opacity:${M.value.includes(a.id) ? 0.5 : 1}`),
+              style: w(`opacity:${O.value.includes(a.id) ? 0.5 : 1}`),
               onClick: (s) => a.segregate()
-            }, R(a.name), 13, sl))
+            }, R(a.name), 13, hl))
           ]),
           _: 2
         }, [
           t.$slots.pattern ? {
             name: "legend-pattern",
-            fn: f(({ legend: a, index: s }) => [
-              Te(Pa, {
+            fn: g(({ legend: a, index: s }) => [
+              Te(Ia, {
                 shape: a.shape,
                 radius: 30,
                 stroke: "none",
@@ -1104,8 +1125,8 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
             ]),
             key: "0"
           } : void 0
-        ]), 1032, ["legendSet", "config"])) : v("", !0),
-        p(t.$slots, "legend", { legend: ke.value }, void 0, !0)
+        ]), 1032, ["legendSet", "config"])) : h("", !0),
+        p(t.$slots, "legend", { legend: te.value }, void 0, !0)
       ], 512),
       t.$slots.source ? (n(), r("div", {
         key: 5,
@@ -1114,31 +1135,31 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
         dir: "auto"
       }, [
         p(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : v("", !0),
-      U.value && e.value.userOptions.buttons.table ? (n(), T(ta(j.value.component), Pe({ key: 6 }, j.value.props, {
+      ], 512)) : h("", !0),
+      U.value && e.value.userOptions.buttons.table ? (n(), T(ra(j.value.component), Se({ key: 6 }, j.value.props, {
         ref_key: "tableUnit",
         ref: V,
         onClose: tt
       }), _e({
-        content: f(() => [
-          (n(), T(u(bt), {
-            key: `table_${wt.value}`,
-            colNames: te.value.colNames,
-            head: te.value.head,
-            body: te.value.body,
-            config: te.value.config,
+        content: g(() => [
+          (n(), T(u(xt), {
+            key: `table_${$t.value}`,
+            colNames: le.value.colNames,
+            head: le.value.head,
+            body: le.value.body,
+            config: le.value.config,
             title: e.value.table.useDialog ? "" : j.value.title,
             withCloseButton: !e.value.table.useDialog,
             onClose: tt
           }, {
-            th: f(({ th: a }) => [
-              y("div", { innerHTML: a }, null, 8, nl)
+            th: g(({ th: a }) => [
+              y("div", { innerHTML: a }, null, 8, dl)
             ]),
-            td: f(({ td: a }) => [
-              Se(R(a.name ? a.name : u(ne)(
+            td: g(({ td: a }) => [
+              Pe(R(a.name ? a.name : u(ue)(
                 e.value.style.chart.selector.labels.formatter,
                 a,
-                u(re)({
+                u(ie)({
                   p: e.value.style.chart.xAxis.labels.prefix,
                   v: a,
                   s: e.value.style.chart.xAxis.labels.suffix,
@@ -1153,20 +1174,20 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
       }, [
         e.value.table.useDialog ? {
           name: "title",
-          fn: f(() => [
-            Se(R(j.value.title), 1)
+          fn: g(() => [
+            Pe(R(j.value.title), 1)
           ]),
           key: "0"
         } : void 0,
         e.value.table.useDialog ? {
           name: "actions",
-          fn: f(() => [
+          fn: g(() => [
             y("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
               onClick: o[1] || (o[1] = (a) => we(e.value.userOptions.callbacks.csv))
             }, [
-              Te(u(mt), {
+              Te(u(pt), {
                 name: "excel",
                 stroke: j.value.props.color
               }, null, 8, ["stroke"])
@@ -1174,11 +1195,11 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
           ]),
           key: "1"
         } : void 0
-      ]), 1040)) : v("", !0),
-      e.value.style.chart.dialog.show ? (n(), T(u(Le), {
+      ]), 1040)) : h("", !0),
+      e.value.style.chart.dialog.show ? (n(), T(u(Me), {
         key: 7,
         ref_key: "dialog",
-        ref: ve,
+        ref: de,
         onClose: o[2] || (o[2] = (a) => H.value = null),
         backgroundColor: e.value.style.chart.dialog.backgroundColor,
         color: e.value.style.chart.dialog.color,
@@ -1188,22 +1209,22 @@ const Oa = ["id"], La = ["xmlns", "viewBox"], za = ["id"], Da = ["stop-color"],
         fullscreenParent: $.value,
         withPadding: ""
       }, {
-        title: f(() => [
-          Se(R(H.value.name), 1)
+        title: g(() => [
+          Pe(R(H.value.name), 1)
         ]),
-        content: f(() => [
-          H.value ? (n(), T(u(gt), {
+        content: g(() => [
+          H.value ? (n(), T(u(mt), {
             key: 0,
             config: Ke.value,
             dataset: Qe.value
-          }, null, 8, ["config", "dataset"])) : v("", !0)
+          }, null, 8, ["config", "dataset"])) : h("", !0)
         ]),
         _: 1
-      }, 8, ["backgroundColor", "color", "headerBg", "headerColor", "isFullscreen", "fullscreenParent"])) : v("", !0),
-      u(W) ? (n(), T(ba, { key: 8 })) : v("", !0)
-    ], 46, Oa));
+      }, 8, ["backgroundColor", "color", "headerBg", "headerColor", "isFullscreen", "fullscreenParent"])) : h("", !0),
+      u(G) ? (n(), T($a, { key: 8 })) : h("", !0)
+    ], 46, Ra));
   }
-}, wl = /* @__PURE__ */ Ma(rl, [["__scopeId", "data-v-5c2e0e6a"]]);
+}, Ml = /* @__PURE__ */ Fa(yl, [["__scopeId", "data-v-0a6ef1d2"]]);
 export {
-  wl as default
+  Ml as default
 };