vue-data-ui 2.3.38 → 2.3.40

package/dist/{vue-ui-xy-B5_TQJnd.js → vue-ui-xy-vIwvvGNZ.js}

@@ -1,19 +1,19 @@
 import { p as J } from "./pdf-97UbtKC2.js";
-import { U as K, s as Q } from "./usePrinter-Dx2e-dXi.js";
-import { c as U, a as j, t as $, v as ee, p as te, u as ae, P as X, J as M, f as q, F as le, U as re, i as ie, A as se, V as oe, M as ne, W as he, y as ce, s as ue, d as de, z as ge, b as fe, r as be, q as Ie, D as me, S as Ne, Y as _e, w as Fe, x as xe, e as ye, o as Ae, Z as Le, C as Se } from "./index-BUQIyeLx.js";
-import { D as Ce } from "./DataTable-DKkvLXwD.js";
-import { _ as ke } from "./Title-0FYOLRT9.js";
-import { _ as we, u as Oe } from "./Tooltip-hkjfa0I0.js";
-import { _ as ve } from "./Shape-BpneoNiL.js";
-import Ge from "./BaseIcon-B8hVR5-4.js";
-import ze from "./vue-ui-table-sparkline-CjB5rPvu.js";
-import pe from "./vue-ui-skeleton-BxxNQUrb.js";
-import { S as Te } from "./Slicer-CTBvSici.js";
-import Me from "./vue-ui-accordion-B_7G2YRK.js";
-import { u as Z } from "./useNestedProp-CW-4h79P.js";
-import { resolveComponent as P, openBlock as r, createElementBlock as i, normalizeClass as T, normalizeStyle as L, createVNode as E, createCommentVNode as h, createBlock as V, createSlots as Pe, withCtx as z, renderSlot as v, normalizeProps as Y, guardReactiveProps as W, createElementVNode as d, Fragment as I, renderList as m, toDisplayString as C, withDirectives as Ve, vModelCheckbox as Re, createTextVNode as De } from "vue";
-import { _ as He } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Be = U(), Ye = {
+import { U as K, s as Q } from "./usePrinter-CLjymPxw.js";
+import { c as Z, a as j, t as $, v as ee, p as te, u as ae, P as X, J as M, f as q, F as le, U as re, i as ie, V as se, W as oe, M as ne, Y as ce, y as he, s as de, d as ue, z as ge, b as fe, r as be, q as me, D as Ie, S as Ne, Z as _e, w as xe, x as Fe, e as ye, o as Ae, _ as Le, C as Se } from "./index-CLohkSjv.js";
+import { D as Ce } from "./DataTable-xRoJJLCK.js";
+import { _ as ke } from "./Title-WVL1w90F.js";
+import { _ as we, u as Oe } from "./Tooltip-B5_8pR7S.js";
+import { _ as ve } from "./Shape-Cnsn1U1B.js";
+import Ge from "./BaseIcon-D7REqiel.js";
+import ze from "./vue-ui-table-sparkline-BYv7kseR.js";
+import pe from "./vue-ui-skeleton-Cu-FCvsL.js";
+import { S as Te } from "./Slicer-CdoJYj--.js";
+import Me from "./vue-ui-accordion-B6lUgTu6.js";
+import { u as U } from "./useNestedProp-BsIUgLPI.js";
+import { resolveComponent as P, openBlock as r, createElementBlock as i, normalizeClass as T, normalizeStyle as L, createVNode as Y, createCommentVNode as c, createBlock as V, createSlots as Pe, withCtx as z, renderSlot as v, normalizeProps as W, guardReactiveProps as B, createElementVNode as u, Fragment as b, renderList as I, toDisplayString as C, withDirectives as Ve, vModelCheckbox as Re, createTextVNode as De } from "vue";
+import { _ as Ee } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const He = Z(), We = {
   name: "vue-ui-xy",
   props: {
     config: {
@@ -42,15 +42,15 @@ const Be = U(), Ye = {
     Accordion: Me
   },
   data() {
-    this.dataset.forEach((c, b) => {
-      [null, void 0].includes(c.series) && this.error({
+    this.dataset.forEach((h, m) => {
+      [null, void 0].includes(h.series) && this.error({
         componentName: "VueUiXy",
         type: "datasetSerieAttribute",
         property: "series (number[])",
-        index: b
+        index: m
       });
     });
-    const l = Math.max(...this.dataset.map((c) => c.series.length)), o = {
+    const l = Math.max(...this.dataset.map((h) => h.series.length)), o = {
       start: 0,
       end: l
     };
@@ -96,14 +96,14 @@ const Be = U(), Ye = {
       selectedSerieIndex: null,
       selectedRowIndex: null,
       segregatedSeries: [],
-      uniqueId: U(),
+      uniqueId: Z(),
       step: 0,
       slicer: o,
       __to__: null,
       maxX: l,
       showSparklineTable: !0,
       segregateStep: 0,
-      sliderId: Be,
+      sliderId: He,
       fontSizes: {
         xAxis: 18,
         yAxis: 12,
@@ -150,7 +150,7 @@ const Be = U(), Ye = {
         id: t.id,
         yOffset: t.yOffset || 0,
         individualHeight: t.individualHeight || this.drawingArea.height
-      })), c = this.plotSet.map((t) => ({
+      })), h = this.plotSet.map((t) => ({
         name: t.name,
         color: t.color,
         scale: t.individualScale,
@@ -162,8 +162,8 @@ const Be = U(), Ye = {
         id: t.id,
         yOffset: t.yOffset || 0,
         individualHeight: t.individualHeight || this.drawingArea.height
-      })), b = [...l, ...o, ...c].flatMap((t) => t).length;
-      return [...l, ...o, ...c].flatMap((t, e) => ({
+      })), m = [...l, ...o, ...h].flatMap((t) => t).length;
+      return [...l, ...o, ...h].flatMap((t, e) => ({
         id: t.id,
         scaleLabel: t.scaleLabel,
         name: t.name,
@@ -171,7 +171,7 @@ const Be = U(), Ye = {
         scale: t.scale,
         yOffset: t.yOffset,
         individualHeight: t.individualHeight,
-        x: this.mutableConfig.isStacked ? this.drawingArea.left : this.drawingArea.left / b * (e + 1),
+        x: this.mutableConfig.isStacked ? this.drawingArea.left : this.drawingArea.left / m * (e + 1),
         yLabels: t.scaleYLabels || t.scale.ticks.map((N) => ({
           y: N >= 0 ? t.zero - t.individualHeight * (N / t.max) : t.zero + t.individualHeight * Math.abs(N) / t.max,
           value: N
@@ -194,8 +194,8 @@ const Be = U(), Ye = {
           userConfig: this.config,
           defaultConfig: l
         });
-        return o.theme ? {
-          ...Z({
+        return "highlightArea" in this.config.chart && (Array.isArray(this.config.chart.highlightArea) ? o.chart.highlightArea = this.config.chart.highlightArea : o.chart.highlightArea = [this.config.chart.highlightArea]), o.theme ? {
+          ...U({
             userConfig: this.themes.vue_ui_xy[o.theme] || this.config,
             defaultConfig: o
           }),
@@ -207,11 +207,19 @@ const Be = U(), Ye = {
       }
     },
     hasHighlightArea() {
-      return this.FINAL_CONFIG.chart.highlightArea && this.FINAL_CONFIG.chart.highlightArea.show;
+      return Array.isArray(this.FINAL_CONFIG.chart.highlightArea) ? this.FINAL_CONFIG.chart.highlightArea.some((l) => l.show) : this.FINAL_CONFIG.chart.highlightArea && this.FINAL_CONFIG.chart.highlightArea.show;
     },
-    highlightAreaSpan() {
-      const { from: l, to: o } = this.FINAL_CONFIG.chart.highlightArea;
-      return l === o ? 1 : o < l ? 0 : o - l + 1;
+    highlightAreas() {
+      if (Array.isArray(this.FINAL_CONFIG.chart.highlightArea))
+        return this.FINAL_CONFIG.chart.highlightArea.map((o) => ({
+          ...o,
+          span: o.from === o.to ? 1 : o.to < o.from ? 0 : o.to - o.from + 1
+        }));
+      const l = this.FINAL_CONFIG.chart.highlightArea;
+      return [{ ...l, span: l.from === l.to ? 1 : l.to < l.from ? 0 : l.to - l.from + 1 }];
+    },
+    xPadding() {
+      return this.FINAL_CONFIG.chart.grid.position === "middle" ? 0 : this.drawingArea.width / this.maxSeries / 2;
     },
     relativeZero() {
       return this.niceScale.min >= 0 ? 0 : Math.abs(this.niceScale.min);
@@ -222,7 +230,7 @@ const Be = U(), Ye = {
     safeDataset() {
       return this.useSafeValues ? this.dataset.map((l, o) => ({
         ...l,
-        series: l.series.map((c) => this.isSafeValue(c) ? c : null).slice(this.slicer.start, this.slicer.end),
+        series: l.series.map((h) => this.isSafeValue(h) ? h : null).slice(this.slicer.start, this.slicer.end),
         color: this.convertColorToHex(l.color ? l.color : this.customPalette[o] ? this.customPalette[o] : this.palette[o]),
         id: `uniqueId_${o}`
       })) : this.dataset;
@@ -230,13 +238,13 @@ const Be = U(), Ye = {
     relativeDataset() {
       return this.safeDataset.map((l, o) => ({
         ...l,
-        series: l.series.map((c) => c + this.relativeZero),
+        series: l.series.map((h) => h + this.relativeZero),
         absoluteValues: l.series
       })).filter((l) => !this.segregatedSeries.includes(l.id));
     },
     tableSparklineDataset() {
       return this.relativeDataset.map((l) => {
-        const o = l.absoluteValues.map((c) => [void 0, null].includes(c) ? 0 : c);
+        const o = l.absoluteValues.map((h) => [void 0, null].includes(h) ? 0 : h);
         return {
           id: l.id,
           name: l.name,
@@ -275,7 +283,7 @@ const Be = U(), Ye = {
       return this.safeDataset.map((l, o) => ({
         absoluteIndex: o,
         ...l,
-        series: l.series.map((c) => c + this.relativeZero),
+        series: l.series.map((h) => h + this.relativeZero),
         absoluteValues: l.series,
         segregate: () => this.segregate(l),
         isSegregated: this.segregatedSeries.includes(l.id)
@@ -284,45 +292,45 @@ const Be = U(), Ye = {
     barSet() {
       return this.activeSeriesWithStackRatios.filter((l) => l.type === "bar").map((l, o) => {
         this.checkAutoScaleError(l);
-        const c = Math.min(...l.absoluteValues.filter((u) => ![null, void 0].includes(u))), b = Math.max(...l.absoluteValues.filter((u) => ![null, void 0].includes(u))), e = {
-          ratios: l.absoluteValues.filter((u) => ![null, void 0].includes(u)).map((u) => (u - c) / (b - c)),
-          valueMin: c,
-          valueMax: b < 0 ? 0 : b
+        const h = Math.min(...l.absoluteValues.filter((d) => ![null, void 0].includes(d))), m = Math.max(...l.absoluteValues.filter((d) => ![null, void 0].includes(d))), e = {
+          ratios: l.absoluteValues.filter((d) => ![null, void 0].includes(d)).map((d) => (d - h) / (m - h)),
+          valueMin: h,
+          valueMax: m < 0 ? 0 : m
         }, N = {
           max: l.scaleMax || Math.max(...l.absoluteValues) || 1,
-          min: l.scaleMin || Math.min(...l.absoluteValues.filter((u) => ![void 0, null].includes(u))) > 0 ? 0 : Math.min(...l.absoluteValues.filter((u) => ![null, void 0].includes(u)))
-        }, A = l.scaleSteps || this.FINAL_CONFIG.chart.grid.labels.yAxis.commonScaleSteps, f = this.calculateNiceScale(N.min, N.max, A), F = this.calculateNiceScale(e.valueMin, e.valueMax, A), p = f.min >= 0 ? 0 : Math.abs(f.min), k = 0, w = f.max + p, G = F.max + Math.abs(k), _ = this.mutableConfig.isStacked ? this.drawingArea.height * (1 - l.cumulatedStackRatio) : 0, S = this.mutableConfig.isStacked ? this.drawingArea.height * l.stackRatio - this.FINAL_CONFIG.chart.grid.labels.yAxis.gap : this.drawingArea.height, a = this.drawingArea.bottom - _ - S * p / w, n = this.drawingArea.bottom - _ - S * k / G, s = this.absoluteDataset.filter((u) => u.type === "bar").filter((u) => !this.segregatedSeries.includes(u.id)).length, g = l.series.map((u, x) => {
-          const H = this.mutableConfig.useIndividualScale ? (l.absoluteValues[x] + p) / w : this.ratioToMax(u), B = this.mutableConfig.useIndividualScale && this.mutableConfig.isStacked ? this.drawingArea.left + this.drawingArea.width / this.maxSeries * x : this.drawingArea.left + this.slot.bar * o + this.slot.bar * x * s - this.barSlot / 2 - o * this.barPeriodGap;
+          min: l.scaleMin || Math.min(...l.absoluteValues.filter((d) => ![void 0, null].includes(d))) > 0 ? 0 : Math.min(...l.absoluteValues.filter((d) => ![null, void 0].includes(d)))
+        }, A = l.scaleSteps || this.FINAL_CONFIG.chart.grid.labels.yAxis.commonScaleSteps, f = this.calculateNiceScaleWithExactExtremes(N.min, N.max, A), x = this.calculateNiceScaleWithExactExtremes(e.valueMin, e.valueMax, A), p = f.min >= 0 ? 0 : Math.abs(f.min), k = 0, w = f.max + p, G = x.max + Math.abs(k), _ = this.mutableConfig.isStacked ? this.drawingArea.height * (1 - l.cumulatedStackRatio) : 0, S = this.mutableConfig.isStacked ? this.drawingArea.height * l.stackRatio - this.FINAL_CONFIG.chart.grid.labels.yAxis.gap : this.drawingArea.height, a = this.drawingArea.bottom - _ - S * p / w, n = this.drawingArea.bottom - _ - S * k / G, s = this.absoluteDataset.filter((d) => d.type === "bar").filter((d) => !this.segregatedSeries.includes(d.id)).length, g = l.series.map((d, F) => {
+          const E = this.mutableConfig.useIndividualScale ? (l.absoluteValues[F] + p) / w : this.ratioToMax(d), H = this.mutableConfig.useIndividualScale && this.mutableConfig.isStacked ? this.drawingArea.left + this.drawingArea.width / this.maxSeries * F : this.drawingArea.left + this.slot.bar * o + this.slot.bar * F * s - this.barSlot / 2 - o * this.barPeriodGap;
           return {
             yOffset: _,
             individualHeight: S,
-            x: B,
-            y: this.drawingArea.bottom - _ - S * H,
-            value: l.absoluteValues[x],
+            x: H,
+            y: this.drawingArea.bottom - _ - S * E,
+            value: l.absoluteValues[F],
             zeroPosition: a,
             individualMax: w,
-            comment: l.comments && l.comments.slice(this.slicer.start, this.slicer.end)[x] || ""
+            comment: l.comments && l.comments.slice(this.slicer.start, this.slicer.end)[F] || ""
           };
-        }), D = l.absoluteValues.map((u) => F.min >= 0 ? (u - Math.abs(F.min)) / (F.max - Math.abs(F.min)) : (u + Math.abs(F.min)) / (F.max + Math.abs(F.min))), R = l.series.map((u, x) => {
-          const H = this.mutableConfig.useIndividualScale && this.mutableConfig.isStacked ? this.drawingArea.left + this.drawingArea.width / this.maxSeries * x : this.drawingArea.left - this.slot.bar / 2 + this.slot.bar * o + this.slot.bar * x * this.absoluteDataset.filter((B) => B.type === "bar").filter((B) => !this.segregatedSeries.includes(B.id)).length;
+        }), D = l.absoluteValues.map((d) => x.min >= 0 ? (d - Math.abs(x.min)) / (x.max - Math.abs(x.min)) : (d + Math.abs(x.min)) / (x.max + Math.abs(x.min))), R = l.series.map((d, F) => {
+          const E = this.mutableConfig.useIndividualScale && this.mutableConfig.isStacked ? this.drawingArea.left + this.drawingArea.width / this.maxSeries * F : this.drawingArea.left - this.slot.bar / 2 + this.slot.bar * o + this.slot.bar * F * this.absoluteDataset.filter((H) => H.type === "bar").filter((H) => !this.segregatedSeries.includes(H.id)).length;
           return {
             yOffset: _,
             individualHeight: S,
-            x: H,
-            y: this.drawingArea.bottom - _ - (S * D[x] || 0),
-            value: l.absoluteValues[x],
+            x: E,
+            y: this.drawingArea.bottom - _ - (S * D[F] || 0),
+            value: l.absoluteValues[F],
             zeroPosition: a,
             individualMax: w,
-            comment: l.comments && l.comments.slice(this.slicer.start, this.slicer.end)[x] || ""
+            comment: l.comments && l.comments.slice(this.slicer.start, this.slicer.end)[F] || ""
           };
-        }), y = f.ticks.map((u) => ({
-          y: u >= 0 ? a - S * (u / w) : a + S * Math.abs(u) / w,
-          value: u
-        })), O = F.ticks.map((u) => {
-          const x = (u - F.min) / (F.max - F.min);
+        }), y = f.ticks.map((d) => ({
+          y: d >= 0 ? a - S * (d / w) : a + S * Math.abs(d) / w,
+          value: d
+        })), O = x.ticks.map((d) => {
+          const F = (d - x.min) / (x.max - x.min);
           return {
-            y: u >= 0 ? n - S * x : n + S * x,
-            value: u
+            y: d >= 0 ? n - S * F : n + S * F,
+            value: d
           };
         });
         return {
@@ -331,7 +339,7 @@ const Be = U(), Ye = {
           autoScaleYLabels: O,
           individualHeight: S,
           scaleYLabels: l.autoScaling ? O : y,
-          individualScale: l.autoScaling ? F : f,
+          individualScale: l.autoScaling ? x : f,
           individualMax: l.autoScaling ? G : w,
           zeroPosition: l.autoScaling ? n : a,
           plots: l.autoScaling ? R : g
@@ -347,37 +355,37 @@ const Be = U(), Ye = {
     lineSet() {
       return this.activeSeriesWithStackRatios.filter((l) => l.type === "line").map((l) => {
         this.checkAutoScaleError(l);
-        const o = Math.min(...l.absoluteValues.filter((u) => ![void 0, null].includes(u))), c = Math.max(...l.absoluteValues.filter((u) => ![void 0, null].includes(u))) || 1, t = {
-          ratios: l.absoluteValues.filter((u) => ![null, void 0].includes(u)).map((u) => (u - o) / (c - o)),
+        const o = Math.min(...l.absoluteValues.filter((d) => ![void 0, null].includes(d))), h = Math.max(...l.absoluteValues.filter((d) => ![void 0, null].includes(d))) || 1, t = {
+          ratios: l.absoluteValues.filter((d) => ![null, void 0].includes(d)).map((d) => (d - o) / (h - o)),
           valueMin: o,
-          valueMax: c
+          valueMax: h
         }, e = {
           max: l.scaleMax || Math.max(...l.absoluteValues) || 1,
           min: l.scaleMin || (Math.min(...l.absoluteValues) > 0 ? 0 : Math.min(...l.absoluteValues))
-        }, N = l.scaleSteps || this.FINAL_CONFIG.chart.grid.labels.yAxis.commonScaleSteps, A = this.calculateNiceScale(e.min, e.max, N), f = this.calculateNiceScale(t.valueMin, t.valueMax, N), F = A.min >= 0 ? 0 : Math.abs(A.min), p = 0, k = A.max + Math.abs(F), w = f.max + Math.abs(p), G = this.mutableConfig.isStacked ? this.drawingArea.height * (1 - l.cumulatedStackRatio) : 0, _ = this.mutableConfig.isStacked ? this.drawingArea.height * l.stackRatio - this.FINAL_CONFIG.chart.grid.labels.yAxis.gap : this.drawingArea.height, S = this.drawingArea.bottom - G - _ * F / k, a = this.drawingArea.bottom - G - _ * p / w, n = l.series.map((u, x) => {
-          const H = this.mutableConfig.useIndividualScale ? (l.absoluteValues[x] + Math.abs(F)) / k : this.ratioToMax(u);
+        }, N = l.scaleSteps || this.FINAL_CONFIG.chart.grid.labels.yAxis.commonScaleSteps, A = this.calculateNiceScaleWithExactExtremes(e.min, e.max, N), f = this.calculateNiceScaleWithExactExtremes(t.valueMin, t.valueMax, N), x = A.min >= 0 ? 0 : Math.abs(A.min), p = 0, k = A.max + Math.abs(x), w = f.max + Math.abs(p), G = this.mutableConfig.isStacked ? this.drawingArea.height * (1 - l.cumulatedStackRatio) : 0, _ = this.mutableConfig.isStacked ? this.drawingArea.height * l.stackRatio - this.FINAL_CONFIG.chart.grid.labels.yAxis.gap : this.drawingArea.height, S = this.drawingArea.bottom - G - _ * x / k, a = this.drawingArea.bottom - G - _ * p / w, n = l.series.map((d, F) => {
+          const E = this.mutableConfig.useIndividualScale ? (l.absoluteValues[F] + Math.abs(x)) / k : this.ratioToMax(d);
           return {
-            x: this.drawingArea.left + this.slot.line / 2 + this.slot.line * x,
-            y: this.drawingArea.bottom - G - _ * H,
-            value: l.absoluteValues[x],
-            comment: l.comments && l.comments.slice(this.slicer.start, this.slicer.end)[x] || ""
+            x: this.drawingArea.left + this.slot.line / 2 + this.slot.line * F,
+            y: this.drawingArea.bottom - G - _ * E,
+            value: l.absoluteValues[F],
+            comment: l.comments && l.comments.slice(this.slicer.start, this.slicer.end)[F] || ""
           };
-        }), s = l.absoluteValues.map((u) => f.min >= 0 ? (u - Math.abs(f.min)) / (f.max - Math.abs(f.min)) : (u + Math.abs(f.min)) / (f.max + Math.abs(f.min))), g = l.series.map((u, x) => {
-          if (![void 0, null].includes(l.absoluteValues[x]))
+        }), s = l.absoluteValues.map((d) => f.min >= 0 ? (d - Math.abs(f.min)) / (f.max - Math.abs(f.min)) : (d + Math.abs(f.min)) / (f.max + Math.abs(f.min))), g = l.series.map((d, F) => {
+          if (![void 0, null].includes(l.absoluteValues[F]))
             return {
-              x: this.drawingArea.left + this.slot.line / 2 + this.slot.line * x,
-              y: this.drawingArea.bottom - G - (_ * s[x] || 0),
-              value: l.absoluteValues[x],
-              comment: l.comments && l.comments.slice(this.slicer.start, this.slicer.end)[x] || ""
+              x: this.drawingArea.left + this.slot.line / 2 + this.slot.line * F,
+              y: this.drawingArea.bottom - G - (_ * s[F] || 0),
+              value: l.absoluteValues[F],
+              comment: l.comments && l.comments.slice(this.slicer.start, this.slicer.end)[F] || ""
             };
-        }), D = this.createSmoothPath(n), R = this.createSmoothPath(g), y = A.ticks.map((u) => ({
-          y: u >= 0 ? S - _ * (u / k) : S + _ * Math.abs(u) / k,
-          value: u
-        })), O = f.ticks.map((u) => {
-          const x = (u - f.min) / (f.max - f.min);
+        }), D = this.createSmoothPath(n), R = this.createSmoothPath(g), y = A.ticks.map((d) => ({
+          y: d >= 0 ? S - _ * (d / k) : S + _ * Math.abs(d) / k,
+          value: d
+        })), O = f.ticks.map((d) => {
+          const F = (d - f.min) / (f.max - f.min);
           return {
-            y: u >= 0 ? a - _ * x : a + _ * x,
-            value: u
+            y: d >= 0 ? a - _ * F : a + _ * F,
+            value: d
           };
         });
         return {
@@ -398,18 +406,18 @@ const Be = U(), Ye = {
     plotSet() {
       return this.activeSeriesWithStackRatios.filter((l) => l.type === "plot").map((l) => {
         this.checkAutoScaleError(l);
-        const o = Math.min(...l.absoluteValues.filter((y) => ![null, void 0].includes(y))), c = Math.max(...l.absoluteValues.filter((y) => ![null, void 0].includes(y))) || 1, t = {
-          ratios: l.absoluteValues.filter((y) => ![null, void 0].includes(y)).map((y) => (y - o) / (c - o)),
+        const o = Math.min(...l.absoluteValues.filter((y) => ![null, void 0].includes(y))), h = Math.max(...l.absoluteValues.filter((y) => ![null, void 0].includes(y))) || 1, t = {
+          ratios: l.absoluteValues.filter((y) => ![null, void 0].includes(y)).map((y) => (y - o) / (h - o)),
           valueMin: o,
-          valueMax: c
+          valueMax: h
         }, e = {
           max: l.scaleMax || Math.max(...l.absoluteValues) || 1,
           min: l.scaleMin || Math.min(...l.absoluteValues) > 0 ? 0 : Math.min(...l.absoluteValues)
-        }, N = l.scaleSteps || this.FINAL_CONFIG.chart.grid.labels.yAxis.commonScaleSteps, A = this.calculateNiceScale(e.min, e.max, N), f = this.calculateNiceScale(t.valueMin, t.valueMax, N), F = A.min >= 0 ? 0 : Math.abs(A.min), p = 0, k = A.max + F, w = f.max + Math.abs(p), G = this.mutableConfig.isStacked ? this.drawingArea.height * (1 - l.cumulatedStackRatio) : 0, _ = this.mutableConfig.isStacked ? this.drawingArea.height * l.stackRatio - this.FINAL_CONFIG.chart.grid.labels.yAxis.gap : this.drawingArea.height, S = this.drawingArea.bottom - G - _ * F / k, a = this.drawingArea.bottom - G - _ * p / w, n = l.series.map((y, O) => {
-          const u = this.mutableConfig.useIndividualScale ? (l.absoluteValues[O] + Math.abs(F)) / k : this.ratioToMax(y);
+        }, N = l.scaleSteps || this.FINAL_CONFIG.chart.grid.labels.yAxis.commonScaleSteps, A = this.calculateNiceScaleWithExactExtremes(e.min, e.max, N), f = this.calculateNiceScaleWithExactExtremes(t.valueMin, t.valueMax, N), x = A.min >= 0 ? 0 : Math.abs(A.min), p = 0, k = A.max + x, w = f.max + Math.abs(p), G = this.mutableConfig.isStacked ? this.drawingArea.height * (1 - l.cumulatedStackRatio) : 0, _ = this.mutableConfig.isStacked ? this.drawingArea.height * l.stackRatio - this.FINAL_CONFIG.chart.grid.labels.yAxis.gap : this.drawingArea.height, S = this.drawingArea.bottom - G - _ * x / k, a = this.drawingArea.bottom - G - _ * p / w, n = l.series.map((y, O) => {
+          const d = this.mutableConfig.useIndividualScale ? (l.absoluteValues[O] + Math.abs(x)) / k : this.ratioToMax(y);
           return {
             x: this.drawingArea.left + this.slot.plot / 2 + this.slot.plot * O,
-            y: this.drawingArea.bottom - G - _ * u,
+            y: this.drawingArea.bottom - G - _ * d,
             value: l.absoluteValues[O],
             comment: l.comments && l.comments.slice(this.slicer.start, this.slicer.end)[O] || ""
           };
@@ -460,7 +468,7 @@ const Be = U(), Ye = {
       return l > 0 ? 0 : l;
     },
     niceScale() {
-      return this.calculateNiceScale(this.min, this.max < 0 ? 0 : this.max, this.FINAL_CONFIG.chart.grid.labels.yAxis.commonScaleSteps);
+      return this.calculateNiceScaleWithExactExtremes(this.min, this.max < 0 ? 0 : this.max, this.FINAL_CONFIG.chart.grid.labels.yAxis.commonScaleSteps);
     },
     maxSeries() {
       return this.slicer.end - this.slicer.start;
@@ -487,15 +495,15 @@ const Be = U(), Ye = {
     },
     table() {
       if (this.safeDataset.length === 0) return { head: [], body: [], config: {}, columnNames: [] };
-      const l = this.relativeDataset.map((c) => ({
-        label: c.name,
-        color: c.color,
-        type: c.type
+      const l = this.relativeDataset.map((h) => ({
+        label: h.name,
+        color: h.color,
+        type: h.type
       })), o = [];
-      return this.timeLabels.forEach((c, b) => {
-        const t = [c];
+      return this.timeLabels.forEach((h, m) => {
+        const t = [h];
         this.relativeDataset.forEach((e) => {
-          t.push(this.canShowValue(e.absoluteValues[b]) ? Number(e.absoluteValues[b].toFixed(this.FINAL_CONFIG.table.rounding)) : "");
+          t.push(this.canShowValue(e.absoluteValues[m]) ? Number(e.absoluteValues[m].toFixed(this.FINAL_CONFIG.table.rounding)) : "");
         }), o.push(t);
       }), { head: l, body: o };
     },
@@ -506,7 +514,7 @@ const Be = U(), Ye = {
         const e = this.relativeDataset.map((N) => N.absoluteValues[t] ?? 0).reduce((N, A) => N + A, 0);
         o.push([this.timeLabels[t] ?? "-"].concat(this.relativeDataset.map((N) => (N.absoluteValues[t] ?? 0).toFixed(this.FINAL_CONFIG.table.rounding))).concat((e ?? 0).toFixed(this.FINAL_CONFIG.table.rounding)));
       }
-      const c = {
+      const h = {
         th: {
           backgroundColor: this.FINAL_CONFIG.table.th.backgroundColor,
           color: this.FINAL_CONFIG.table.th.color,
@@ -518,8 +526,8 @@ const Be = U(), Ye = {
           outline: this.FINAL_CONFIG.table.td.outline
         },
         breakpoint: this.FINAL_CONFIG.table.responsiveBreakpoint
-      }, b = [this.FINAL_CONFIG.table.columnNames.period].concat(this.relativeDataset.map((t) => t.name)).concat(this.FINAL_CONFIG.table.columnNames.total);
-      return { head: l, body: o, config: c, colNames: b };
+      }, m = [this.FINAL_CONFIG.table.columnNames.period].concat(this.relativeDataset.map((t) => t.name)).concat(this.FINAL_CONFIG.table.columnNames.total);
+      return { head: l, body: o, config: h, colNames: m };
     },
     dataTooltipSlot() {
       return {
@@ -538,14 +546,14 @@ const Be = U(), Ye = {
         name: l.name,
         color: l.color,
         type: l.type,
-        value: l.absoluteValues.find((o, c) => c === this.selectedSerieIndex),
+        value: l.absoluteValues.find((o, h) => h === this.selectedSerieIndex),
         comments: l.comments || []
       }));
     },
     tooltipContent() {
       let l = "", o = this.selectedSeries.map((t) => t.value).filter((t) => this.isSafeValue(t) && t !== null).reduce((t, e) => Math.abs(t) + Math.abs(e), 0);
-      const c = this.timeLabels[this.selectedSerieIndex], b = this.FINAL_CONFIG.chart.tooltip.customFormat;
-      return this.isFunction(b) && this.functionReturnsString(() => b({
+      const h = this.timeLabels[this.selectedSerieIndex], m = this.FINAL_CONFIG.chart.tooltip.customFormat;
+      return this.isFunction(m) && this.functionReturnsString(() => m({
         seriesIndex: this.selectedSerieIndex,
         datapoint: this.selectedSeries,
         series: this.absoluteDataset,
@@ -553,7 +561,7 @@ const Be = U(), Ye = {
         lines: this.lineSet,
         plots: this.plotSet,
         config: this.FINAL_CONFIG
-      })) ? b({
+      })) ? m({
         seriesIndex: this.selectedSerieIndex,
         datapoint: this.selectedSeries,
         series: this.absoluteDataset,
@@ -561,7 +569,7 @@ const Be = U(), Ye = {
         lines: this.lineSet,
         plots: this.plotSet,
         config: this.FINAL_CONFIG
-      }) : (c && (l += `<div style="padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid ${this.FINAL_CONFIG.chart.tooltip.borderColor}; width:100%">${c}</div>`), this.selectedSeries.forEach((t) => {
+      }) : (h && (l += `<div style="padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid ${this.FINAL_CONFIG.chart.tooltip.borderColor}; width:100%">${h}</div>`), this.selectedSeries.forEach((t) => {
         if (this.isSafeValue(t.value)) {
           let e = "", N = "";
           switch (this.icons[t.type]) {
@@ -647,9 +655,9 @@ const Be = U(), Ye = {
         index: o
       });
     }), this.FINAL_CONFIG.showWarnings && this.dataset.forEach((l) => {
-      l.series.forEach((o, c) => {
-        this.isSafeValue(o) || console.warn(`SmartXY has detected an unsafe value in your dataset:
------> The serie '${l.name}' contains the value '${o}' at index ${c}.
+      l.series.forEach((o, h) => {
+        this.isSafeValue(o) || console.warn(`VueUiXy has detected an unsafe value in your dataset:
+-----> The serie '${l.name}' contains the value '${o}' at index ${h}.
 '${o}' was converted to null to allow the chart to display.`);
       });
     }), document.addEventListener("mousemove", (l) => {
@@ -666,15 +674,15 @@ const Be = U(), Ye = {
       isStacked: this.FINAL_CONFIG.chart.grid.labels.yAxis.stacked,
       useIndividualScale: this.FINAL_CONFIG.chart.grid.labels.yAxis.useIndividualScale
     }, this.FINAL_CONFIG.responsive) {
-      const o = this.$refs.chart.parentNode, { height: c, width: b } = o.getBoundingClientRect();
+      const o = this.$refs.chart.parentNode, { height: h, width: m } = o.getBoundingClientRect();
       let t = null, e = 0;
       this.FINAL_CONFIG.chart.title.show && (t = this.$refs.chartTitle, e = t.getBoundingClientRect().height);
       let N = null, A = 0;
       this.FINAL_CONFIG.chart.zoom.show && this.maxX > 6 && this.isDataset && (N = this.$refs.chartSlicer.$el, A = N.getBoundingClientRect().height);
-      let f = null, F = 0;
-      this.FINAL_CONFIG.chart.legend.show && (f = this.$refs.chartLegend, F = f.getBoundingClientRect().height), this.height = c - e - F - A, this.width = b, this.viewBox = `0 0 ${this.width < 0 ? 10 : this.width} ${this.height < 0 ? 10 : this.height}`, this.convertSizes(), new ResizeObserver((k) => {
+      let f = null, x = 0;
+      this.FINAL_CONFIG.chart.legend.show && (f = this.$refs.chartLegend, x = f.getBoundingClientRect().height), this.height = h - e - x - A, this.width = m, this.viewBox = `0 0 ${this.width < 0 ? 10 : this.width} ${this.height < 0 ? 10 : this.height}`, this.convertSizes(), new ResizeObserver((k) => {
         for (const w of k)
-          t && (e = t.getBoundingClientRect().height), N && (A = N.getBoundingClientRect().height), f && (F = f.getBoundingClientRect().height), this.height = w.contentBoxSize[0].blockSize - e - F - A - 24, this.width = w.contentBoxSize[0].inlineSize, this.viewBox = `0 0 ${this.width < 0 ? 10 : this.width} ${this.height < 0 ? 10 : this.height}`, this.convertSizes();
+          t && (e = t.getBoundingClientRect().height), N && (A = N.getBoundingClientRect().height), f && (x = f.getBoundingClientRect().height), this.height = w.contentBoxSize[0].blockSize - e - x - A - 24, this.width = w.contentBoxSize[0].inlineSize, this.viewBox = `0 0 ${this.width < 0 ? 10 : this.width} ${this.height < 0 ? 10 : this.height}`, this.convertSizes();
       }).observe(o);
     } else
       this.height = this.FINAL_CONFIG.chart.height, this.width = this.FINAL_CONFIG.chart.width, this.viewBox = `0 0 ${this.width} ${this.height}`, this.fontSizes.dataLabels = this.FINAL_CONFIG.chart.grid.labels.fontSize, this.fontSizes.yAxis = this.FINAL_CONFIG.chart.grid.labels.axis.fontSize, this.fontSizes.xAxis = this.FINAL_CONFIG.chart.grid.labels.xAxisLabels.fontSize, this.fontSizes.plotLabels = this.FINAL_CONFIG.chart.labels.fontSize, this.plotRadii.plot = this.FINAL_CONFIG.plot.radius, this.plotRadii.line = this.FINAL_CONFIG.line.radius;
@@ -683,30 +691,30 @@ const Be = U(), Ye = {
     abbreviate: le,
     assignStackRatios: re,
     applyDataLabel: ie,
-    calculateNiceScale: se,
+    calculateNiceScaleWithExactExtremes: se,
     checkNaN: oe,
     createSmoothPath: ne,
-    isSafeValue: he,
-    treeShake: ce,
-    shiftHue: ue,
+    isSafeValue: ce,
+    treeShake: he,
+    shiftHue: de,
     pdf: J,
     img: Q,
-    convertColorToHex: de,
+    convertColorToHex: ue,
     convertConfigColors: ge,
     convertCustomPalette: fe,
     downloadCsv: be,
-    createCsvContent: Ie,
-    adaptColorToBackground: me,
+    createCsvContent: me,
+    adaptColorToBackground: Ie,
     calcLinearProgression: Ne,
     useMouse: Oe,
     closestDecimal: _e,
     dataLabel: q,
-    isFunction: Fe,
-    functionReturnsString: xe,
+    isFunction: xe,
+    functionReturnsString: Fe,
     error: ye,
     objectIsEmpty: Ae,
     createTSpans: Le,
-    useNestedProp: Z,
+    useNestedProp: U,
     translateSize: Se,
     convertSizes() {
       this.fontSizes.dataLabels = this.translateSize({
@@ -764,26 +772,25 @@ const Be = U(), Ye = {
     },
     createArea(l) {
       if (!l[0]) return [-10, -10, "", -10, -10];
-      const o = { x: l[0].x, y: this.zero }, c = { x: l.at(-1).x, y: this.zero }, b = [];
+      const o = { x: l[0].x, y: this.zero }, h = { x: l.at(-1).x, y: this.zero }, m = [];
       return l.forEach((t) => {
-        b.push(`${t.x},${t.y} `);
-      }), [o.x, o.y, ...b, c.x, c.y].toString();
+        m.push(`${t.x},${t.y} `);
+      }), [o.x, o.y, ...m, h.x, h.y].toString();
     },
     createIndividualArea(l, o) {
       if (!l[0]) return [-10, -10, "", -10, -10];
-      const c = { x: l[0] ? l[0].x : Math.min(...l.filter((e) => !!e).map((e) => e.x)), y: o }, b = { x: l.at(-1) ? l.at(-1).x : Math.min(...l.filter((e) => !!e).map((e) => e.x)), y: o }, t = [];
+      const h = { x: l[0] ? l[0].x : Math.min(...l.filter((e) => !!e).map((e) => e.x)), y: o }, m = { x: l.at(-1) ? l.at(-1).x : Math.min(...l.filter((e) => !!e).map((e) => e.x)), y: o }, t = [];
       return l.filter((e) => !!e).forEach((e) => {
         t.push(`${e.x},${e.y} `);
-      }), [c.x, c.y, ...t, b.x, b.y].toString();
+      }), [h.x, h.y, ...t, m.x, m.y].toString();
     },
     createStar: X,
     createPolygonPath: M,
-    /////////////////////////////// CANVAS /////////////////////////////////
     fillArray(l, o) {
-      let c = Array(l).fill(0);
-      for (let b = 0; b < o.length && b < l; b += 1)
-        c[b] = o[b];
-      return c;
+      let h = Array(l).fill(0);
+      for (let m = 0; m < o.length && m < l; m += 1)
+        h[m] = o[m];
+      return h;
     },
     refreshSlicer() {
       this.slicer = {
@@ -813,12 +820,12 @@ const Be = U(), Ye = {
       return ![null, void 0, NaN].includes(l);
     },
     findClosestValue(l, o) {
-      let c = o[0], b = Math.abs(l - o[0]);
+      let h = o[0], m = Math.abs(l - o[0]);
       for (let t = 1; t < o.length; t += 1) {
         const e = Math.abs(l - o[t]);
-        e < b && o[t] < l && (c = o[t], b = e);
+        e < m && o[t] < l && (h = o[t], m = e);
       }
-      return c;
+      return h;
     },
     ratioToMax(l) {
       return l / this.absoluteMax;
@@ -880,7 +887,7 @@ const Be = U(), Ye = {
       }, 100);
     },
     generateCsv() {
-      const l = [[this.FINAL_CONFIG.chart.title.text], [this.FINAL_CONFIG.chart.title.subtitle.text], [""]], o = ["", ...this.table.head.map((e) => e.label)], c = this.table.body, b = l.concat([o]).concat(c), t = this.createCsvContent(b);
+      const l = [[this.FINAL_CONFIG.chart.title.text], [this.FINAL_CONFIG.chart.title.subtitle.text], [""]], o = ["", ...this.table.head.map((e) => e.label)], h = this.table.body, m = l.concat([o]).concat(h), t = this.createCsvContent(m);
       this.downloadCsv({ csvContent: t, title: this.FINAL_CONFIG.chart.title.text || "vue-ui-xy" });
     },
     showSpinnerImage() {
@@ -898,7 +905,7 @@ const Be = U(), Ye = {
       }, 100);
     }
   }
-}, We = ["id"], Ee = ["viewBox"], Xe = { key: 0 }, qe = { class: "vue-ui-xy-grid" }, Ze = ["stroke", "x1", "x2", "y1", "y2"], Ue = ["stroke", "x1", "x2", "y1", "y2"], Je = { key: 1 }, Ke = ["x1", "x2", "y1", "y2", "stroke"], Qe = ["x1", "x2", "y1", "y2", "stroke"], je = ["x1", "x2", "y1", "y2", "stroke"], $e = { key: 3 }, et = ["x1", "x2", "y1", "y2", "stroke"], tt = ["id"], at = ["stop-color"], lt = ["stop-color"], rt = ["stop-color"], it = ["id"], st = ["stop-color"], ot = ["stop-color"], nt = ["stop-color"], ht = ["id"], ct = ["stop-color"], ut = ["stop-color"], dt = ["id"], gt = ["stop-color"], ft = ["stop-color"], bt = ["id"], It = ["stop-color"], mt = ["stop-color"], Nt = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], _t = ["width", "x", "y"], Ft = { key: 0 }, xt = ["id"], yt = ["fill"], At = ["x1", "x2", "y1", "y2", "stroke", "marker-end"], Lt = ["x", "y", "font-size", "fill"], St = ["stroke", "x1", "x2", "y1", "y2"], Ct = ["width", "x", "y"], kt = { style: { width: "100%" } }, wt = { key: 0 }, Ot = ["id"], vt = ["fill"], Gt = ["x1", "x2", "y1", "y2", "stroke", "marker-end"], zt = ["x", "y", "font-size", "fill"], pt = ["d", "stroke", "stroke-width", "stroke-dasharray"], Tt = { key: 1 }, Mt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Pt = { key: 0 }, Vt = ["d", "fill"], Rt = ["d", "fill"], Dt = ["d", "stroke", "stroke-width", "stroke-dasharray"], Ht = { key: 2 }, Bt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Yt = ["width", "x", "y"], Wt = { style: { width: "100%" } }, Et = { key: 3 }, Xt = ["id"], qt = ["fill"], Zt = ["x1", "x2", "y1", "y2", "stroke", "marker-end"], Ut = ["x", "y", "font-size", "fill"], Jt = { key: 2 }, Kt = ["x", "y", "font-size", "fill"], Qt = ["x", "y", "font-size", "fill", "font-weight"], jt = { key: 3 }, $t = ["x", "y", "font-size", "fill"], ea = ["x", "y"], ta = ["x", "y"], aa = { key: 4 }, la = ["x", "y", "font-size", "fill"], ra = ["x", "y"], ia = ["x", "y"], sa = { key: 5 }, oa = ["x", "y", "height", "width", "fill"], na = ["x", "y", "width"], ha = ["y", "width", "height", "fill"], ca = ["x", "y", "width", "height", "fill"], ua = ["x", "y", "font-size", "fill", "innerHTML"], da = ["x", "y", "font-size", "fill", "innerHTML"], ga = ["x", "y", "font-size", "fill", "innerHTML"], fa = ["x", "y", "font-size", "fill", "innerHTML"], ba = { key: 6 }, Ia = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ma = ["fill", "font-size", "transform"], Na = ["x1", "x2", "y1", "y2", "stroke"], _a = ["x", "y", "font-size", "fill"], Fa = ["x1", "x2", "y1", "y2", "stroke"], xa = ["x", "y", "font-size", "fill"], ya = ["x", "y", "width", "height", "fill", "onMouseenter"], Aa = ["font-size", "fill", "transform"], La = ["x", "y", "font-size", "fill"], Sa = { key: 8 }, Ca = ["text-anchor", "font-size", "fill", "transform"], ka = ["x", "y", "height", "width", "fill", "onMouseenter", "onClick"], wa = { key: 9 }, Oa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], va = { key: 10 }, Ga = ["x", "y"], za = ["cx", "cy", "r", "fill"], pa = {
+}, Be = ["id"], Ye = ["viewBox"], Xe = { key: 0 }, qe = { class: "vue-ui-xy-grid" }, Ue = ["stroke", "x1", "x2", "y1", "y2"], Ze = ["stroke", "x1", "x2", "y1", "y2"], Je = { key: 1 }, Ke = ["x1", "x2", "y1", "y2", "stroke"], Qe = ["x1", "x2", "y1", "y2", "stroke"], je = ["x1", "x2", "y1", "y2", "stroke"], $e = { key: 3 }, et = ["x1", "x2", "y1", "y2", "stroke"], tt = ["id"], at = ["stop-color"], lt = ["stop-color"], rt = ["stop-color"], it = ["id"], st = ["stop-color"], ot = ["stop-color"], nt = ["stop-color"], ct = ["id"], ht = ["stop-color"], dt = ["stop-color"], ut = ["id"], gt = ["stop-color"], ft = ["stop-color"], bt = ["id"], mt = ["stop-color"], It = ["stop-color"], Nt = ["x", "y", "height", "width", "fill"], _t = ["x", "y", "width"], xt = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], Ft = ["width", "x", "y"], yt = { key: 0 }, At = ["id"], Lt = ["fill"], St = ["x1", "x2", "y1", "y2", "stroke", "marker-end"], Ct = ["x", "y", "font-size", "fill"], kt = ["stroke", "x1", "x2", "y1", "y2"], wt = ["y", "width", "height", "fill"], Ot = ["x", "y", "width", "height", "fill"], vt = ["x", "y", "width", "height", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin", "stroke-dasharray"], Gt = { key: 3 }, zt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], pt = ["fill", "font-size", "transform"], Tt = ["x1", "x2", "y1", "y2", "stroke"], Mt = ["x", "y", "font-size", "fill"], Pt = ["x1", "x2", "y1", "y2", "stroke"], Vt = ["x", "y", "font-size", "fill"], Rt = ["width", "x", "y"], Dt = { style: { width: "100%" } }, Et = { key: 0 }, Ht = ["id"], Wt = ["fill"], Bt = ["x1", "x2", "y1", "y2", "stroke", "marker-end"], Yt = ["x", "y", "font-size", "fill"], Xt = ["d", "stroke", "stroke-width", "stroke-dasharray"], qt = { key: 1 }, Ut = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Zt = { key: 0 }, Jt = ["d", "fill"], Kt = ["d", "fill"], Qt = ["d", "stroke", "stroke-width", "stroke-dasharray"], jt = { key: 2 }, $t = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], ea = ["width", "x", "y"], ta = { style: { width: "100%" } }, aa = { key: 3 }, la = ["id"], ra = ["fill"], ia = ["x1", "x2", "y1", "y2", "stroke", "marker-end"], sa = ["x", "y", "font-size", "fill"], oa = { key: 4 }, na = ["x", "y", "font-size", "fill"], ca = ["x", "y", "font-size", "fill", "font-weight"], ha = { key: 5 }, da = ["x", "y", "font-size", "fill"], ua = ["x", "y"], ga = ["x", "y"], fa = { key: 6 }, ba = ["x", "y", "font-size", "fill"], ma = ["x", "y"], Ia = ["x", "y"], Na = ["x", "y", "font-size", "fill", "innerHTML"], _a = ["x", "y", "font-size", "fill", "innerHTML"], xa = ["x", "y", "font-size", "fill", "innerHTML"], Fa = ["x", "y", "font-size", "fill", "innerHTML"], ya = ["x", "y", "width", "height", "fill", "onMouseenter"], Aa = ["font-size", "fill", "transform"], La = ["x", "y", "font-size", "fill"], Sa = { key: 8 }, Ca = ["text-anchor", "font-size", "fill", "transform"], ka = ["x", "y", "height", "width", "fill", "onMouseenter", "onClick"], wa = { key: 9 }, Oa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], va = { key: 10 }, Ga = ["x", "y"], za = ["cx", "cy", "r", "fill"], pa = {
   key: 3,
   class: "vue-data-ui-watermark"
 }, Ta = ["onClick"], Ma = {
@@ -914,12 +921,12 @@ const Be = U(), Ye = {
 }, Ra = ["fill"], Da = {
   key: 7,
   ref: "chartLegend"
-}, Ha = {
+}, Ea = {
   style: { display: "flex", "flex-direction": "row", gap: "6px", "align-items": "center", "padding-left": "6px" },
   "data-html2canvas-ignore": ""
-}, Ba = ["innerHTML"];
-function Ya(l, o, c, b, t, e) {
-  const N = P("Title"), A = P("UserOptions"), f = P("Shape"), F = P("Skeleton"), p = P("Slicer"), k = P("Tooltip"), w = P("BaseIcon"), G = P("TableSparkline"), _ = P("DataTable"), S = P("Accordion");
+}, Ha = ["innerHTML"];
+function Wa(l, o, h, m, t, e) {
+  const N = P("Title"), A = P("UserOptions"), f = P("Shape"), x = P("Skeleton"), p = P("Slicer"), k = P("Tooltip"), w = P("BaseIcon"), G = P("TableSparkline"), _ = P("DataTable"), S = P("Accordion");
   return r(), i("div", {
     id: `vue-ui-xy_${t.uniqueId}`,
     class: T(`vue-ui-xy ${t.isFullscreen ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.FINAL_CONFIG.useCssAnimation ? "" : "vue-ui-dna"}`),
@@ -932,7 +939,7 @@ function Ya(l, o, c, b, t, e) {
       class: "vue-ui-xy-title",
       style: L(`font-family:${e.FINAL_CONFIG.chart.fontFamily}`)
     }, [
-      E(N, {
+      Y(N, {
         config: {
           title: {
             cy: "xy-div-title",
@@ -944,7 +951,7 @@ function Ya(l, o, c, b, t, e) {
           }
         }
       }, null, 8, ["config"])
-    ], 4)) : h("", !0),
+    ], 4)) : c("", !0),
     e.FINAL_CONFIG.chart.userOptions.show && e.isDataset ? (r(), V(A, {
       ref: "defails",
       key: `user_options_${t.step}`,
@@ -959,7 +966,7 @@ function Ya(l, o, c, b, t, e) {
       hasImg: e.FINAL_CONFIG.chart.userOptions.buttons.img,
       hasLabel: e.FINAL_CONFIG.chart.userOptions.buttons.labels,
       hasTable: e.FINAL_CONFIG.chart.userOptions.buttons.table,
-      hasStack: c.dataset.length > 1 && e.FINAL_CONFIG.chart.userOptions.buttons.stack,
+      hasStack: h.dataset.length > 1 && e.FINAL_CONFIG.chart.userOptions.buttons.stack,
       hasFullscreen: e.FINAL_CONFIG.chart.userOptions.buttons.fullscreen,
       isStacked: t.mutableConfig.isStacked,
       isFullscreen: t.isFullscreen,
@@ -1027,11 +1034,11 @@ function Ya(l, o, c, b, t, e) {
       l.$slots.optionFullscreen ? {
         name: "optionFullscreen",
         fn: z(({ toggleFullscreen: a, isFullscreen: n }) => [
-          v(l.$slots, "optionFullscreen", Y(W({ toggleFullscreen: a, isFullscreen: n })), void 0, !0)
+          v(l.$slots, "optionFullscreen", W(B({ toggleFullscreen: a, isFullscreen: n })), void 0, !0)
         ]),
         key: "7"
       } : void 0
-    ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasLabel", "hasTable", "hasStack", "hasFullscreen", "isStacked", "isFullscreen", "chartElement", "isTooltip", "titles", "onToggleFullscreen", "onGeneratePdf", "onGenerateCsv", "onGenerateImage", "onToggleTable", "onToggleLabels", "onToggleStack", "onToggleTooltip"])) : h("", !0),
+    ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasLabel", "hasTable", "hasStack", "hasFullscreen", "isStacked", "isFullscreen", "chartElement", "isTooltip", "titles", "onToggleFullscreen", "onGeneratePdf", "onGenerateCsv", "onGenerateImage", "onToggleTable", "onToggleLabels", "onToggleStack", "onToggleTooltip"])) : c("", !0),
     e.isDataset ? (r(), i("svg", {
       key: 2,
       xmlns: "http://www.w3.org/2000/svg",
@@ -1041,114 +1048,114 @@ function Ya(l, o, c, b, t, e) {
       style: L(`background:${e.FINAL_CONFIG.chart.backgroundColor}; color:${e.FINAL_CONFIG.chart.color}; font-family:${e.FINAL_CONFIG.chart.fontFamily}`)
     }, [
       e.maxSeries > 0 ? (r(), i("g", Xe, [
-        d("g", qe, [
+        u("g", qe, [
           e.FINAL_CONFIG.chart.grid.labels.xAxis.showBaseline ? (r(), i("line", {
             key: 0,
             stroke: e.FINAL_CONFIG.chart.grid.stroke,
             "stroke-width": "1",
-            x1: e.drawingArea.left,
-            x2: e.drawingArea.right,
+            x1: e.drawingArea.left + e.xPadding,
+            x2: e.drawingArea.right - e.xPadding,
             y1: e.drawingArea.bottom,
             y2: e.drawingArea.bottom,
             "stroke-linecap": "round"
-          }, null, 8, Ze)) : h("", !0),
-          t.mutableConfig.useIndividualScale ? e.FINAL_CONFIG.chart.grid.showHorizontalLines ? (r(!0), i(I, { key: 2 }, m(e.allScales, (a) => (r(), i("g", null, [
-            a.id === t.selectedScale && a.yLabels.length ? (r(!0), i(I, { key: 0 }, m(a.yLabels, (n) => (r(), i("line", {
-              x1: e.drawingArea.left,
-              x2: e.drawingArea.right,
+          }, null, 8, Ue)) : c("", !0),
+          t.mutableConfig.useIndividualScale ? e.FINAL_CONFIG.chart.grid.showHorizontalLines ? (r(!0), i(b, { key: 2 }, I(e.allScales, (a) => (r(), i("g", null, [
+            a.id === t.selectedScale && a.yLabels.length ? (r(!0), i(b, { key: 0 }, I(a.yLabels, (n) => (r(), i("line", {
+              x1: e.drawingArea.left + e.xPadding,
+              x2: e.drawingArea.right - e.xPadding,
               y1: n.y,
               y2: n.y,
               stroke: a.color,
               "stroke-width": 0.5,
               "stroke-linecap": "round"
-            }, null, 8, Qe))), 256)) : a.yLabels.length ? (r(!0), i(I, { key: 1 }, m(a.yLabels, (n) => (r(), i("line", {
-              x1: e.drawingArea.left,
-              x2: e.drawingArea.right,
+            }, null, 8, Qe))), 256)) : a.yLabels.length ? (r(!0), i(b, { key: 1 }, I(a.yLabels, (n) => (r(), i("line", {
+              x1: e.drawingArea.left + e.xPadding,
+              x2: e.drawingArea.right - e.xPadding,
               y1: n.y,
               y2: n.y,
               stroke: e.FINAL_CONFIG.chart.grid.stroke,
               "stroke-width": 0.5,
               "stroke-linecap": "round"
-            }, null, 8, je))), 256)) : h("", !0)
-          ]))), 256)) : h("", !0) : (r(), i(I, { key: 1 }, [
+            }, null, 8, je))), 256)) : c("", !0)
+          ]))), 256)) : c("", !0) : (r(), i(b, { key: 1 }, [
             e.FINAL_CONFIG.chart.grid.labels.yAxis.showBaseline ? (r(), i("line", {
               key: 0,
               stroke: e.FINAL_CONFIG.chart.grid.stroke,
               "stroke-width": "1",
-              x1: e.drawingArea.left,
-              x2: e.drawingArea.left,
+              x1: e.drawingArea.left + e.xPadding,
+              x2: e.drawingArea.left + e.xPadding,
               y1: e.drawingArea.top,
               y2: e.drawingArea.bottom,
               "stroke-linecap": "round"
-            }, null, 8, Ue)) : h("", !0),
+            }, null, 8, Ze)) : c("", !0),
             e.FINAL_CONFIG.chart.grid.showHorizontalLines ? (r(), i("g", Je, [
-              (r(!0), i(I, null, m(e.yLabels, (a) => (r(), i("line", {
-                x1: e.drawingArea.left,
-                x2: e.drawingArea.right,
+              (r(!0), i(b, null, I(e.yLabels, (a) => (r(), i("line", {
+                x1: e.drawingArea.left + e.xPadding,
+                x2: e.drawingArea.right - e.xPadding,
                 y1: a.y,
                 y2: a.y,
                 stroke: e.FINAL_CONFIG.chart.grid.stroke,
                 "stroke-width": 0.5,
                 "stroke-linecap": "round"
               }, null, 8, Ke))), 256))
-            ])) : h("", !0)
+            ])) : c("", !0)
           ], 64)),
           e.FINAL_CONFIG.chart.grid.showVerticalLines ? (r(), i("g", $e, [
-            (r(!0), i(I, null, m(e.maxSeries + 1, (a, n) => (r(), i("line", {
+            (r(!0), i(b, null, I(e.maxSeries + (e.FINAL_CONFIG.chart.grid.position === "middle" ? 1 : 0), (a, n) => (r(), i("line", {
               key: `grid_vertical_line_${n}`,
-              x1: e.drawingArea.width / e.maxSeries * n + e.drawingArea.left,
-              x2: e.drawingArea.width / e.maxSeries * n + e.drawingArea.left,
+              x1: e.drawingArea.width / e.maxSeries * n + e.drawingArea.left + e.xPadding,
+              x2: e.drawingArea.width / e.maxSeries * n + e.drawingArea.left + e.xPadding,
               y1: e.drawingArea.top,
               y2: e.drawingArea.bottom,
               "stroke-width": "0.5",
               stroke: e.FINAL_CONFIG.chart.grid.stroke
             }, null, 8, et))), 128))
-          ])) : h("", !0)
+          ])) : c("", !0)
         ]),
-        (r(!0), i(I, null, m(e.barSet, (a, n) => (r(), i("defs", {
+        (r(!0), i(b, null, I(e.barSet, (a, n) => (r(), i("defs", {
           key: `def_rect_${n}`
         }, [
-          d("linearGradient", {
+          u("linearGradient", {
             id: `rectGradient_pos_${n}_${t.uniqueId}`,
             x2: "0%",
             y2: "100%"
           }, [
-            d("stop", {
+            u("stop", {
               offset: "0%",
               "stop-color": a.color
             }, null, 8, at),
-            d("stop", {
+            u("stop", {
               offset: "62%",
               "stop-color": `${e.shiftHue(a.color, 0.02)}DE`
             }, null, 8, lt),
-            d("stop", {
+            u("stop", {
               offset: "100%",
               "stop-color": `${e.shiftHue(a.color, 0.05)}66`
             }, null, 8, rt)
           ], 8, tt),
-          d("linearGradient", {
+          u("linearGradient", {
             id: `rectGradient_neg_${n}_${t.uniqueId}`,
             x2: "0%",
             y2: "100%"
           }, [
-            d("stop", {
+            u("stop", {
               offset: "0%",
               "stop-color": `${e.shiftHue(a.color, 0.05)}66`
             }, null, 8, st),
-            d("stop", {
+            u("stop", {
               offset: "38%",
               "stop-color": `${e.shiftHue(a.color, 0.02)}DE`
             }, null, 8, ot),
-            d("stop", {
+            u("stop", {
               offset: "100%",
               "stop-color": a.color
             }, null, 8, nt)
           ], 8, it)
         ]))), 128)),
-        (r(!0), i(I, null, m(e.plotSet, (a, n) => (r(), i("defs", {
+        (r(!0), i(b, null, I(e.plotSet, (a, n) => (r(), i("defs", {
           key: `def_plot_${n}`
         }, [
-          d("radialGradient", {
+          u("radialGradient", {
             id: `plotGradient_${n}_${t.uniqueId}`,
             cx: "50%",
             cy: "50%",
@@ -1156,20 +1163,20 @@ function Ya(l, o, c, b, t, e) {
             fx: "50%",
             fy: "50%"
           }, [
-            d("stop", {
+            u("stop", {
               offset: "0%",
               "stop-color": `${e.shiftHue(a.color, 0.05)}`
-            }, null, 8, ct),
-            d("stop", {
+            }, null, 8, ht),
+            u("stop", {
               offset: "100%",
               "stop-color": a.color
-            }, null, 8, ut)
-          ], 8, ht)
+            }, null, 8, dt)
+          ], 8, ct)
         ]))), 128)),
-        (r(!0), i(I, null, m(e.lineSet, (a, n) => (r(), i("defs", {
+        (r(!0), i(b, null, I(e.lineSet, (a, n) => (r(), i("defs", {
           key: `def_line_${n}`
         }, [
-          d("radialGradient", {
+          u("radialGradient", {
             id: `lineGradient_${n}_${t.uniqueId}`,
             cx: "50%",
             cy: "50%",
@@ -1177,38 +1184,61 @@ function Ya(l, o, c, b, t, e) {
             fx: "50%",
             fy: "50%"
           }, [
-            d("stop", {
+            u("stop", {
               offset: "0%",
               "stop-color": `${e.shiftHue(a.color, 0.05)}`
             }, null, 8, gt),
-            d("stop", {
+            u("stop", {
               offset: "100%",
               "stop-color": a.color
             }, null, 8, ft)
-          ], 8, dt),
-          d("linearGradient", {
+          ], 8, ut),
+          u("linearGradient", {
             id: `areaGradient_${n}_${t.uniqueId}`,
             x1: "0%",
             x2: "100%",
             y1: "0%",
             y2: "0%"
           }, [
-            d("stop", {
+            u("stop", {
               offset: "0%",
               "stop-color": `${e.shiftHue(a.color, 0.03)}${t.opacity[e.FINAL_CONFIG.line.area.opacity]}`
-            }, null, 8, It),
-            d("stop", {
+            }, null, 8, mt),
+            u("stop", {
               offset: "100%",
               "stop-color": `${a.color}${t.opacity[e.FINAL_CONFIG.line.area.opacity]}`
-            }, null, 8, mt)
+            }, null, 8, It)
           ], 8, bt)
         ]))), 128)),
-        e.barSet.length ? (r(!0), i(I, { key: 0 }, m(e.barSet, (a, n) => (r(), i("g", {
+        (r(!0), i(b, null, I(e.highlightAreas, (a) => (r(), i("g", null, [
+          a.show ? (r(), i(b, { key: 0 }, [
+            u("rect", {
+              x: e.drawingArea.left + e.drawingArea.width / e.maxSeries * (a.from - t.slicer.start),
+              y: e.drawingArea.top,
+              height: e.drawingArea.height < 0 ? 10 : e.drawingArea.height,
+              width: e.drawingArea.width / e.maxSeries * a.span < 0 ? 1e-5 : e.drawingArea.width / e.maxSeries * a.span,
+              fill: `${a.color}${t.opacity[a.opacity]}`
+            }, null, 8, Nt),
+            a.caption.text ? (r(), i("foreignObject", {
+              key: 0,
+              x: e.drawingArea.left + e.drawingArea.width / e.maxSeries * (a.from - t.slicer.start) - (a.caption.width === "auto" ? 0 : a.caption.width / 2 - e.drawingArea.width / e.maxSeries * a.span / 2),
+              y: e.drawingArea.top + a.caption.offsetY,
+              style: { overflow: "visible" },
+              height: "1",
+              width: a.caption.width === "auto" ? e.drawingArea.width / e.maxSeries * a.span : a.caption.width
+            }, [
+              u("div", {
+                style: L(`padding:${a.caption.padding}px;text-align:${a.caption.textAlign};font-size:${a.caption.fontSize}px;color:${a.caption.color};font-weight:${a.caption.bold ? "bold" : "normal"}`)
+              }, C(a.caption.text), 5)
+            ], 8, _t)) : c("", !0)
+          ], 64)) : c("", !0)
+        ]))), 256)),
+        e.barSet.length ? (r(!0), i(b, { key: 0 }, I(e.barSet, (a, n) => (r(), i("g", {
           key: `serie_bar_${n}`,
           class: T(`serie_bar_${n}`),
           style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.2 : 1};transition:opacity 0.2s ease-in-out`)
         }, [
-          (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+          (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
             key: `bar_plot_${n}_${g}`
           }, [
             e.canShowValue(s.value) ? (r(), i("rect", {
@@ -1221,7 +1251,7 @@ function Ya(l, o, c, b, t, e) {
               fill: e.FINAL_CONFIG.bar.useGradient ? s.value >= 0 ? `url(#rectGradient_pos_${n}_${t.uniqueId})` : `url(#rectGradient_neg_${n}_${t.uniqueId})` : a.color,
               stroke: e.FINAL_CONFIG.bar.border.useSerieColor ? a.color : e.FINAL_CONFIG.bar.border.stroke,
               "stroke-width": e.FINAL_CONFIG.bar.border.strokeWidth
-            }, null, 8, Nt)) : h("", !0),
+            }, null, 8, xt)) : c("", !0),
             s.comment && e.FINAL_CONFIG.chart.comments.show ? (r(), i("foreignObject", {
               key: 1,
               style: { overflow: "visible" },
@@ -1233,11 +1263,11 @@ function Ya(l, o, c, b, t, e) {
               v(l.$slots, "plot-comment", {
                 plot: { ...s, color: a.color }
               }, void 0, !0)
-            ], 8, _t)) : h("", !0)
+            ], 8, Ft)) : c("", !0)
           ]))), 128)),
-          Object.hasOwn(a, "useProgression") && a.useProgression === !0 && !isNaN(e.calcLinearProgression(a.plots).trend) ? (r(), i("g", Ft, [
-            d("defs", null, [
-              d("marker", {
+          Object.hasOwn(a, "useProgression") && a.useProgression === !0 && !isNaN(e.calcLinearProgression(a.plots).trend) ? (r(), i("g", yt, [
+            u("defs", null, [
+              u("marker", {
                 id: `bar_arrow_${n}`,
                 markerWidth: 7,
                 markerHeight: 7,
@@ -1245,11 +1275,11 @@ function Ya(l, o, c, b, t, e) {
                 refY: 7 / 2,
                 orient: "auto"
               }, [
-                d("polygon", {
+                u("polygon", {
                   points: `0 0, 7 ${7 / 2}, 0 7`,
                   fill: a.color
-                }, null, 8, yt)
-              ], 8, xt)
+                }, null, 8, Lt)
+              ], 8, At)
             ]),
             a.plots.length > 1 ? (r(), i("line", {
               key: 0,
@@ -1261,7 +1291,7 @@ function Ya(l, o, c, b, t, e) {
               stroke: a.color,
               "stroke-dasharray": 2,
               "marker-end": `url(#bar_arrow_${n})`
-            }, null, 8, At)) : h("", !0),
+            }, null, 8, St)) : c("", !0),
             a.plots.length > 1 ? (r(), i("text", {
               key: 1,
               "text-anchor": "middle",
@@ -1273,25 +1303,136 @@ function Ya(l, o, c, b, t, e) {
               v: e.calcLinearProgression(a.plots).trend * 100,
               s: "%",
               r: 2
-            })), 9, Lt)) : h("", !0)
-          ])) : h("", !0)
-        ], 6))), 128)) : h("", !0),
+            })), 9, Ct)) : c("", !0)
+          ])) : c("", !0)
+        ], 6))), 128)) : c("", !0),
         !t.mutableConfig.useIndividualScale && e.FINAL_CONFIG.chart.grid.labels.zeroLine.show ? (r(), i("line", {
           key: 1,
           stroke: e.FINAL_CONFIG.chart.grid.stroke,
           "stroke-width": "1",
-          x1: e.drawingArea.left,
-          x2: e.drawingArea.right,
+          x1: e.drawingArea.left + e.xPadding,
+          x2: e.drawingArea.right - e.xPadding,
           y1: e.zero,
           y2: e.zero,
           "stroke-linecap": "round"
-        }, null, 8, St)) : h("", !0),
-        (r(!0), i(I, null, m(e.plotSet, (a, n) => (r(), i("g", {
+        }, null, 8, kt)) : c("", !0),
+        u("g", null, [
+          u("rect", {
+            x: 0,
+            y: e.drawingArea.top,
+            width: e.FINAL_CONFIG.chart.padding.left - 1 + e.xPadding,
+            height: e.drawingArea.height < 0 ? 10 : e.drawingArea.height,
+            fill: e.FINAL_CONFIG.chart.backgroundColor
+          }, null, 8, wt),
+          u("rect", {
+            x: e.drawingArea.right + 1 - e.xPadding,
+            y: e.drawingArea.top,
+            width: e.FINAL_CONFIG.chart.padding.right - 1 + e.xPadding,
+            height: e.drawingArea.height < 0 ? 10 : e.drawingArea.height,
+            fill: e.FINAL_CONFIG.chart.backgroundColor
+          }, null, 8, Ot)
+        ]),
+        e.FINAL_CONFIG.chart.grid.frame.show ? (r(), i("rect", {
+          key: 2,
+          style: { pointerEvents: "none" },
+          x: e.drawingArea.left + e.xPadding,
+          y: e.drawingArea.top,
+          width: e.drawingArea.width - (e.FINAL_CONFIG.chart.grid.position === "middle" ? 0 : e.drawingArea.width / e.maxSeries),
+          height: e.drawingArea.height,
+          fill: "transparent",
+          stroke: e.FINAL_CONFIG.chart.grid.frame.stroke,
+          "stroke-width": e.FINAL_CONFIG.chart.grid.frame.strokeWidth,
+          "stroke-linecap": e.FINAL_CONFIG.chart.grid.frame.strokeLinecap,
+          "stroke-linejoin": e.FINAL_CONFIG.chart.grid.frame.strokeLinejoin,
+          "stroke-dasharray": e.FINAL_CONFIG.chart.grid.frame.strokeDasharray
+        }, null, 8, vt)) : c("", !0),
+        e.FINAL_CONFIG.chart.grid.labels.show ? (r(), i("g", Gt, [
+          t.mutableConfig.useIndividualScale ? (r(), i(b, { key: 0 }, [
+            (r(!0), i(b, null, I(e.allScales, (a) => (r(), i("g", null, [
+              u("line", {
+                x1: a.x + e.xPadding,
+                x2: a.x + e.xPadding,
+                y1: t.mutableConfig.isStacked ? e.drawingArea.bottom - a.yOffset - a.individualHeight : e.drawingArea.top,
+                y2: t.mutableConfig.isStacked ? e.drawingArea.bottom - a.yOffset : e.drawingArea.bottom,
+                stroke: a.color,
+                "stroke-width": e.FINAL_CONFIG.chart.grid.stroke,
+                "stroke-linecap": "round",
+                style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.3 : 1};transition:opacity 0.2s ease-in-out`)
+              }, null, 12, zt)
+            ]))), 256)),
+            (r(!0), i(b, null, I(e.allScales, (a) => (r(), i("g", {
+              style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.3 : 1};transition:opacity 0.2s ease-in-out`)
+            }, [
+              u("text", {
+                fill: a.color,
+                "font-size": t.fontSizes.dataLabels,
+                "text-anchor": "middle",
+                transform: `translate(${a.x - e.FINAL_CONFIG.chart.grid.labels.yAxis.labelWidth + 5}, ${t.mutableConfig.isStacked ? e.drawingArea.bottom - a.yOffset - a.individualHeight / 2 : e.drawingArea.top + e.drawingArea.height / 2}) rotate(-90)`
+              }, C(a.name) + " " + C(a.scaleLabel ? `- ${a.scaleLabel}` : ""), 9, pt),
+              (r(!0), i(b, null, I(a.yLabels, (n, s) => (r(), i("line", {
+                x1: a.x - 3 + e.xPadding,
+                x2: a.x + e.xPadding,
+                y1: n.y,
+                y2: n.y,
+                stroke: a.color,
+                "stroke-width": 1,
+                "stroke-linecap": "round"
+              }, null, 8, Tt))), 256)),
+              (r(!0), i(b, null, I(a.yLabels, (n, s) => (r(), i("text", {
+                x: a.x - 5 + e.xPadding,
+                y: n.y + e.xPadding,
+                "font-size": t.fontSizes.dataLabels,
+                "text-anchor": "end",
+                fill: a.color
+              }, C(e.applyDataLabel(
+                e.FINAL_CONFIG.chart.grid.labels.yAxis.formatter,
+                n.value,
+                e.dataLabel({
+                  p: e.FINAL_CONFIG.chart.labels.prefix,
+                  v: n.value,
+                  s: e.FINAL_CONFIG.chart.labels.suffix,
+                  r: 1
+                })
+              )), 9, Mt))), 256))
+            ], 4))), 256))
+          ], 64)) : (r(!0), i(b, { key: 1 }, I(e.yLabels, (a, n) => (r(), i("g", {
+            key: `yLabel_${n}`
+          }, [
+            e.canShowValue(a) && a.value >= e.niceScale.min && a.value <= e.niceScale.max ? (r(), i("line", {
+              key: 0,
+              x1: e.drawingArea.left + e.xPadding,
+              x2: e.drawingArea.left - 5 + e.xPadding,
+              y1: a.y,
+              y2: a.y,
+              stroke: e.FINAL_CONFIG.chart.grid.stroke,
+              "stroke-width": "1",
+              "stroke-linecap": "round"
+            }, null, 8, Pt)) : c("", !0),
+            a.value >= e.niceScale.min && a.value <= e.niceScale.max ? (r(), i("text", {
+              key: 1,
+              x: e.drawingArea.left - 7 + e.xPadding,
+              y: a.y + t.fontSizes.dataLabels / 3,
+              "font-size": t.fontSizes.dataLabels,
+              "text-anchor": "end",
+              fill: e.FINAL_CONFIG.chart.grid.labels.color
+            }, C(e.canShowValue(a.value) ? e.applyDataLabel(
+              e.FINAL_CONFIG.chart.grid.labels.yAxis.formatter,
+              a.value,
+              e.dataLabel({
+                p: e.FINAL_CONFIG.chart.labels.prefix,
+                v: a.value,
+                s: e.FINAL_CONFIG.chart.labels.suffix,
+                r: 1
+              })
+            ) : ""), 9, Vt)) : c("", !0)
+          ]))), 128))
+        ])) : c("", !0),
+        (r(!0), i(b, null, I(e.plotSet, (a, n) => (r(), i("g", {
           key: `serie_plot_${n}`,
           class: T(`serie_plot_${n}`),
           style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.2 : 1};transition:opacity 0.2s ease-in-out`)
         }, [
-          (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+          (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
             key: `circle_plot_${n}_${g}`
           }, [
             e.canShowValue(s.value) ? (r(), V(f, {
@@ -1302,7 +1443,7 @@ function Ya(l, o, c, b, t, e) {
               radius: t.selectedSerieIndex !== null && t.selectedSerieIndex === g ? (t.plotRadii.plot || 6) * 1.5 : t.plotRadii.plot || 6,
               stroke: e.FINAL_CONFIG.chart.backgroundColor,
               strokeWidth: 0.5
-            }, null, 8, ["shape", "color", "plot", "radius", "stroke"])) : h("", !0),
+            }, null, 8, ["shape", "color", "plot", "radius", "stroke"])) : c("", !0),
             s.comment && e.FINAL_CONFIG.chart.comments.show ? (r(), i("foreignObject", {
               key: 1,
               style: { overflow: "visible" },
@@ -1311,16 +1452,16 @@ function Ya(l, o, c, b, t, e) {
               x: s.x - e.FINAL_CONFIG.chart.comments.width / 2 + e.FINAL_CONFIG.chart.comments.offsetX,
               y: s.y + e.FINAL_CONFIG.chart.comments.offsetY + 6
             }, [
-              d("div", kt, [
+              u("div", Dt, [
                 v(l.$slots, "plot-comment", {
                   plot: { ...s, color: a.color }
                 }, void 0, !0)
               ])
-            ], 8, Ct)) : h("", !0)
+            ], 8, Rt)) : c("", !0)
           ]))), 128)),
-          Object.hasOwn(a, "useProgression") && a.useProgression === !0 && !isNaN(e.calcLinearProgression(a.plots).trend) ? (r(), i("g", wt, [
-            d("defs", null, [
-              d("marker", {
+          Object.hasOwn(a, "useProgression") && a.useProgression === !0 && !isNaN(e.calcLinearProgression(a.plots).trend) ? (r(), i("g", Et, [
+            u("defs", null, [
+              u("marker", {
                 id: `plot_arrow_${n}`,
                 markerWidth: 7,
                 markerHeight: 7,
@@ -1328,11 +1469,11 @@ function Ya(l, o, c, b, t, e) {
                 refY: 7 / 2,
                 orient: "auto"
               }, [
-                d("polygon", {
+                u("polygon", {
                   points: `0 0, 7 ${7 / 2}, 0 7`,
                   fill: a.color
-                }, null, 8, vt)
-              ], 8, Ot)
+                }, null, 8, Wt)
+              ], 8, Ht)
             ]),
             a.plots.length > 1 ? (r(), i("line", {
               key: 0,
@@ -1344,7 +1485,7 @@ function Ya(l, o, c, b, t, e) {
               stroke: a.color,
               "stroke-dasharray": 2,
               "marker-end": `url(#plot_arrow_${n})`
-            }, null, 8, Gt)) : h("", !0),
+            }, null, 8, Bt)) : c("", !0),
             a.plots.length > 1 ? (r(), i("text", {
               key: 1,
               "text-anchor": "middle",
@@ -1356,10 +1497,10 @@ function Ya(l, o, c, b, t, e) {
               v: e.calcLinearProgression(a.plots).trend * 100,
               s: "%",
               r: 2
-            })), 9, zt)) : h("", !0)
-          ])) : h("", !0)
+            })), 9, Yt)) : c("", !0)
+          ])) : c("", !0)
         ], 6))), 128)),
-        (r(!0), i(I, null, m(e.lineSet, (a, n) => (r(), i("g", {
+        (r(!0), i(b, null, I(e.lineSet, (a, n) => (r(), i("g", {
           key: `serie_line_${n}`,
           class: T(`serie_line_${n}`),
           style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.2 : 1};transition:opacity 0.2s ease-in-out`)
@@ -1371,8 +1512,8 @@ function Ya(l, o, c, b, t, e) {
             "stroke-width": e.FINAL_CONFIG.line.strokeWidth + 1,
             "stroke-dasharray": a.dashed ? e.FINAL_CONFIG.line.strokeWidth * 2 : 0,
             fill: "none"
-          }, null, 8, pt)) : a.plots.length > 1 ? (r(), i("g", Tt, [
-            (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+          }, null, 8, Xt)) : a.plots.length > 1 ? (r(), i("g", qt, [
+            (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
               key: `line_${n}_${g}`
             }, [
               s && g < a.plots.length - 1 && a.plots[g + 1] && e.canShowValue(s.value) && e.canShowValue(a.plots[g + 1].value) ? (r(), i("line", {
@@ -1386,26 +1527,26 @@ function Ya(l, o, c, b, t, e) {
                 "stroke-dasharray": a.dashed ? e.FINAL_CONFIG.line.strokeWidth * 2 : 0,
                 "stroke-linejoin": "round",
                 "stroke-linecap": "round"
-              }, null, 8, Mt)) : h("", !0)
+              }, null, 8, Ut)) : c("", !0)
             ]))), 128))
-          ])) : h("", !0)
+          ])) : c("", !0)
         ], 6))), 128)),
-        (r(!0), i(I, null, m(e.lineSet, (a, n) => (r(), i("g", {
+        (r(!0), i(b, null, I(e.lineSet, (a, n) => (r(), i("g", {
           key: `serie_line_${n}`,
           class: T(`serie_line_${n}`),
           style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.2 : 1};transition:opacity 0.2s ease-in-out`)
         }, [
-          a.useArea && a.plots.length > 1 ? (r(), i("g", Pt, [
+          a.useArea && a.plots.length > 1 ? (r(), i("g", Zt, [
             a.smooth ? (r(), i("path", {
               key: 0,
               d: `M ${a.plots[0] ? a.plots[0].x : Math.min(...a.plots.filter((s) => !!s).map((s) => s.x))},${t.mutableConfig.isStacked ? e.drawingArea.bottom - a.yOffset : e.drawingArea.bottom} ${a.curve} L ${a.plots.at(-1) ? a.plots.at(-1).x : e.drawingArea.left + e.slot.line * n + e.slot.line / 2},${t.mutableConfig.isStacked ? e.drawingArea.bottom - a.yOffset : e.drawingArea.bottom} Z`,
               fill: e.FINAL_CONFIG.line.area.useGradient ? `url(#areaGradient_${n}_${t.uniqueId})` : `${a.color}${t.opacity[e.FINAL_CONFIG.line.area.opacity]}`
-            }, null, 8, Vt)) : (r(), i("path", {
+            }, null, 8, Jt)) : (r(), i("path", {
               key: 1,
               d: `M${a.area}Z`,
               fill: e.FINAL_CONFIG.line.area.useGradient ? `url(#areaGradient_${n}_${t.uniqueId})` : `${a.color}${t.opacity[e.FINAL_CONFIG.line.area.opacity]}`
-            }, null, 8, Rt))
-          ])) : h("", !0),
+            }, null, 8, Kt))
+          ])) : c("", !0),
           a.smooth && a.plots.length > 1 ? (r(), i("path", {
             key: 1,
             d: `M${a.curve}`,
@@ -1413,8 +1554,8 @@ function Ya(l, o, c, b, t, e) {
             "stroke-width": e.FINAL_CONFIG.line.strokeWidth,
             "stroke-dasharray": a.dashed ? e.FINAL_CONFIG.line.strokeWidth * 2 : 0,
             fill: "none"
-          }, null, 8, Dt)) : a.plots.length > 1 ? (r(), i("g", Ht, [
-            (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+          }, null, 8, Qt)) : a.plots.length > 1 ? (r(), i("g", jt, [
+            (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
               key: `line_${n}_${g}`
             }, [
               s && g < a.plots.length - 1 && a.plots[g + 1] && e.canShowValue(s.value) && e.canShowValue(a.plots[g + 1].value) ? (r(), i("line", {
@@ -1428,10 +1569,10 @@ function Ya(l, o, c, b, t, e) {
                 "stroke-dasharray": a.dashed ? e.FINAL_CONFIG.line.strokeWidth * 2 : 0,
                 "stroke-linejoin": "round",
                 "stroke-linecap": "round"
-              }, null, 8, Bt)) : h("", !0)
+              }, null, 8, $t)) : c("", !0)
             ]))), 128))
-          ])) : h("", !0),
-          (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+          ])) : c("", !0),
+          (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
             key: `circle_line_${n}_${g}`
           }, [
             s && e.canShowValue(s.value) ? (r(), V(f, {
@@ -1442,7 +1583,7 @@ function Ya(l, o, c, b, t, e) {
               radius: t.selectedSerieIndex !== null && t.selectedSerieIndex === g ? (t.plotRadii.line || 6) * 1.5 : t.plotRadii.line,
               stroke: e.FINAL_CONFIG.chart.backgroundColor,
               strokeWidth: 0.5
-            }, null, 8, ["shape", "color", "plot", "radius", "stroke"])) : h("", !0),
+            }, null, 8, ["shape", "color", "plot", "radius", "stroke"])) : c("", !0),
             s.comment && e.FINAL_CONFIG.chart.comments.show ? (r(), i("foreignObject", {
               key: 1,
               style: { overflow: "visible" },
@@ -1451,16 +1592,16 @@ function Ya(l, o, c, b, t, e) {
               x: s.x - e.FINAL_CONFIG.chart.comments.width / 2 + e.FINAL_CONFIG.chart.comments.offsetX,
               y: s.y + e.FINAL_CONFIG.chart.comments.offsetY + 6
             }, [
-              d("div", Wt, [
+              u("div", ta, [
                 v(l.$slots, "plot-comment", {
                   plot: { ...s, color: a.color }
                 }, void 0, !0)
               ])
-            ], 8, Yt)) : h("", !0)
+            ], 8, ea)) : c("", !0)
           ]))), 128)),
-          Object.hasOwn(a, "useProgression") && a.useProgression === !0 && !isNaN(e.calcLinearProgression(a.plots).trend) ? (r(), i("g", Et, [
-            d("defs", null, [
-              d("marker", {
+          Object.hasOwn(a, "useProgression") && a.useProgression === !0 && !isNaN(e.calcLinearProgression(a.plots).trend) ? (r(), i("g", aa, [
+            u("defs", null, [
+              u("marker", {
                 id: `line_arrow_${n}`,
                 markerWidth: 7,
                 markerHeight: 7,
@@ -1468,11 +1609,11 @@ function Ya(l, o, c, b, t, e) {
                 refY: 7 / 2,
                 orient: "auto"
               }, [
-                d("polygon", {
+                u("polygon", {
                   points: `0 0, 7 ${7 / 2}, 0 7`,
                   fill: a.color
-                }, null, 8, qt)
-              ], 8, Xt)
+                }, null, 8, ra)
+              ], 8, la)
             ]),
             a.plots.length > 1 ? (r(), i("line", {
               key: 0,
@@ -1484,7 +1625,7 @@ function Ya(l, o, c, b, t, e) {
               stroke: a.color,
               "stroke-dasharray": 2,
               "marker-end": `url(#line_arrow_${n})`
-            }, null, 8, Zt)) : h("", !0),
+            }, null, 8, ia)) : c("", !0),
             a.plots.length > 1 ? (r(), i("text", {
               key: 1,
               "text-anchor": "middle",
@@ -1496,16 +1637,16 @@ function Ya(l, o, c, b, t, e) {
               v: e.calcLinearProgression(a.plots).trend * 100,
               s: "%",
               r: 2
-            })), 9, Ut)) : h("", !0)
-          ])) : h("", !0)
+            })), 9, sa)) : c("", !0)
+          ])) : c("", !0)
         ], 6))), 128)),
-        (e.FINAL_CONFIG.bar.labels.show || e.FINAL_CONFIG.bar.serieName.show) && t.mutableConfig.dataLabels.show ? (r(), i("g", Jt, [
-          (r(!0), i(I, null, m(e.barSet, (a, n) => (r(), i("g", {
+        (e.FINAL_CONFIG.bar.labels.show || e.FINAL_CONFIG.bar.serieName.show) && t.mutableConfig.dataLabels.show ? (r(), i("g", oa, [
+          (r(!0), i(b, null, I(e.barSet, (a, n) => (r(), i("g", {
             key: `xLabel_bar_${n}`,
             class: T(`xLabel_bar_${n}`),
             style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.2 : 1};transition:opacity 0.2s ease-in-out`)
           }, [
-            (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+            (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
               key: `xLabel_bar_${n}_${g}`
             }, [
               s && (!Object.hasOwn(a, "dataLabels") || a.dataLabels === !0) && e.FINAL_CONFIG.bar.labels.show ? (r(), i("text", {
@@ -1528,7 +1669,7 @@ function Ya(l, o, c, b, t, e) {
                   datapoint: s,
                   serie: a
                 }
-              ) : ""), 9, Kt)) : h("", !0),
+              ) : ""), 9, na)) : c("", !0),
               s && e.FINAL_CONFIG.bar.serieName.show ? (r(), i("text", {
                 key: 1,
                 x: t.mutableConfig.useIndividualScale && t.mutableConfig.isStacked ? s.x + e.slot.line / 2 : s.x + e.calcRectWidth() * 1.1,
@@ -1537,17 +1678,17 @@ function Ya(l, o, c, b, t, e) {
                 "font-size": t.fontSizes.plotLabels,
                 fill: e.FINAL_CONFIG.bar.serieName.useSerieColor ? a.color : e.FINAL_CONFIG.bar.serieName.color,
                 "font-weight": e.FINAL_CONFIG.bar.serieName.bold ? "bold" : "normal"
-              }, C(e.FINAL_CONFIG.bar.serieName.useAbbreviation ? e.abbreviate({ source: a.name, length: e.FINAL_CONFIG.bar.serieName.abbreviationSize }) : a.name), 9, Qt)) : h("", !0)
+              }, C(e.FINAL_CONFIG.bar.serieName.useAbbreviation ? e.abbreviate({ source: a.name, length: e.FINAL_CONFIG.bar.serieName.abbreviationSize }) : a.name), 9, ca)) : c("", !0)
             ]))), 128))
           ], 6))), 128))
-        ])) : h("", !0),
-        e.FINAL_CONFIG.plot.labels.show && t.mutableConfig.dataLabels.show ? (r(), i("g", jt, [
-          (r(!0), i(I, null, m(e.plotSet, (a, n) => (r(), i("g", {
+        ])) : c("", !0),
+        e.FINAL_CONFIG.plot.labels.show && t.mutableConfig.dataLabels.show ? (r(), i("g", ha, [
+          (r(!0), i(b, null, I(e.plotSet, (a, n) => (r(), i("g", {
             key: `xLabel_plot_${n}`,
             class: T(`xLabel_plot_${n}`),
             style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.2 : 1};transition:opacity 0.2s ease-in-out`)
           }, [
-            (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+            (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
               key: `xLabel_plot_${n}_${g}`
             }, [
               s && !Object.hasOwn(a, "dataLabels") || a.dataLabels === !0 ? (r(), i("text", {
@@ -1570,7 +1711,7 @@ function Ya(l, o, c, b, t, e) {
                   datapoint: s,
                   serie: a
                 }
-              ) : ""), 9, $t)) : h("", !0),
+              ) : ""), 9, da)) : c("", !0),
               s && g === 0 && a.useTag && a.useTag === "start" ? (r(), i("foreignObject", {
                 key: 1,
                 x: s.x,
@@ -1579,10 +1720,10 @@ function Ya(l, o, c, b, t, e) {
                 width: "150",
                 style: { overflow: "visible" }
               }, [
-                d("div", {
+                u("div", {
                   style: L(`padding: 3px; background:${a.color}${t.opacity[80]};color:${e.adaptColorToBackground(a.color)};width:fit-content;font-size:${t.fontSizes.plotLabels}px;border-radius: 2px;`)
                 }, C(a.name), 5)
-              ], 8, ea)) : h("", !0),
+              ], 8, ua)) : c("", !0),
               s && g === a.plots.length - 1 && a.useTag && a.useTag === "end" ? (r(), i("foreignObject", {
                 key: 2,
                 x: s.x - a.name.length * (t.fontSizes.plotLabels / 2),
@@ -1591,20 +1732,20 @@ function Ya(l, o, c, b, t, e) {
                 width: "150",
                 style: { overflow: "visible" }
               }, [
-                d("div", {
+                u("div", {
                   style: L(`padding: 3px; background:${a.color}${t.opacity[80]};color:${e.adaptColorToBackground(a.color)};width:fit-content;font-size:${t.fontSizes.plotLabels}px;border-radius: 2px;`)
                 }, C(a.name), 5)
-              ], 8, ta)) : h("", !0)
+              ], 8, ga)) : c("", !0)
             ]))), 128))
           ], 6))), 128))
-        ])) : h("", !0),
-        e.FINAL_CONFIG.line.labels.show && t.mutableConfig.dataLabels.show ? (r(), i("g", aa, [
-          (r(!0), i(I, null, m(e.lineSet, (a, n) => (r(), i("g", {
+        ])) : c("", !0),
+        e.FINAL_CONFIG.line.labels.show && t.mutableConfig.dataLabels.show ? (r(), i("g", fa, [
+          (r(!0), i(b, null, I(e.lineSet, (a, n) => (r(), i("g", {
             key: `xLabel_line_${n}`,
             class: T(`xLabel_line_${n}`),
             style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.2 : 1};transition:opacity 0.2s ease-in-out`)
           }, [
-            (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+            (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
               key: `xLabel_line_${n}_${g}`
             }, [
               s && !Object.hasOwn(a, "dataLabels") || a.dataLabels === !0 ? (r(), i("text", {
@@ -1627,7 +1768,7 @@ function Ya(l, o, c, b, t, e) {
                   datapoint: s,
                   serie: a
                 }
-              ) : ""), 9, la)) : h("", !0),
+              ) : ""), 9, ba)) : c("", !0),
               s && g === 0 && a.useTag && a.useTag === "start" ? (r(), i("foreignObject", {
                 key: 1,
                 x: s.x,
@@ -1636,10 +1777,10 @@ function Ya(l, o, c, b, t, e) {
                 width: "150",
                 style: { overflow: "visible" }
               }, [
-                d("div", {
+                u("div", {
                   style: L(`padding: 3px; background:${a.color}${t.opacity[80]};color:${e.adaptColorToBackground(a.color)};width:fit-content;font-size:${t.fontSizes.plotLabels}px;border-radius: 2px;`)
                 }, C(a.name), 5)
-              ], 8, ra)) : h("", !0),
+              ], 8, ma)) : c("", !0),
               s && g === a.plots.length - 1 && a.useTag && a.useTag === "end" ? (r(), i("foreignObject", {
                 key: 2,
                 x: s.x - a.name.length * (t.fontSizes.plotLabels / 2),
@@ -1648,56 +1789,19 @@ function Ya(l, o, c, b, t, e) {
                 width: "150",
                 style: { overflow: "visible" }
               }, [
-                d("div", {
+                u("div", {
                   style: L(`padding: 3px; background:${a.color}${t.opacity[80]};color:${e.adaptColorToBackground(a.color)};width:fit-content;font-size:${t.fontSizes.plotLabels}px;border-radius: 2px;`)
                 }, C(a.name), 5)
-              ], 8, ia)) : h("", !0)
+              ], 8, Ia)) : c("", !0)
             ]))), 128))
           ], 6))), 128))
-        ])) : h("", !0),
-        e.hasHighlightArea ? (r(), i("g", sa, [
-          d("rect", {
-            x: e.drawingArea.left + e.drawingArea.width / e.maxSeries * (e.FINAL_CONFIG.chart.highlightArea.from - t.slicer.start),
-            y: e.drawingArea.top,
-            height: e.drawingArea.height < 0 ? 10 : e.drawingArea.height,
-            width: e.drawingArea.width / e.maxSeries * e.highlightAreaSpan < 0 ? 1e-5 : e.drawingArea.width / e.maxSeries * e.highlightAreaSpan,
-            fill: `${e.FINAL_CONFIG.chart.highlightArea.color}${t.opacity[e.FINAL_CONFIG.chart.highlightArea.opacity]}`
-          }, null, 8, oa),
-          e.FINAL_CONFIG.chart.highlightArea.caption.text ? (r(), i("foreignObject", {
-            key: 0,
-            x: e.drawingArea.left + e.drawingArea.width / e.maxSeries * (e.FINAL_CONFIG.chart.highlightArea.from - t.slicer.start) - (e.FINAL_CONFIG.chart.highlightArea.caption.width === "auto" ? 0 : e.FINAL_CONFIG.chart.highlightArea.caption.width / 2 - e.drawingArea.width / e.maxSeries * e.highlightAreaSpan / 2),
-            y: e.drawingArea.top + e.FINAL_CONFIG.chart.highlightArea.caption.offsetY,
-            style: { overflow: "visible" },
-            height: "1",
-            width: e.FINAL_CONFIG.chart.highlightArea.caption.width === "auto" ? e.drawingArea.width / e.maxSeries * e.highlightAreaSpan : e.FINAL_CONFIG.chart.highlightArea.caption.width
-          }, [
-            d("div", {
-              style: L(`padding:${e.FINAL_CONFIG.chart.highlightArea.caption.padding}px;text-align:${e.FINAL_CONFIG.chart.highlightArea.caption.textAlign};font-size:${e.FINAL_CONFIG.chart.highlightArea.caption.fontSize}px;color:${e.FINAL_CONFIG.chart.highlightArea.caption.color};font-weight:${e.FINAL_CONFIG.chart.highlightArea.caption.bold ? "bold" : "normal"}`)
-            }, C(e.FINAL_CONFIG.chart.highlightArea.caption.text), 5)
-          ], 8, na)) : h("", !0)
-        ])) : h("", !0),
-        d("g", null, [
-          d("rect", {
-            x: 0,
-            y: e.drawingArea.top,
-            width: e.FINAL_CONFIG.chart.padding.left - 1,
-            height: e.drawingArea.height < 0 ? 10 : e.drawingArea.height,
-            fill: e.FINAL_CONFIG.chart.backgroundColor
-          }, null, 8, ha),
-          d("rect", {
-            x: e.drawingArea.right + 1,
-            y: e.drawingArea.top,
-            width: e.FINAL_CONFIG.chart.padding.right,
-            height: e.drawingArea.height < 0 ? 10 : e.drawingArea.height,
-            fill: e.FINAL_CONFIG.chart.backgroundColor
-          }, null, 8, ca)
-        ]),
-        (r(!0), i(I, null, m(e.lineSet, (a, n) => (r(), i("g", {
+        ])) : c("", !0),
+        (r(!0), i(b, null, I(e.lineSet, (a, n) => (r(), i("g", {
           key: `xLabel_line_${n}`,
           class: T(`xLabel_line_${n}`),
           style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.2 : 1};transition:opacity 0.2s ease-in-out`)
         }, [
-          (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+          (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
             key: `xLabel_line_${n}_${g}`
           }, [
             s && g === 0 && a.showSerieName && a.showSerieName === "start" ? (r(), i("text", {
@@ -1715,7 +1819,7 @@ function Ya(l, o, c, b, t, e) {
                 y: s.y,
                 maxWords: 2
               })
-            }, null, 8, ua)) : h("", !0),
+            }, null, 8, Na)) : c("", !0),
             s && g === a.plots.length - 1 && a.showSerieName && a.showSerieName === "end" ? (r(), i("text", {
               key: 1,
               x: s.x + t.fontSizes.plotLabels,
@@ -1731,15 +1835,15 @@ function Ya(l, o, c, b, t, e) {
                 y: s.y,
                 maxWords: 2
               })
-            }, null, 8, da)) : h("", !0)
+            }, null, 8, _a)) : c("", !0)
           ]))), 128))
         ], 6))), 128)),
-        (r(!0), i(I, null, m(e.plotSet, (a, n) => (r(), i("g", {
+        (r(!0), i(b, null, I(e.plotSet, (a, n) => (r(), i("g", {
           key: `xLabel_plot_${n}`,
           class: T(`xLabel_plot_${n}`),
           style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.2 : 1};transition:opacity 0.2s ease-in-out`)
         }, [
-          (r(!0), i(I, null, m(a.plots, (s, g) => (r(), i("g", {
+          (r(!0), i(b, null, I(a.plots, (s, g) => (r(), i("g", {
             key: `xLabel_plot_${n}_${g}`
           }, [
             s && g === 0 && a.showSerieName && a.showSerieName === "start" ? (r(), i("text", {
@@ -1757,7 +1861,7 @@ function Ya(l, o, c, b, t, e) {
                 y: s.y,
                 maxWords: 2
               })
-            }, null, 8, ga)) : h("", !0),
+            }, null, 8, xa)) : c("", !0),
             s && g === a.plots.length - 1 && a.showSerieName && a.showSerieName === "end" ? (r(), i("text", {
               key: 1,
               x: s.x + t.fontSizes.plotLabels,
@@ -1773,91 +1877,10 @@ function Ya(l, o, c, b, t, e) {
                 y: s.y,
                 maxWords: 2
               })
-            }, null, 8, fa)) : h("", !0)
+            }, null, 8, Fa)) : c("", !0)
           ]))), 128))
         ], 6))), 128)),
-        e.FINAL_CONFIG.chart.grid.labels.show ? (r(), i("g", ba, [
-          t.mutableConfig.useIndividualScale ? (r(), i(I, { key: 0 }, [
-            (r(!0), i(I, null, m(e.allScales, (a) => (r(), i("g", null, [
-              d("line", {
-                x1: a.x,
-                x2: a.x,
-                y1: t.mutableConfig.isStacked ? e.drawingArea.bottom - a.yOffset - a.individualHeight : e.drawingArea.top,
-                y2: t.mutableConfig.isStacked ? e.drawingArea.bottom - a.yOffset : e.drawingArea.bottom,
-                stroke: a.color,
-                "stroke-width": e.FINAL_CONFIG.chart.grid.stroke,
-                "stroke-linecap": "round",
-                style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.3 : 1};transition:opacity 0.2s ease-in-out`)
-              }, null, 12, Ia)
-            ]))), 256)),
-            (r(!0), i(I, null, m(e.allScales, (a) => (r(), i("g", {
-              style: L(`opacity:${t.selectedScale ? t.selectedScale === a.id ? 1 : 0.3 : 1};transition:opacity 0.2s ease-in-out`)
-            }, [
-              d("text", {
-                fill: a.color,
-                "font-size": t.fontSizes.dataLabels,
-                "text-anchor": "middle",
-                transform: `translate(${a.x - e.FINAL_CONFIG.chart.grid.labels.yAxis.labelWidth + 5}, ${t.mutableConfig.isStacked ? e.drawingArea.bottom - a.yOffset - a.individualHeight / 2 : e.drawingArea.top + e.drawingArea.height / 2}) rotate(-90)`
-              }, C(a.name) + " " + C(a.scaleLabel ? `- ${a.scaleLabel}` : ""), 9, ma),
-              (r(!0), i(I, null, m(a.yLabels, (n, s) => (r(), i("line", {
-                x1: a.x - 3,
-                x2: a.x,
-                y1: n.y,
-                y2: n.y,
-                stroke: a.color,
-                "stroke-width": 1,
-                "stroke-linecap": "round"
-              }, null, 8, Na))), 256)),
-              (r(!0), i(I, null, m(a.yLabels, (n, s) => (r(), i("text", {
-                x: a.x - 5,
-                y: n.y,
-                "font-size": t.fontSizes.dataLabels,
-                "text-anchor": "end",
-                fill: a.color
-              }, C(e.applyDataLabel(
-                e.FINAL_CONFIG.chart.grid.labels.yAxis.formatter,
-                n.value,
-                e.dataLabel({
-                  p: e.FINAL_CONFIG.chart.labels.prefix,
-                  v: n.value,
-                  s: e.FINAL_CONFIG.chart.labels.suffix,
-                  r: 1
-                })
-              )), 9, _a))), 256))
-            ], 4))), 256))
-          ], 64)) : (r(!0), i(I, { key: 1 }, m(e.yLabels, (a, n) => (r(), i("g", {
-            key: `yLabel_${n}`
-          }, [
-            e.canShowValue(a) && a.value >= e.niceScale.min && a.value <= e.niceScale.max ? (r(), i("line", {
-              key: 0,
-              x1: e.drawingArea.left,
-              x2: e.drawingArea.left - 5,
-              y1: a.y,
-              y2: a.y,
-              stroke: e.FINAL_CONFIG.chart.grid.stroke,
-              "stroke-width": "1",
-              "stroke-linecap": "round"
-            }, null, 8, Fa)) : h("", !0),
-            a.value >= e.niceScale.min && a.value <= e.niceScale.max ? (r(), i("text", {
-              key: 1,
-              x: e.drawingArea.left - 7,
-              y: a.y + t.fontSizes.dataLabels / 3,
-              "font-size": t.fontSizes.dataLabels,
-              "text-anchor": "end",
-              fill: e.FINAL_CONFIG.chart.grid.labels.color
-            }, C(e.canShowValue(a.value) ? e.applyDataLabel(
-              e.FINAL_CONFIG.chart.grid.labels.yAxis.formatter,
-              a.value,
-              e.dataLabel({
-                p: e.FINAL_CONFIG.chart.labels.prefix,
-                v: a.value,
-                s: e.FINAL_CONFIG.chart.labels.suffix,
-                r: 1
-              })
-            ) : ""), 9, xa)) : h("", !0)
-          ]))), 128))
-        ])) : h("", !0),
-        t.mutableConfig.useIndividualScale && !t.mutableConfig.isStacked ? (r(!0), i(I, { key: 7 }, m(e.allScales, (a) => (r(), i("rect", {
+        t.mutableConfig.useIndividualScale && !t.mutableConfig.isStacked ? (r(!0), i(b, { key: 7 }, I(e.allScales, (a) => (r(), i("rect", {
           x: a.x - e.FINAL_CONFIG.chart.grid.labels.yAxis.labelWidth,
           y: e.drawingArea.top,
           width: e.FINAL_CONFIG.chart.grid.labels.yAxis.labelWidth,
@@ -1865,8 +1888,8 @@ function Ya(l, o, c, b, t, e) {
           fill: t.selectedScale === a.id ? `${a.color}20` : "transparent",
           onMouseenter: (n) => t.selectedScale = a.id,
           onMouseleave: o[0] || (o[0] = (n) => t.selectedScale = null)
-        }, null, 40, ya))), 256)) : h("", !0),
-        d("g", null, [
+        }, null, 40, ya))), 256)) : c("", !0),
+        u("g", null, [
           e.FINAL_CONFIG.chart.grid.labels.axis.yLabel && !t.mutableConfig.useIndividualScale ? (r(), i("text", {
             key: 0,
             "font-size": t.fontSizes.yAxis,
@@ -1874,7 +1897,7 @@ function Ya(l, o, c, b, t, e) {
             transform: `translate(${t.fontSizes.yAxis + e.FINAL_CONFIG.chart.grid.labels.axis.yLabelOffsetX}, ${e.drawingArea.top + e.drawingArea.height / 2}) rotate(-90)`,
             "text-anchor": "middle",
             style: { transition: "none" }
-          }, C(e.FINAL_CONFIG.chart.grid.labels.axis.yLabel), 9, Aa)) : h("", !0),
+          }, C(e.FINAL_CONFIG.chart.grid.labels.axis.yLabel), 9, Aa)) : c("", !0),
           e.FINAL_CONFIG.chart.grid.labels.axis.xLabel ? (r(), i("text", {
             key: 1,
             "text-anchor": "middle",
@@ -1882,10 +1905,10 @@ function Ya(l, o, c, b, t, e) {
             y: e.drawingArea.bottom + t.fontSizes.yAxis + t.fontSizes.xAxis * 1.3 + e.FINAL_CONFIG.chart.grid.labels.axis.xLabelOffsetY,
             "font-size": t.fontSizes.yAxis,
             fill: e.FINAL_CONFIG.chart.grid.labels.color
-          }, C(e.FINAL_CONFIG.chart.grid.labels.axis.xLabel), 9, La)) : h("", !0)
+          }, C(e.FINAL_CONFIG.chart.grid.labels.axis.xLabel), 9, La)) : c("", !0)
         ]),
         e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.show ? (r(), i("g", Sa, [
-          (r(!0), i(I, null, m(e.timeLabels, (a, n) => (r(), i("g", {
+          (r(!0), i(b, null, I(e.timeLabels, (a, n) => (r(), i("g", {
             key: `time_label_${n}`
           }, [
             a && !e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.showOnlyFirstAndLast && !e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.showOnlyAtModulo || a && e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.showOnlyFirstAndLast && (n === 0 || n === e.timeLabels.length - 1) && !e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.showOnlyAtModulo || a && e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.showOnlyFirstAndLast && t.selectedSerieIndex === n && !e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.showOnlyAtModulo || a && !e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.showOnlyFirstAndLast && e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.showOnlyAtModulo && n % Math.floor((this.slicer.end - this.slicer.start) / e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.modulo) === 0 ? (r(), i("text", {
@@ -1894,14 +1917,14 @@ function Ya(l, o, c, b, t, e) {
               "font-size": t.fontSizes.xAxis,
               fill: e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.color,
               transform: `translate(${e.drawingArea.left + e.drawingArea.width / e.maxSeries * n + e.drawingArea.width / e.maxSeries / 2}, ${e.drawingArea.bottom + t.fontSizes.xAxis * 1.3 + e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.yOffset}), rotate(${e.FINAL_CONFIG.chart.grid.labels.xAxisLabels.rotation})`
-            }, C(a || ""), 9, Ca)) : h("", !0)
+            }, C(a || ""), 9, Ca)) : c("", !0)
           ]))), 128))
-        ])) : h("", !0),
-        d("g", null, [
-          (r(!0), i(I, null, m(e.maxSeries, (a, n) => (r(), i("g", {
+        ])) : c("", !0),
+        u("g", null, [
+          (r(!0), i(b, null, I(e.maxSeries, (a, n) => (r(), i("g", {
             key: `tooltip_trap_${n}`
           }, [
-            d("rect", {
+            u("rect", {
               "data-cy-trap": "",
               x: e.drawingArea.left + e.drawingArea.width / e.maxSeries * n,
               y: e.drawingArea.top,
@@ -1915,7 +1938,7 @@ function Ya(l, o, c, b, t, e) {
           ]))), 128))
         ]),
         e.FINAL_CONFIG.chart.highlighter.useLine && ![null, void 0].includes(t.selectedSerieIndex) ? (r(), i("g", wa, [
-          d("line", {
+          u("line", {
             x1: e.drawingArea.left + e.drawingArea.width / e.maxSeries * t.selectedSerieIndex + e.drawingArea.width / e.maxSeries / 2,
             x2: e.drawingArea.left + e.drawingArea.width / e.maxSeries * t.selectedSerieIndex + e.drawingArea.width / e.maxSeries / 2,
             y1: e.drawingArea.top,
@@ -1926,7 +1949,7 @@ function Ya(l, o, c, b, t, e) {
             "stroke-linecap": "round",
             style: { transition: "none !important", animation: "none !important", "pointer-events": "none" }
           }, null, 8, Oa)
-        ])) : h("", !0),
+        ])) : c("", !0),
         e.FINAL_CONFIG.chart.timeTag.show && ![null, void 0].includes(t.selectedSerieIndex) ? (r(), i("g", va, [
           (r(), i("foreignObject", {
             x: e.drawingArea.left + e.drawingArea.width / e.maxSeries * t.selectedSerieIndex - 100 + e.drawingArea.width / e.maxSeries / 2,
@@ -1935,25 +1958,25 @@ function Ya(l, o, c, b, t, e) {
             height: "40",
             style: { overflow: "visible !important" }
           }, [
-            d("div", {
+            u("div", {
               class: "vue-ui-xy-time-tag",
               style: L(`width: fit-content;margin: 0 auto;text-align:center;padding:3px 12px;background:${e.FINAL_CONFIG.chart.timeTag.backgroundColor};color:${e.FINAL_CONFIG.chart.timeTag.color};font-size:${e.FINAL_CONFIG.chart.timeTag.fontSize}px`)
             }, C(e.timeLabels[t.selectedSerieIndex] || t.selectedSerieIndex), 5)
           ], 8, Ga)),
-          d("circle", {
+          u("circle", {
             cx: e.drawingArea.left + e.drawingArea.width / e.maxSeries * t.selectedSerieIndex + e.drawingArea.width / e.maxSeries / 2,
             cy: e.drawingArea.bottom,
             r: e.FINAL_CONFIG.chart.timeTag.circleMarker.radius,
             fill: e.FINAL_CONFIG.chart.timeTag.circleMarker.color
           }, null, 8, za)
-        ])) : h("", !0)
-      ])) : h("", !0),
+        ])) : c("", !0)
+      ])) : c("", !0),
       v(l.$slots, "svg", { svg: e.svg }, void 0, !0)
-    ], 14, Ee)) : h("", !0),
+    ], 14, Ye)) : c("", !0),
     l.$slots.watermark ? (r(), i("div", pa, [
-      v(l.$slots, "watermark", Y(W({ isPrinting: t.isPrinting || t.isImaging })), void 0, !0)
-    ])) : h("", !0),
-    e.isDataset ? h("", !0) : (r(), V(F, {
+      v(l.$slots, "watermark", W(B({ isPrinting: t.isPrinting || t.isImaging })), void 0, !0)
+    ])) : c("", !0),
+    e.isDataset ? c("", !0) : (r(), V(x, {
       key: 4,
       config: {
         type: "line",
@@ -1994,23 +2017,23 @@ function Ya(l, o, c, b, t, e) {
       onReset: e.refreshSlicer
     }, {
       "reset-action": z(({ reset: a }) => [
-        v(l.$slots, "reset-action", Y(W({ reset: a })), void 0, !0)
+        v(l.$slots, "reset-action", W(B({ reset: a })), void 0, !0)
       ]),
       _: 3
-    }, 8, ["background", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "borderColor", "max", "valueStart", "valueEnd", "start", "end", "onReset"])) : h("", !0),
+    }, 8, ["background", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "borderColor", "max", "valueStart", "valueEnd", "start", "end", "onReset"])) : c("", !0),
     e.FINAL_CONFIG.chart.legend.show ? (r(), i("div", {
       key: 6,
       ref: "chartLegend",
       class: "vue-ui-xy-legend",
       style: L(`font-size:${e.FINAL_CONFIG.chart.legend.fontSize}px`)
     }, [
-      (r(!0), i(I, null, m(e.absoluteDataset, (a, n) => (r(), i("div", {
+      (r(!0), i(b, null, I(e.absoluteDataset, (a, n) => (r(), i("div", {
         key: `div_legend_item_${n}`,
         onClick: (s) => e.segregate(a),
         class: T({ "vue-ui-xy-legend-item": !0, "vue-ui-xy-legend-item-segregated": t.segregatedSeries.includes(a.id) })
       }, [
         t.icons[a.type] === "line" ? (r(), i("svg", Ma, [
-          d("rect", {
+          u("rect", {
             x: "0",
             y: "7",
             rx: "3",
@@ -2019,7 +2042,7 @@ function Ya(l, o, c, b, t, e) {
             width: "20",
             fill: a.color
           }, null, 8, Pa),
-          E(f, {
+          Y(f, {
             plot: { x: 10, y: 9 },
             radius: 4,
             color: a.color,
@@ -2045,14 +2068,14 @@ function Ya(l, o, c, b, t, e) {
             shape: ["triangle", "square", "diamond", "pentagon", "hexagon", "star"].includes(a.shape) ? a.shape : "circle"
           }, null, 8, ["color", "shape"]))
         ])),
-        d("span", {
+        u("span", {
           style: L(`color:${e.FINAL_CONFIG.chart.legend.color}`)
         }, C(a.name), 5)
       ], 10, Ta))), 128))
     ], 4)) : (r(), i("div", Da, [
       v(l.$slots, "legend", { legend: e.absoluteDataset }, void 0, !0)
     ], 512)),
-    E(k, {
+    Y(k, {
       show: t.mutableConfig.showTooltip && t.isTooltip,
       backgroundColor: e.FINAL_CONFIG.chart.tooltip.backgroundColor,
       color: e.FINAL_CONFIG.chart.tooltip.color,
@@ -2068,10 +2091,10 @@ function Ya(l, o, c, b, t, e) {
       isCustom: e.FINAL_CONFIG.chart.tooltip.customFormat && typeof e.FINAL_CONFIG.chart.tooltip.customFormat == "function"
     }, {
       "tooltip-before": z(() => [
-        v(l.$slots, "tooltip-before", Y(W({ ...e.dataTooltipSlot })), void 0, !0)
+        v(l.$slots, "tooltip-before", W(B({ ...e.dataTooltipSlot })), void 0, !0)
       ]),
       "tooltip-after": z(() => [
-        v(l.$slots, "tooltip-after", Y(W({ ...e.dataTooltipSlot })), void 0, !0)
+        v(l.$slots, "tooltip-after", W(B({ ...e.dataTooltipSlot })), void 0, !0)
       ]),
       _: 3
     }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom"]),
@@ -2092,21 +2115,21 @@ function Ya(l, o, c, b, t, e) {
       }
     }, {
       content: z(() => [
-        d("div", {
+        u("div", {
           style: L(`${t.isPrinting ? "" : "max-height:400px"};overflow:auto;width:100%;margin-top:48px`)
         }, [
-          d("div", Ha, [
-            Ve(d("input", {
+          u("div", Ea, [
+            Ve(u("input", {
               type: "checkbox",
               "onUpdate:modelValue": o[4] || (o[4] = (a) => t.showSparklineTable = a)
             }, null, 512), [
               [Re, t.showSparklineTable]
             ]),
-            d("div", {
+            u("div", {
               onClick: o[5] || (o[5] = (a) => t.showSparklineTable = !t.showSparklineTable),
               style: { cursor: "pointer" }
             }, [
-              E(w, {
+              Y(w, {
                 name: "chartLine",
                 size: 20,
                 stroke: e.FINAL_CONFIG.chart.color
@@ -2127,7 +2150,7 @@ function Ya(l, o, c, b, t, e) {
             onClose: o[6] || (o[6] = (a) => t.mutableConfig.showTable = !1)
           }, {
             th: z(({ th: a }) => [
-              d("div", { innerHTML: a }, null, 8, Ba)
+              u("div", { innerHTML: a }, null, 8, Ha)
             ]),
             td: z(({ td: a }) => [
               De(C(isNaN(Number(a)) ? a : e.dataLabel({
@@ -2142,10 +2165,10 @@ function Ya(l, o, c, b, t, e) {
         ], 4)
       ]),
       _: 1
-    }, 8, ["config"])) : h("", !0)
-  ], 14, We);
+    }, 8, ["config"])) : c("", !0)
+  ], 14, Be);
 }
-const rl = /* @__PURE__ */ He(Ye, [["render", Ya], ["__scopeId", "data-v-6a1d72ac"]]);
+const rl = /* @__PURE__ */ Ee(We, [["render", Wa], ["__scopeId", "data-v-58a339d5"]]);
 export {
   rl as default
 };