vue-data-ui 3.16.0 → 3.16.1

package/dist/{vue-ui-treemap-C0zhPMxE.js → vue-ui-treemap-98KaVRyd.js}

@@ -1,4 +1,4 @@
-import { defineAsyncComponent as Ne, useSlots as Fl, onMounted as No, computed as w, ref as b, shallowRef as Ce, toRefs as Ll, watch as Be, onBeforeUnmount as Nl, openBlock as d, createElementBlock as S, unref as y, normalizeStyle as xe, normalizeClass as Zt, createElementVNode as H, toDisplayString as tt, createBlock as he, createCommentVNode as L, withCtx as A, renderSlot as k, normalizeProps as X, guardReactiveProps as j, createSlots as Bo, Fragment as ot, renderList as ht, withKeys as Ro, withModifiers as Jt, mergeProps as ft, createVNode as pt, createTextVNode as gt, Teleport as Bl, resolveDynamicComponent as Rl, nextTick as Do } from "vue";
+import { defineAsyncComponent as Ne, useSlots as Fl, onMounted as No, computed as k, ref as b, shallowRef as Ce, toRefs as Ll, watch as Be, onBeforeUnmount as Nl, openBlock as v, createElementBlock as A, unref as y, normalizeStyle as xe, normalizeClass as Zt, createElementVNode as E, toDisplayString as tt, createBlock as he, createCommentVNode as N, withCtx as M, renderSlot as C, normalizeProps as X, guardReactiveProps as j, createSlots as Bo, Fragment as ot, renderList as ht, withKeys as Ro, withModifiers as Jt, mergeProps as ft, createVNode as pt, createTextVNode as gt, Teleport as Bl, resolveDynamicComponent as Rl, nextTick as Do } from "vue";
 import { j as yt, t as zo, m as Dl, p as G, n as zl, o as Vo, q as Vl, s as lt, k as mt, l as at, X as Qt, x as bt, W as wt, T as Ho, a0 as Hl, a1 as El, az as kt, aA as eo, U as Wl } from "./lib-DBptbyyI.js";
 import { t as Ul, u as Yl } from "./useResponsive-DfdjqQps.js";
 import { u as Xl } from "./useConfig-DO94Aj5s.js";
