vue-data-ui 3.4.3 → 3.4.4

package/dist/vue-ui-treemap-DNimXWh4.js

@@ -1,1131 +0,0 @@
-import { defineAsyncComponent as ee, useSlots as Kt, onMounted as bt, computed as m, ref as y, shallowRef as H, toRefs as Jt, watch as ke, onBeforeUnmount as Qt, createElementBlock as b, openBlock as h, unref as d, normalizeStyle as R, normalizeClass as Me, createBlock as Z, createCommentVNode as O, createElementVNode as _, createVNode as we, createSlots as kt, withCtx as T, renderSlot as C, normalizeProps as te, guardReactiveProps as le, Fragment as Ce, renderList as Ve, withKeys as wt, withModifiers as Ee, mergeProps as He, createTextVNode as $e, toDisplayString as se, Teleport as el, resolveDynamicComponent as tl, nextTick as ll } from "vue";
-import { c as Te, t as ol, b as al, p as I, e as nl, o as Ct, f as sl, h as de, a as xe, d as he, X as ul, S as $t, J as Tt, G as xt, P as rl, Q as il, H as cl } from "./lib-BcBZIm6u.js";
-import { t as vl, u as dl } from "./useResponsive-DfdjqQps.js";
-import { u as hl, a as Ot } from "./useNestedProp-CtheCta-.js";
-import { u as pl, B as fl } from "./BaseScanner-BgWxam9d.js";
-import { u as gl } from "./usePrinter-C1GiglOH.js";
-import { u as ml } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as yl } from "./useChartAccessibility-9icAAmYg.js";
-import bl from "./img-CFY3JivG.js";
-import kl from "./Title-D7_5ICX_.js";
-import { t as wl } from "./themes-AUNCOb2G.js";
-import Cl from "./Legend-C8u37J42.js";
-import _t from "./BaseIcon-B5KaGWWC.js";
-import { u as $l } from "./useSvgExport-DrjCWun4.js";
-import { _ as Tl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-function St(n, r) {
-  const s = n.length;
-  if (s === 0)
-    throw new Error(`Max aspect ratio cannot be computed: ${n} is an empty array`);
-  {
-    let i = 1 / 0, u = -1 / 0, p = 0;
-    for (let g = 0; g < s; g += 1) {
-      const f = n[g].normalizedValue;
-      f < i && (i = f), f > u && (u = f), p += f;
-    }
-    return Math.max(
-      r ** 2 * u / p ** 2,
-      p ** 2 / (r ** 2 * i)
-    );
-  }
-}
-function At(n) {
-  const { xOffset: r, yOffset: s, width: i, height: u } = n;
-  return {
-    x0: r,
-    y0: s,
-    x1: r + i,
-    y1: s + u
-  };
-}
-function xl(n, r, s) {
-  if (n.length === 0)
-    return !0;
-  {
-    const i = n.concat(r), u = St(
-      n,
-      s
-    ), p = St(i, s);
-    return u >= p;
-  }
-}
-function Ol(n) {
-  const r = [], s = n.length;
-  for (let i = 0; i < s; i += 1) {
-    const u = n[i], p = u.length;
-    for (let v = 0; v < p; v += 1)
-      r.push(u[v]);
-  }
-  return r;
-}
-function _l(n, r) {
-  const s = {
-    ...r,
-    children: n
-  };
-  return Ft(s);
-}
-function Sl(n) {
-  return (n.x1 - n.x0) * (n.y1 - n.y0);
-}
-function It(n, r) {
-  const { width: s, height: i, xOffset: u, yOffset: p } = Ue(r), v = n.length, g = n.map((w) => w.normalizedValue || 0).reduce((w, F) => w + F, 0), f = g / i, U = g / s;
-  let L = u, k = p;
-  const $ = [];
-  if (s >= i) {
-    for (let w = 0; w < v; w += 1) {
-      const F = n[w], M = k + F.normalizedValue / f, S = {
-        x0: L,
-        y0: k,
-        x1: L + f,
-        y1: M
-      }, N = Object.assign({}, F, S);
-      k = M, $.push(N);
-    }
-    return $;
-  } else {
-    for (let w = 0; w < v; w += 1) {
-      const F = n[w], M = L + F.normalizedValue / U, S = {
-        x0: L,
-        y0: k,
-        x1: M,
-        y1: k + U
-      }, N = Object.assign({}, F, S);
-      L = M, $.push(N);
-    }
-    return $;
-  }
-}
-function Al(n) {
-  const r = Ue(n), s = r.width, i = r.height;
-  return Math.min(s, i);
-}
-function Il(n, r) {
-  const s = n.length, i = n.map((f) => f.value ?? 0).reduce((f, U) => f + U, 0), u = r / i, p = [];
-  let v, g;
-  for (let f = 0; f < s; f += 1)
-    g = n[f], v = Object.assign({}, g, {
-      normalizedValue: g.value * (u || 0)
-    }), p.push(v);
-  return p;
-}
-function Ue(n) {
-  const { x0: r, y0: s, x1: i, y1: u } = n;
-  return {
-    xOffset: r,
-    yOffset: s,
-    width: i - r,
-    height: u - s
-  };
-}
-function Fl(n, r, s, i) {
-  let u = n, p = r, v = s, g = i;
-  for (; ; ) {
-    const f = u.length;
-    if (f === 0) {
-      const $ = It(p, v);
-      return g.concat($);
-    }
-    const U = Al(v), L = u[0], k = u.slice(1, f);
-    if (xl(p, L, U)) {
-      const $ = p.concat(L);
-      u = k, p = $, v = v, g = g;
-    } else {
-      const $ = p.length;
-      let w = 0;
-      for (let N = 0; N < $; N += 1)
-        w += p[N].normalizedValue;
-      const F = Dl(v, w), M = It(p, v), S = g.concat(M);
-      u = u, p = [], v = F, g = S;
-    }
-  }
-}
-function Ft(n) {
-  if (typeof n.children > "u" || !n.children.length)
-    return [n];
-  {
-    const r = Il(
-      n.children,
-      Sl(n)
-    ), s = Fl(r, [], n, []), i = s.length, u = [];
-    for (let v = 0; v < i; v += 1)
-      u.push(Ft(s[v]));
-    return Ol(u);
-  }
-}
-function Dl(n, r) {
-  const { width: s, height: i, xOffset: u, yOffset: p } = Ue(n);
-  if (s >= i) {
-    const v = r / i, g = s - v, f = {
-      xOffset: u + v,
-      yOffset: p,
-      width: g,
-      height: i
-    };
-    return At(f);
-  } else {
-    const v = r / s, g = i - v, f = {
-      xOffset: u,
-      yOffset: p + v,
-      width: s,
-      height: g
-    };
-    return At(f);
-  }
-}
-const Nl = ["id"], Pl = ["id"], Rl = ["tabindex", "onClick", "onKeydown", "data-last-crumb", "onMouseenter", "onFocus"], Ll = { class: "vue-ui-treemap-crumb-unit" }, zl = { class: "vue-ui-treemap-crumb-unit-label" }, Bl = {
-  key: 0,
-  style: { width: "24px", display: "flex", "align-items": "center" }
-}, Ml = {
-  key: 0,
-  class: "vue-ui-treemap-crumb-unit-arrow"
-}, Vl = ["xmlns", "viewBox"], El = { key: 0 }, Hl = ["id"], Ul = ["stop-color"], Wl = ["stop-color"], Gl = ["x", "y", "height", "width", "fill", "rx", "stroke", "stroke-width", "onClick", "onMouseenter", "onMouseleave"], Xl = ["x", "y", "height", "width"], ql = {
-  key: 5,
-  class: "vue-data-ui-watermark"
-}, Yl = ["id"], jl = ["onClick"], Zl = ["innerHTML"], Kl = {
-  __name: "vue-ui-treemap",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-  emits: ["selectLegend", "selectDatapoint"],
-  setup(n, { expose: r, emit: s }) {
-    const i = ee(() => import("./DataTable-DOx3zgih.js")), u = ee(() => import("./PenAndPaper-Dj2diYr0.js")), p = ee(() => import("./vue-ui-accordion-DXdd_qAk.js")), v = ee(() => import("./Tooltip-Cs4v8OnI.js")), g = ee(() => import("./UserOptions-C0YT60JN.js")), f = ee(() => import("./PackageVersion-Df-8U2yE.js")), U = ee(() => import("./BaseDraggableDialog-CbuLbfrc.js")), { vue_ui_treemap: L } = hl(), k = n, $ = s, w = Kt();
-    bt(() => {
-      w["chart-background"] && console.warn("VueUiTreemap does not support the #chart-background slot.");
-    });
-    const F = m(() => !!k.dataset && k.dataset.length), M = m(() => /^((?!chrome|android).)*safari/i.test(navigator.userAgent)), S = y(Te()), N = y(!1), Oe = y(""), K = y(!1), We = y(0), z = y([]), V = H(null), Ge = H(null), Xe = H(null), qe = H(null), Ye = H(null), je = y(0), _e = y(0), Se = y(0), x = y([]), Ae = y(null), Ze = y(!1), ue = y(null), Ie = y(null), e = y(Pe()), { loading: re, FINAL_DATASET: Fe, manualLoading: Dt } = pl({
-      ...Jt(k),
-      FINAL_CONFIG: e,
-      prepareConfig: Pe,
-      skeletonDataset: [
-        {
-          name: "_",
-          value: 53,
-          color: "#CACACA90",
-          children: [
-            { name: "_", value: 21 },
-            { name: "_", value: 13 },
-            { name: "_", value: 8 },
-            { name: "_", value: 5 },
-            { name: "_", value: 3 },
-            { name: "_", value: 2 },
-            { name: "_", value: 1 }
-          ]
-        }
-      ],
-      skeletonConfig: ol({
-        defaultConfig: e.value,
-        userConfig: {
-          userOptions: { show: !1 },
-          style: {
-            chart: {
-              backgroundColor: "#999999",
-              layout: {
-                labels: {
-                  showDefaultLabels: !1
-                },
-                rects: {
-                  stroke: "#6A6A6A"
-                }
-              },
-              legend: {
-                backgroundColor: "transparent"
-              }
-            }
-          }
-        }
-      })
-    }), { userOptionsVisible: De, setUserOptionsVisibility: Ke, keepUserOptionState: Je } = ml({ config: e.value }), { svgRef: Ne } = yl({ config: e.value.style.chart.title });
-    function Pe() {
-      const t = Ot({
-        userConfig: k.config,
-        defaultConfig: L
-      });
-      return t.theme ? {
-        ...Ot({
-          userConfig: wl.vue_ui_treemap[t.theme] || k.config,
-          defaultConfig: t
-        }),
-        customPalette: al[t.theme] || I
-      } : t;
-    }
-    ke(() => k.config, (t) => {
-      re.value || (e.value = Pe()), De.value = !e.value.userOptions.showOnChartHover, je.value += 1, _e.value += 1, Se.value += 1, D.value.showTable = e.value.table.show, D.value.showTooltip = e.value.style.chart.tooltip.show;
-    }, { deep: !0 });
-    const { isPrinting: Qe, isImaging: et, generatePdf: tt, generateImage: lt } = gl({
-      elementId: `treemap_${S.value}`,
-      fileName: e.value.style.chart.title.text || "vue-ui-treemap",
-      options: e.value.userOptions.print
-    }), Nt = m(() => e.value.userOptions.show && !e.value.style.chart.title.text), pe = m(() => nl(e.value.customPalette)), D = y({
-      showTable: e.value.table.show,
-      showTooltip: e.value.style.chart.tooltip.show
-    });
-    ke(e, () => {
-      D.value = {
-        showTable: e.value.table.show,
-        showTooltip: e.value.style.chart.tooltip.show
-      };
-    }, { immediate: !0 });
-    const W = y({
-      height: e.value.style.chart.height,
-      width: e.value.style.chart.width
-    }), J = m(() => ({
-      bottom: W.value.height - e.value.style.chart.padding.bottom,
-      height: W.value.height - e.value.style.chart.padding.top - e.value.style.chart.padding.bottom,
-      left: e.value.style.chart.padding.left,
-      right: W.value.width - e.value.style.chart.padding.right,
-      top: e.value.style.chart.padding.top,
-      vbHeight: W.value.height,
-      vbWidth: W.value.width,
-      width: W.value.width - e.value.style.chart.padding.left - e.value.style.chart.padding.right
-    })), P = y(Fe.value), G = y(P.value), ot = H(/* @__PURE__ */ new Map());
-    function at(t) {
-      Array.isArray(t) && t.forEach((o, l) => {
-        o.id || (o.id = Te());
-        let a = de(o.color) || ot.value.get(o.id) || pe.value[l] || I[l] || I[l % I.length];
-        a = de(a), ot.value.set(o.id, a), o.color = a, nt(o, a);
-      });
-    }
-    function nt(t, o) {
-      Array.isArray(t.children) && t.children.forEach((l) => {
-        l.id || (l.id = Te()), l.parentId = t.id, l.color = o, nt(l, o);
-      });
-    }
-    function Pt() {
-      if (!x.value.length)
-        G.value = P.value.slice();
-      else {
-        const t = x.value[x.value.length - 1], o = Y(t);
-        G.value = o?.children?.slice() || [];
-      }
-    }
-    ke(
-      () => Fe.value,
-      () => {
-        P.value = Fe.value, at(P.value), Pt(), Se.value += 1, _e.value += 1;
-      },
-      { deep: !0, immediate: !0, flush: "post" }
-    );
-    const X = H(null), oe = H(null);
-    bt(() => {
-      Ze.value = !0, Lt();
-    });
-    const Rt = m(() => e.value.debug);
-    function Lt() {
-      if (Ct(k.dataset) && sl({
-        componentName: "VueUiTreemap",
-        type: "dataset",
-        debug: Rt.value
-      }), at(P.value), Ct(k.dataset) || (Dt.value = e.value.loading), e.value.responsive) {
-        const t = vl(() => {
-          const { width: o, height: l } = dl({
-            chart: V.value,
-            title: e.value.style.chart.title.text ? Ge.value : null,
-            legend: e.value.style.chart.legend.show ? Xe.value : null,
-            source: qe.value,
-            noTitle: Ye.value
-          });
-          requestAnimationFrame(() => {
-            W.value.width = o, W.value.height = l - 12;
-          });
-        });
-        X.value && (oe.value && X.value.unobserve(oe.value), X.value.disconnect()), X.value = new ResizeObserver(t), oe.value = V.value.parentNode, X.value.observe(oe.value);
-      }
-    }
-    Qt(() => {
-      X.value && (oe.value && X.value.unobserve(oe.value), X.value.disconnect());
-    });
-    const ie = m(() => G.value.map((t, o) => ({
-      ...t,
-      color: de(t.color) || pe.value[o] || I[o] || I[o % I.length]
-    })).filter((t) => !z.value.includes(t.id))), ae = m(() => P.value.filter((t) => !z.value.includes(t.id)).map((t) => t.value || 0).reduce((t, o) => t + o, 0)), st = m({
-      get() {
-        let t = [...ie.value];
-        return e.value.style.chart.layout.sorted && (t = [...ie.value].sort((o, l) => l.value - o.value)), t.map((o) => ({
-          ...o
-        }));
-      },
-      set(t) {
-        return t;
-      }
-    });
-    function ut(t, o) {
-      return t.value / o;
-    }
-    function zt(t, o, l) {
-      const a = e.value.style.chart.layout.rects.colorRatio - ut(o, l);
-      return $t(t, a < 0 ? 0 : a);
-    }
-    function rt(t, o, l, a) {
-      return t.map((c, A) => {
-        const be = zt(de(o) || pe.value[A] || I[A] || I[A % I.length], c, a), Zt = ut(c, a);
-        return {
-          ...c,
-          color: be,
-          proportion: Zt,
-          parentName: l,
-          children: c.children ? rt(c.children, be, c.name, a) : void 0
-        };
-      });
-    }
-    const ce = m(() => _l(
-      st.value.map((t, o) => {
-        const l = t.children ? t.children.reduce((a, c) => a + c.value, 0) : t.value;
-        return {
-          value: t.value,
-          id: t.id || Te(),
-          children: t.children ? rt(t.children.sort((a, c) => c.value - a.value), t.color, t.name, l) : void 0,
-          color: t.color,
-          name: t.name
-        };
-      }),
-      { x0: J.value.left * 2, y0: J.value.top, x1: J.value.width, y1: J.value.height }
-    ));
-    function it({ y0: t, y1: o }) {
-      return o - t <= 0 ? 1e-4 : o - t;
-    }
-    function ct({ x0: t, x1: o }) {
-      return o - t <= 0 ? 1e-4 : o - t;
-    }
-    function q(t) {
-      const o = e.value.style.chart.layout.labels.fontSize * (t.proportion * 2 > 1 ? 1 : t.proportion * 2);
-      return o < e.value.style.chart.layout.labels.minFontSize ? e.value.style.chart.layout.labels.minFontSize : o;
-    }
-    function vt(t) {
-      K.value = t, We.value += 1;
-    }
-    const ne = m(() => {
-      let t = 0;
-      return Ae.value && (t = Ae.value.getBoundingClientRect().height), {
-        startX: 0,
-        startY: 0,
-        width: J.value.vbWidth,
-        height: J.value.vbHeight - t
-      };
-    });
-    function Y(t, o = P.value) {
-      for (const l of o) {
-        if (l.id === t)
-          return l;
-        if (l.children) {
-          const a = Y(t, l.children);
-          if (a)
-            return a;
-        }
-      }
-      return null;
-    }
-    const Q = m(() => x.value.length > 0);
-    function fe(t, o) {
-      if (!t) {
-        G.value = P.value.slice(), $("selectDatapoint", void 0), x.value = [];
-        return;
-      }
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: o });
-      const l = Y(t.id);
-      if (l && l.children?.length)
-        x.value.push(l.id), G.value = l.children.slice(), $("selectDatapoint", t);
-      else if (t.parentId) {
-        x.value.push(t.parentId);
-        const a = Y(t.parentId);
-        G.value = a.children.slice(), $("selectDatapoint", t);
-      } else if (x.value.length > 0) {
-        x.value.pop();
-        const a = x.value[x.value.length - 1];
-        if (a) {
-          const c = Y(a);
-          G.value = c.children.slice();
-        } else
-          G.value = P.value.slice(), x.value = [], $("selectDatapoint", void 0);
-      }
-    }
-    function Bt(t) {
-      return !!(Y(t.id)?.children?.length || t.parentId);
-    }
-    const j = m(() => {
-      const t = [
-        { id: null, label: "All" }
-      ];
-      if (x.value.length > 0) {
-        let o = Y(x.value[x.value.length - 1]);
-        const l = [];
-        for (; o; )
-          l.unshift(o), o = o.parentId ? Y(o.parentId) : null;
-        for (const a of l)
-          t.push({
-            id: a.id,
-            label: a.name,
-            node: a
-          });
-      }
-      return t;
-    }), B = H(null), Re = m(() => P.value.map((t, o) => ({
-      ...t,
-      color: de(t.color) || pe.value[o] || I[o] || I[o % I.length],
-      shape: "square"
-    })).sort((t, o) => o.value - t.value).map((t, o) => {
-      const l = t.value / P.value.map((a) => a.value).reduce((a, c) => a + c, 0);
-      return {
-        ...t,
-        proportion: l,
-        opacity: z.value.includes(t.id) ? 0.5 : 1,
-        display: `${t.name}${e.value.style.chart.legend.showPercentage || e.value.style.chart.legend.showValue ? ": " : ""}${e.value.style.chart.legend.showValue ? xe(
-          e.value.style.chart.layout.labels.formatter,
-          t.value,
-          he({
-            p: e.value.style.chart.layout.labels.prefix,
-            v: t.value,
-            s: e.value.style.chart.layout.labels.suffix,
-            r: e.value.style.chart.legend.roundingValue
-          }),
-          { datapoint: t }
-        ) : ""}${e.value.style.chart.legend.showPercentage ? z.value.includes(t.id) ? `${e.value.style.chart.legend.showValue ? " (" : ""}- %${e.value.style.chart.legend.showValue ? ")" : ""}` : `${e.value.style.chart.legend.showValue ? " (" : ""}${isNaN(t.value / ae.value) ? "-" : (t.value / ae.value * 100).toFixed(e.value.style.chart.legend.roundingPercentage)}%${e.value.style.chart.legend.showValue ? ")" : ""}` : ""}`
-      };
-    })), Mt = m(() => ({
-      cy: "treemap-div-legend",
-      backgroundColor: e.value.style.chart.legend.backgroundColor,
-      color: e.value.style.chart.legend.color,
-      fontSize: e.value.style.chart.legend.fontSize,
-      paddingBottom: 12,
-      fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
-    }));
-    function dt(t) {
-      B.value = null, z.value.includes(t.id) ? z.value = z.value.filter((o) => o !== t.id) : z.value.length < k.dataset.length - 1 && z.value.push(t.id), $("selectLegend", st.value);
-    }
-    function Vt({ datapoint: t, seriesIndex: o }) {
-      B.value = null, N.value = !1, e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: o });
-    }
-    const Le = y(null);
-    function Et({ datapoint: t, seriesIndex: o }) {
-      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: o }), B.value = t, Le.value = { datapoint: t, seriesIndex: o, config: e.value, series: ie.value };
-      const l = e.value.style.chart.tooltip.customFormat;
-      if (xt(l) && cl(() => l({
-        seriesIndex: o,
-        datapoint: t,
-        series: ie.value,
-        config: e.value
-      })))
-        Oe.value = l({
-          seriesIndex: o,
-          datapoint: t,
-          series: ie.value,
-          config: e.value
-        });
-      else {
-        let a = "";
-        a += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${t.name}</div>`, a += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><rect x="0" y="0" height="12" width="12" stroke="none" fill="${t.color}"/></svg>`, a += `<b>${xe(
-          e.value.style.chart.layout.labels.formatter,
-          t.value,
-          he({
-            p: e.value.style.chart.layout.labels.prefix,
-            v: t.value,
-            s: e.value.style.chart.layout.labels.suffix,
-            r: e.value.style.chart.tooltip.roundingValue
-          }),
-          { datapoint: t, seriesIndex: o }
-        )}</b>`, Oe.value = `<div>${a}</div>`;
-      }
-      N.value = !0;
-    }
-    const E = m(() => {
-      const t = ce.value.map((l) => ({
-        name: l.name,
-        color: l.color
-      })), o = ce.value.map((l) => l.value);
-      return { head: t, body: o };
-    });
-    function ze(t = null) {
-      ll(() => {
-        const o = E.value.head.map((c, A) => [[
-          c.name
-        ], [E.value.body[A]], [isNaN(E.value.body[A] / ae.value) ? "-" : E.value.body[A] / ae.value * 100]]), l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(o), a = rl(l);
-        t ? t(a) : il({ csvContent: a, title: e.value.style.chart.title.text || "vue-ui-treemap" });
-      });
-    }
-    const ge = m(() => {
-      const t = [
-        e.value.table.columnNames.series,
-        e.value.table.columnNames.value,
-        e.value.table.columnNames.percentage
-      ], o = E.value.head.map((c, A) => {
-        const be = xe(
-          e.value.style.chart.layout.labels.formatter,
-          E.value.body[A],
-          he({
-            p: e.value.style.chart.layout.labels.prefix,
-            v: E.value.body[A],
-            s: e.value.style.chart.layout.labels.suffix,
-            r: e.value.table.td.roundingValue
-          })
-        );
-        return [
-          {
-            color: c.color,
-            name: c.name,
-            shape: "square"
-          },
-          be,
-          isNaN(E.value.body[A] / ae.value) ? "-" : he({
-            v: E.value.body[A] / ae.value * 100,
-            s: "%",
-            r: e.value.table.td.roundingPercentage
-          })
-        ];
-      }), l = {
-        th: {
-          backgroundColor: e.value.table.th.backgroundColor,
-          color: e.value.table.th.color,
-          outline: e.value.table.th.outline
-        },
-        td: {
-          backgroundColor: e.value.table.td.backgroundColor,
-          color: e.value.table.td.color,
-          outline: e.value.table.td.outline
-        },
-        breakpoint: e.value.table.responsiveBreakpoint
-      };
-      return {
-        colNames: [
-          e.value.table.columnNames.series,
-          e.value.table.columnNames.value
-        ],
-        head: t,
-        body: o,
-        config: l
-      };
-    });
-    function Ht() {
-      return ce.value;
-    }
-    function ht() {
-      D.value.showTable = !D.value.showTable;
-    }
-    function pt() {
-      D.value.showTooltip = !D.value.showTooltip;
-    }
-    const me = y(!1);
-    function Be() {
-      me.value = !me.value;
-    }
-    const ye = y(null);
-    function ft(t) {
-      ye.value = t;
-    }
-    function gt() {
-      ye.value = null;
-    }
-    async function Ut({ scale: t = 2 } = {}) {
-      if (!V.value) return;
-      const { width: o, height: l } = V.value.getBoundingClientRect(), a = o / l, { imageUri: c, base64: A } = await bl({ domElement: V.value, base64: !0, img: !0, scale: t });
-      return {
-        imageUri: c,
-        base64: A,
-        title: e.value.style.chart.title.text,
-        width: o,
-        height: l,
-        aspectRatio: a
-      };
-    }
-    const ve = m(() => {
-      const t = e.value.table.useDialog && !e.value.table.show, o = D.value.showTable;
-      return {
-        component: t ? U : p,
-        title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
-        props: t ? {
-          backgroundColor: e.value.table.th.backgroundColor,
-          color: e.value.table.th.color,
-          headerColor: e.value.table.th.color,
-          headerBg: e.value.table.th.backgroundColor,
-          isFullscreen: K.value,
-          fullscreenParent: V.value,
-          forcedWidth: Math.min(800, window.innerWidth * 0.8)
-        } : {
-          hideDetails: !0,
-          config: {
-            open: o,
-            maxHeight: 1e4,
-            body: {
-              backgroundColor: e.value.style.chart.backgroundColor,
-              color: e.value.style.chart.color
-            },
-            head: {
-              backgroundColor: e.value.style.chart.backgroundColor,
-              color: e.value.style.chart.color
-            }
-          }
-        }
-      };
-    });
-    ke(() => D.value.showTable, (t) => {
-      e.value.table.show || (t && e.value.table.useDialog && ue.value ? ue.value.open() : "close" in ue.value && ue.value.close());
-    });
-    function mt() {
-      D.value.showTable = !1, Ie.value && Ie.value.setTableIconState(!1);
-    }
-    const Wt = m(() => Re.value.map((t) => ({
-      ...t,
-      name: t.display
-    }))), Gt = m(() => e.value.style.chart.backgroundColor), Xt = m(() => e.value.style.chart.legend), qt = m(() => e.value.style.chart.title), { exportSvg: Yt, getSvg: jt } = $l({
-      svg: Ne,
-      title: qt,
-      legend: Xt,
-      legendItems: Wt,
-      backgroundColor: Gt
-    });
-    async function yt({ isCb: t }) {
-      if (t) {
-        const { blob: o, url: l, text: a, dataUrl: c } = await jt();
-        e.value.userOptions.callbacks.svg({ blob: o, url: l, text: a, dataUrl: c });
-      } else
-        Yt();
-    }
-    return r({
-      getData: Ht,
-      getImage: Ut,
-      generateCsv: ze,
-      generateImage: lt,
-      generateSvg: yt,
-      generatePdf: tt,
-      toggleTable: ht,
-      toggleTooltip: pt,
-      toggleAnnotator: Be,
-      toggleFullscreen: vt
-    }), (t, o) => (h(), b("div", {
-      ref_key: "treemapChart",
-      ref: V,
-      class: Me(`vue-data-ui-component vue-ui-treemap ${K.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
-      style: R(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height: 100%;" : ""} text-align:center;background:${e.value.style.chart.backgroundColor}`),
-      id: `treemap_${S.value}`,
-      onMouseenter: o[2] || (o[2] = () => d(Ke)(!0)),
-      onMouseleave: o[3] || (o[3] = () => d(Ke)(!1))
-    }, [
-      e.value.userOptions.buttons.annotator ? (h(), Z(d(u), {
-        key: 0,
-        svgRef: d(Ne),
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        active: me.value,
-        onClose: Be
-      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : O("", !0),
-      Nt.value ? (h(), b("div", {
-        key: 1,
-        ref_key: "noTitle",
-        ref: Ye,
-        class: "vue-data-ui-no-title-space",
-        style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : O("", !0),
-      e.value.style.chart.title.text ? (h(), b("div", {
-        key: 2,
-        ref_key: "chartTitle",
-        ref: Ge,
-        style: R(`width:100%;background:${e.value.style.chart.backgroundColor};padding-bottom:6px`)
-      }, [
-        (h(), Z(kl, {
-          key: `title_${je.value}`,
-          config: {
-            title: {
-              cy: "treemap-div-title",
-              ...e.value.style.chart.title
-            },
-            subtitle: {
-              cy: "treemap-div-subtitle",
-              ...e.value.style.chart.title.subtitle
-            }
-          }
-        }, null, 8, ["config"]))
-      ], 4)) : O("", !0),
-      _("div", {
-        id: `legend-top-${S.value}`
-      }, null, 8, Pl),
-      e.value.userOptions.show && F.value && (d(Je) || d(De)) ? (h(), Z(d(g), {
-        ref_key: "userOptionsRef",
-        ref: Ie,
-        key: `user_option_${We.value}`,
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        isPrinting: d(Qe),
-        isImaging: d(et),
-        uid: S.value,
-        hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
-        hasPdf: e.value.userOptions.buttons.pdf,
-        hasXls: e.value.userOptions.buttons.csv,
-        hasImg: e.value.userOptions.buttons.img,
-        hasSvg: e.value.userOptions.buttons.svg,
-        hasTable: e.value.userOptions.buttons.table,
-        hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: K.value,
-        isTooltip: D.value.showTooltip,
-        titles: { ...e.value.userOptions.buttonTitles },
-        chartElement: V.value,
-        position: e.value.userOptions.position,
-        hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: me.value,
-        callbacks: e.value.userOptions.callbacks,
-        printScale: e.value.userOptions.print.scale,
-        tableDialog: e.value.table.useDialog,
-        onToggleFullscreen: vt,
-        onGeneratePdf: d(tt),
-        onGenerateCsv: ze,
-        onGenerateImage: d(lt),
-        onGenerateSvg: yt,
-        onToggleTable: ht,
-        onToggleTooltip: pt,
-        onToggleAnnotator: Be,
-        style: R({
-          visibility: d(Je) ? d(De) ? "visible" : "hidden" : "visible"
-        })
-      }, kt({ _: 2 }, [
-        t.$slots.menuIcon ? {
-          name: "menuIcon",
-          fn: T(({ isOpen: l, color: a }) => [
-            C(t.$slots, "menuIcon", te(le({ isOpen: l, color: a })), void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        t.$slots.optionTooltip ? {
-          name: "optionTooltip",
-          fn: T(() => [
-            C(t.$slots, "optionTooltip", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        t.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: T(() => [
-            C(t.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        t.$slots.optionCsv ? {
-          name: "optionCsv",
-          fn: T(() => [
-            C(t.$slots, "optionCsv", {}, void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        t.$slots.optionImg ? {
-          name: "optionImg",
-          fn: T(() => [
-            C(t.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "4"
-        } : void 0,
-        t.$slots.optionTable ? {
-          name: "optionTable",
-          fn: T(() => [
-            C(t.$slots, "optionTable", {}, void 0, !0)
-          ]),
-          key: "5"
-        } : void 0,
-        t.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: T(({ toggleFullscreen: l, isFullscreen: a }) => [
-            C(t.$slots, "optionFullscreen", te(le({ toggleFullscreen: l, isFullscreen: a })), void 0, !0)
-          ]),
-          key: "6"
-        } : void 0,
-        t.$slots.optionAnnotator ? {
-          name: "optionAnnotator",
-          fn: T(({ toggleAnnotator: l, isAnnotator: a }) => [
-            C(t.$slots, "optionAnnotator", te(le({ toggleAnnotator: l, isAnnotator: a })), void 0, !0)
-          ]),
-          key: "7"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasSvg", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : O("", !0),
-      j.value.length > 1 ? (h(), b("nav", {
-        key: 4,
-        class: "vue-ui-treemap-breadcrumbs",
-        "data-dom-to-png-ignore": "",
-        ref_key: "breadcrumbsNav",
-        ref: Ae
-      }, [
-        (h(!0), b(Ce, null, Ve(j.value, (l, a) => (h(), b("span", {
-          role: "button",
-          tabindex: a < j.value.length - 1 ? 0 : void 0,
-          key: l.id || "root",
-          onClick: (c) => a === j.value.length - 1 ? () => {
-          } : fe(l.node),
-          onKeydown: [
-            wt(Ee((c) => a === j.value.length - 1 ? void 0 : fe(l.node), ["prevent"]), ["enter"]),
-            wt(Ee((c) => a === j.value.length - 1 ? void 0 : fe(l.node), ["prevent"]), ["space"])
-          ],
-          class: "vue-ui-treemap-crumb",
-          "data-last-crumb": a === j.value.length - 1,
-          style: R({
-            color: e.value.style.chart.color
-          }),
-          onMouseenter: (c) => ft(a),
-          onMouseleave: gt,
-          onFocus: (c) => ft(a),
-          onBlur: gt
-        }, [
-          _("span", Ll, [
-            _("span", zl, [
-              C(t.$slots, "breadcrumb-label", He({ ref_for: !0 }, { crumb: l, isRoot: a === 0, isFocus: ye.value === a }), () => [
-                a === 0 ? (h(), b("div", Bl, [
-                  we(_t, {
-                    name: ye.value === 0 ? "homeFilled" : "home",
-                    stroke: e.value.style.chart.color
-                  }, null, 8, ["name", "stroke"])
-                ])) : (h(), b(Ce, { key: 1 }, [
-                  $e(se(l.label), 1)
-                ], 64))
-              ], !0)
-            ]),
-            a < j.value.length - 1 ? (h(), b("span", Ml, [
-              C(t.$slots, "breadcrumb-arrow", {}, () => [
-                o[4] || (o[4] = $e(" › ", -1))
-              ], !0)
-            ])) : O("", !0)
-          ])
-        ], 44, Rl))), 128))
-      ], 512)) : O("", !0),
-      (h(), b("svg", {
-        ref_key: "svgRef",
-        ref: Ne,
-        xmlns: d(ul),
-        class: Me({ "vue-data-ui-fullscreen--on": K.value, "vue-data-ui-fulscreen--off": !K.value, "vue-data-ui-zoom-plus": !Q.value, "vue-data-ui-zoom-minus": Q.value, loading: d(re) }),
-        viewBox: `${ne.value.startX} ${ne.value.startY} ${ne.value.width <= 0 ? 10 : ne.value.width} ${ne.value.height <= 0 ? 10 : ne.value.height}`,
-        style: R(`max-width:100%; overflow: hidden; background:transparent;color:${e.value.style.chart.color}`)
-      }, [
-        we(d(f)),
-        (h(!0), b(Ce, null, Ve(ce.value, (l, a) => (h(), b("g", {
-          key: `tgrad_${l.id}`
-        }, [
-          e.value.style.chart.layout.rects.gradient.show ? (h(), b("defs", El, [
-            _("radialGradient", {
-              id: `tgrad_${l.id}`,
-              gradientTransform: "translate(-1, -1.000001) scale(2, 2)"
-            }, [
-              _("stop", {
-                offset: "18%",
-                "stop-color": l.color
-              }, null, 8, Ul),
-              _("stop", {
-                offset: "100%",
-                "stop-color": d($t)(l.color, e.value.style.chart.layout.rects.gradient.intensity / 100)
-              }, null, 8, Wl)
-            ], 8, Hl)
-          ])) : O("", !0)
-        ]))), 128)),
-        (h(!0), b(Ce, null, Ve(ce.value, (l, a) => (h(), b("g", {
-          key: `k_${l.id}`
-        }, [
-          _("rect", {
-            x: l.x0,
-            y: l.y0,
-            height: it(l),
-            width: ct(l),
-            fill: M.value ? l.color : e.value.style.chart.layout.rects.gradient.show ? `url(#tgrad_${l.id})` : l.color,
-            rx: e.value.style.chart.layout.rects.borderRadius,
-            stroke: B.value && B.value.id === l.id ? e.value.style.chart.layout.rects.selected.stroke : e.value.style.chart.layout.rects.stroke,
-            "stroke-width": B.value && B.value.id === l.id ? e.value.style.chart.layout.rects.selected.strokeWidth : e.value.style.chart.layout.rects.strokeWidth,
-            onClick: Ee((c) => fe(l, a), ["stop"]),
-            onMouseenter: () => Et({
-              datapoint: l,
-              seriesIndex: a
-            }),
-            onMouseleave: (c) => Vt({ datapoint: l, seriesIndex: a }),
-            style: R(`opacity:${B.value ? B.value.id === l.id ? 1 : e.value.style.chart.layout.rects.selected.unselectedOpacity : 1}`),
-            class: Me([
-              "vue-ui-treemap-rect",
-              Bt(l) ? "vue-data-ui-zoom-plus" : Q.value ? "vue-data-ui-zoom-minus" : ""
-            ])
-          }, null, 46, Gl),
-          (h(), b("foreignObject", {
-            x: l.x0,
-            y: l.y0,
-            height: it(l),
-            width: ct(l),
-            class: "vue-ui-treemap-cell-foreignObject"
-          }, [
-            _("div", {
-              style: R({
-                width: `calc(100% - ${q(l) / 1.5}px)`,
-                height: `calc(100% - ${q(l) / 1.5}px)`,
-                padding: `${q(l) / 3}px`,
-                lineHeight: `${q(l)}px`
-              }),
-              class: "vue-ui-treemap-cell"
-            }, [
-              e.value.style.chart.layout.labels.showDefaultLabels && (l.proportion > e.value.style.chart.layout.labels.hideUnderProportion || Q.value) ? (h(), b("div", {
-                key: 0,
-                class: "vue-ui-treemap-cell-default",
-                style: R(`width:calc(100% - ${q(l) / 1.5}px);text-align:left; color:${d(Tt)(l.color)}`)
-              }, [
-                _("span", {
-                  style: R(`width:100%;font-size:${q(l)}px;`)
-                }, se(l.name), 5),
-                o[5] || (o[5] = _("br", null, null, -1)),
-                _("span", {
-                  style: R(`width:100%;font-size:${q(l)}px;`)
-                }, se(d(xe)(
-                  e.value.style.chart.layout.labels.formatter,
-                  l.value,
-                  d(he)({
-                    p: e.value.style.chart.layout.labels.prefix,
-                    v: l.value,
-                    s: e.value.style.chart.layout.labels.suffix,
-                    r: e.value.style.chart.layout.labels.rounding
-                  }),
-                  { datapoint: l }
-                )), 5)
-              ], 4)) : O("", !0),
-              d(re) ? O("", !0) : C(t.$slots, "rect", He({
-                key: 1,
-                ref_for: !0
-              }, {
-                rect: l,
-                shouldShow: l.proportion > e.value.style.chart.layout.labels.hideUnderProportion || Q.value,
-                fontSize: q(l),
-                isZoom: Q.value,
-                textColor: d(Tt)(l.color)
-              }), void 0, !0)
-            ], 4)
-          ], 8, Xl))
-        ]))), 128)),
-        C(t.$slots, "svg", te(le({ svg: J.value, isZoom: Q.value, rect: B.value, config: e.value })), void 0, !0)
-      ], 14, Vl)),
-      t.$slots.watermark ? (h(), b("div", ql, [
-        C(t.$slots, "watermark", te(le({ isPrinting: d(Qe) || d(et) })), void 0, !0)
-      ])) : O("", !0),
-      _("div", {
-        id: `legend-bottom-${S.value}`
-      }, null, 8, Yl),
-      Ze.value ? (h(), Z(el, {
-        key: 6,
-        to: e.value.style.chart.legend.position === "top" ? `#legend-top-${S.value}` : `#legend-bottom-${S.value}`
-      }, [
-        _("div", {
-          ref_key: "chartLegend",
-          ref: Xe
-        }, [
-          e.value.style.chart.legend.show ? (h(), Z(Cl, {
-            key: `legend_${Se.value}`,
-            legendSet: Re.value,
-            config: Mt.value,
-            id: `treemap_legend_${S.value}`,
-            onClickMarker: o[0] || (o[0] = ({ legend: l }) => dt(l))
-          }, {
-            item: T(({ legend: l, index: a }) => [
-              d(re) ? O("", !0) : (h(), b("div", {
-                key: 0,
-                onClick: (c) => dt(l),
-                style: R(`opacity:${z.value.includes(l.id) ? 0.5 : 1}`)
-              }, se(l.display), 13, jl))
-            ]),
-            _: 1
-          }, 8, ["legendSet", "config", "id"])) : C(t.$slots, "legend", {
-            key: 1,
-            legend: Re.value
-          }, void 0, !0)
-        ], 512)
-      ], 8, ["to"])) : O("", !0),
-      t.$slots.source ? (h(), b("div", {
-        key: 7,
-        ref_key: "source",
-        ref: qe,
-        dir: "auto"
-      }, [
-        C(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : O("", !0),
-      we(d(v), {
-        show: D.value.showTooltip && N.value,
-        backgroundColor: e.value.style.chart.tooltip.backgroundColor,
-        color: e.value.style.chart.tooltip.color,
-        fontSize: e.value.style.chart.tooltip.fontSize,
-        borderRadius: e.value.style.chart.tooltip.borderRadius,
-        borderColor: e.value.style.chart.tooltip.borderColor,
-        borderWidth: e.value.style.chart.tooltip.borderWidth,
-        backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
-        position: e.value.style.chart.tooltip.position,
-        offsetY: e.value.style.chart.tooltip.offsetY,
-        parent: V.value,
-        content: Oe.value,
-        isFullscreen: K.value,
-        isCustom: d(xt)(e.value.style.chart.tooltip.customFormat),
-        smooth: e.value.style.chart.tooltip.smooth,
-        backdropFilter: e.value.style.chart.tooltip.backdropFilter,
-        smoothForce: e.value.style.chart.tooltip.smoothForce,
-        smoothSnapThreshold: e.value.style.chart.tooltip.smoothSnapThreshold
-      }, {
-        "tooltip-before": T(() => [
-          C(t.$slots, "tooltip-before", te(le({ ...Le.value })), void 0, !0)
-        ]),
-        "tooltip-after": T(() => [
-          C(t.$slots, "tooltip-after", te(le({ ...Le.value })), void 0, !0)
-        ]),
-        _: 3
-      }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      F.value && e.value.userOptions.buttons.table ? (h(), Z(tl(ve.value.component), He({ key: 8 }, ve.value.props, {
-        ref_key: "tableUnit",
-        ref: ue,
-        onClose: mt
-      }), kt({
-        content: T(() => [
-          (h(), Z(d(i), {
-            key: `table_${_e.value}`,
-            colNames: ge.value.colNames,
-            head: ge.value.head,
-            body: ge.value.body,
-            config: ge.value.config,
-            title: e.value.table.useDialog ? "" : ve.value.title,
-            withCloseButton: !e.value.table.useDialog,
-            onClose: mt
-          }, {
-            th: T(({ th: l }) => [
-              _("div", {
-                innerHTML: l,
-                style: { display: "flex", "align-items": "center" }
-              }, null, 8, Zl)
-            ]),
-            td: T(({ td: l }) => [
-              $e(se(l.name || l), 1)
-            ]),
-            _: 1
-          }, 8, ["colNames", "head", "body", "config", "title", "withCloseButton"]))
-        ]),
-        _: 2
-      }, [
-        e.value.table.useDialog ? {
-          name: "title",
-          fn: T(() => [
-            $e(se(ve.value.title), 1)
-          ]),
-          key: "0"
-        } : void 0,
-        e.value.table.useDialog ? {
-          name: "actions",
-          fn: T(() => [
-            _("button", {
-              tabindex: "0",
-              class: "vue-ui-user-options-button",
-              onClick: o[1] || (o[1] = (l) => ze(e.value.userOptions.callbacks.csv))
-            }, [
-              we(_t, {
-                name: "excel",
-                stroke: ve.value.props.color
-              }, null, 8, ["stroke"])
-            ])
-          ]),
-          key: "1"
-        } : void 0
-      ]), 1040)) : O("", !0),
-      d(re) ? (h(), Z(fl, { key: 9 })) : O("", !0)
-    ], 46, Nl));
-  }
-}, po = /* @__PURE__ */ Tl(Kl, [["__scopeId", "data-v-a92570b3"]]);
-export {
-  po as default
-};