vue-data-ui 3.2.3 → 3.2.5

package/dist/{vue-ui-table-__ABUm9x.js → vue-ui-table-DZ_jLauo.js}

@@ -1,11 +1,11 @@
-import { a2 as U, t as V, m as x, y as X, d as j, r as Y, x as W, a6 as J, h as K, E as Z, p as q } from "./lib-BEpWEyMm.js";
-import { u as Q } from "./useNestedProp-CLD3Gk9S.js";
-import $ from "./vue-ui-xy-DGln2YgO.js";
-import ee from "./vue-ui-donut-BgYaWImK.js";
+import { a2 as U, t as V, m as T, y as X, d as j, r as Y, x as W, a6 as J, h as K, E as Z, p as q } from "./lib-BEpWEyMm.js";
+import { u as Q } from "./useNestedProp-B9OeNO-E.js";
+import $ from "./vue-ui-xy-vlcc3Vxv.js";
+import ee from "./vue-ui-donut-fadiDQvI.js";
 import te from "./BaseIcon-Bz-1GQhu.js";
-import { resolveComponent as D, createElementBlock as u, openBlock as c, normalizeStyle as g, createCommentVNode as b, createElementVNode as a, toDisplayString as h, createTextVNode as v, withDirectives as O, withKeys as S, withModifiers as L, vModelText as A, createVNode as E, Fragment as F, renderList as k, normalizeClass as N, vModelSelect as P, createBlock as H } from "vue";
-import { _ as se } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const ne = {
+import { resolveComponent as G, createElementBlock as u, openBlock as c, normalizeStyle as g, createCommentVNode as b, createElementVNode as a, toDisplayString as h, withDirectives as O, withKeys as L, withModifiers as S, vModelText as A, createVNode as E, Fragment as p, renderList as k, normalizeClass as C, createTextVNode as w, vModelSelect as P, createBlock as B, ref as se, computed as ne } from "vue";
+import { _ as re } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const le = {
   name: "vue-ui-table",
   props: {
     config: {
@@ -117,6 +117,13 @@ const ne = {
       filename: ""
     };
   },
+  setup() {
+    const n = se(null), t = ne(() => n.value ? n.value.getBoundingClientRect().height + 3 : 3);
+    return {
+      tableCaption: n,
+      exportButtonTop: t
+    };
+  },
   mounted() {
     if (this.dataset.header.length === 0)
       throw new Error(`vue-ui-table error: missing header data.
@@ -212,10 +219,10 @@ Provide an array of objects of type:
     },
     chartData() {
       if (!this.canChart) return [];
-      const n = 316, t = 512, r = this.currentSelectionSpan.rows.length, i = t / r, s = Math.max(...this.currentSelectionSpan.rows.map((w) => w.value)), e = Math.min(...this.currentSelectionSpan.rows.map((w) => w.value)), m = this.dataset.header[this.currentSelectionSpan.col].isPercentage && this.dataset.header[this.currentSelectionSpan.col].percentageTo, f = this.chart.type === this.constants.DONUT && this.selectedDonutCategory && this.selectedDonutCategory.name, _ = this.dataset.header[this.currentSelectionSpan.col].name + (m ? ` / ${this.dataset.header[this.percentages[this.currentSelectionSpan.col].referenceIndex].name}` : "") + (f ? ` ${this.FINAL_CONFIG.translations.by} ${this.selectedDonutCategory.name}` : ""), l = this.dataset.header[this.currentSelectionSpan.col].prefix, o = this.dataset.header[this.currentSelectionSpan.col].suffix, d = [
+      const n = 316, t = 512, r = this.currentSelectionSpan.rows.length, i = t / r, s = Math.max(...this.currentSelectionSpan.rows.map((v) => v.value)), e = Math.min(...this.currentSelectionSpan.rows.map((v) => v.value)), m = this.dataset.header[this.currentSelectionSpan.col].isPercentage && this.dataset.header[this.currentSelectionSpan.col].percentageTo, f = this.chart.type === this.constants.DONUT && this.selectedDonutCategory && this.selectedDonutCategory.name, _ = this.dataset.header[this.currentSelectionSpan.col].name + (m ? ` / ${this.dataset.header[this.percentages[this.currentSelectionSpan.col].referenceIndex].name}` : "") + (f ? ` ${this.FINAL_CONFIG.translations.by} ${this.selectedDonutCategory.name}` : ""), o = this.dataset.header[this.currentSelectionSpan.col].prefix, l = this.dataset.header[this.currentSelectionSpan.col].suffix, d = [
         {
           name: _,
-          series: this.currentSelectionSpan.rows.map((w) => w.value),
+          series: this.currentSelectionSpan.rows.map((v) => v.value),
           type: "line",
           useProgression: !0,
           smooth: this.FINAL_CONFIG.style.chart.layout.line.smooth,
@@ -225,26 +232,26 @@ Provide an array of objects of type:
       ], y = [
         {
           name: _,
-          series: this.currentSelectionSpan.rows.map((w) => w.value),
+          series: this.currentSelectionSpan.rows.map((v) => v.value),
           type: "bar",
           useProgression: !0,
           color: this.FINAL_CONFIG.style.chart.layout.bar.fill
         }
-      ], C = this.FINAL_CONFIG.style.chart.modal.backgroundColor, p = this.adaptColorToBackground(C), I = this.dataset.header[this.currentSelectionSpan.col].decimals, B = {
+      ], I = this.FINAL_CONFIG.style.chart.modal.backgroundColor, N = this.adaptColorToBackground(I), F = this.dataset.header[this.currentSelectionSpan.col].decimals, H = {
         chart: {
-          backgroundColor: C,
-          color: p,
+          backgroundColor: I,
+          color: N,
           labels: {
             fontSize: 18,
-            prefix: l,
-            suffix: o
+            prefix: o,
+            suffix: l
           },
           grid: {
-            stroke: x(p, 0.5),
+            stroke: T(N, 0.5),
             labels: {
-              color: p,
+              color: N,
               xAxisLabels: {
-                color: p,
+                color: N,
                 show: this.chartTimeLabels.length,
                 values: this.chartTimeLabels,
                 datetimeFormatter: this.FINAL_CONFIG.style.chart.layout.datetimeFormatter,
@@ -254,23 +261,23 @@ Provide an array of objects of type:
             }
           },
           highlighter: {
-            color: p
+            color: N
           },
           legend: {
-            color: p
+            color: N
           },
           title: {
             text: _,
-            color: p,
+            color: N,
             fontSize: 18
           },
           tooltip: {
             showTimeLabel: this.chartTimeLabels.length,
             backgroundOpacity: 30,
-            color: p,
-            backgroundColor: C,
+            color: N,
+            backgroundColor: I,
             showPercentage: !1,
-            roundingValue: I
+            roundingValue: F
           },
           userOptions: {
             position: "left",
@@ -292,8 +299,8 @@ Provide an array of objects of type:
         line: {
           labels: {
             show: !0,
-            color: p,
-            rounding: I
+            color: N,
+            rounding: F
           },
           dot: {
             useSerieColor: !1,
@@ -310,18 +317,18 @@ Provide an array of objects of type:
           },
           labels: {
             show: !0,
-            color: p,
-            rounding: I
+            color: N,
+            rounding: F
           }
         }
-      }, G = e >= 0 ? 0 : Math.abs(e), R = s + G, M = this.dataset.header[this.currentSelectionSpan.col].isPercentage, T = this.currentSelectionSpan.rows.map((w, z) => ({
+      }, x = e >= 0 ? 0 : Math.abs(e), R = s + x, M = this.dataset.header[this.currentSelectionSpan.col].isPercentage, D = this.currentSelectionSpan.rows.map((v, z) => ({
         x: i * z + i / 2,
-        y: (1 - (w.value + G) / R) * n,
-        value: M ? w.value * 100 : w.value,
+        y: (1 - (v.value + x) / R) * n,
+        value: M ? v.value * 100 : v.value,
         suffix: M ? "%" : this.dataset.header[this.currentSelectionSpan.col].suffix ? this.dataset.header[this.currentSelectionSpan.col].suffix : "",
         prefix: this.dataset.header[this.currentSelectionSpan.col].prefix ? this.dataset.header[this.currentSelectionSpan.col].prefix : "",
-        index: w.index,
-        absoluteValue: M ? Math.abs(w.value) * 100 : Math.abs(w.value)
+        index: v.index,
+        absoluteValue: M ? Math.abs(v.value) * 100 : Math.abs(v.value)
       }));
       return {
         donutConfig: {
@@ -336,8 +343,8 @@ Provide an array of objects of type:
           },
           style: {
             chart: {
-              backgroundColor: C,
-              color: p,
+              backgroundColor: I,
+              color: N,
               layout: {
                 curvedMarkers: !0,
                 donut: {
@@ -346,32 +353,32 @@ Provide an array of objects of type:
                 labels: {
                   dataLabels: {
                     suffix: M ? "%" : "",
-                    prefix: l
+                    prefix: o
                   },
                   value: {
-                    rounding: I
+                    rounding: F
                   },
                   percentage: {
-                    color: p,
-                    rounding: I
+                    color: N,
+                    rounding: F
                   },
                   name: {
-                    color: p
+                    color: N
                   },
                   hollow: {
                     average: {
-                      color: p,
+                      color: N,
                       text: this.FINAL_CONFIG.translations.average,
                       value: {
-                        color: p
+                        color: N
                       }
                     },
                     total: {
-                      color: p,
+                      color: N,
                       offsetY: -12,
                       text: this.FINAL_CONFIG.translations.total,
                       value: {
-                        color: p,
+                        color: N,
                         offsetY: -12
                       }
                     }
@@ -379,10 +386,10 @@ Provide an array of objects of type:
                 }
               },
               legend: {
-                backgroundColor: C,
-                color: p,
-                roundingValue: I,
-                roundingPercentage: I
+                backgroundColor: I,
+                color: N,
+                roundingValue: F,
+                roundingPercentage: F
               },
               padding: {
                 left: 12,
@@ -390,23 +397,23 @@ Provide an array of objects of type:
               },
               title: {
                 text: _,
-                color: p,
+                color: N,
                 fontSize: 18
               },
               tooltip: {
                 backgroundOpacity: 30,
-                color: p,
-                backgroundColor: C,
-                roundingValue: I,
-                roundingValue: I
+                color: N,
+                backgroundColor: I,
+                roundingValue: F,
+                roundingValue: F
               }
             }
           }
         },
-        xyConfig: B,
+        xyConfig: H,
         xyDatasetLine: d,
         xyDatasetBar: y,
-        progression: T.length >= 2 ? this.calcLinearProgression(T) : !1
+        progression: D.length >= 2 ? this.calcLinearProgression(D) : !1
       };
     },
     hasNumericTypes() {
@@ -476,7 +483,7 @@ Provide an array of objects of type:
     darkenHexColor: Y,
     dataLabel: j,
     downloadCsv: X,
-    lightenHexColor: x,
+    lightenHexColor: T,
     treeShake: V,
     // specific
     applyDonutOption() {
@@ -531,9 +538,9 @@ Provide an array of objects of type:
       return this.rows.map((t) => t[n]).map((t) => isNaN(Number(t)) ? 0 : t).reduce((t, r) => t + r, 0) / this.bodyCopy.length;
     },
     getDatesRange(n) {
-      const t = this.dataset.body.map((y) => new Date(y.td[n])), r = new Date(Math.min(...t)), i = new Date(Math.max(...t)), s = r.getFullYear(), e = i.getFullYear(), m = String(r.getMonth() + 1).padStart(2, "0"), f = String(i.getMonth() + 1).padStart(2, "0"), _ = String(r.getDate()).padStart(2, "0"), l = String(i.getDate()).padStart(2, "0"), o = `${s}-${m}-${_}`, d = `${e}-${f}-${l}`;
+      const t = this.dataset.body.map((y) => new Date(y.td[n])), r = new Date(Math.min(...t)), i = new Date(Math.max(...t)), s = r.getFullYear(), e = i.getFullYear(), m = String(r.getMonth() + 1).padStart(2, "0"), f = String(i.getMonth() + 1).padStart(2, "0"), _ = String(r.getDate()).padStart(2, "0"), o = String(i.getDate()).padStart(2, "0"), l = `${s}-${m}-${_}`, d = `${e}-${f}-${o}`;
       return {
-        from: o,
+        from: l,
         to: d
       };
     },
@@ -622,25 +629,25 @@ Provide an array of objects of type:
       n.preventDefault();
       const t = n.keyCode, r = 38, i = 40, s = 37, e = 39;
       if (![r, i, s, e].includes(t)) return;
-      const m = n.target.id, f = /cell_(\d+)_(\d+)_vue-ui-table-(\d+)/, _ = m.match(f), l = parseInt(_[1]), o = parseInt(_[2]), d = document.getElementById(`cell_${l}_${o + 1}_${this.uid}`), y = document.getElementById(`cell_${l}_${o - 1}_${this.uid}`), C = document.getElementById(`cell_${l + 1}_${o}_${this.uid}`), p = document.getElementById(`cell_${l - 1}_${o}_${this.uid}`);
-      let I;
+      const m = n.target.id, f = /cell_(\d+)_(\d+)_vue-ui-table-(\d+)/, _ = m.match(f), o = parseInt(_[1]), l = parseInt(_[2]), d = document.getElementById(`cell_${o}_${l + 1}_${this.uid}`), y = document.getElementById(`cell_${o}_${l - 1}_${this.uid}`), I = document.getElementById(`cell_${o + 1}_${l}_${this.uid}`), N = document.getElementById(`cell_${o - 1}_${l}_${this.uid}`);
+      let F;
       switch (!0) {
         case t === e:
-          I = d;
+          F = d;
           break;
         case t === s:
-          I = y;
+          F = y;
           break;
         case t === r:
-          I = p;
+          F = N;
           break;
         case t === i:
-          I = C;
+          F = I;
           break;
         default:
           return;
       }
-      I && (I.focus(), I.scrollIntoView({ behavior: "smooth", block: "center" }));
+      F && (F.focus(), F.scrollIntoView({ behavior: "smooth", block: "center" }));
     },
     openDonutOptions() {
       this.selectedDonutCategory = this.availableDonutCategories[0], this.showDonutOptions = !0;
@@ -836,64 +843,68 @@ Provide an array of objects of type:
       this.clientX = n.clientX - this.dragOffsetX, this.clientY = n.clientY - this.dragOffsetY - 40, this.clientX < 0 && (this.clientX = 0), this.clientX + r.width > window.innerWidth && (this.clientX = window.innerWidth - r.width - 48), this.clientY < 0 && (this.clientY = 0), this.clientY + r.height > window.innerHeight && (this.clientY = window.innerHeight - r.height - 24);
     }
   }
-}, re = {
-  key: 0,
-  class: "vue-ui-table-export-hub"
-}, oe = ["innerHTML"], le = ["data-is-open"], ae = { class: "vue-ui-table-export-hub-options" }, ie = { class: "vue-ui-table-export-hub-option-wrapper" }, ce = { class: "label" }, ue = ["innerHTML"], he = { class: "vue-ui-table-export-hub-option-wrapper" }, de = { class: "label" }, ge = ["innerHTML"], me = { class: "vue-ui-table-dialog-field" }, ye = { class: "label vue-ui-table-dialog-input-label" }, be = { class: "vue-ui-table" }, fe = { key: 0 }, pe = { key: 0 }, Ne = { key: 1 }, Ce = {
+}, oe = ["innerHTML"], ae = ["data-is-open"], ie = { class: "vue-ui-table-export-hub-options" }, ce = { class: "vue-ui-table-export-hub-option-wrapper" }, ue = { class: "label" }, he = ["innerHTML"], de = { class: "vue-ui-table-export-hub-option-wrapper" }, ge = { class: "label" }, me = ["innerHTML"], ye = { class: "vue-ui-table-dialog-field" }, be = {
+  class: "label vue-ui-table-dialog-input-label",
+  style: { width: "100%" }
+}, fe = { style: { width: "fit-content" } }, Ne = { class: "vue-ui-table" }, pe = { key: 0 }, Ce = { key: 0 }, Ie = { key: 1 }, Fe = {
   key: 0,
   style: { display: "flex", "align-items": "center", "justify-content": "flex-end" }
-}, Ie = ["innerHTML"], Fe = {
+}, ve = ["innerHTML"], we = {
   key: 0,
   style: { "margin-left": "3px" }
-}, ve = { key: 0 }, we = { class: "th-filter" }, _e = {
+}, _e = { key: 0 }, ke = { class: "th-filter" }, Oe = {
   key: 0,
   class: "th-date"
-}, ke = { class: "date-wrapper--inputs" }, Oe = { class: "date-fieldset" }, Se = ["for"], Le = ["id", "onUpdate:modelValue", "onInput"], Ae = { class: "date-fieldset" }, Me = ["for"], De = ["id", "onUpdate:modelValue", "onInput"], Ge = { class: "date-wrapper--button" }, Te = ["onClick"], xe = ["innerHTML"], Ee = ["innerHTML"], Pe = ["innerHTML"], He = ["onClick", "disabled"], Be = ["placeholder", "onUpdate:modelValue", "name"], Re = ["onClick"], ze = ["innerHTML"], Ue = ["innerHTML"], Ve = ["innerHTML"], Xe = ["onClick", "innerHTML"], je = ["innerHTML"], Ye = {
+}, Le = { class: "date-wrapper--inputs" }, Se = { class: "date-fieldset" }, Ae = ["for"], Me = ["id", "onUpdate:modelValue", "onInput"], Ge = { class: "date-fieldset" }, xe = ["for"], De = ["id", "onUpdate:modelValue", "onInput"], Te = { class: "date-wrapper--button" }, Ee = ["onClick"], Pe = ["innerHTML"], Be = ["innerHTML"], He = ["innerHTML"], Re = ["onClick", "disabled"], ze = ["placeholder", "onUpdate:modelValue", "name"], Ue = ["onClick"], Ve = ["innerHTML"], Xe = ["innerHTML"], je = ["innerHTML"], Ye = ["onClick", "innerHTML"], We = ["innerHTML"], Je = {
   key: 5,
   class: "th-range-filter"
-}, We = ["for"], Je = ["id", "max", "min", "onUpdate:modelValue"], Ke = ["id", "max", "min", "onUpdate:modelValue"], Ze = ["for"], qe = ["onClick", "disabled"], Qe = ["id"], $e = ["onClick"], et = ["onClick", "onKeyup"], tt = ["innerHTML", "onClick", "onKeyup"], st = ["data-row"], nt = ["data-row"], rt = ["data-row", "onClick", "onKeyup", "id"], ot = ["innerHTML"], lt = { key: 1 }, at = { key: 2 }, it = { key: 5 }, ct = ["innerHTML"], ut = { key: 0 }, ht = { style: { "margin-left": "12px" } }, dt = { class: "format-num" }, gt = { style: { "margin-left": "12px" } }, mt = {
+}, Ke = ["for"], Ze = ["id", "max", "min", "onUpdate:modelValue"], qe = ["id", "max", "min", "onUpdate:modelValue"], Qe = ["for"], $e = ["onClick", "disabled"], et = ["id"], tt = ["onClick"], st = ["onClick", "onKeyup"], nt = ["innerHTML", "onClick", "onKeyup"], rt = ["data-row"], lt = ["data-row"], ot = ["data-row", "onClick", "onKeyup", "id"], at = ["innerHTML"], it = { key: 1 }, ct = { key: 2 }, ut = { key: 5 }, ht = ["innerHTML"], dt = { key: 0 }, gt = { style: { "margin-left": "12px" } }, mt = { class: "format-num" }, yt = { style: { "margin-left": "12px" } }, bt = {
   key: 0,
   class: "format-num"
-}, yt = {
+}, ft = {
   key: 1,
   class: "format-num"
-}, bt = { key: 2 }, ft = { style: { "margin-left": "12px" } }, pt = {
+}, Nt = { key: 2 }, pt = { style: { "margin-left": "12px" } }, Ct = {
   key: 0,
   class: "format-num"
-}, Nt = {
+}, It = {
   key: 1,
   class: "format-num"
-}, Ct = { key: 2 }, It = {
+}, Ft = { key: 2 }, vt = {
   key: 1,
   class: "vue-ui-table-paginator format-num"
-}, Ft = {
+}, wt = {
   key: 2,
   class: "vue-ui-table-size-warning"
-}, vt = ["innerHTML"], wt = {
+}, _t = ["innerHTML"], kt = {
   key: 4,
   class: "vue-ui-table-pagination format-num"
-}, _t = ["innerHTML", "disabled"], kt = ["disabled"], Ot = {
+}, Ot = ["innerHTML", "disabled"], Lt = ["disabled"], St = {
   key: 0,
   class: "vue-ui-table-page-scroller-wrapper"
-}, St = {
+}, At = {
   for: "pageScroller",
   style: { "font-size": "14px" }
-}, Lt = ["max", "value"], At = { key: 1 }, Mt = ["disabled"], Dt = ["innerHTML", "disabled"], Gt = ["innerHTML"], Tt = { class: "chart-modal-options" }, xt = ["innerHTML"], Et = ["innerHTML"], Pt = ["innerHTML"], Ht = {
+}, Mt = ["max", "value"], Gt = { key: 1 }, xt = ["disabled"], Dt = ["innerHTML", "disabled"], Tt = ["innerHTML"], Et = { class: "chart-modal-options" }, Pt = ["innerHTML"], Bt = ["innerHTML"], Ht = ["innerHTML"], Rt = {
   style: { width: "100%", height: "fit-content" },
   ref: "chartModal"
-}, Bt = { class: "vue-ui-table-fieldset" }, Rt = { class: "vue-ui-table-fieldset-wrapper" }, zt = ["name", "id", "checked", "onInput"], Ut = ["for"], Vt = ["disabled"], Xt = ["innerHTML"], jt = { key: 0 }, Yt = { style: { width: "100%", "margin-bottom": "12px" } }, Wt = {
+}, zt = { class: "vue-ui-table-fieldset" }, Ut = { class: "vue-ui-table-fieldset-wrapper" }, Vt = ["name", "id", "checked", "onInput"], Xt = ["for"], jt = ["disabled"], Yt = ["innerHTML"], Wt = { key: 0 }, Jt = { style: { width: "100%", "margin-bottom": "12px" } }, Kt = {
   key: 2,
   style: { width: "100%", "margin-bottom": "32px" }
 };
-function Jt(n, t, r, i, s, e) {
-  const m = D("BaseIcon"), f = D("VueUiXy"), _ = D("VueUiDonut");
+function Zt(n, t, r, i, s, e) {
+  const m = G("BaseIcon"), f = G("VueUiXy"), _ = G("VueUiDonut");
   return c(), u("div", {
     class: "vue-ui-table-main",
     style: g(`font-family: ${e.FINAL_CONFIG.fontFamily}`)
   }, [
-    e.FINAL_CONFIG.style.exportMenu.show ? (c(), u("div", re, [
+    e.FINAL_CONFIG.style.exportMenu.show ? (c(), u("div", {
+      key: 0,
+      class: "vue-ui-table-export-hub",
+      style: g({ top: i.exportButtonTop + "px" })
+    }, [
       a("button", {
-        onClick: t[0] || (t[0] = (l) => s.isExportRequest = !s.isExportRequest),
+        onClick: t[0] || (t[0] = (o) => s.isExportRequest = !s.isExportRequest),
         innerHTML: e.icons.export,
         style: g(`background:${e.FINAL_CONFIG.style.exportMenu.backgroundColor};color:${e.FINAL_CONFIG.style.exportMenu.color}`)
       }, null, 12, oe),
@@ -905,323 +916,356 @@ function Jt(n, t, r, i, s, e) {
         t[29] || (t[29] = a("b", { class: "vue-ui-table-export-hub-title" }, " Export ", -1)),
         a("button", {
           class: "close-dropdown",
-          onClick: t[1] || (t[1] = (l) => s.isExportRequest = !1),
+          onClick: t[1] || (t[1] = (o) => s.isExportRequest = !1),
           style: g(`background:${e.FINAL_CONFIG.style.closeButtons.backgroundColor};color:${e.FINAL_CONFIG.style.closeButtons.color};border-radius:${e.FINAL_CONFIG.style.closeButtons.borderRadius}`)
         }, " ✖ ", 4),
-        a("div", ae, [
-          a("div", ie, [
-            a("div", ce, h(e.FINAL_CONFIG.translations.exportAllLabel) + " (" + h(s.bodyCopy.length) + ") ", 1),
+        a("div", ie, [
+          a("div", ce, [
+            a("div", ue, h(e.FINAL_CONFIG.translations.exportAllLabel) + " (" + h(s.bodyCopy.length) + ") ", 1),
             a("button", {
               id: "exportAll",
-              onClick: t[2] || (t[2] = (l) => e.createXls("all")),
+              onClick: t[2] || (t[2] = (o) => e.createXls("all")),
               style: g(`background:${e.FINAL_CONFIG.style.exportMenu.buttons.backgroundColor};color:${e.FINAL_CONFIG.style.exportMenu.buttons.color}`)
             }, [
               a("div", {
                 innerHTML: e.icons.fileDownload
-              }, null, 8, ue),
+              }, null, 8, he),
               a("span", null, h(e.FINAL_CONFIG.translations.exportAllButton), 1)
             ], 4)
           ]),
-          a("div", he, [
-            a("div", de, h(e.FINAL_CONFIG.translations.exportPageLabel), 1),
+          a("div", de, [
+            a("div", ge, h(e.FINAL_CONFIG.translations.exportPageLabel), 1),
             a("button", {
               id: "exportPage",
-              onClick: t[3] || (t[3] = (l) => e.createXls("page")),
+              onClick: t[3] || (t[3] = (o) => e.createXls("page")),
               style: g(`background:${e.FINAL_CONFIG.style.exportMenu.buttons.backgroundColor};color:${e.FINAL_CONFIG.style.exportMenu.buttons.color}`)
             }, [
               a("div", {
                 innerHTML: e.icons.fileDownload
-              }, null, 8, ge),
+              }, null, 8, me),
               a("span", null, h(e.FINAL_CONFIG.translations.exportPageButton), 1)
             ], 4)
           ]),
-          a("div", me, [
-            a("label", ye, [
-              v(h(e.FINAL_CONFIG.translations.filename) + " ", 1),
+          a("div", ye, [
+            a("label", be, [
+              a("span", fe, h(e.FINAL_CONFIG.translations.filename), 1),
               O(a("input", {
+                name: "filename",
                 ref: "filenameInputRef",
-                onKeydown: t[4] || (t[4] = S(L(() => {
+                onKeydown: t[4] || (t[4] = L(S(() => {
                 }, ["stop"]), ["space"])),
                 pattern: ".*",
                 class: "vue-ui-table-dialog-input",
                 type: "text",
-                "onUpdate:modelValue": t[5] || (t[5] = (l) => s.filename = l)
+                "onUpdate:modelValue": t[5] || (t[5] = (o) => s.filename = o)
               }, null, 544), [
                 [A, s.filename]
               ])
             ]),
-            a("button", {
+            s.filename ? (c(), u("button", {
+              key: 0,
               class: "vue-ui-table-dialog-field-button",
-              onClick: t[6] || (t[6] = (l) => s.filename = "")
+              onClick: t[6] || (t[6] = (o) => s.filename = "")
             }, [
               E(m, {
                 name: "close",
                 stroke: e.FINAL_CONFIG.style.exportMenu.color,
                 size: 18
               }, null, 8, ["stroke"])
-            ])
+            ])) : b("", !0)
           ])
         ])
-      ], 12, le)
-    ])) : b("", !0),
+      ], 12, ae)
+    ], 4)) : b("", !0),
     a("div", {
       class: "vue-ui-table__wrapper",
       style: g(`max-height:${e.FINAL_CONFIG.maxHeight}px`),
       ref: "tableWrapper"
     }, [
-      a("table", be, [
+      a("table", Ne, [
+        e.FINAL_CONFIG.style.title.text ? (c(), u("caption", {
+          key: 0,
+          class: "vue-ui-table__caption",
+          ref: "tableCaption",
+          style: g({
+            textAlign: e.FINAL_CONFIG.style.title.textAlign,
+            paddingLeft: e.FINAL_CONFIG.style.title.paddingLeft + "px",
+            paddingRight: e.FINAL_CONFIG.style.title.paddingRight + "px",
+            backgroundColor: e.FINAL_CONFIG.style.title.backgroundColor,
+            boxShadow: `${e.FINAL_CONFIG.style.title.backgroundColor} -1px 0px 0px 0px`
+          })
+        }, [
+          a("span", {
+            style: g({
+              fontSize: e.FINAL_CONFIG.style.title.fontSize + "px",
+              fontWeight: e.FINAL_CONFIG.style.title.bold ? "bold" : "normal",
+              color: e.FINAL_CONFIG.style.title.color
+            })
+          }, h(e.FINAL_CONFIG.style.title.text), 5),
+          e.FINAL_CONFIG.style.title.subtitle.text ? (c(), u(p, { key: 0 }, [
+            t[30] || (t[30] = a("br", null, null, -1)),
+            a("span", {
+              style: g({
+                fontSize: e.FINAL_CONFIG.style.title.subtitle.fontSize,
+                fontWeight: e.FINAL_CONFIG.style.title.subtitle.bold ? "bold" : "normal",
+                color: e.FINAL_CONFIG.style.title.subtitle.color
+              })
+            }, h(e.FINAL_CONFIG.style.title.subtitle.text), 5)
+          ], 64)) : b("", !0)
+        ], 4)) : b("", !0),
         a("thead", {
           id: "tableHead",
           class: "vue-ui-table__head",
           style: g({
             background: e.FINAL_CONFIG.style.th.backgroundColor,
-            boxShadow: `-1px 0 0 ${e.FINAL_CONFIG.style.th.backgroundColor}`
+            boxShadow: `-1px 0 0 ${e.FINAL_CONFIG.style.th.backgroundColor}`,
+            top: i.exportButtonTop - 3 + "px"
           })
         }, [
           a("tr", null, [
-            t[30] || (t[30] = a("th", { class: "invisible-cell" }, null, -1)),
-            (c(!0), u(F, null, k(s.tableHead, (l, o) => (c(), u("th", {
-              key: `thead_${o}`,
+            t[31] || (t[31] = a("th", { class: "invisible-cell" }, null, -1)),
+            (c(!0), u(p, null, k(s.tableHead, (o, l) => (c(), u("th", {
+              key: `thead_${l}`,
               style: g(`overflow: visible;background:${e.FINAL_CONFIG.style.th.backgroundColor};color:${e.FINAL_CONFIG.style.th.color};outline:${e.FINAL_CONFIG.style.th.outline}`),
-              class: N({ "th-has-nan": s.hasNaN[o] })
+              class: C({ "th-has-nan": s.hasNaN[l] })
             }, [
-              e.hasNumericTypes && ([s.constants.TEXT, s.constants.DATE].includes(l.type) || l.isPercentage) ? (c(), u("span", fe, [
-                v(h(l.name) + " ", 1),
-                l.isPercentage ? (c(), u("span", pe, " / " + h(l.percentageTo), 1)) : b("", !0)
-              ])) : (c(), u("span", Ne, h(l.name), 1))
+              e.hasNumericTypes && ([s.constants.TEXT, s.constants.DATE].includes(o.type) || o.isPercentage) ? (c(), u("span", pe, [
+                w(h(o.name) + " ", 1),
+                o.isPercentage ? (c(), u("span", Ce, " / " + h(o.percentageTo), 1)) : b("", !0)
+              ])) : (c(), u("span", Ie, h(o.name), 1))
             ], 6))), 128))
           ]),
-          e.hasNumericTypes ? (c(), u(F, { key: 0 }, [
+          e.hasNumericTypes ? (c(), u(p, { key: 0 }, [
             a("tr", null, [
-              t[31] || (t[31] = a("th", { class: "invisible-cell" }, null, -1)),
-              (c(!0), u(F, null, k(s.tableHead, (l, o) => (c(), u("th", {
-                key: `thead_${o}`,
-                class: N({ "th-numeric": !0, "th-has-nan": s.hasNaN[o] }),
+              t[32] || (t[32] = a("th", { class: "invisible-cell" }, null, -1)),
+              (c(!0), u(p, null, k(s.tableHead, (o, l) => (c(), u("th", {
+                key: `thead_${l}`,
+                class: C({ "th-numeric": !0, "th-has-nan": s.hasNaN[l] }),
                 style: g(`background:${e.FINAL_CONFIG.style.th.backgroundColor};color:${e.FINAL_CONFIG.style.th.color};outline:${e.FINAL_CONFIG.style.th.outline}`)
               }, [
-                l.sum && !s.hasNaN[o] ? (c(), u("span", Ce, [
+                o.sum && !s.hasNaN[l] ? (c(), u("span", Fe, [
                   a("span", {
                     innerHTML: e.icons.sum,
                     style: { "margin-bottom": "-4px", "margin-right": "3px" }
-                  }, null, 8, Ie),
-                  v(" " + h(e.dataLabel({
-                    p: l.prefix,
-                    v: Number(e.getSum(o)),
-                    s: l.suffix,
-                    r: l.decimals
+                  }, null, 8, ve),
+                  w(" " + h(e.dataLabel({
+                    p: o.prefix,
+                    v: Number(e.getSum(l)),
+                    s: o.suffix,
+                    r: o.decimals
                   })) + " ", 1),
-                  s.percentages[o] && l.percentageTo && !l.isPercentage ? (c(), u("span", Fe, " (" + h(isNaN(e.getSum(o) / e.getSum(s.percentages[o].referenceIndex)) ? "-" : e.dataLabel({
-                    v: e.getSum(o) / e.getSum(s.percentages[o].referenceIndex) * 100,
+                  s.percentages[l] && o.percentageTo && !o.isPercentage ? (c(), u("span", we, " (" + h(isNaN(e.getSum(l) / e.getSum(s.percentages[l].referenceIndex)) ? "-" : e.dataLabel({
+                    v: e.getSum(l) / e.getSum(s.percentages[l].referenceIndex) * 100,
                     s: "%",
-                    r: l.decimals
+                    r: o.decimals
                   })) + ") ", 1)) : b("", !0)
                 ])) : b("", !0)
               ], 6))), 128))
             ]),
             a("tr", null, [
-              t[32] || (t[32] = a("th", { class: "invisible-cell" }, null, -1)),
-              (c(!0), u(F, null, k(s.tableHead, (l, o) => (c(), u("th", {
-                key: `thead_${o}`,
-                class: N({ "th-numeric": !0, "th-has-nan": s.hasNaN[o] }),
+              t[33] || (t[33] = a("th", { class: "invisible-cell" }, null, -1)),
+              (c(!0), u(p, null, k(s.tableHead, (o, l) => (c(), u("th", {
+                key: `thead_${l}`,
+                class: C({ "th-numeric": !0, "th-has-nan": s.hasNaN[l] }),
                 style: g(`background:${e.FINAL_CONFIG.style.th.backgroundColor};color:${e.FINAL_CONFIG.style.th.color};outline:${e.FINAL_CONFIG.style.th.outline}`)
               }, [
-                l.average && !s.hasNaN[o] ? (c(), u("span", ve, " ~ " + h(isNaN(e.getAverage(o)) ? "" : e.dataLabel({
-                  p: l.prefix,
-                  v: Number(e.getAverage(o)),
-                  s: l.suffix,
-                  r: l.decimals
+                o.average && !s.hasNaN[l] ? (c(), u("span", _e, " ~ " + h(isNaN(e.getAverage(l)) ? "" : e.dataLabel({
+                  p: o.prefix,
+                  v: Number(e.getAverage(l)),
+                  s: o.suffix,
+                  r: o.decimals
                 })), 1)) : b("", !0)
               ], 6))), 128))
             ]),
             a("tr", null, [
-              t[35] || (t[35] = a("th", { class: "invisible-cell" }, null, -1)),
-              (c(!0), u(F, null, k(s.tableHead, (l, o) => (c(), u("th", {
-                key: `thead_${o}`,
-                class: N({ "th-has-nan": s.hasNaN[o] }),
+              t[36] || (t[36] = a("th", { class: "invisible-cell" }, null, -1)),
+              (c(!0), u(p, null, k(s.tableHead, (o, l) => (c(), u("th", {
+                key: `thead_${l}`,
+                class: C({ "th-has-nan": s.hasNaN[l] }),
                 style: g(`background:${e.FINAL_CONFIG.style.th.backgroundColor};color:${e.FINAL_CONFIG.style.th.color};outline:${e.FINAL_CONFIG.style.th.outline}`)
               }, [
-                a("div", we, [
-                  l.type === s.constants.DATE && s.dates[o] ? (c(), u("div", _e, [
-                    a("div", ke, [
-                      a("div", Oe, [
+                a("div", ke, [
+                  o.type === s.constants.DATE && s.dates[l] ? (c(), u("div", Oe, [
+                    a("div", Le, [
+                      a("div", Se, [
                         a("label", {
-                          for: `from_${o}`
-                        }, h(e.FINAL_CONFIG.translations.from), 9, Se),
+                          for: `from_${l}`
+                        }, h(e.FINAL_CONFIG.translations.from), 9, Ae),
                         O(a("input", {
-                          id: `from_${o}`,
+                          id: `from_${l}`,
                           type: "date",
-                          "onUpdate:modelValue": (d) => s.dates[o].from = d,
+                          "onUpdate:modelValue": (d) => s.dates[l].from = d,
                           onInput: (d) => {
-                            e.filterBody(), e.setFilterDatesIndexes(o);
+                            e.filterBody(), e.setFilterDatesIndexes(l);
                           },
                           style: g(`background:${e.FINAL_CONFIG.style.inputs.backgroundColor};color:${e.FINAL_CONFIG.style.inputs.color};border:${e.FINAL_CONFIG.style.inputs.border}`)
-                        }, null, 44, Le), [
-                          [A, s.dates[o].from]
+                        }, null, 44, Me), [
+                          [A, s.dates[l].from]
                         ])
                       ]),
-                      a("div", Ae, [
+                      a("div", Ge, [
                         a("label", {
-                          for: `to_${o}`
-                        }, h(e.FINAL_CONFIG.translations.to), 9, Me),
+                          for: `to_${l}`
+                        }, h(e.FINAL_CONFIG.translations.to), 9, xe),
                         O(a("input", {
-                          id: `to_${o}`,
+                          id: `to_${l}`,
                           type: "date",
-                          "onUpdate:modelValue": (d) => s.dates[o].to = d,
+                          "onUpdate:modelValue": (d) => s.dates[l].to = d,
                           onInput: (d) => {
-                            e.filterBody(), e.setFilterDatesIndexes(o);
+                            e.filterBody(), e.setFilterDatesIndexes(l);
                           },
                           style: g(`background:${e.FINAL_CONFIG.style.inputs.backgroundColor};color:${e.FINAL_CONFIG.style.inputs.color};border:${e.FINAL_CONFIG.style.inputs.border}`)
                         }, null, 44, De), [
-                          [A, s.dates[o].to]
+                          [A, s.dates[l].to]
                         ])
                       ])
                     ]),
-                    a("div", Ge, [
-                      l.isSort ? (c(), u("button", {
+                    a("div", Te, [
+                      o.isSort ? (c(), u("button", {
                         key: 0,
-                        onClick: (d) => e.sortTh(o, d),
-                        class: N({ "th-button-active": [s.constants.DESC, s.constants.ASC].includes(s.sorts[o]) }),
-                        style: g(`background:${[s.constants.DESC, s.constants.ASC].includes(s.sorts[o]) ? "" : e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${[s.constants.DESC, s.constants.ASC].includes(s.sorts[o]) ? "" : e.FINAL_CONFIG.style.pagination.buttons.color}`)
+                        onClick: (d) => e.sortTh(l, d),
+                        class: C({ "th-button-active": [s.constants.DESC, s.constants.ASC].includes(s.sorts[l]) }),
+                        style: g(`background:${[s.constants.DESC, s.constants.ASC].includes(s.sorts[l]) ? "" : e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${[s.constants.DESC, s.constants.ASC].includes(s.sorts[l]) ? "" : e.FINAL_CONFIG.style.pagination.buttons.color}`)
                       }, [
-                        s.sorts[o] === s.constants.ASC ? (c(), u("span", {
+                        s.sorts[l] === s.constants.ASC ? (c(), u("span", {
                           key: 0,
-                          innerHTML: [s.constants.DATE].includes(l.type) ? e.icons.sort09 : e.icons.sortAZ
-                        }, null, 8, xe)) : s.sorts[o] === s.constants.DESC ? (c(), u("span", {
+                          innerHTML: [s.constants.DATE].includes(o.type) ? e.icons.sort09 : e.icons.sortAZ
+                        }, null, 8, Pe)) : s.sorts[l] === s.constants.DESC ? (c(), u("span", {
                           key: 1,
-                          innerHTML: [s.constants.DATE].includes(l.type) ? e.icons.sort90 : e.icons.sortZA
-                        }, null, 8, Ee)) : (c(), u("span", {
+                          innerHTML: [s.constants.DATE].includes(o.type) ? e.icons.sort90 : e.icons.sortZA
+                        }, null, 8, Be)) : (c(), u("span", {
                           key: 2,
                           innerHTML: e.icons.arrowSort
-                        }, null, 8, Pe))
-                      ], 14, Te)) : b("", !0),
+                        }, null, 8, He))
+                      ], 14, Ee)) : b("", !0),
                       a("button", {
                         onClick: (d) => {
-                          e.resetDates(o), e.resetFilter(o, l, d);
+                          e.resetDates(l), e.resetFilter(l, o, d);
                         },
-                        disabled: !s.filteredDatesIndexes[o] && e.isResetDisabled(o, l),
+                        disabled: !s.filteredDatesIndexes[l] && e.isResetDisabled(l, o),
                         class: "th-reset"
-                      }, " ✖ ", 8, He)
+                      }, " ✖ ", 8, Re)
                     ])
                   ])) : b("", !0),
-                  l.isSearch ? O((c(), u("input", {
+                  o.isSearch ? O((c(), u("input", {
                     key: 1,
                     placeholder: e.FINAL_CONFIG.translations.inputPlaceholder,
-                    "onUpdate:modelValue": (d) => s.searches[o] = d,
+                    "onUpdate:modelValue": (d) => s.searches[l] = d,
                     onInput: t[7] || (t[7] = (d) => e.debounce(e.filterBody, 400)),
-                    name: `search_${o}`,
+                    name: `search_${l}`,
                     style: g(`background:${e.FINAL_CONFIG.style.inputs.backgroundColor};color:${e.FINAL_CONFIG.style.inputs.color};border:${e.FINAL_CONFIG.style.inputs.border}`)
-                  }, null, 44, Be)), [
-                    [A, s.searches[o]]
+                  }, null, 44, ze)), [
+                    [A, s.searches[l]]
                   ]) : b("", !0),
-                  !s.hasNaN[o] && l.isSort && l.type !== s.constants.DATE ? (c(), u("button", {
+                  !s.hasNaN[l] && o.isSort && o.type !== s.constants.DATE ? (c(), u("button", {
                     key: 2,
-                    onClick: (d) => e.sortTh(o, d),
-                    class: N({ "th-button-active": [s.constants.DESC, s.constants.ASC].includes(s.sorts[o]) }),
-                    style: g(`background:${[s.constants.DESC, s.constants.ASC].includes(s.sorts[o]) ? "" : e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${[s.constants.DESC, s.constants.ASC].includes(s.sorts[o]) ? "" : e.FINAL_CONFIG.style.pagination.buttons.color}`)
+                    onClick: (d) => e.sortTh(l, d),
+                    class: C({ "th-button-active": [s.constants.DESC, s.constants.ASC].includes(s.sorts[l]) }),
+                    style: g(`background:${[s.constants.DESC, s.constants.ASC].includes(s.sorts[l]) ? "" : e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${[s.constants.DESC, s.constants.ASC].includes(s.sorts[l]) ? "" : e.FINAL_CONFIG.style.pagination.buttons.color}`)
                   }, [
-                    s.sorts[o] === s.constants.ASC ? (c(), u("span", {
+                    s.sorts[l] === s.constants.ASC ? (c(), u("span", {
                       key: 0,
-                      innerHTML: [s.constants.NUMERIC].includes(l.type) ? e.icons.sort09 : e.icons.sortZA
-                    }, null, 8, ze)) : s.sorts[o] === s.constants.DESC ? (c(), u("span", {
+                      innerHTML: [s.constants.NUMERIC].includes(o.type) ? e.icons.sort09 : e.icons.sortZA
+                    }, null, 8, Ve)) : s.sorts[l] === s.constants.DESC ? (c(), u("span", {
                       key: 1,
-                      innerHTML: [s.constants.NUMERIC].includes(l.type) ? e.icons.sort90 : e.icons.sortAZ
-                    }, null, 8, Ue)) : (c(), u("span", {
+                      innerHTML: [s.constants.NUMERIC].includes(o.type) ? e.icons.sort90 : e.icons.sortAZ
+                    }, null, 8, Xe)) : (c(), u("span", {
                       key: 2,
                       innerHTML: e.icons.arrowSort
-                    }, null, 8, Ve))
-                  ], 14, Re)) : b("", !0),
-                  l.isMultiselect ? (c(), u("button", {
+                    }, null, 8, je))
+                  ], 14, Ue)) : b("", !0),
+                  o.isMultiselect ? (c(), u("button", {
                     key: 3,
-                    onClick: (d) => e.toggleMultiselect(o, l, d),
+                    onClick: (d) => e.toggleMultiselect(l, o, d),
                     innerHTML: e.icons.filter,
-                    class: N({ "th-button-active": s.multiselects[o] && s.multiselects[o].length !== e.getDropdownOptions(o).length }),
-                    style: g(`background:${s.multiselects[o] && s.multiselects[o].length !== e.getDropdownOptions(o).length ? "" : e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${s.multiselects[o] && s.multiselects[o].length !== e.getDropdownOptions(o).length ? "" : e.FINAL_CONFIG.style.pagination.buttons.color}`)
-                  }, null, 14, Xe)) : b("", !0),
-                  s.currentSelectionSpan.col === o && e.canChart ? (c(), u("button", {
+                    class: C({ "th-button-active": s.multiselects[l] && s.multiselects[l].length !== e.getDropdownOptions(l).length }),
+                    style: g(`background:${s.multiselects[l] && s.multiselects[l].length !== e.getDropdownOptions(l).length ? "" : e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${s.multiselects[l] && s.multiselects[l].length !== e.getDropdownOptions(l).length ? "" : e.FINAL_CONFIG.style.pagination.buttons.color}`)
+                  }, null, 14, Ye)) : b("", !0),
+                  s.currentSelectionSpan.col === l && e.canChart ? (c(), u("button", {
                     key: 4,
                     onClick: t[8] || (t[8] = (d) => s.showChart = !s.showChart),
                     innerHTML: e.icons.chart,
-                    class: N({ "th-button-active": s.showChart }),
+                    class: C({ "th-button-active": s.showChart }),
                     style: g(`background:${s.showChart ? "" : e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${s.showChart ? "" : e.FINAL_CONFIG.style.pagination.buttons.color}`)
-                  }, null, 14, je)) : b("", !0),
-                  l.rangeFilter && s.rangeFilters[o] && !s.hasNaN[o] ? (c(), u("div", Ye, [
+                  }, null, 14, We)) : b("", !0),
+                  o.rangeFilter && s.rangeFilters[l] && !s.hasNaN[l] ? (c(), u("div", Je, [
                     a("label", {
-                      for: `rangeMin${o}`
-                    }, [...t[33] || (t[33] = [
+                      for: `rangeMin${l}`
+                    }, [...t[34] || (t[34] = [
                       a("span", { style: { color: "grey" } }, "ᒥ", -1),
-                      v(" min ", -1),
+                      w(" min ", -1),
                       a("span", { style: { color: "grey" } }, "ᒣ", -1)
-                    ])], 8, We),
+                    ])], 8, Ke),
                     O(a("input", {
                       type: "number",
-                      id: `rangeMin${o}`,
-                      max: s.immutableRangeFilters[o].max,
-                      min: s.immutableRangeFilters[o].min,
-                      "onUpdate:modelValue": (d) => s.rangeFilters[o].min = d,
+                      id: `rangeMin${l}`,
+                      max: s.immutableRangeFilters[l].max,
+                      min: s.immutableRangeFilters[l].min,
+                      "onUpdate:modelValue": (d) => s.rangeFilters[l].min = d,
                       onInput: t[9] || (t[9] = (d) => e.debounce(e.filterBody, 400)),
                       style: g(`background:${e.FINAL_CONFIG.style.inputs.backgroundColor};color:${e.FINAL_CONFIG.style.inputs.color};border:${e.FINAL_CONFIG.style.inputs.border}`)
-                    }, null, 44, Je), [
+                    }, null, 44, Ze), [
                       [
                         A,
-                        s.rangeFilters[o].min,
+                        s.rangeFilters[l].min,
                         void 0,
                         { number: !0 }
                       ]
                     ]),
                     O(a("input", {
                       type: "number",
-                      id: `rangeMax${o}`,
-                      max: s.immutableRangeFilters[o].max,
-                      min: s.immutableRangeFilters[o].min,
-                      "onUpdate:modelValue": (d) => s.rangeFilters[o].max = d,
+                      id: `rangeMax${l}`,
+                      max: s.immutableRangeFilters[l].max,
+                      min: s.immutableRangeFilters[l].min,
+                      "onUpdate:modelValue": (d) => s.rangeFilters[l].max = d,
                       onInput: t[10] || (t[10] = (d) => e.debounce(e.filterBody, 400)),
                       style: g(`background:${e.FINAL_CONFIG.style.inputs.backgroundColor};color:${e.FINAL_CONFIG.style.inputs.color};border:${e.FINAL_CONFIG.style.inputs.border}`)
-                    }, null, 44, Ke), [
+                    }, null, 44, qe), [
                       [
                         A,
-                        s.rangeFilters[o].max,
+                        s.rangeFilters[l].max,
                         void 0,
                         { number: !0 }
                       ]
                     ]),
                     a("label", {
-                      for: `rangeMax${o}`
-                    }, [...t[34] || (t[34] = [
+                      for: `rangeMax${l}`
+                    }, [...t[35] || (t[35] = [
                       a("span", { style: { color: "grey" } }, "ᒪ", -1),
-                      v(" max ", -1),
+                      w(" max ", -1),
                       a("span", { style: { color: "grey" } }, "ᒧ", -1)
-                    ])], 8, Ze)
+                    ])], 8, Qe)
                   ])) : b("", !0),
-                  e.canResetColumn(o, l) ? (c(), u("button", {
+                  e.canResetColumn(l, o) ? (c(), u("button", {
                     key: 6,
-                    onClick: (d) => e.resetFilter(o, l, d),
-                    disabled: e.isResetDisabled(o, l),
+                    onClick: (d) => e.resetFilter(l, o, d),
+                    disabled: e.isResetDisabled(l, o),
                     class: "th-reset"
-                  }, " ✖ ", 8, qe)) : b("", !0),
-                  l.isMultiselect ? (c(), u("div", {
+                  }, " ✖ ", 8, $e)) : b("", !0),
+                  o.isMultiselect ? (c(), u("div", {
                     key: 7,
                     class: "th-dropdown",
                     "data-is-open": "false",
-                    id: `th_dropdown_${o}`,
+                    id: `th_dropdown_${l}`,
                     style: g(`background:${e.FINAL_CONFIG.style.dropdowns.backgroundColor};color:${e.FINAL_CONFIG.style.dropdowns.color}`)
                   }, [
                     a("button", {
                       class: "close-dropdown",
-                      onClick: (d) => e.toggleMultiselect(o, l, d),
+                      onClick: (d) => e.toggleMultiselect(l, o, d),
                       style: g(`background:${e.FINAL_CONFIG.style.closeButtons.backgroundColor};color:${e.FINAL_CONFIG.style.closeButtons.color}`)
-                    }, " ✖ ", 12, $e),
-                    (c(!0), u(F, null, k(e.getDropdownOptions(o), (d, y) => (c(), u("span", {
+                    }, " ✖ ", 12, tt),
+                    (c(!0), u(p, null, k(e.getDropdownOptions(l), (d, y) => (c(), u("span", {
                       class: "th-option",
-                      key: `th_option_${o}_${y}`,
-                      onClick: (C) => e.selectDropdownOption(d, o),
+                      key: `th_option_${l}_${y}`,
+                      onClick: (I) => e.selectDropdownOption(d, l),
                       onKeyup: [
-                        S((C) => e.selectDropdownOption(d, o), ["enter"]),
-                        S((C) => e.selectDropdownOption(d, o), ["space"])
+                        L((I) => e.selectDropdownOption(d, l), ["enter"]),
+                        L((I) => e.selectDropdownOption(d, l), ["space"])
                       ],
-                      style: g(`opacity:${e.isDropdownOptionSelected(d, o) ? 1 : 0.5}`),
+                      style: g(`opacity:${e.isDropdownOptionSelected(d, l) ? 1 : 0.5}`),
                       tabindex: "0"
                     }, [
-                      e.isDropdownOptionSelected(d, o) ? (c(), u("span", {
+                      e.isDropdownOptionSelected(d, l) ? (c(), u("span", {
                         key: 0,
                         style: g(`color:${e.FINAL_CONFIG.style.dropdowns.icons.selected.color};margin-right:5px`),
                         class: "th-icon-green"
@@ -1231,87 +1275,87 @@ function Jt(n, t, r, i, s, e) {
                         class: "th-icon-red"
                       }, h(e.FINAL_CONFIG.style.dropdowns.icons.unselected.unicode), 5)),
                       a("span", null, h(d), 1)
-                    ], 44, et))), 128))
-                  ], 12, Qe)) : b("", !0)
+                    ], 44, st))), 128))
+                  ], 12, et)) : b("", !0)
                 ])
               ], 6))), 128))
             ])
           ], 64)) : b("", !0),
           a("tr", null, [
-            t[36] || (t[36] = a("th", { class: "invisible-cell" }, null, -1)),
-            (c(!0), u(F, null, k(s.tableHead, (l, o) => (c(), u("th", {
-              key: `col_selector_${o}`,
-              class: N({ "vue-ui-table-col-selector": !s.hasNaN[o], "th-has-nan": s.hasNaN[o] }),
-              style: g(`background:${o === s.selectedColumn && !s.hasNaN[o] ? e.FINAL_CONFIG.style.th.selected.backgroundColor : e.FINAL_CONFIG.style.th.backgroundColor};color:${o === s.selectedColumn && !s.hasNaN[o] ? e.FINAL_CONFIG.style.th.selected.color : e.FINAL_CONFIG.style.th.color};outline:${e.FINAL_CONFIG.style.th.outline}`)
+            t[37] || (t[37] = a("th", { class: "invisible-cell" }, null, -1)),
+            (c(!0), u(p, null, k(s.tableHead, (o, l) => (c(), u("th", {
+              key: `col_selector_${l}`,
+              class: C({ "vue-ui-table-col-selector": !s.hasNaN[l], "th-has-nan": s.hasNaN[l] }),
+              style: g(`background:${l === s.selectedColumn && !s.hasNaN[l] ? e.FINAL_CONFIG.style.th.selected.backgroundColor : e.FINAL_CONFIG.style.th.backgroundColor};color:${l === s.selectedColumn && !s.hasNaN[l] ? e.FINAL_CONFIG.style.th.selected.color : e.FINAL_CONFIG.style.th.color};outline:${e.FINAL_CONFIG.style.th.outline}`)
             }, [
-              s.hasNaN[o] ? b("", !0) : (c(), u("div", {
+              s.hasNaN[l] ? b("", !0) : (c(), u("div", {
                 key: 0,
-                innerHTML: s.tableHead[o].type === s.constants.NUMERIC ? e.icons.chevronDown : "",
-                class: N({ "col-selector": s.tableHead[o].type === s.constants.NUMERIC }),
+                innerHTML: s.tableHead[l].type === s.constants.NUMERIC ? e.icons.chevronDown : "",
+                class: C({ "col-selector": s.tableHead[l].type === s.constants.NUMERIC }),
                 tabindex: "0",
-                onClick: L((d) => e.selectColumn(o), ["stop"]),
-                onKeyup: S((d) => e.selectColumn(o), ["enter"])
-              }, null, 42, tt))
+                onClick: S((d) => e.selectColumn(l), ["stop"]),
+                onKeyup: L((d) => e.selectColumn(l), ["enter"])
+              }, null, 42, nt))
             ], 6))), 128))
           ])
         ], 4),
         a("tbody", {
-          onClick: t[11] || (t[11] = (...l) => e.closeAllDropdowns && e.closeAllDropdowns(...l)),
-          onKeydown: t[12] || (t[12] = (l) => e.navigateCell(l))
+          onClick: t[11] || (t[11] = (...o) => e.closeAllDropdowns && e.closeAllDropdowns(...o)),
+          onKeydown: t[12] || (t[12] = (o) => e.navigateCell(o))
         }, [
-          (c(!0), u(F, null, k(e.visibleRows, (l, o) => (c(), u("tr", {
-            key: `tbody_${o}`,
-            "data-row": o % 2 === 0 ? "odd" : "even",
-            class: N(`tr_${s.uid}`),
-            style: g(`${o % 2 === 0 ? `background:${e.FINAL_CONFIG.style.rows.odd.backgroundColor};color:${e.FINAL_CONFIG.style.rows.odd.color}` : `background:${e.FINAL_CONFIG.style.rows.even.backgroundColor};color:${e.FINAL_CONFIG.style.rows.even.color}`}`)
+          (c(!0), u(p, null, k(e.visibleRows, (o, l) => (c(), u("tr", {
+            key: `tbody_${l}`,
+            "data-row": l % 2 === 0 ? "odd" : "even",
+            class: C(`tr_${s.uid}`),
+            style: g(`${l % 2 === 0 ? `background:${e.FINAL_CONFIG.style.rows.odd.backgroundColor};color:${e.FINAL_CONFIG.style.rows.odd.color}` : `background:${e.FINAL_CONFIG.style.rows.even.backgroundColor};color:${e.FINAL_CONFIG.style.rows.even.color}`}`)
           }, [
             a("td", {
               class: "vue-ui-table-td-iteration",
-              "data-row": o % 2 === 0 ? "odd" : "even"
-            }, h(l.absoluteIndex + 1), 9, nt),
-            (c(!0), u(F, null, k(l.td, (d, y) => (c(), u("td", {
-              "data-row": o % 2 === 0 ? "odd" : "even",
-              key: `td_${o}_${y}`,
+              "data-row": l % 2 === 0 ? "odd" : "even"
+            }, h(o.absoluteIndex + 1), 9, lt),
+            (c(!0), u(p, null, k(o.td, (d, y) => (c(), u("td", {
+              "data-row": l % 2 === 0 ? "odd" : "even",
+              key: `td_${l}_${y}`,
               style: g(e.isNumeric(d) || r.dataset.header[y].type === s.constants.DATE ? "text-align:right;font-variant-numeric: tabular-nums;" : ""),
-              onClick: (C) => e.selectTd({
+              onClick: (I) => e.selectTd({
                 td: d,
-                rowIndex: o,
+                rowIndex: l,
                 colIndex: y,
                 headerType: r.dataset.header[y].type,
-                event: C
+                event: I
               }),
               onKeyup: [
-                S((C) => e.selectTd({
+                L((I) => e.selectTd({
                   td: d,
-                  rowIndex: o,
+                  rowIndex: l,
                   colIndex: y,
                   headerType: r.dataset.header[y].type,
-                  event: C
+                  event: I
                 }), ["enter"]),
-                S((C) => e.selectTd({
+                L((I) => e.selectTd({
                   td: d,
-                  rowIndex: o,
+                  rowIndex: l,
                   colIndex: y,
                   headerType: r.dataset.header[y].type,
-                  event: C
+                  event: I
                 }), ["space"])
               ],
-              class: N({ "td-numeric": r.dataset.header[y].type === s.constants.NUMERIC, "td-focusable": !0, "td-has-nan": s.hasNaN[y] }),
-              id: `cell_${o}_${y}_${s.uid}`,
+              class: C({ "td-numeric": r.dataset.header[y].type === s.constants.NUMERIC, "td-focusable": !0, "td-has-nan": s.hasNaN[y] }),
+              id: `cell_${l}_${y}_${s.uid}`,
               tabindex: "0"
             }, [
-              l.meta && l.meta.markerIndices.includes(y) && l.meta.unicodeIcon ? (c(), u("span", {
+              o.meta && o.meta.markerIndices.includes(y) && o.meta.unicodeIcon ? (c(), u("span", {
                 key: 0,
-                style: g(`color:${l.meta.color};margin-right:3px`),
-                innerHTML: l.meta.unicodeIcon
-              }, null, 12, ot)) : b("", !0),
-              r.dataset.header[y].type === s.constants.DATE ? (c(), u("span", lt, h(r.dataset.header[y].prefix) + " " + h(new Date(d).toLocaleString().slice(0, 10)) + " " + h(r.dataset.header[y].suffix), 1)) : r.dataset.header[y].isPercentage ? (c(), u("span", at, h(e.dataLabel({
+                style: g(`color:${o.meta.color};margin-right:3px`),
+                innerHTML: o.meta.unicodeIcon
+              }, null, 12, at)) : b("", !0),
+              r.dataset.header[y].type === s.constants.DATE ? (c(), u("span", it, h(r.dataset.header[y].prefix) + " " + h(new Date(d).toLocaleString().slice(0, 10)) + " " + h(r.dataset.header[y].suffix), 1)) : r.dataset.header[y].isPercentage ? (c(), u("span", ct, h(e.dataLabel({
                 v: Number(d * 100),
                 s: "%",
                 r: r.dataset.header[y].decimals
               })), 1)) : s.percentages[y] && r.dataset.header[y].percentageTo && !r.dataset.header[y].isPercentage ? (c(), u("span", {
                 key: 3,
-                class: N({ "td-nan": isNaN(Number(d)) })
+                class: C({ "td-nan": isNaN(Number(d)) })
               }, h(isNaN(Number(d)) ? `${d} is not ${s.constants.NUMERIC}` : e.dataLabel({
                 p: r.dataset.header[y].prefix,
                 v: Number(d),
@@ -1323,69 +1367,69 @@ function Jt(n, t, r, i, s, e) {
                 r: r.dataset.header[y].decimals
               })) + ") ", 3)) : r.dataset.header[y].type === s.constants.NUMERIC ? (c(), u("span", {
                 key: 4,
-                class: N({ "td-nan": isNaN(Number(d)) })
+                class: C({ "td-nan": isNaN(Number(d)) })
               }, h(isNaN(Number(d)) ? `${d} is not ${s.constants.NUMERIC}` : e.dataLabel({
                 p: r.dataset.header[y].prefix,
                 v: Number(d.toFixed(r.dataset.header[y].decimals)),
                 s: r.dataset.header[y].suffix,
                 r: r.dataset.header[y].decimals
-              })), 3)) : (c(), u("span", it, h(r.dataset.header[y].prefix) + " " + h(d) + " " + h(r.dataset.header[y].suffix), 1))
-            ], 46, rt))), 128))
-          ], 14, st))), 128))
+              })), 3)) : (c(), u("span", ut, h(r.dataset.header[y].prefix) + " " + h(d) + " " + h(r.dataset.header[y].suffix), 1))
+            ], 46, ot))), 128))
+          ], 14, rt))), 128))
         ], 32)
       ])
     ], 4),
     a("div", {
-      class: N({ "td-selector-info": !0, "td-selector-info--active": s.currentSelectionSpan.col !== void 0 && s.currentSelectionSpan.rows.length }),
+      class: C({ "td-selector-info": !0, "td-selector-info--active": s.currentSelectionSpan.col !== void 0 && s.currentSelectionSpan.rows.length }),
       style: g(`background:${e.FINAL_CONFIG.style.infoBar.backgroundColor};color:${e.FINAL_CONFIG.style.infoBar.color}`)
     }, [
-      s.currentSelectionSpan.col !== void 0 && s.currentSelectionSpan.rows.length ? (c(), u(F, { key: 0 }, [
+      s.currentSelectionSpan.col !== void 0 && s.currentSelectionSpan.rows.length ? (c(), u(p, { key: 0 }, [
         a("div", {
           innerHTML: e.icons.table,
           class: "td-selector-icon"
-        }, null, 8, ct),
+        }, null, 8, ht),
         a("span", null, [
           a("b", null, [
-            v(h(r.dataset.header[s.currentSelectionSpan.col].name) + " ", 1),
-            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("span", ut, " / " + h(r.dataset.header[s.percentages[s.currentSelectionSpan.col].referenceIndex].name), 1)) : b("", !0)
-          ]),
-          a("span", ht, [
-            v(h(e.FINAL_CONFIG.translations.nb) + " : ", 1),
-            a("b", dt, h(s.currentSelectionSpan.rows.length), 1)
+            w(h(r.dataset.header[s.currentSelectionSpan.col].name) + " ", 1),
+            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("span", dt, " / " + h(r.dataset.header[s.percentages[s.currentSelectionSpan.col].referenceIndex].name), 1)) : b("", !0)
           ]),
           a("span", gt, [
-            v(h(e.FINAL_CONFIG.translations.sum) + " : ", 1),
-            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("b", mt, h(e.selectedCellsCalculations.sumPercentage), 1)) : (c(), u("b", yt, h(r.dataset.header[s.currentSelectionSpan.col].prefix) + " " + h(e.selectedCellsCalculations.sumRegular) + " " + h(r.dataset.header[s.currentSelectionSpan.col].suffix), 1)),
-            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("b", bt, "%")) : b("", !0)
+            w(h(e.FINAL_CONFIG.translations.nb) + " : ", 1),
+            a("b", mt, h(s.currentSelectionSpan.rows.length), 1)
+          ]),
+          a("span", yt, [
+            w(h(e.FINAL_CONFIG.translations.sum) + " : ", 1),
+            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("b", bt, h(e.selectedCellsCalculations.sumPercentage), 1)) : (c(), u("b", ft, h(r.dataset.header[s.currentSelectionSpan.col].prefix) + " " + h(e.selectedCellsCalculations.sumRegular) + " " + h(r.dataset.header[s.currentSelectionSpan.col].suffix), 1)),
+            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("b", Nt, "%")) : b("", !0)
           ]),
-          a("span", ft, [
-            v(h(e.FINAL_CONFIG.translations.average) + " : ", 1),
-            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("b", pt, h(e.selectedCellsCalculations.averagePercentage), 1)) : (c(), u("b", Nt, h(r.dataset.header[s.currentSelectionSpan.col].prefix) + " " + h(e.selectedCellsCalculations.averageRegular) + " " + h(r.dataset.header[s.currentSelectionSpan.col].suffix), 1)),
-            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("b", Ct, "%")) : b("", !0)
+          a("span", pt, [
+            w(h(e.FINAL_CONFIG.translations.average) + " : ", 1),
+            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("b", Ct, h(e.selectedCellsCalculations.averagePercentage), 1)) : (c(), u("b", It, h(r.dataset.header[s.currentSelectionSpan.col].prefix) + " " + h(e.selectedCellsCalculations.averageRegular) + " " + h(r.dataset.header[s.currentSelectionSpan.col].suffix), 1)),
+            r.dataset.header[s.currentSelectionSpan.col].isPercentage ? (c(), u("b", Ft, "%")) : b("", !0)
           ])
         ]),
         a("button", {
-          onClick: t[13] || (t[13] = (...l) => e.resetSelection && e.resetSelection(...l)),
+          onClick: t[13] || (t[13] = (...o) => e.resetSelection && e.resetSelection(...o)),
           class: "td-selector-info-reset",
           style: g(`background:${e.FINAL_CONFIG.style.closeButtons.backgroundColor};color:${e.FINAL_CONFIG.style.closeButtons.color};border-radius:${e.FINAL_CONFIG.style.closeButtons.borderRadius}`)
         }, " ✖ ", 4)
       ], 64)) : b("", !0)
     ], 6),
-    s.bodyCopy.length > 10 ? (c(), u("div", It, [
-      v(h(e.FINAL_CONFIG.translations.totalRows) + " : " + h(r.dataset.body.length) + " | " + h(e.FINAL_CONFIG.translations.paginatorLabel) + " : ", 1),
+    s.bodyCopy.length > 10 ? (c(), u("div", vt, [
+      w(h(e.FINAL_CONFIG.translations.totalRows) + " : " + h(r.dataset.body.length) + " | " + h(e.FINAL_CONFIG.translations.paginatorLabel) + " : ", 1),
       s.bodyCopy.length > 10 ? O((c(), u("select", {
         key: 0,
         id: "paginatorSelector",
-        "onUpdate:modelValue": t[14] || (t[14] = (l) => s.itemsPerPage = l),
-        onChange: t[15] || (t[15] = (l) => {
+        "onUpdate:modelValue": t[14] || (t[14] = (o) => s.itemsPerPage = o),
+        onChange: t[15] || (t[15] = (o) => {
           e.resetSelection(), e.onPageChange();
         }),
         style: g(`background:${e.FINAL_CONFIG.style.inputs.backgroundColor};color:${e.FINAL_CONFIG.style.inputs.color};border:${e.FINAL_CONFIG.style.inputs.border}`)
       }, [
-        (c(!0), u(F, null, k(s.paginatorOptions, (l, o) => (c(), u(F, null, [
-          s.bodyCopy.length > l || r.dataset.body.length === l ? (c(), u("option", {
-            key: `paginator_option_${o}`
-          }, h(l), 1)) : b("", !0)
+        (c(!0), u(p, null, k(s.paginatorOptions, (o, l) => (c(), u(p, null, [
+          s.bodyCopy.length > o || r.dataset.body.length === o ? (c(), u("option", {
+            key: `paginator_option_${l}`
+          }, h(o), 1)) : b("", !0)
         ], 64))), 256))
       ], 36)), [
         [
@@ -1396,34 +1440,34 @@ function Jt(n, t, r, i, s, e) {
         ]
       ]) : b("", !0)
     ])) : b("", !0),
-    s.itemsPerPage >= 250 ? (c(), u("div", Ft, [
+    s.itemsPerPage >= 250 ? (c(), u("div", wt, [
       a("span", {
         innerHTML: e.icons.warning
-      }, null, 8, vt),
-      v(h(e.FINAL_CONFIG.translations.sizeWarning), 1)
+      }, null, 8, _t),
+      w(h(e.FINAL_CONFIG.translations.sizeWarning), 1)
     ])) : b("", !0),
     e.pages.length > 1 && e.pages.length <= 10 ? (c(), u("div", {
       key: 3,
       class: "vue-ui-table-navigation-indicator",
       style: g(`background:${e.FINAL_CONFIG.style.pagination.navigationIndicator.backgroundColor};width:calc(${s.currentPage / (e.pages.length - 1) * 100}%)`)
     }, null, 4)) : b("", !0),
-    e.pages.length > 1 ? (c(), u("div", wt, [
+    e.pages.length > 1 ? (c(), u("div", kt, [
       a("button", {
         class: "vue-ui-table-navigation",
-        onClick: t[16] || (t[16] = L((l) => e.navigate("previous"), ["stop"])),
+        onClick: t[16] || (t[16] = S((o) => e.navigate("previous"), ["stop"])),
         innerHTML: e.icons.chevronLeft,
         disabled: s.currentPage === 0,
         style: g(`background:${e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${e.FINAL_CONFIG.style.pagination.buttons.color};opacity:${s.currentPage === 0 ? e.FINAL_CONFIG.style.pagination.buttons.opacityDisabled : 1}`)
-      }, null, 12, _t),
-      e.pages.length > 3 ? (c(), u(F, { key: 0 }, [
+      }, null, 12, Ot),
+      e.pages.length > 3 ? (c(), u(p, { key: 0 }, [
         a("button", {
           class: "vue-ui-table-navigation",
-          onClick: t[17] || (t[17] = L((l) => e.navigate(1), ["stop"])),
+          onClick: t[17] || (t[17] = S((o) => e.navigate(1), ["stop"])),
           disabled: s.currentPage === 0,
           style: g(`background:${e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${e.FINAL_CONFIG.style.pagination.buttons.color};opacity:${s.currentPage === 0 ? e.FINAL_CONFIG.style.pagination.buttons.opacityDisabled : 1}`)
-        }, " 1 ", 12, kt),
-        e.pages.length > 10 ? (c(), u("div", Ot, [
-          a("label", St, h(e.FINAL_CONFIG.translations.page) + " " + h(s.currentPage + 1) + " / " + h(e.pages.length), 1),
+        }, " 1 ", 12, Lt),
+        e.pages.length > 10 ? (c(), u("div", St, [
+          a("label", At, h(e.FINAL_CONFIG.translations.page) + " " + h(s.currentPage + 1) + " / " + h(e.pages.length), 1),
           a("input", {
             class: "vue-ui-table-page-scroller",
             id: "pageScroller",
@@ -1431,23 +1475,23 @@ function Jt(n, t, r, i, s, e) {
             step: "1",
             min: 0,
             max: e.pages.length - 1,
-            onInput: t[18] || (t[18] = (l) => e.updateCurrentPage(l)),
+            onInput: t[18] || (t[18] = (o) => e.updateCurrentPage(o)),
             value: s.currentPage,
             style: g(`background:${e.FINAL_CONFIG.style.inputs.backgroundColor};color:${e.FINAL_CONFIG.style.inputs.color};border:${e.FINAL_CONFIG.style.inputs.border};accent-color:${e.FINAL_CONFIG.style.inputs.accentColor}`)
-          }, null, 44, Lt)
-        ])) : (c(), u("span", At, h(e.FINAL_CONFIG.translations.page) + " " + h(s.currentPage + 1) + " / " + h(e.pages.length), 1)),
+          }, null, 44, Mt)
+        ])) : (c(), u("span", Gt, h(e.FINAL_CONFIG.translations.page) + " " + h(s.currentPage + 1) + " / " + h(e.pages.length), 1)),
         a("button", {
           class: "vue-ui-table-navigation",
-          onClick: t[19] || (t[19] = L((l) => e.navigate(e.pages.length), ["stop"])),
+          onClick: t[19] || (t[19] = S((o) => e.navigate(e.pages.length), ["stop"])),
           disabled: s.currentPage === e.pages.length - 1,
           style: g(`background:${e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${e.FINAL_CONFIG.style.pagination.buttons.color};opacity:${s.currentPage === e.pages.length - 1 ? e.FINAL_CONFIG.style.pagination.buttons.opacityDisabled : 1}`)
-        }, h(e.pages.length), 13, Mt)
-      ], 64)) : (c(), u(F, { key: 1 }, [
-        v(h(e.FINAL_CONFIG.translations.page) + " " + h(s.currentPage + 1) + " / " + h(e.pages.length), 1)
+        }, h(e.pages.length), 13, xt)
+      ], 64)) : (c(), u(p, { key: 1 }, [
+        w(h(e.FINAL_CONFIG.translations.page) + " " + h(s.currentPage + 1) + " / " + h(e.pages.length), 1)
       ], 64)),
       a("button", {
         class: "vue-ui-table-navigation",
-        onClick: t[20] || (t[20] = L((l) => e.navigate("next"), ["stop"])),
+        onClick: t[20] || (t[20] = S((o) => e.navigate("next"), ["stop"])),
         innerHTML: e.icons.chevronRight,
         disabled: s.currentPage === e.pages.length - 1,
         style: g(`background:${e.FINAL_CONFIG.style.pagination.buttons.backgroundColor};color:${e.FINAL_CONFIG.style.pagination.buttons.color};opacity:${s.currentPage === e.pages.length - 1 ? e.FINAL_CONFIG.style.pagination.buttons.opacityDisabled : 1}`)
@@ -1460,103 +1504,103 @@ function Jt(n, t, r, i, s, e) {
     }, [
       a("div", {
         class: "modal-drag-handle",
-        onMousedown: t[22] || (t[22] = (...l) => e.dragMouseDown && e.dragMouseDown(...l))
+        onMousedown: t[22] || (t[22] = (...o) => e.dragMouseDown && e.dragMouseDown(...o))
       }, [
         a("span", {
           innerHTML: e.icons.grip
-        }, null, 8, Gt),
+        }, null, 8, Tt),
         a("button", {
           class: "close-chart-modal",
-          onClick: t[21] || (t[21] = (l) => s.showChart = !1)
+          onClick: t[21] || (t[21] = (o) => s.showChart = !1)
         }, "✖")
       ], 32),
       a("button", {
         style: g([{ "z-index": "1" }, `background:${e.FINAL_CONFIG.style.closeButtons.backgroundColor};color:${e.FINAL_CONFIG.style.closeButtons.color};border-radius:${e.FINAL_CONFIG.style.closeButtons.borderRadius}`]),
         class: "close-chart-modal",
-        onClick: t[23] || (t[23] = (l) => s.showChart = !1)
+        onClick: t[23] || (t[23] = (o) => s.showChart = !1)
       }, " ✖ ", 4),
-      a("div", Tt, [
+      a("div", Et, [
         e.availableDonutCategories.length ? (c(), u("button", {
           key: 0,
-          onClick: t[24] || (t[24] = (l) => s.showDonutOptions = !0),
+          onClick: t[24] || (t[24] = (o) => s.showDonutOptions = !0),
           innerHTML: e.icons.donut,
-          class: N({ "is-active-chart": s.chart.type === s.constants.DONUT || s.showDonutOptions }),
+          class: C({ "is-active-chart": s.chart.type === s.constants.DONUT || s.showDonutOptions }),
           style: g(`background:${s.chart.type === s.constants.DONUT || s.showDonutOptions ? e.FINAL_CONFIG.style.chart.modal.buttons.selected.backgroundColor : e.FINAL_CONFIG.style.chart.modal.buttons.unselected.backgroundColor};color:${s.chart.type === s.constants.DONUT || s.showDonutOptions ? e.FINAL_CONFIG.style.chart.modal.buttons.selected.color : e.FINAL_CONFIG.style.chart.modal.buttons.unselected.color}`)
-        }, null, 14, xt)) : b("", !0),
+        }, null, 14, Pt)) : b("", !0),
         a("button", {
-          onClick: t[25] || (t[25] = (l) => {
+          onClick: t[25] || (t[25] = (o) => {
             s.chart.type = s.constants.LINE, s.showDonutOptions = !1;
           }),
           innerHTML: e.icons.chart,
-          class: N({ "is-active-chart": s.chart.type === s.constants.LINE && !s.showDonutOptions }),
+          class: C({ "is-active-chart": s.chart.type === s.constants.LINE && !s.showDonutOptions }),
           style: g(`background:${s.chart.type === s.constants.LINE && !s.showDonutOptions ? e.FINAL_CONFIG.style.chart.modal.buttons.selected.backgroundColor : e.FINAL_CONFIG.style.chart.modal.buttons.unselected.backgroundColor};color:${s.chart.type === s.constants.LINE && !s.showDonutOptions ? e.FINAL_CONFIG.style.chart.modal.buttons.selected.color : e.FINAL_CONFIG.style.chart.modal.buttons.unselected.color}`)
-        }, null, 14, Et),
+        }, null, 14, Bt),
         a("button", {
-          onClick: t[26] || (t[26] = (l) => {
+          onClick: t[26] || (t[26] = (o) => {
             s.chart.type = s.constants.BAR, s.showDonutOptions = !1;
           }),
           innerHTML: e.icons.bar,
-          class: N({ "is-active-chart": s.chart.type === s.constants.BAR && !s.showDonutOptions }),
+          class: C({ "is-active-chart": s.chart.type === s.constants.BAR && !s.showDonutOptions }),
           style: g(`background:${s.chart.type === s.constants.BAR && !s.showDonutOptions ? e.FINAL_CONFIG.style.chart.modal.buttons.selected.backgroundColor : e.FINAL_CONFIG.style.chart.modal.buttons.unselected.backgroundColor};color:${s.chart.type === s.constants.BAR && !s.showDonutOptions ? e.FINAL_CONFIG.style.chart.modal.buttons.selected.color : e.FINAL_CONFIG.style.chart.modal.buttons.unselected.color}`)
-        }, null, 14, Pt)
+        }, null, 14, Ht)
       ]),
-      a("div", Ht, [
+      a("div", Rt, [
         s.showDonutOptions && e.availableDonutCategories.length ? (c(), u("div", {
           key: 0,
           style: g(`background:${e.FINAL_CONFIG.style.chart.modal.backgroundColor};color:${e.FINAL_CONFIG.style.chart.modal.color}`)
         }, [
-          a("fieldset", Bt, [
+          a("fieldset", zt, [
             a("legend", null, h(e.FINAL_CONFIG.translations.chooseCategoryColumn), 1),
-            a("div", Rt, [
-              (c(!0), u(F, null, k(e.availableDonutCategories, (l, o) => (c(), u("div", {
-                key: `donut_radio_${o}`,
+            a("div", Ut, [
+              (c(!0), u(p, null, k(e.availableDonutCategories, (o, l) => (c(), u("div", {
+                key: `donut_radio_${l}`,
                 class: "vue-ui-table-fieldset-option"
               }, [
                 a("input", {
                   type: "radio",
-                  name: l.name,
-                  id: l.name,
-                  checked: s.selectedDonutCategory && l.name === s.selectedDonutCategory.name,
-                  onInput: (d) => s.selectedDonutCategory = e.availableDonutCategories[o],
+                  name: o.name,
+                  id: o.name,
+                  checked: s.selectedDonutCategory && o.name === s.selectedDonutCategory.name,
+                  onInput: (d) => s.selectedDonutCategory = e.availableDonutCategories[l],
                   style: g(`background:${e.FINAL_CONFIG.style.inputs.backgroundColor};color:${e.FINAL_CONFIG.style.inputs.color};border:${e.FINAL_CONFIG.style.inputs.border};accent-color:${e.FINAL_CONFIG.style.inputs.accentColor}`)
-                }, null, 44, zt),
+                }, null, 44, Vt),
                 a("label", {
-                  for: l.name
-                }, h(l.name), 9, Ut)
+                  for: o.name
+                }, h(o.name), 9, Xt)
               ]))), 128))
             ]),
             a("button", {
               class: "vue-ui-table-generate-donut",
               disabled: !s.selectedDonutCategory,
-              onClick: t[27] || (t[27] = (...l) => e.applyDonutOption && e.applyDonutOption(...l)),
+              onClick: t[27] || (t[27] = (...o) => e.applyDonutOption && e.applyDonutOption(...o)),
               style: g(`background:${e.FINAL_CONFIG.style.chart.modal.buttons.selected.backgroundColor};color:${e.FINAL_CONFIG.style.chart.modal.buttons.selected.color}`)
             }, [
               a("div", {
                 style: { "margin-bottom": "-3px" },
                 innerHTML: e.icons.donut
-              }, null, 8, Xt),
-              v(" " + h(e.FINAL_CONFIG.translations.makeDonut), 1)
-            ], 12, Vt)
+              }, null, 8, Yt),
+              w(" " + h(e.FINAL_CONFIG.translations.makeDonut), 1)
+            ], 12, jt)
           ])
         ], 4)) : b("", !0),
-        [s.constants.BAR, s.constants.LINE].includes(s.chart.type) && !s.showDonutOptions ? (c(), u(F, { key: 1 }, [
-          e.chartTimeLabelOptions.length > 1 ? (c(), u("label", jt, [
-            v(h(e.FINAL_CONFIG.translations.xAxisLabels) + " ", 1),
+        [s.constants.BAR, s.constants.LINE].includes(s.chart.type) && !s.showDonutOptions ? (c(), u(p, { key: 1 }, [
+          e.chartTimeLabelOptions.length > 1 ? (c(), u("label", Wt, [
+            w(h(e.FINAL_CONFIG.translations.xAxisLabels) + " ", 1),
             O(a("select", {
-              "onUpdate:modelValue": t[28] || (t[28] = (l) => s.chartTimeLabelSourceModel = l)
+              "onUpdate:modelValue": t[28] || (t[28] = (o) => s.chartTimeLabelSourceModel = o)
             }, [
-              (c(!0), u(F, null, k(e.chartTimeLabelOptions, (l) => (c(), u("option", null, h(l), 1))), 256))
+              (c(!0), u(p, null, k(e.chartTimeLabelOptions, (o) => (c(), u("option", null, h(o), 1))), 256))
             ], 512), [
               [P, s.chartTimeLabelSourceModel]
             ])
           ])) : b("", !0),
-          a("div", Yt, [
-            s.chart.type === s.constants.LINE ? (c(), H(f, {
+          a("div", Jt, [
+            s.chart.type === s.constants.LINE ? (c(), B(f, {
               key: `chart_line_${s.chartStep}`,
               dataset: e.chartData.xyDatasetLine,
               config: e.chartData.xyConfig
             }, null, 8, ["dataset", "config"])) : b("", !0),
-            s.chart.type === s.constants.BAR ? (c(), H(f, {
+            s.chart.type === s.constants.BAR ? (c(), B(f, {
               key: `chart_bar_${s.chartStep}`,
               dataset: e.chartData.xyDatasetBar,
               config: e.chartData.xyConfig
@@ -1567,15 +1611,15 @@ function Jt(n, t, r, i, s, e) {
             class: "chart-trend",
             style: g(`color:${e.FINAL_CONFIG.style.chart.modal.color}`)
           }, [
-            t[37] || (t[37] = a("span", null, "---", -1)),
-            v(" Trend: " + h(e.dataLabel({
+            t[38] || (t[38] = a("span", null, "---", -1)),
+            w(" Trend: " + h(e.dataLabel({
               v: e.chartData.progression.trend * 100,
               s: "%",
               r: 1
             })), 1)
           ], 4)) : b("", !0)
         ], 64)) : b("", !0),
-        [s.constants.DONUT].includes(s.chart.type) && !s.showDonutOptions ? (c(), u("div", Wt, [
+        [s.constants.DONUT].includes(s.chart.type) && !s.showDonutOptions ? (c(), u("div", Kt, [
           E(_, {
             dataset: s.currentDonut,
             config: e.chartData.donutConfig
@@ -1585,7 +1629,7 @@ function Jt(n, t, r, i, s, e) {
     ], 4)) : b("", !0)
   ], 4);
 }
-const ns = /* @__PURE__ */ se(ne, [["render", Jt], ["__scopeId", "data-v-baef4664"]]);
+const ls = /* @__PURE__ */ re(le, [["render", Zt], ["__scopeId", "data-v-0b5e4eaf"]]);
 export {
-  ns as default
+  ls as default
 };