@@ -17,164 +17,164 @@ import Eo from "./BaseIcon-Cb3zzG6s.js";
 import { A as aa } from "./A11yDataTable-KcVAX2cP.js";
 import { B as na } from "./BaseLegendToggle-BQVIawmA.js";
 import { _ as sa } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-function Wo(i, p) {
-  const v = i.length;
-  if (v === 0)
-    throw new Error(`Max aspect ratio cannot be computed: ${i} is an empty array`);
+function Wo(r, p) {
+  const h = r.length;
+  if (h === 0)
+    throw new Error(`Max aspect ratio cannot be computed: ${r} is an empty array`);
   {
-    let g = 1 / 0, f = -1 / 0, C = 0;
-    for (let P = 0; P < v; P += 1) {
-      const T = i[P].normalizedValue;
-      T < g && (g = T), T > f && (f = T), C += T;
+    let g = 1 / 0, f = -1 / 0, x = 0;
+    for (let P = 0; P < h; P += 1) {
+      const S = r[P].normalizedValue;
+      S < g && (g = S), S > f && (f = S), x += S;
     }
     return Math.max(
-      p ** 2 * f / C ** 2,
-      C ** 2 / (p ** 2 * g)
+      p ** 2 * f / x ** 2,
+      x ** 2 / (p ** 2 * g)
     );
   }
 }
-function Uo(i) {
-  const { xOffset: p, yOffset: v, width: g, height: f } = i;
+function Uo(r) {
+  const { xOffset: p, yOffset: h, width: g, height: f } = r;
   return {
     x0: p,
-    y0: v,
+    y0: h,
     x1: p + g,
-    y1: v + f
+    y1: h + f
   };
 }
-function ua(i, p, v) {
-  if (i.length === 0)
+function ua(r, p, h) {
+  if (r.length === 0)
     return !0;
   {
-    const g = i.concat(p), f = Wo(
-      i,
-      v
-    ), C = Wo(g, v);
-    return f >= C;
+    const g = r.concat(p), f = Wo(
+      r,
+      h
+    ), x = Wo(g, h);
+    return f >= x;
   }
 }
-function ra(i) {
-  const p = [], v = i.length;
-  for (let g = 0; g < v; g += 1) {
-    const f = i[g], C = f.length;
-    for (let m = 0; m < C; m += 1)
+function ra(r) {
+  const p = [], h = r.length;
+  for (let g = 0; g < h; g += 1) {
+    const f = r[g], x = f.length;
+    for (let m = 0; m < x; m += 1)
       p.push(f[m]);
   }
   return p;
 }
-function Yo(i, p) {
-  const v = {
+function Yo(r, p) {
+  const h = {
     ...p,
-    children: i
+    children: r
   };
-  return jo(v);
+  return jo(h);
 }
-function ia(i) {
-  return (i.x1 - i.x0) * (i.y1 - i.y0);
+function ia(r) {
+  return (r.x1 - r.x0) * (r.y1 - r.y0);
 }
-function Xo(i, p) {
-  const { width: v, height: g, xOffset: f, yOffset: C } = oo(p), m = i.length, P = i.map((x) => x.normalizedValue || 0).reduce((x, D) => x + D, 0), T = P / g, $e = P / v;
-  let ue = f, fe = C;
+function Xo(r, p) {
+  const { width: h, height: g, xOffset: f, yOffset: x } = oo(p), m = r.length, P = r.map(($) => $.normalizedValue || 0).reduce(($, V) => $ + V, 0), S = P / g, $e = P / h;
+  let ue = f, fe = x;
   const Z = [];
-  if (v >= g) {
-    for (let x = 0; x < m; x += 1) {
-      const D = i[x], pe = fe + D.normalizedValue / T, Te = {
+  if (h >= g) {
+    for (let $ = 0; $ < m; $ += 1) {
+      const V = r[$], pe = fe + V.normalizedValue / S, Te = {
         x0: ue,
         y0: fe,
-        x1: ue + T,
+        x1: ue + S,
         y1: pe
-      }, ge = Object.assign({}, D, Te);
+      }, ge = Object.assign({}, V, Te);
       fe = pe, Z.push(ge);
     }
     return Z;
   } else {
-    for (let x = 0; x < m; x += 1) {
-      const D = i[x], pe = ue + D.normalizedValue / $e, Te = {
+    for (let $ = 0; $ < m; $ += 1) {
+      const V = r[$], pe = ue + V.normalizedValue / $e, Te = {
         x0: ue,
         y0: fe,
         x1: pe,
         y1: fe + $e
-      }, ge = Object.assign({}, D, Te);
+      }, ge = Object.assign({}, V, Te);
       ue = pe, Z.push(ge);
     }
     return Z;
   }
 }
-function ca(i) {
-  const p = oo(i), v = p.width, g = p.height;
-  return Math.min(v, g);
+function ca(r) {
+  const p = oo(r), h = p.width, g = p.height;
+  return Math.min(h, g);
 }
-function da(i, p) {
-  const v = i.length, g = i.map((T) => T.value ?? 0).reduce((T, $e) => T + $e, 0), f = p / g, C = [];
+function da(r, p) {
+  const h = r.length, g = r.map((S) => S.value ?? 0).reduce((S, $e) => S + $e, 0), f = p / g, x = [];
   let m, P;
-  for (let T = 0; T < v; T += 1)
-    P = i[T], m = Object.assign({}, P, {
+  for (let S = 0; S < h; S += 1)
+    P = r[S], m = Object.assign({}, P, {
       normalizedValue: P.value * (f || 0)
-    }), C.push(m);
-  return C;
+    }), x.push(m);
+  return x;
 }
-function oo(i) {
-  const { x0: p, y0: v, x1: g, y1: f } = i;
+function oo(r) {
+  const { x0: p, y0: h, x1: g, y1: f } = r;
   return {
     xOffset: p,
-    yOffset: v,
+    yOffset: h,
     width: g - p,
-    height: f - v
+    height: f - h
   };
 }
-function va(i, p, v, g) {
-  let f = i, C = p, m = v, P = g;
+function va(r, p, h, g) {
+  let f = r, x = p, m = h, P = g;
   for (; ; ) {
-    const T = f.length;
-    if (T === 0) {
-      const Z = Xo(C, m);
+    const S = f.length;
+    if (S === 0) {
+      const Z = Xo(x, m);
       return P.concat(Z);
     }
-    const $e = ca(m), ue = f[0], fe = f.slice(1, T);
-    if (ua(C, ue, $e)) {
-      const Z = C.concat(ue);
-      f = fe, C = Z, m = m, P = P;
+    const $e = ca(m), ue = f[0], fe = f.slice(1, S);
+    if (ua(x, ue, $e)) {
+      const Z = x.concat(ue);
+      f = fe, x = Z, m = m, P = P;
     } else {
-      const Z = C.length;
-      let x = 0;
+      const Z = x.length;
+      let $ = 0;
       for (let ge = 0; ge < Z; ge += 1)
-        x += C[ge].normalizedValue;
-      const D = ha(m, x), pe = Xo(C, m), Te = P.concat(pe);
-      f = f, C = [], m = D, P = Te;
+        $ += x[ge].normalizedValue;
+      const V = ha(m, $), pe = Xo(x, m), Te = P.concat(pe);
+      f = f, x = [], m = V, P = Te;
     }
   }
 }
-function jo(i) {
-  if (typeof i.children > "u" || !i.children.length)
-    return [i];
+function jo(r) {
+  if (typeof r.children > "u" || !r.children.length)
+    return [r];
   {
     const p = da(
-      i.children,
-      ia(i)
-    ), v = va(p, [], i, []), g = v.length, f = [];
+      r.children,
+      ia(r)
+    ), h = va(p, [], r, []), g = h.length, f = [];
     for (let m = 0; m < g; m += 1)
-      f.push(jo(v[m]));
+      f.push(jo(h[m]));
     return ra(f);
   }
 }
-function ha(i, p) {
-  const { width: v, height: g, xOffset: f, yOffset: C } = oo(i);
-  if (v >= g) {
-    const m = p / g, P = v - m, T = {
+function ha(r, p) {
+  const { width: h, height: g, xOffset: f, yOffset: x } = oo(r);
+  if (h >= g) {
+    const m = p / g, P = h - m, S = {
       xOffset: f + m,
-      yOffset: C,
+      yOffset: x,
       width: P,
       height: g
     };
-    return Uo(T);
+    return Uo(S);
   } else {
-    const m = p / v, P = g - m, T = {
+    const m = p / h, P = g - m, S = {
       xOffset: f,
-      yOffset: C + m,
-      width: v,
+      yOffset: x + m,
+      width: h,
       height: P
     };
-    return Uo(T);
+    return Uo(S);
   }
 }
 const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKeydown", "data-last-crumb", "onMouseenter", "onFocus"], ma = { class: "vue-ui-treemap-crumb-unit" }, ba = { class: "vue-ui-treemap-crumb-unit-label" }, wa = {
@@ -214,12 +214,12 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
     }
   },
   emits: ["selectLegend", "selectDatapoint", "copyAlt"],
-  setup(i, { expose: p, emit: v }) {
-    const g = Ne(() => import("./DataTable-DT2kIdQ6.js")), f = Ne(() => import("./PenAndPaper-DARlvvKW.js")), C = Ne(() => import("./vue-ui-accordion-nvggWcGN.js")), m = Ne(() => import("./Tooltip-Bf-kM3_A.js")), P = Ne(() => import("./UserOptions-DWHf8jyO.js")), T = Ne(() => import("./PackageVersion-IIGK_e2C.js")), $e = Ne(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_treemap: ue } = Xl(), { isThemeValid: fe, warnInvalidTheme: Z } = Zl(), x = i, D = v, pe = Fl();
+  setup(r, { expose: p, emit: h }) {
+    const g = Ne(() => import("./DataTable-DT2kIdQ6.js")), f = Ne(() => import("./PenAndPaper-Ct3qJ4lA.js")), x = Ne(() => import("./vue-ui-accordion-nvggWcGN.js")), m = Ne(() => import("./Tooltip-Bf-kM3_A.js")), P = Ne(() => import("./UserOptions-rW2fRf3V.js")), S = Ne(() => import("./PackageVersion-DPO-OOVI.js")), $e = Ne(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_treemap: ue } = Xl(), { isThemeValid: fe, warnInvalidTheme: Z } = Zl(), $ = r, V = h, pe = Fl();
     No(() => {
       pe["chart-background"] && console.warn("VueUiTreemap does not support the #chart-background slot.");
     });
-    const Te = w(() => !!x.dataset && x.dataset.length), ge = w(() => /^((?!chrome|android).)*safari/i.test(navigator.userAgent)), le = b(yt()), Ue = b(!1), Ct = b(""), Ie = b(!1), lo = b(0), N = b([]), re = Ce(null), ao = Ce(null), no = Ce(null), so = Ce(null), uo = Ce(null), ro = b(0), xt = b(0), $t = b(0), I = b([]), Tt = b(null), io = b(!1), Ye = b(null), St = b(null), Xe = b(null), K = b(/* @__PURE__ */ new Map()), nt = b(!1), st = b(!1), ye = b(null), co = b({ x: 0, y: 0 }), je = b("pointer"), At = b(!1), t = b(Ot()), Se = w(() => t.value.userOptions.useCursorPointer), Ko = w(() => zo({
+    const Te = k(() => !!$.dataset && $.dataset.length), ge = k(() => /^((?!chrome|android).)*safari/i.test(navigator.userAgent)), le = b(yt()), Ue = b(!1), Ct = b(""), Ie = b(!1), lo = b(0), B = b([]), re = Ce(null), ao = Ce(null), no = Ce(null), so = Ce(null), uo = Ce(null), ro = b(0), xt = b(0), $t = b(0), I = b([]), Tt = b(null), io = b(!1), Ye = b(null), St = b(null), Xe = b(null), K = b(/* @__PURE__ */ new Map()), nt = b(!1), st = b(!1), ye = b(null), co = b({ x: 0, y: 0 }), je = b("pointer"), At = b(!1), t = b(Ot()), Se = k(() => t.value.userOptions.useCursorPointer), Ko = k(() => zo({
       defaultConfig: {
         userOptions: { show: !1 },
         style: {
@@ -241,10 +241,10 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       },
       userConfig: t.value.skeletonConfig ?? {}
     })), { loading: Ae, FINAL_DATASET: Mt, manualLoading: qo } = jl({
-      ...Ll(x),
+      ...Ll($),
       FINAL_CONFIG: t,
       prepareConfig: Ot,
-      skeletonDataset: x.config?.skeletonDataset ?? [
+      skeletonDataset: $.config?.skeletonDataset ?? [
         {
           name: "_",
           value: 53,
@@ -267,17 +267,17 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
     }), { userOptionsVisible: Pt, setUserOptionsVisibility: vo, keepUserOptionState: ho } = Jl({ config: t.value }), { svgRef: Fe } = Ql({ config: t.value.style.chart.title });
     function Ot() {
       const e = to({
-        userConfig: x.config,
+        userConfig: $.config,
         defaultConfig: ue
       }), l = e.theme;
       if (!l) return e;
       if (!fe.value(e))
         return Z(e), e;
       const o = to({
-        userConfig: oa[l] || x.config,
+        userConfig: oa[l] || $.config,
         defaultConfig: e
       }), a = to({
-        userConfig: x.config,
+        userConfig: $.config,
         defaultConfig: o
       });
       return {
@@ -285,14 +285,14 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
         customPalette: a.customPalette.length ? a.customPalette : Dl[l] || G
       };
     }
-    Be(() => x.config, (e) => {
+    Be(() => $.config, (e) => {
       Ae.value || (t.value = Ot()), Pt.value = !t.value.userOptions.showOnChartHover, ro.value += 1, xt.value += 1, $t.value += 1, J.value.showTable = t.value.table.show, J.value.showTooltip = t.value.style.chart.tooltip.show;
     }, { deep: !0 });
     const { isPrinting: _t, isImaging: It, generatePdf: fo, generateImage: po } = ql({
       elementId: `treemap_${le.value}`,
       fileName: t.value.style.chart.title.text || "vue-ui-treemap",
       options: t.value.userOptions.print
-    }), Go = w(() => t.value.userOptions.show && !t.value.style.chart.title.text), ut = w(() => zl(t.value.customPalette)), J = b({
+    }), Go = k(() => t.value.userOptions.show && !t.value.style.chart.title.text), ut = k(() => zl(t.value.customPalette)), J = b({
       showTable: t.value.table.show,
       showTooltip: t.value.style.chart.tooltip.show
     });
@@ -317,15 +317,15 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       const e = Tt.value, l = getComputedStyle(e), o = e.offsetHeight + parseFloat(l.marginTop || "0") + parseFloat(l.marginBottom || "0") + parseFloat(l.paddingTop || "0") + parseFloat(l.paddingBottom || "0");
       return Zo(o);
     }
-    const B = w(() => {
-      const e = t.value.style.chart.padding, l = Le.value.width, o = Le.value.height, a = Jo(), n = e.left, s = l - e.right, u = e.top, r = o - e.bottom - a;
+    const D = k(() => {
+      const e = t.value.style.chart.padding, l = Le.value.width, o = Le.value.height, a = Jo(), n = e.left, s = l - e.right, u = e.top, i = o - e.bottom - a;
       return {
         left: n,
         top: u,
         right: s,
-        bottom: r,
+        bottom: i,
         width: s - n,
-        height: Math.max(0, r - u),
+        height: Math.max(0, i - u),
         vbWidth: l,
         vbHeight: o - a,
         offsetY: a
@@ -338,7 +338,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       },
       { deep: !0 }
     ), Be(
-      () => N.value,
+      () => B.value,
       () => {
         Xe.value = null, K.value = /* @__PURE__ */ new Map();
       },
@@ -380,13 +380,13 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
     No(() => {
       io.value = !0, tl();
     });
-    const el = w(() => t.value.debug);
+    const el = k(() => t.value.debug);
     function tl() {
-      if (Vo(x.dataset) && Vl({
+      if (Vo($.dataset) && Vl({
         componentName: "VueUiTreemap",
         type: "dataset",
         debug: el.value
-      }), yo(Y.value), Vo(x.dataset) || (qo.value = t.value.loading), t.value.responsive) {
+      }), yo(Y.value), Vo($.dataset) || (qo.value = t.value.loading), t.value.responsive) {
         const e = Ul(() => {
           const { width: l, height: o } = Yl({
             chart: re.value,
@@ -405,10 +405,10 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
     Nl(() => {
       Pe.value && (Re.value && Pe.value.unobserve(Re.value), Pe.value.disconnect());
     });
-    const Ke = w(() => Me.value.map((e, l) => ({
+    const Ke = k(() => Me.value.map((e, l) => ({
       ...e,
       color: lt(e.color) || ut.value[l] || G[l] || G[l % G.length]
-    })).filter((e) => !N.value.includes(e.id))), De = w(() => Y.value.filter((e) => !N.value.includes(e.id)).map((e) => e.value || 0).reduce((e, l) => e + l, 0)), Ft = w({
+    })).filter((e) => !B.value.includes(e.id))), De = k(() => Y.value.filter((e) => !B.value.includes(e.id)).map((e) => e.value || 0).reduce((e, l) => e + l, 0)), Ft = k({
       get() {
         let e = [...Ke.value];
         return t.value.style.chart.layout.sorted && (e = [...Ke.value].sort((l, o) => o.value - l.value)), e.map((l) => ({
@@ -439,34 +439,34 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       });
     }
     function ko(e, l, o, a, n) {
-      return ll(e).map((u, r) => {
+      return ll(e).map((u, i) => {
         const c = ol(
-          lt(l) || ut.value[r] || G[r] || G[r % G.length],
+          lt(l) || ut.value[i] || G[i] || G[i % G.length],
           u,
           a
-        ), h = bo(u, a), M = n ?? u.parentId ?? u.id;
+        ), d = bo(u, a), w = n ?? u.parentId ?? u.id;
         return {
           ...u,
           color: c,
-          proportion: h,
+          proportion: d,
           parentName: o,
-          rootId: M,
+          rootId: w,
           children: Array.isArray(u.children) && u.children.length ? ko(
             u.children,
             c,
             u.name,
             a,
-            M
+            w
           ) : void 0
         };
       });
     }
-    const Co = w(() => {
+    const Co = k(() => {
       const e = Ft.value.map((n) => Number(n.value) || 0).reduce((n, s) => n + s, 0) || 1, l = Ft.value.map((n) => {
-        const s = n.children ? n.children.reduce((q, Oe) => q + (Number(Oe.value) || 0), 0) : n.value, { children: u, parentId: r, id: c, value: h, name: M, color: R, ...$ } = n, V = n.id || yt();
+        const s = n.children ? n.children.reduce((q, Oe) => q + (Number(Oe.value) || 0), 0) : n.value, { children: u, parentId: i, id: c, value: d, name: w, color: z, ...T } = n, H = n.id || yt();
         return {
-          ...$,
-          id: V,
+          ...T,
+          id: H,
           name: n.name,
           value: n.value,
           color: n.color,
@@ -481,77 +481,77 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       });
       if (I.value.length === 0) {
         if (!Xe.value) {
-          const r = { x0: 0, y0: 0, x1: 1, y1: 1 };
-          Xe.value = Yo(l, r);
+          const i = { x0: 0, y0: 0, x1: 1, y1: 1 };
+          Xe.value = Yo(l, i);
         }
         const n = {
-          x0: B.value.left,
-          y0: B.value.top,
-          x1: B.value.left + B.value.width,
-          y1: B.value.top + B.value.height
+          x0: D.value.left,
+          y0: D.value.top,
+          x1: D.value.left + D.value.width,
+          y1: D.value.top + D.value.height
         }, s = n.x1 - n.x0, u = n.y1 - n.y0;
-        return Xe.value.map((r) => ({
-          ...r,
-          x0: n.x0 + r.x0 * s,
-          x1: n.x0 + r.x1 * s,
-          y0: n.y0 + r.y0 * u,
-          y1: n.y0 + r.y1 * u
+        return Xe.value.map((i) => ({
+          ...i,
+          x0: n.x0 + i.x0 * s,
+          x1: n.x0 + i.x1 * s,
+          y0: n.y0 + i.y0 * u,
+          y1: n.y0 + i.y1 * u
         }));
       }
       const a = {
-        x0: B.value.left,
-        y0: B.value.top,
-        x1: B.value.left + B.value.width,
-        y1: B.value.top + B.value.height
+        x0: D.value.left,
+        y0: D.value.top,
+        x1: D.value.left + D.value.width,
+        y1: D.value.top + D.value.height
       };
       return Yo(l, a);
     });
     function al(e) {
       const l = I.value.length ? I.value[I.value.length - 1] : null, o = /* @__PURE__ */ new Map(), a = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Map(), s = /* @__PURE__ */ new Map();
-      for (const r of e) {
-        let c = rl(r.id);
+      for (const i of e) {
+        let c = rl(i.id);
         if (l) {
-          const h = c.indexOf(l);
-          if (h >= 0)
-            c = c.slice(h);
+          const d = c.indexOf(l);
+          if (d >= 0)
+            c = c.slice(d);
           else
             continue;
         }
-        c = c.filter((h) => {
-          const M = te(h);
-          return M && Array.isArray(M.children) && M.children.length;
-        }), c.length && (c.forEach((h, M) => {
-          const R = te(h);
-          if (!R) return;
-          let $ = o.get(h);
-          $ ? ($.x0 = Math.min($.x0, r.x0), $.y0 = Math.min($.y0, r.y0), $.x1 = Math.max($.x1, r.x1), $.y1 = Math.max($.y1, r.y1), $.depth = Math.min($.depth, M)) : ($ = {
-            id: h,
-            name: R.name,
-            value: R.value,
-            color: R.color,
-            x0: r.x0,
-            y0: r.y0,
-            x1: r.x1,
-            y1: r.y1,
-            depth: M
+        c = c.filter((d) => {
+          const w = te(d);
+          return w && Array.isArray(w.children) && w.children.length;
+        }), c.length && (c.forEach((d, w) => {
+          const z = te(d);
+          if (!z) return;
+          let T = o.get(d);
+          T ? (T.x0 = Math.min(T.x0, i.x0), T.y0 = Math.min(T.y0, i.y0), T.x1 = Math.max(T.x1, i.x1), T.y1 = Math.max(T.y1, i.y1), T.depth = Math.min(T.depth, w)) : (T = {
+            id: d,
+            name: z.name,
+            value: z.value,
+            color: z.color,
+            x0: i.x0,
+            y0: i.y0,
+            x1: i.x1,
+            y1: i.y1,
+            depth: w
             // depth from visible root
-          }, o.set(h, $));
-          let V = n.get(h);
-          V || (V = /* @__PURE__ */ new Set(), n.set(h, V)), V.add(r.id);
-          const q = s.get(h);
-          (q == null || M < q) && s.set(h, M);
-        }), a.set(r.id, c));
+          }, o.set(d, T));
+          let H = n.get(d);
+          H || (H = /* @__PURE__ */ new Set(), n.set(d, H)), H.add(i.id);
+          const q = s.get(d);
+          (q == null || w < q) && s.set(d, w);
+        }), a.set(i.id, c));
       }
       return {
-        wrappers: Array.from(o.values()).map((r) => ({
-          ...r,
-          depth: s.get(r.id) ?? r.depth ?? 0,
-          childrenIds: Array.from(n.get(r.id) || [])
+        wrappers: Array.from(o.values()).map((i) => ({
+          ...i,
+          depth: s.get(i.id) ?? i.depth ?? 0,
+          childrenIds: Array.from(n.get(i.id) || [])
         })),
         ancestorsByLeaf: a
       };
     }
-    const Lt = w(() => al(Co.value)), nl = w(() => {
+    const Lt = k(() => al(Co.value)), nl = k(() => {
       const e = Lt.value.wrappers;
       return e.length ? e.filter((l) => sl(l)) : [];
     });
@@ -562,7 +562,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       const l = Nt(e);
       return Q(e) < l * 1.1 ? !1 : (e.labelY0 = e.y0, !0);
     }
-    const E = w(() => ul({
+    const F = k(() => ul({
       rects: Co.value,
       wrappers: Lt.value.wrappers,
       ancestorsByLeaf: Lt.value.ancestorsByLeaf
@@ -574,12 +574,12 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
         const s = o.get(n.id);
         if (!s || !s.length) return n;
         let u = { ...n };
-        for (const r of s) {
-          const c = a.get(r);
+        for (const i of s) {
+          const c = a.get(i);
           if (!c) continue;
-          const h = Q(c), M = Nt(c);
-          if (h < M * 1.1) continue;
-          const R = ze(c), $ = R * 1.2, V = R * 0.5, q = R * 0.5, Oe = $ * 0.5, Je = ee(c) / 3, Qe = Math.min(V, Je), _e = h * 0.25, Ht = Math.min(q, _e), Wt = (typeof c.labelY0 == "number" ? c.labelY0 : c.y0) + M, ce = Math.max(u.x0, c.x0 + Qe), we = Math.min(u.x1, c.x1 - Qe), ke = Math.max(u.y0, Wt + Oe), Ut = Math.min(u.y1, c.y1 - Ht);
+          const d = Q(c), w = Nt(c);
+          if (d < w * 1.1) continue;
+          const z = ze(c), T = z * 1.2, H = z * 0.5, q = z * 0.5, Oe = T * 0.5, Je = ee(c) / 3, Qe = Math.min(H, Je), _e = d * 0.25, Ht = Math.min(q, _e), Wt = (typeof c.labelY0 == "number" ? c.labelY0 : c.y0) + w, ce = Math.max(u.x0, c.x0 + Qe), we = Math.min(u.x1, c.x1 - Qe), ke = Math.max(u.y0, Wt + Oe), Ut = Math.min(u.y1, c.y1 - Ht);
           if (we <= ce || Ut <= ke)
             break;
           u = {
@@ -600,25 +600,25 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       return l - e <= 0 ? 1e-4 : l - e;
     }
     function ze(e) {
-      const l = t.value.style.chart.layout.labels, o = l.fontSize, a = l.minFontSize, n = l.fontSize * 2, s = 0.5, u = 0.6, r = 1, c = 0.9;
-      let h = e.proportion;
-      if (!(typeof h == "number" && isFinite(h))) {
-        const q = Math.max(1e-6, ee(e) * Q(e)), Oe = Math.max(1e-6, B.value.width * B.value.height);
-        h = q / Oe;
+      const l = t.value.style.chart.layout.labels, o = l.fontSize, a = l.minFontSize, n = l.fontSize * 2, s = 0.5, u = 0.6, i = 1, c = 0.9;
+      let d = e.proportion;
+      if (!(typeof d == "number" && isFinite(d))) {
+        const q = Math.max(1e-6, ee(e) * Q(e)), Oe = Math.max(1e-6, D.value.width * D.value.height);
+        d = q / Oe;
       }
-      const M = Math.pow(Math.min(1, Math.max(0, h)), s), R = u + (r - u) * M;
-      let $ = o * R;
-      const V = Math.max(1e-4, Math.min(ee(e), Q(e)));
-      return $ = Math.min($, V * c), $ = Math.max(a, Math.min(n, $)), $;
+      const w = Math.pow(Math.min(1, Math.max(0, d)), s), z = u + (i - u) * w;
+      let T = o * z;
+      const H = Math.max(1e-4, Math.min(ee(e), Q(e)));
+      return T = Math.min(T, H * c), T = Math.max(a, Math.min(n, T)), T;
     }
     function xo(e) {
       Ie.value = e, lo.value += 1;
     }
-    const ie = w(() => ({
+    const ie = k(() => ({
       startX: 0,
       startY: 0,
-      width: B.value.vbWidth,
-      height: B.value.vbHeight
+      width: D.value.vbWidth,
+      height: D.value.vbHeight
     }));
     function te(e, l = Y.value) {
       for (const o of l) {
@@ -642,20 +642,20 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       }
       return l;
     }
-    const Ve = w(() => I.value.length > 0);
+    const Ve = k(() => I.value.length > 0);
     function qe(e, l) {
       if (!e) {
-        Me.value = Y.value.slice(), D("selectDatapoint", void 0), I.value = [];
+        Me.value = Y.value.slice(), V("selectDatapoint", void 0), I.value = [];
         return;
       }
       t.value.events.datapointClick && t.value.events.datapointClick({ datapoint: e, seriesIndex: l });
       const o = te(e.id);
       if (o && o.children?.length)
-        I.value.push(o.id), Me.value = o.children.slice(), D("selectDatapoint", e);
+        I.value.push(o.id), Me.value = o.children.slice(), V("selectDatapoint", e);
       else if (e.parentId) {
         I.value.push(e.parentId);
         const a = te(e.parentId);
-        Me.value = a.children.slice(), D("selectDatapoint", e);
+        Me.value = a.children.slice(), V("selectDatapoint", e);
       } else if (I.value.length > 0) {
         I.value.pop();
         const a = I.value[I.value.length - 1];
@@ -663,13 +663,13 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
           const n = te(a);
           Me.value = n.children.slice();
         } else
-          Me.value = Y.value.slice(), I.value = [], D("selectDatapoint", void 0);
+          Me.value = Y.value.slice(), I.value = [], V("selectDatapoint", void 0);
       }
     }
     function il(e) {
       return !!(te(e.id)?.children?.length || e.parentId);
     }
-    const me = w(() => {
+    const me = k(() => {
       const e = [
         { id: null, label: "All" }
       ];
@@ -686,7 +686,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
           });
       }
       return e;
-    }), z = Ce(null), He = w(() => Y.value.map((e, l) => ({
+    }), R = Ce(null), He = k(() => Y.value.map((e, l) => ({
       ...e,
       color: lt(e.color) || ut.value[l] || G[l] || G[l % G.length],
       shape: "square"
@@ -695,7 +695,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       return {
         ...e,
         proportion: o,
-        opacity: N.value.includes(e.id) ? 0.5 : 1,
+        opacity: B.value.includes(e.id) ? 0.5 : 1,
         display: `${e.name}${t.value.style.chart.legend.showPercentage || t.value.style.chart.legend.showValue ? ": " : ""}${t.value.style.chart.legend.showValue ? mt(
           t.value.style.chart.layout.labels.formatter,
           e.value,
@@ -706,23 +706,23 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
             r: t.value.style.chart.legend.roundingValue
           }),
           { datapoint: e }
-        ) : ""}${t.value.style.chart.legend.showPercentage ? N.value.includes(e.id) ? `${t.value.style.chart.legend.showValue ? " (" : ""}- %${t.value.style.chart.legend.showValue ? ")" : ""}` : `${t.value.style.chart.legend.showValue ? " (" : ""}${isNaN(e.value / De.value) ? "-" : (e.value / De.value * 100).toFixed(t.value.style.chart.legend.roundingPercentage)}%${t.value.style.chart.legend.showValue ? ")" : ""}` : ""}`
+        ) : ""}${t.value.style.chart.legend.showPercentage ? B.value.includes(e.id) ? `${t.value.style.chart.legend.showValue ? " (" : ""}- %${t.value.style.chart.legend.showValue ? ")" : ""}` : `${t.value.style.chart.legend.showValue ? " (" : ""}${isNaN(e.value / De.value) ? "-" : (e.value / De.value * 100).toFixed(t.value.style.chart.legend.roundingPercentage)}%${t.value.style.chart.legend.showValue ? ")" : ""}` : ""}`
       };
-    })), cl = w(() => ({
+    })), cl = k(() => ({
       cy: "treemap-div-legend",
       backgroundColor: t.value.style.chart.legend.backgroundColor,
       color: t.value.style.chart.legend.color,
       fontSize: t.value.style.chart.legend.fontSize,
       paddingBottom: 12,
       fontWeight: t.value.style.chart.legend.bold ? "bold" : ""
-    })), Ee = w(() => N.value.length === He.value.length);
+    })), Ee = k(() => B.value.length === He.value.length);
     function dl() {
-      N.value.length ? N.value = [] : He.value.forEach((e) => {
-        N.value.push(e.id);
+      B.value.length ? B.value = [] : He.value.forEach((e) => {
+        B.value.push(e.id);
       });
     }
     function rt(e) {
-      z.value = null, N.value.includes(e.id) ? N.value = N.value.filter((l) => l !== e.id) : N.value.length < x.dataset.length - 1 && N.value.push(e.id), D("selectLegend", Ft.value);
+      R.value = null, B.value.includes(e.id) ? B.value = B.value.filter((l) => l !== e.id) : B.value.length < $.dataset.length - 1 && B.value.push(e.id), V("selectLegend", Ft.value);
     }
     function $o(e) {
       if (!Y.value.length)
@@ -732,19 +732,19 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
     }
     function vl(e) {
       const l = $o(e);
-      l !== null && N.value.includes(l.id) && rt({ id: l.id });
+      l !== null && B.value.includes(l.id) && rt({ id: l.id });
     }
     function hl(e) {
       const l = $o(e);
-      l !== null && (N.value.includes(l.id) || rt({ id: l.id }));
+      l !== null && (B.value.includes(l.id) || rt({ id: l.id }));
     }
     function fl({ datapoint: e, seriesIndex: l }) {
-      z.value = null, Ue.value = !1, ye.value = null, je.value = "pointer", t.value.events.datapointLeave && t.value.events.datapointLeave({ datapoint: e, seriesIndex: l });
+      R.value = null, Ue.value = !1, ye.value = null, je.value = "pointer", t.value.events.datapointLeave && t.value.events.datapointLeave({ datapoint: e, seriesIndex: l });
     }
     const Bt = b(null);
     function To({ datapoint: e, seriesIndex: l, triggerMode: o = "pointer" }) {
       if (Ee.value) return;
-      t.value.events.datapointEnter && t.value.events.datapointEnter({ datapoint: e, seriesIndex: l }), ye.value = l, je.value = o, z.value = e, Bt.value = { datapoint: e, seriesIndex: l, config: t.value, series: Ke.value };
+      t.value.events.datapointEnter && t.value.events.datapointEnter({ datapoint: e, seriesIndex: l }), ye.value = l, je.value = o, R.value = e, Bt.value = { datapoint: e, seriesIndex: l, config: t.value, series: Ke.value };
       const a = t.value.style.chart.tooltip.customFormat;
       if (Ho(a) && Wl(() => a({
         seriesIndex: l,
@@ -774,11 +774,11 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       }
       Ue.value = !0;
     }
-    const be = w(() => {
-      const e = E.value.map((o) => ({
+    const be = k(() => {
+      const e = F.value.map((o) => ({
         name: o.name,
         color: o.color
-      })), l = E.value.map((o) => o.value);
+      })), l = F.value.map((o) => o.value);
       return { head: e, body: l };
     });
     function Rt(e = null) {
@@ -789,7 +789,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
         e ? e(a) : El({ csvContent: a, title: t.value.style.chart.title.text || "vue-ui-treemap" });
       });
     }
-    const We = w(() => {
+    const We = k(() => {
       const e = [
         t.value.table.columnNames.series,
         t.value.table.columnNames.value,
@@ -842,7 +842,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       };
     });
     function pl() {
-      return E.value;
+      return F.value;
     }
     function So() {
       J.value.showTable = !J.value.showTable;
@@ -873,10 +873,10 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
         aspectRatio: a
       };
     }
-    const Ze = w(() => {
+    const Ze = k(() => {
       const e = t.value.table.useDialog && !t.value.table.show, l = J.value.showTable;
       return {
-        component: e ? $e : C,
+        component: e ? $e : x,
         title: `${t.value.style.chart.title.text}${t.value.style.chart.title.subtitle.text ? `: ${t.value.style.chart.title.subtitle.text}` : ""}`,
         props: e ? {
           backgroundColor: t.value.table.th.backgroundColor,
@@ -910,10 +910,10 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
     function Oo() {
       J.value.showTable = !1, St.value && St.value.setTableIconState(!1);
     }
-    const yl = w(() => He.value.map((e) => ({
+    const yl = k(() => He.value.map((e) => ({
       ...e,
       name: e.display
-    }))), ml = w(() => t.value.style.chart.backgroundColor), bl = w(() => t.value.style.chart.legend), wl = w(() => t.value.style.chart.title), { exportSvg: kl, getSvg: Cl } = Gl({
+    }))), ml = k(() => t.value.style.chart.backgroundColor), bl = k(() => t.value.style.chart.legend), wl = k(() => t.value.style.chart.title), { exportSvg: kl, getSvg: Cl } = Gl({
       svg: Fe,
       title: wl,
       legend: bl,
@@ -953,10 +953,10 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       const s = I.value.length === 0, u = s ? `${e.id}:${o ? "title" : "rect"}` : null;
       if (s && K.value.has(u))
         return K.value.get(u);
-      const r = Math.max(2, ze(e) / 3), c = Math.max(8, ze(e)), h = c * 1.2, M = Math.max(0, ee(e) - r * 2), R = Math.max(0, Q(e) - r * 2);
-      if (M <= 2 || R <= c * 0.8)
+      const i = Math.max(2, ze(e) / 3), c = Math.max(8, ze(e)), d = c * 1.2, w = Math.max(0, ee(e) - i * 2), z = Math.max(0, Q(e) - i * 2);
+      if (w <= 2 || z <= c * 0.8)
         return s && u && K.value.set(u, ""), "";
-      const $ = t.value.style.fontFamily, V = t.value.style.chart.layout.labels.name.bold ? "600" : "400", q = t.value.style.chart.layout.labels.value.bold ? "600" : "400", Oe = o ? t.value.style.chart.layout.rects.group.label.adaptColorToBackground ? t.value.style.chart.layout.rects.group.useSeriesBackgroundColor ? wt(bt(e.color, 0.4)) : wt(t.value.style.chart.backgroundColor) : t.value.style.chart.layout.rects.group.label.color : wt(e.color), Vt = a ? String(e.name ?? "") : "", Je = n ? mt(
+      const T = t.value.style.fontFamily, H = t.value.style.chart.layout.labels.name.bold ? "600" : "400", q = t.value.style.chart.layout.labels.value.bold ? "600" : "400", Oe = o ? t.value.style.chart.layout.rects.group.label.adaptColorToBackground ? t.value.style.chart.layout.rects.group.useSeriesBackgroundColor ? wt(bt(e.color, 0.4)) : wt(t.value.style.chart.backgroundColor) : t.value.style.chart.layout.rects.group.label.color : wt(e.color), Vt = a ? String(e.name ?? "") : "", Je = n ? mt(
         t.value.style.chart.layout.labels.formatter,
         e.value ?? 0,
         at({
@@ -966,34 +966,34 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
           r: t.value.style.chart.layout.labels.rounding
         }),
         { datapoint: e, seriesIndex: l }
-      ) : "", Qe = o ? $l(e) : M;
-      function _e(F, ae = c, et = "400") {
+      ) : "", Qe = o ? $l(e) : w;
+      function _e(L, ae = c, et = "400") {
         const oe = document.createElementNS(Qt, "svg");
         oe.setAttribute("width", "0"), oe.setAttribute("height", "0"), oe.style.position = "absolute", oe.style.visibility = "hidden", oe.style.pointerEvents = "none";
         const ne = document.createElementNS(Qt, "text");
-        ne.setAttribute("font-size", String(ae)), ne.setAttribute("font-family", $), ne.setAttribute("font-weight", String(et)), ne.textContent = F || "", oe.appendChild(ne), document.body.appendChild(oe);
+        ne.setAttribute("font-size", String(ae)), ne.setAttribute("font-family", T), ne.setAttribute("font-weight", String(et)), ne.textContent = L || "", oe.appendChild(ne), document.body.appendChild(oe);
         const ct = ne.getComputedTextLength();
         return document.body.removeChild(oe), ct;
       }
       if (o) {
-        let F = "";
-        if (a && (F = Vt), n && (F = F ? `${F} (${Je})` : Je), !F)
+        let L = "";
+        if (a && (L = Vt), n && (L = L ? `${L} (${Je})` : Je), !L)
           return s && u && K.value.set(u, ""), "";
-        let ae = F;
-        if (_e(ae, c, V) > Qe) {
+        let ae = L;
+        if (_e(ae, c, H) > Qe) {
           let U = ae;
-          for (; U.length && _e(U + "…", c, V) > Qe; )
+          for (; U.length && _e(U + "…", c, H) > Qe; )
             U = U.slice(0, -1);
           ae = U ? U + "…" : "";
         }
         if (!ae)
           return s && u && K.value.set(u, ""), "";
-        const et = Nt(e), oe = typeof e.depth == "number" ? e.depth : 0, ne = et * 1.4, ct = typeof e.labelY0 == "number" ? e.labelY0 : e.y0 + oe * ne, jt = e.x0 + r + c / 2, W = ct + r + c, se = `<text
+        const et = Nt(e), oe = typeof e.depth == "number" ? e.depth : 0, ne = et * 1.4, ct = typeof e.labelY0 == "number" ? e.labelY0 : e.y0 + oe * ne, jt = e.x0 + i + c / 2, W = ct + i + c, se = `<text
             x="${jt}"
             y="${W}"
             font-size="${c}"
-            font-family="${kt($)}"
-            font-weight="${V}"
+            font-family="${kt(T)}"
+            font-weight="${H}"
             fill="${kt(Oe)}"
             paint-order="stroke"
             stroke="transparent"
@@ -1004,11 +1004,11 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
         </text>`;
         return s && u && K.value.set(u, se), se;
       }
-      const Ht = n ? 1 : 0, Et = Math.max(0, Math.floor(R / h) - Ht);
+      const Ht = n ? 1 : 0, Et = Math.max(0, Math.floor(z / d) - Ht);
       if (Et <= 0 && !n)
         return s && u && K.value.set(u, ""), "";
-      function Wt(F, ae, et, oe, ne, ct) {
-        const jt = String(F).split(/\s+/).filter(Boolean), W = [];
+      function Wt(L, ae, et, oe, ne, ct) {
+        const jt = String(L).split(/\s+/).filter(Boolean), W = [];
         let se = "";
         function U(_) {
           return _e(_, et, oe) <= ae;
@@ -1068,43 +1068,43 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       }
       const ce = a ? Wt(
         Vt,
-        M,
+        w,
         c,
-        V,
+        H,
         Et
       ) : [];
       let we = c, ke = String(Je);
       if (n) {
-        for (; _e(ke, we, q) > M && we > Math.max(8, c * 0.75); )
+        for (; _e(ke, we, q) > w && we > Math.max(8, c * 0.75); )
           we -= 1;
-        if (_e(ke, we, q) > M) {
-          let F = ke;
-          for (; F.length && _e(F + "…", we, q) > M; )
-            F = F.slice(0, -1);
-          if (ke = F ? F + "…" : "", !ke.length)
+        if (_e(ke, we, q) > w) {
+          let L = ke;
+          for (; L.length && _e(L + "…", we, q) > w; )
+            L = L.slice(0, -1);
+          if (ke = L ? L + "…" : "", !ke.length)
             return s && u && K.value.set(u, ""), "";
         }
       }
-      if (ce.length * h + (n ? h : 0) > R) {
-        for (; ce.length && ce.length * h + (n ? h : 0) > R; )
+      if (ce.length * d + (n ? d : 0) > z) {
+        for (; ce.length && ce.length * d + (n ? d : 0) > z; )
           ce.pop();
-        if (!ce.length && (!n || h > R))
+        if (!ce.length && (!n || d > z))
           return s && u && K.value.set(u, ""), "";
       }
-      const Yt = e.x0 + r, Ol = e.y0 + r + c, Xt = [];
-      a && ce.forEach((F, ae) => {
+      const Yt = e.x0 + i, Ol = e.y0 + i + c, Xt = [];
+      a && ce.forEach((L, ae) => {
         Xt.push(`
             <tspan 
                 x="${Yt}" 
-                dy="${ae === 0 ? 0 : h}" 
-                font-weight="${V}"
+                dy="${ae === 0 ? 0 : d}" 
+                font-weight="${H}"
             >
-                ${eo(F)}
+                ${eo(L)}
             </tspan>`);
       }), n && Xt.push(`
         <tspan 
             x="${Yt}" 
-            dy="${ce.length ? h : 0}"
+            dy="${ce.length ? d : 0}"
             font-weight="${q}" 
             font-size="${we}"
         >
@@ -1114,7 +1114,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
         x="${Yt}" 
         y="${Ol}" 
         font-size="${c}" 
-        font-family="${kt($)}" 
+        font-family="${kt(T)}" 
         fill="${kt(Oe)}" 
         paint-order="stroke" 
         stroke="transparent" 
@@ -1130,51 +1130,52 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       return Math.min(l, Math.min(o, a) / 6);
     }
     async function Fo() {
-      if (D("copyAlt", {
+      if (V("copyAlt", {
         config: t.value,
-        dataset: E.value
+        dataset: F.value
       }), !t.value.userOptions.callbacks.altCopy) {
         console.warn("Vue Data UI - A callback must be set for `altCopy` in userOptions.");
         return;
       }
       await Promise.resolve(t.value.userOptions.callbacks.altCopy({
         config: t.value,
-        dataset: E.value
+        dataset: F.value
       }));
     }
     function Sl() {
       ye.value = null, At.value = !0;
     }
     function Al() {
-      ye.value = null, je.value = "pointer", Ue.value = !1, z.value = null, At.value = !1;
+      ye.value = null, je.value = "pointer", Ue.value = !1, R.value = null, At.value = !1;
     }
     function Ml(e) {
-      if (!Fe.value || Ge.value || document.activeElement !== Fe.value || !E.value.length || Ee.value) return;
+      if (!Fe.value || Ge.value || document.activeElement !== Fe.value || !F.value.length || Ee.value) return;
       const l = ["ArrowLeft", "ArrowUp"].includes(e.key), o = ["ArrowRight", "ArrowDown"].includes(e.key), a = e.key === "Enter" || e.key === " ", n = e.key === "Escape";
       if (!l && !o && !a && !n) return;
       if (e.preventDefault(), e.stopPropagation(), n) {
-        ye.value = null, je.value = "pointer", Ue.value = !1, z.value = null;
+        ye.value = null, je.value = "pointer", Ue.value = !1, R.value = null;
         return;
       }
       if (a) {
         if (ye.value === null) return;
-        const r = E.value[ye.value];
-        if (!r) return;
-        qe(r, ye.value);
+        const w = F.value[ye.value];
+        if (!w) return;
+        qe(w, ye.value);
         return;
       }
       let s = ye.value;
-      s === null || s < 0 || s >= E.value.length ? s = o ? 0 : E.value.length - 1 : o ? (s += 1, s >= E.value.length && (s = 0)) : l && (s -= 1, s < 0 && (s = E.value.length - 1));
-      const u = E.value[s];
-      u && (Pl(s), To({
-        datapoint: u,
+      const u = R.value ? F.value.findIndex((w) => w.id === R.value.id) : null, i = s !== null && s >= 0 && s < F.value.length, c = u !== null && u >= 0 && u < F.value.length;
+      i ? o ? (s += 1, s >= F.value.length && (s = 0)) : l && (s -= 1, s < 0 && (s = F.value.length - 1)) : c ? (s = o ? u + 1 : u - 1, s >= F.value.length && (s = 0), s < 0 && (s = F.value.length - 1)) : o ? s = 0 : s = F.value.length - 1;
+      const d = F.value[s];
+      d && (Pl(s), To({
+        datapoint: d,
         seriesIndex: s,
         triggerMode: "keyboard"
       }));
     }
     function Pl(e) {
       if (!Number.isFinite(e) || !Fe.value) return;
-      const l = E.value[e];
+      const l = F.value[e];
       if (!l) return;
       const o = l.x0 + ee(l) / 2, a = l.y0 + Q(l) / 2, n = Fe.value.getBoundingClientRect();
       co.value = {
@@ -1182,7 +1183,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
         y: n.top + (a - ie.value.startY) / ie.value.height * n.height
       };
     }
-    const zt = w(() => {
+    const zt = k(() => {
       const e = We.value?.colNames ?? [], l = We.value?.body ?? [];
       return { headers: e, rows: l };
     });
@@ -1200,7 +1201,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       toggleAnnotator: Dt,
       toggleFullscreen: xo,
       copyAlt: Fo
-    }), (e, l) => (d(), S("div", {
+    }), (e, l) => (v(), A("div", {
       ref_key: "treemapChart",
       ref: re,
       class: Zt(`vue-data-ui-component vue-ui-treemap ${Ie.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${t.value.useCssAnimation ? "" : "vue-ui-dna"}`),
@@ -1209,21 +1210,21 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       onMouseenter: l[2] || (l[2] = () => y(vo)(!0)),
       onMouseleave: l[3] || (l[3] = () => y(vo)(!1))
     }, [
-      H("div", {
+      E("div", {
         id: `chart-instructions-${le.value}`,
         class: "sr-only"
       }, [
-        H("p", null, tt(t.value.a11y.translations.keyboardNavigation), 1)
+        E("p", null, tt(t.value.a11y.translations.keyboardNavigation), 1)
       ], 8, pa),
-      zt.value?.rows?.length ? (d(), he(aa, {
+      zt.value?.rows?.length ? (v(), he(aa, {
         key: 0,
         uid: le.value,
         head: zt.value.headers,
         body: zt.value.rows,
         notice: t.value.a11y.translations.tableAvailable,
         caption: t.value.a11y.translations.tableCaption
-      }, null, 8, ["uid", "head", "body", "notice", "caption"])) : L("", !0),
-      t.value.userOptions.buttons.annotator ? (d(), he(y(f), {
+      }, null, 8, ["uid", "head", "body", "notice", "caption"])) : N("", !0),
+      t.value.userOptions.buttons.annotator ? (v(), he(y(f), {
         key: 1,
         svgRef: y(Fe),
         backgroundColor: t.value.style.chart.backgroundColor,
@@ -1232,40 +1233,40 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
         isCursorPointer: Se.value,
         onClose: Dt
       }, {
-        "annotator-action-close": A(() => [
-          k(e.$slots, "annotator-action-close", {}, void 0, !0)
+        "annotator-action-close": M(() => [
+          C(e.$slots, "annotator-action-close", {}, void 0, !0)
         ]),
-        "annotator-action-color": A(({ color: o }) => [
-          k(e.$slots, "annotator-action-color", X(j({ color: o })), void 0, !0)
+        "annotator-action-color": M(({ color: o }) => [
+          C(e.$slots, "annotator-action-color", X(j({ color: o })), void 0, !0)
         ]),
-        "annotator-action-draw": A(({ mode: o }) => [
-          k(e.$slots, "annotator-action-draw", X(j({ mode: o })), void 0, !0)
+        "annotator-action-draw": M(({ mode: o }) => [
+          C(e.$slots, "annotator-action-draw", X(j({ mode: o })), void 0, !0)
         ]),
-        "annotator-action-undo": A(({ disabled: o }) => [
-          k(e.$slots, "annotator-action-undo", X(j({ disabled: o })), void 0, !0)
+        "annotator-action-undo": M(({ disabled: o }) => [
+          C(e.$slots, "annotator-action-undo", X(j({ disabled: o })), void 0, !0)
         ]),
-        "annotator-action-redo": A(({ disabled: o }) => [
-          k(e.$slots, "annotator-action-redo", X(j({ disabled: o })), void 0, !0)
+        "annotator-action-redo": M(({ disabled: o }) => [
+          C(e.$slots, "annotator-action-redo", X(j({ disabled: o })), void 0, !0)
         ]),
-        "annotator-action-delete": A(({ disabled: o }) => [
-          k(e.$slots, "annotator-action-delete", X(j({ disabled: o })), void 0, !0)
+        "annotator-action-delete": M(({ disabled: o }) => [
+          C(e.$slots, "annotator-action-delete", X(j({ disabled: o })), void 0, !0)
         ]),
         _: 3
-      }, 8, ["svgRef", "backgroundColor", "color", "active", "isCursorPointer"])) : L("", !0),
-      Go.value ? (d(), S("div", {
+      }, 8, ["svgRef", "backgroundColor", "color", "active", "isCursorPointer"])) : N("", !0),
+      Go.value ? (v(), A("div", {
         key: 2,
         ref_key: "noTitle",
         ref: uo,
         class: "vue-data-ui-no-title-space",
         style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : L("", !0),
-      t.value.style.chart.title.text ? (d(), S("div", {
+      }, null, 512)) : N("", !0),
+      t.value.style.chart.title.text ? (v(), A("div", {
         key: 3,
         ref_key: "chartTitle",
         ref: ao,
         style: xe(`width:100%;background:${t.value.style.chart.backgroundColor};padding-bottom:6px`)
       }, [
-        (d(), he(ta, {
+        (v(), he(ta, {
           key: `title_${ro.value}`,
           config: {
             title: {
@@ -1278,11 +1279,11 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
             }
           }
         }, null, 8, ["config"]))
-      ], 4)) : L("", !0),
-      H("div", {
+      ], 4)) : N("", !0),
+      E("div", {
         id: `legend-top-${le.value}`
       }, null, 8, ga),
-      t.value.userOptions.show && Te.value && (y(ho) || y(Pt)) ? (d(), he(y(P), {
+      t.value.userOptions.show && Te.value && (y(ho) || y(Pt)) ? (v(), he(y(P), {
         ref_key: "userOptionsRef",
         ref: St,
         key: `user_option_${lo.value}`,
@@ -1325,83 +1326,83 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       }, Bo({ _: 2 }, [
         e.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: A(({ isOpen: o, color: a }) => [
-            k(e.$slots, "menuIcon", X(j({ isOpen: o, color: a })), void 0, !0)
+          fn: M(({ isOpen: o, color: a }) => [
+            C(e.$slots, "menuIcon", X(j({ isOpen: o, color: a })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         e.$slots.optionTooltip ? {
           name: "optionTooltip",
-          fn: A(() => [
-            k(e.$slots, "optionTooltip", {}, void 0, !0)
+          fn: M(() => [
+            C(e.$slots, "optionTooltip", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         e.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: A(() => [
-            k(e.$slots, "optionPdf", {}, void 0, !0)
+          fn: M(() => [
+            C(e.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         e.$slots.optionCsv ? {
           name: "optionCsv",
-          fn: A(() => [
-            k(e.$slots, "optionCsv", {}, void 0, !0)
+          fn: M(() => [
+            C(e.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         e.$slots.optionImg ? {
           name: "optionImg",
-          fn: A(() => [
-            k(e.$slots, "optionImg", {}, void 0, !0)
+          fn: M(() => [
+            C(e.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         e.$slots.optionSvg ? {
           name: "optionSvg",
-          fn: A(() => [
-            k(e.$slots, "optionSvg", {}, void 0, !0)
+          fn: M(() => [
+            C(e.$slots, "optionSvg", {}, void 0, !0)
           ]),
           key: "5"
         } : void 0,
         e.$slots.optionTable ? {
           name: "optionTable",
-          fn: A(() => [
-            k(e.$slots, "optionTable", {}, void 0, !0)
+          fn: M(() => [
+            C(e.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "6"
         } : void 0,
         e.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: A(({ toggleFullscreen: o, isFullscreen: a }) => [
-            k(e.$slots, "optionFullscreen", X(j({ toggleFullscreen: o, isFullscreen: a })), void 0, !0)
+          fn: M(({ toggleFullscreen: o, isFullscreen: a }) => [
+            C(e.$slots, "optionFullscreen", X(j({ toggleFullscreen: o, isFullscreen: a })), void 0, !0)
           ]),
           key: "7"
         } : void 0,
         e.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: A(({ toggleAnnotator: o, isAnnotator: a }) => [
-            k(e.$slots, "optionAnnotator", X(j({ toggleAnnotator: o, isAnnotator: a })), void 0, !0)
+          fn: M(({ toggleAnnotator: o, isAnnotator: a }) => [
+            C(e.$slots, "optionAnnotator", X(j({ toggleAnnotator: o, isAnnotator: a })), void 0, !0)
           ]),
           key: "8"
         } : void 0,
         e.$slots.optionAltCopy ? {
           name: "optionAltCopy",
-          fn: A(({ altCopy: o }) => [
-            k(e.$slots, "optionAltCopy", X(j({ altCopy: o })), void 0, !0)
+          fn: M(({ altCopy: o }) => [
+            C(e.$slots, "optionAltCopy", X(j({ altCopy: o })), void 0, !0)
           ]),
           key: "9"
         } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasSvg", "hasTable", "hasFullscreen", "hasAltCopy", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "isCursorPointer", "onGeneratePdf", "style"])) : L("", !0),
-      me.value.length > 1 ? (d(), S("nav", {
+      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasSvg", "hasTable", "hasFullscreen", "hasAltCopy", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "isCursorPointer", "onGeneratePdf", "style"])) : N("", !0),
+      me.value.length > 1 ? (v(), A("nav", {
         key: 5,
         class: "vue-ui-treemap-breadcrumbs",
         "data-dom-to-png-ignore": "",
         ref_key: "breadcrumbsNav",
         ref: Tt
       }, [
-        (d(!0), S(ot, null, ht(me.value, (o, a) => (d(), S("span", {
+        (v(!0), A(ot, null, ht(me.value, (o, a) => (v(), A("span", {
           role: "button",
           tabindex: a < me.value.length - 1 ? 0 : void 0,
           key: o.id || "root",
@@ -1422,29 +1423,29 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
           onFocus: (n) => Mo(a),
           onBlur: Po
         }, [
-          H("span", ma, [
-            H("span", ba, [
-              k(e.$slots, "breadcrumb-label", ft({ ref_for: !0 }, { crumb: o, isRoot: a === 0, isFocus: it.value === a }), () => [
-                a === 0 ? (d(), S("div", wa, [
+          E("span", ma, [
+            E("span", ba, [
+              C(e.$slots, "breadcrumb-label", ft({ ref_for: !0 }, { crumb: o, isRoot: a === 0, isFocus: it.value === a }), () => [
+                a === 0 ? (v(), A("div", wa, [
                   pt(Eo, {
                     name: it.value === 0 ? "homeFilled" : "home",
                     stroke: t.value.style.chart.color
                   }, null, 8, ["name", "stroke"])
-                ])) : (d(), S(ot, { key: 1 }, [
+                ])) : (v(), A(ot, { key: 1 }, [
                   gt(tt(o.label), 1)
                 ], 64))
               ], !0)
             ]),
-            a < me.value.length - 1 ? (d(), S("span", ka, [
-              k(e.$slots, "breadcrumb-arrow", {}, () => [
+            a < me.value.length - 1 ? (v(), A("span", ka, [
+              C(e.$slots, "breadcrumb-arrow", {}, () => [
                 l[4] || (l[4] = gt(" › ", -1))
               ], !0)
-            ])) : L("", !0)
+            ])) : N("", !0)
           ])
         ], 44, ya))), 128))
-      ], 512)) : L("", !0),
-      H("div", Ca, [
-        (d(), S("svg", {
+      ], 512)) : N("", !0),
+      E("div", Ca, [
+        (v(), A("svg", {
           ref_key: "svgRef",
           ref: Fe,
           xmlns: y(Qt),
@@ -1457,31 +1458,31 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
           onBlur: Al,
           onKeydown: Ml
         }, [
-          pt(y(T)),
-          (d(!0), S(ot, null, ht(E.value, (o, a) => (d(), S("g", {
+          pt(y(S)),
+          (v(!0), A(ot, null, ht(F.value, (o, a) => (v(), A("g", {
             key: `tgrad_${o.id}`
           }, [
-            t.value.style.chart.layout.rects.gradient.show ? (d(), S("defs", $a, [
-              H("radialGradient", {
+            t.value.style.chart.layout.rects.gradient.show ? (v(), A("defs", $a, [
+              E("radialGradient", {
                 id: `tgrad_${o.id}`,
                 gradientTransform: "translate(-1, -1.000001) scale(2, 2)"
               }, [
-                H("stop", {
+                E("stop", {
                   offset: "18%",
                   "stop-color": o.color
                 }, null, 8, Sa),
-                H("stop", {
+                E("stop", {
                   offset: "100%",
                   "stop-color": y(bt)(o.color, t.value.style.chart.layout.rects.gradient.intensity / 100)
                 }, null, 8, Aa)
               ], 8, Ta)
-            ])) : L("", !0)
+            ])) : N("", !0)
           ]))), 128)),
-          (d(!0), S(ot, null, ht(nl.value, (o, a) => (d(), S("g", {
+          (v(!0), A(ot, null, ht(nl.value, (o, a) => (v(), A("g", {
             key: `parent_${o.id}`,
             class: "vue-ui-treemap-parent-wrapper"
           }, [
-            H("rect", {
+            E("rect", {
               x: o.x0,
               y: o.y0,
               height: Q(o),
@@ -1492,33 +1493,33 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
               "stroke-width": t.value.style.chart.layout.rects.group.strokeWidth,
               class: "vue-data-ui-cursor-default vue-ui-treemap-rect"
             }, null, 8, Ma),
-            e.$slots["group-label"] && !Ee.value ? (d(), S("foreignObject", {
+            e.$slots["group-label"] && !Ee.value ? (v(), A("foreignObject", {
               key: 0,
               width: ee(o),
               height: Q(o),
               x: o.x0,
               y: o.y0
             }, [
-              k(e.$slots, "group-label", ft({ ref_for: !0 }, { group: o }), void 0, !0)
-            ], 8, Pa)) : !y(Ae) && t.value.style.chart.layout.labels.showDefaultLabels && !Ee.value ? (d(), S("g", {
+              C(e.$slots, "group-label", ft({ ref_for: !0 }, { group: o }), void 0, !0)
+            ], 8, Pa)) : !y(Ae) && t.value.style.chart.layout.labels.showDefaultLabels && !Ee.value ? (v(), A("g", {
               key: 1,
               style: { "pointer-events": "none" },
               innerHTML: Io({ rect: o, seriesIndex: 0, isTitle: !0 }),
               class: "vue-data-ui-cursor-default"
-            }, null, 8, Oa)) : L("", !0)
+            }, null, 8, Oa)) : N("", !0)
           ]))), 128)),
-          (d(!0), S(ot, null, ht(E.value, (o, a) => (d(), S("g", {
+          (v(!0), A(ot, null, ht(F.value, (o, a) => (v(), A("g", {
             key: `k_${o.id}`
           }, [
-            H("rect", {
+            E("rect", {
               x: o.x0,
               y: o.y0,
               height: Q(o),
               width: ee(o),
               fill: ge.value ? o.color ?? t.value.style.chart.backgroundColor : t.value.style.chart.layout.rects.gradient.show ? Ee.value ? t.value.style.chart.backgroundColor : `url(#tgrad_${o.id})` : o.color ?? t.value.style.chart.backgroundColor,
               rx: Tl(o),
-              stroke: z.value && z.value.id === o.id ? t.value.style.chart.layout.rects.selected.stroke : t.value.style.chart.layout.rects.stroke,
-              "stroke-width": z.value && z.value.id === o.id ? t.value.style.chart.layout.rects.selected.strokeWidth : t.value.style.chart.layout.rects.strokeWidth,
+              stroke: R.value && R.value.id === o.id ? t.value.style.chart.layout.rects.selected.stroke : t.value.style.chart.layout.rects.stroke,
+              "stroke-width": R.value && R.value.id === o.id ? t.value.style.chart.layout.rects.selected.strokeWidth : t.value.style.chart.layout.rects.strokeWidth,
               onClick: Jt((n) => qe(o, a), ["stop"]),
               onMouseenter: () => To({
                 datapoint: o,
@@ -1526,26 +1527,26 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
                 triggerMode: "pointer"
               }),
               onMouseleave: (n) => fl({ datapoint: o, seriesIndex: a }),
-              style: xe(`opacity:${z.value ? z.value.id === o.id ? 1 : t.value.style.chart.layout.rects.selected.unselectedOpacity : 1}`),
+              style: xe(`opacity:${R.value ? R.value.id === o.id ? 1 : t.value.style.chart.layout.rects.selected.unselectedOpacity : 1}`),
               class: Zt([
                 "vue-ui-treemap-rect",
                 il(o) ? "vue-data-ui-zoom-plus" : Ve.value ? "vue-data-ui-zoom-minus" : ""
               ])
             }, null, 46, _a),
-            !e.$slots.rect && !y(Ae) && t.value.style.chart.layout.labels.showDefaultLabels && !Ee.value ? (d(), S("g", {
+            !e.$slots.rect && !y(Ae) && t.value.style.chart.layout.labels.showDefaultLabels && !Ee.value ? (v(), A("g", {
               key: 0,
-              style: xe(`pointer-events:none; opacity:${z.value ? z.value.id === o.id ? 1 : t.value.style.chart.layout.rects.selected.unselectedOpacity : 1}`),
+              style: xe(`pointer-events:none; opacity:${R.value ? R.value.id === o.id ? 1 : t.value.style.chart.layout.rects.selected.unselectedOpacity : 1}`),
               innerHTML: Io({ rect: o, seriesIndex: a })
-            }, null, 12, Ia)) : L("", !0),
-            (d(), S("foreignObject", {
+            }, null, 12, Ia)) : N("", !0),
+            (v(), A("foreignObject", {
               x: o.x0,
               y: o.y0,
               height: Q(o),
               width: ee(o),
               class: "vue-ui-treemap-cell-foreignObject"
             }, [
-              H("div", La, [
-                y(Ae) ? L("", !0) : k(e.$slots, "rect", ft({
+              E("div", La, [
+                y(Ae) ? N("", !0) : C(e.$slots, "rect", ft({
                   key: 0,
                   ref_for: !0
                 }, {
@@ -1553,7 +1554,7 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
                     ...o,
                     height: Q(o),
                     width: ee(o),
-                    isSelected: z.value ? z.value.id === o.id : !0
+                    isSelected: R.value ? R.value.id === o.id : !0
                   },
                   shouldShow: o.proportion > t.value.style.chart.layout.labels.hideUnderProportion || Ve.value,
                   fontSize: ze(o),
@@ -1563,27 +1564,27 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
               ])
             ], 8, Fa))
           ]))), 128)),
-          k(e.$slots, "svg", X(j({ svg: B.value, isZoom: Ve.value, rect: z.value, config: t.value, isPrintingImg: y(_t) | y(It) | nt.value, isPrintingSvg: st.value })), void 0, !0)
+          C(e.$slots, "svg", X(j({ svg: D.value, isZoom: Ve.value, rect: R.value, config: t.value, isPrintingImg: y(_t) | y(It) | nt.value, isPrintingSvg: st.value })), void 0, !0)
         ], 46, xa)),
-        e.$slots.hint ? (d(), S("div", Na, [
-          k(e.$slots, "hint", X(j({ hint: t.value.a11y.translations.keyboardNavigation, isVisible: At.value })), void 0, !0)
-        ])) : L("", !0)
+        e.$slots.hint ? (v(), A("div", Na, [
+          C(e.$slots, "hint", X(j({ hint: t.value.a11y.translations.keyboardNavigation, isVisible: At.value })), void 0, !0)
+        ])) : N("", !0)
       ]),
-      e.$slots.watermark ? (d(), S("div", Ba, [
-        k(e.$slots, "watermark", X(j({ isPrinting: y(_t) || y(It) || nt.value || st.value })), void 0, !0)
-      ])) : L("", !0),
-      H("div", {
+      e.$slots.watermark ? (v(), A("div", Ba, [
+        C(e.$slots, "watermark", X(j({ isPrinting: y(_t) || y(It) || nt.value || st.value })), void 0, !0)
+      ])) : N("", !0),
+      E("div", {
         id: `legend-bottom-${le.value}`
       }, null, 8, Ra),
-      io.value ? (d(), he(Bl, {
+      io.value ? (v(), he(Bl, {
         key: 7,
         to: t.value.style.chart.legend.position === "top" ? `#legend-top-${le.value}` : `#legend-bottom-${le.value}`
       }, [
-        H("div", {
+        E("div", {
           ref_key: "chartLegend",
           ref: no
         }, [
-          t.value.style.chart.legend.show ? (d(), he(la, {
+          t.value.style.chart.legend.show ? (v(), he(la, {
             key: `legend_${$t.value}`,
             legendSet: He.value,
             config: cl.value,
@@ -1591,39 +1592,39 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
             isCursorPointer: Se.value,
             onClickMarker: l[0] || (l[0] = ({ legend: o }) => rt(o))
           }, {
-            item: A(({ legend: o, index: a }) => [
-              y(Ae) ? L("", !0) : (d(), S("div", {
+            item: M(({ legend: o, index: a }) => [
+              y(Ae) ? N("", !0) : (v(), A("div", {
                 key: 0,
                 onClick: (n) => rt(o),
-                style: xe(`opacity:${N.value.includes(o.id) ? 0.5 : 1}`)
+                style: xe(`opacity:${B.value.includes(o.id) ? 0.5 : 1}`)
               }, tt(o.display), 13, Da))
             ]),
-            legendToggle: A(() => [
-              He.value.length > 2 && t.value.style.chart.legend.selectAllToggle.show && !y(Ae) ? (d(), he(na, {
+            legendToggle: M(() => [
+              He.value.length > 2 && t.value.style.chart.legend.selectAllToggle.show && !y(Ae) ? (v(), he(na, {
                 key: 0,
                 backgroundColor: t.value.style.chart.legend.selectAllToggle.backgroundColor,
                 color: t.value.style.chart.legend.selectAllToggle.color,
                 fontSize: t.value.style.chart.legend.fontSize,
-                checked: N.value.length > 0,
+                checked: B.value.length > 0,
                 isCursorPointer: Se.value,
                 onToggle: dl
-              }, null, 8, ["backgroundColor", "color", "fontSize", "checked", "isCursorPointer"])) : L("", !0)
+              }, null, 8, ["backgroundColor", "color", "fontSize", "checked", "isCursorPointer"])) : N("", !0)
             ]),
             _: 1
-          }, 8, ["legendSet", "config", "id", "isCursorPointer"])) : k(e.$slots, "legend", {
+          }, 8, ["legendSet", "config", "id", "isCursorPointer"])) : C(e.$slots, "legend", {
             key: 1,
             legend: He.value
           }, void 0, !0)
         ], 512)
-      ], 8, ["to"])) : L("", !0),
-      e.$slots.source ? (d(), S("div", {
+      ], 8, ["to"])) : N("", !0),
+      e.$slots.source ? (v(), A("div", {
         key: 8,
         ref_key: "source",
         ref: so,
         dir: "auto"
       }, [
-        k(e.$slots, "source", {}, void 0, !0)
-      ], 512)) : L("", !0),
+        C(e.$slots, "source", {}, void 0, !0)
+      ], 512)) : N("", !0),
       pt(y(m), {
         teleportTo: t.value.style.chart.tooltip.teleportTo,
         show: J.value.showTooltip && Ue.value,
@@ -1647,21 +1648,21 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
         isA11yMode: je.value === "keyboard",
         a11yPosition: co.value
       }, {
-        "tooltip-before": A(() => [
-          k(e.$slots, "tooltip-before", X(j({ ...Bt.value })), void 0, !0)
+        "tooltip-before": M(() => [
+          C(e.$slots, "tooltip-before", X(j({ ...Bt.value })), void 0, !0)
         ]),
-        "tooltip-after": A(() => [
-          k(e.$slots, "tooltip-after", X(j({ ...Bt.value })), void 0, !0)
+        "tooltip-after": M(() => [
+          C(e.$slots, "tooltip-after", X(j({ ...Bt.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["teleportTo", "show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold", "isA11yMode", "a11yPosition"]),
-      Te.value && t.value.userOptions.buttons.table ? (d(), he(Rl(Ze.value.component), ft({ key: 9 }, Ze.value.props, {
+      Te.value && t.value.userOptions.buttons.table ? (v(), he(Rl(Ze.value.component), ft({ key: 9 }, Ze.value.props, {
         ref_key: "tableUnit",
         ref: Ye,
         onClose: Oo
       }), Bo({
-        content: A(() => [
-          (d(), he(y(g), {
+        content: M(() => [
+          (v(), he(y(g), {
             key: `table_${xt.value}`,
             colNames: We.value.colNames,
             head: We.value.head,
@@ -1672,13 +1673,13 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
             isCursorPointer: Se.value,
             onClose: Oo
           }, {
-            th: A(({ th: o }) => [
-              H("div", {
+            th: M(({ th: o }) => [
+              E("div", {
                 innerHTML: o,
                 style: { display: "flex", "align-items": "center" }
               }, null, 8, za)
             ]),
-            td: A(({ td: o }) => [
+            td: M(({ td: o }) => [
               gt(tt(o.name || o), 1)
             ]),
             _: 1
@@ -1688,15 +1689,15 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
       }, [
         t.value.table.useDialog ? {
           name: "title",
-          fn: A(() => [
+          fn: M(() => [
             gt(tt(Ze.value.title), 1)
           ]),
           key: "0"
         } : void 0,
         t.value.table.useDialog ? {
           name: "actions",
-          fn: A(() => [
-            H("button", {
+          fn: M(() => [
+            E("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
               onClick: l[1] || (l[1] = (o) => Rt(t.value.userOptions.callbacks.csv)),
@@ -1710,13 +1711,13 @@ const fa = ["id"], pa = ["id"], ga = ["id"], ya = ["tabindex", "onClick", "onKey
           ]),
           key: "1"
         } : void 0
-      ]), 1040)) : L("", !0),
-      k(e.$slots, "skeleton", {}, () => [
-        y(Ae) ? (d(), he(Kl, { key: 0 })) : L("", !0)
+      ]), 1040)) : N("", !0),
+      C(e.$slots, "skeleton", {}, () => [
+        y(Ae) ? (v(), he(Kl, { key: 0 })) : N("", !0)
       ], !0)
     ], 46, fa));
   }
-}, sn = /* @__PURE__ */ sa(Va, [["__scopeId", "data-v-e07a50ff"]]);
+}, sn = /* @__PURE__ */ sa(Va, [["__scopeId", "data-v-d1257624"]]);
 export {
   sn as default
 };