vue-data-ui 2.4.1 → 2.4.3

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

@@ -1,792 +0,0 @@
-import { computed as C, ref as y, watch as je, onMounted as Ye, onBeforeUnmount as Ze, openBlock as m, createElementBlock as k, normalizeClass as _e, normalizeStyle as V, createBlock as X, createCommentVNode as B, unref as b, createSlots as Je, withCtx as T, renderSlot as _, normalizeProps as q, guardReactiveProps as j, createVNode as Oe, Fragment as Se, renderList as Ne, createElementVNode as O, toDisplayString as Y, createTextVNode as ze, nextTick as Ke, pushScopeId as Qe, popScopeId as et } from "vue";
-import { u as tt, c as Ie, t as lt, a as ot, p as x, b as at, o as nt, e as st, d as oe, i as ae, f as K, X as rt, l as Pe, F as Fe, x as Le, y as ut, q as it, r as ct } from "./index-DDXisDKy.js";
-import { _ as dt } from "./Title-DYNLqCCT.js";
-import { u as vt, U as ht } from "./usePrinter-8ofTb2MJ.js";
-import { _ as ft } from "./Tooltip-CICAYyQj.js";
-import { L as pt } from "./Legend-DXLiSLHd.js";
-import gt from "./vue-ui-skeleton-B2sRnIXX.js";
-import { D as yt } from "./DataTable-DL2agEJ3.js";
-import mt from "./vue-ui-accordion-D_1fE5EF.js";
-import { t as bt, u as wt } from "./useResponsive-NZB-WLRF.js";
-import { u as Re } from "./useNestedProp-S1UXxUgm.js";
-import { _ as Ct } from "./PackageVersion-DtnhR89q.js";
-import { _ as kt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-function De(a, i) {
-  const s = a.length;
-  if (s === 0)
-    throw new Error(`Max aspect ratio cannot be computed: ${a} is an empty array`);
-  {
-    let n = 1 / 0, r = -1 / 0, c = 0;
-    for (let h = 0; h < s; h += 1) {
-      const v = a[h].normalizedValue;
-      v < n && (n = v), v > r && (r = v), c += v;
-    }
-    return Math.max(
-      i ** 2 * r / c ** 2,
-      c ** 2 / (i ** 2 * n)
-    );
-  }
-}
-function Ae(a) {
-  const { xOffset: i, yOffset: s, width: n, height: r } = a;
-  return {
-    x0: i,
-    y0: s,
-    x1: i + n,
-    y1: s + r
-  };
-}
-function xt(a, i, s) {
-  if (a.length === 0)
-    return !0;
-  {
-    const n = a.concat(i), r = De(
-      a,
-      s
-    ), c = De(n, s);
-    return r >= c;
-  }
-}
-function $t(a) {
-  const i = [], s = a.length;
-  for (let n = 0; n < s; n += 1) {
-    const r = a[n], c = r.length;
-    for (let d = 0; d < c; d += 1)
-      i.push(r[d]);
-  }
-  return i;
-}
-function Tt(a, i) {
-  const s = {
-    ...i,
-    children: a
-  };
-  return Ve(s);
-}
-function _t(a) {
-  return (a.x1 - a.x0) * (a.y1 - a.y0);
-}
-function Me(a, i) {
-  const { width: s, height: n, xOffset: r, yOffset: c } = ue(i), d = a.length, h = a.map((p) => p.normalizedValue || 0).reduce((p, $) => p + $, 0), v = h / n, S = h / s;
-  let w = r, N = c;
-  const f = [];
-  if (s >= n) {
-    for (let p = 0; p < d; p += 1) {
-      const $ = a[p], z = N + $.normalizedValue / v, R = {
-        x0: w,
-        y0: N,
-        x1: w + v,
-        y1: z
-      }, I = Object.assign({}, $, R);
-      N = z, f.push(I);
-    }
-    return f;
-  } else {
-    for (let p = 0; p < d; p += 1) {
-      const $ = a[p], z = w + $.normalizedValue / S, R = {
-        x0: w,
-        y0: N,
-        x1: z,
-        y1: N + S
-      }, I = Object.assign({}, $, R);
-      w = z, f.push(I);
-    }
-    return f;
-  }
-}
-function Ot(a) {
-  const i = ue(a), s = i.width, n = i.height;
-  return Math.min(s, n);
-}
-function St(a, i) {
-  const s = a.length, n = a.map((v) => v.value ?? 0).reduce((v, S) => v + S, 0), r = i / n, c = [];
-  let d, h;
-  for (let v = 0; v < s; v += 1)
-    h = a[v], d = Object.assign({}, h, {
-      normalizedValue: h.value * (r || 0)
-    }), c.push(d);
-  return c;
-}
-function ue(a) {
-  const { x0: i, y0: s, x1: n, y1: r } = a;
-  return {
-    xOffset: i,
-    yOffset: s,
-    width: n - i,
-    height: r - s
-  };
-}
-function Nt(a, i, s, n) {
-  let r = a, c = i, d = s, h = n;
-  for (; ; ) {
-    const v = r.length;
-    if (v === 0) {
-      const f = Me(c, d);
-      return h.concat(f);
-    }
-    const S = Ot(d), w = r[0], N = r.slice(1, v);
-    if (xt(c, w, S)) {
-      const f = c.concat(w);
-      r = N, c = f, d = d, h = h;
-    } else {
-      const f = c.length;
-      let p = 0;
-      for (let I = 0; I < f; I += 1)
-        p += c[I].normalizedValue;
-      const $ = zt(d, p), z = Me(c, d), R = h.concat(z);
-      r = r, c = [], d = $, h = R;
-    }
-  }
-}
-function Ve(a) {
-  if (typeof a.children > "u" || !a.children.length)
-    return [a];
-  {
-    const i = St(
-      a.children,
-      _t(a)
-    ), s = Nt(i, [], a, []), n = s.length, r = [];
-    for (let d = 0; d < n; d += 1)
-      r.push(Ve(s[d]));
-    return $t(r);
-  }
-}
-function zt(a, i) {
-  const { width: s, height: n, xOffset: r, yOffset: c } = ue(a);
-  if (s >= n) {
-    const d = i / n, h = s - d, v = {
-      xOffset: r + d,
-      yOffset: c,
-      width: h,
-      height: n
-    };
-    return Ae(v);
-  } else {
-    const d = i / s, h = n - d, v = {
-      xOffset: r,
-      yOffset: c + d,
-      width: s,
-      height: h
-    };
-    return Ae(v);
-  }
-}
-const It = (a) => (Qe("data-v-f7f2df00"), a = a(), et(), a), Pt = ["id"], Ft = ["xmlns", "viewBox"], Lt = { key: 0 }, Rt = ["id"], Dt = ["stop-color"], At = ["stop-color"], Mt = ["x", "y", "height", "width", "fill", "rx", "stroke", "stroke-width", "onClick", "onMouseenter"], Vt = ["x", "y", "height", "width"], Bt = {
-  style: { width: "100%", height: "100%" },
-  class: "vue-ui-treemap-cell"
-}, Wt = /* @__PURE__ */ It(() => /* @__PURE__ */ O("br", null, null, -1)), Ht = {
-  key: 3,
-  class: "vue-data-ui-watermark"
-}, Et = ["onClick"], Ut = { key: 0 }, Gt = { key: 1 }, Xt = ["innerHTML"], qt = {
-  __name: "vue-ui-treemap",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-  emits: ["selectLegend", "selectDatapoint"],
-  setup(a, { expose: i, emit: s }) {
-    const n = a, { vue_ui_treemap: r } = tt(), c = C(() => !!n.dataset && n.dataset.length), d = C(() => /^((?!chrome|android).)*safari/i.test(navigator.userAgent)), h = y(Ie()), v = y(!1), S = y(""), w = y(!1), N = y(0), f = y([]), p = y(null), $ = y(null), z = y(null), R = y(0), I = y(0), ie = y(0), e = C({
-      get: () => ce(),
-      set: (t) => t
-    });
-    function ce() {
-      const t = Re({
-        userConfig: n.config,
-        defaultConfig: r
-      });
-      return t.theme ? {
-        ...Re({
-          userConfig: lt.vue_ui_treemap[t.theme] || n.config,
-          defaultConfig: t
-        }),
-        customPalette: ot[t.theme] || x
-      } : t;
-    }
-    je(() => n.config, (t) => {
-      e.value = ce(), R.value += 1, I.value += 1, ie.value += 1;
-    }, { deep: !0 });
-    const { isPrinting: de, isImaging: ve, generatePdf: he, generateImage: fe } = vt({
-      elementId: `treemap_${h.value}`,
-      fileName: e.value.style.chart.title.text || "vue-ui-treemap"
-    }), Q = C(() => at(e.value.customPalette)), D = y({
-      showTable: e.value.table.show,
-      showTooltip: e.value.style.chart.tooltip.show
-    }), A = y({
-      height: e.value.style.chart.height,
-      width: e.value.style.chart.width
-    }), W = C(() => ({
-      bottom: A.value.height - e.value.style.chart.padding.bottom,
-      height: A.value.height - e.value.style.chart.padding.top - e.value.style.chart.padding.bottom,
-      left: e.value.style.chart.padding.left,
-      right: A.value.width - e.value.style.chart.padding.right,
-      top: e.value.style.chart.padding.top,
-      vbHeight: A.value.height,
-      vbWidth: A.value.width,
-      width: A.value.width - e.value.style.chart.padding.left - e.value.style.chart.padding.right
-    }));
-    function pe(t) {
-      t.forEach((o, l) => {
-        o.id = Ie(), o.color = oe(o.color) || Q.value[l] || x[l] || x[l % x.length], o.children && (o.children.forEach((u) => {
-          u.parentId = o.id, u.color = o.color;
-        }), pe(o.children));
-      });
-    }
-    const H = y(n.dataset), ee = y(null);
-    Ye(() => {
-      Be();
-    });
-    function Be() {
-      if (nt(n.dataset) && st({
-        componentName: "VueUiTreemap",
-        type: "dataset"
-      }), pe(H.value), e.value.responsive) {
-        const t = bt(() => {
-          const { width: o, height: l } = wt({
-            chart: p.value,
-            title: e.value.style.chart.title.text ? $.value : null,
-            legend: e.value.style.chart.legend.show ? z.value : null
-          });
-          A.value.width = o, A.value.height = l;
-        });
-        ee.value = new ResizeObserver(t), ee.value.observe(p.value.parentNode);
-      }
-    }
-    Ze(() => {
-      ee.value && ee.value.disconnect();
-    });
-    const ne = y(H.value), Z = C(() => ne.value.map((t, o) => ({
-      ...t,
-      color: oe(t.color) || Q.value[o] || x[o] || x[o % x.length]
-    })).filter((t) => !f.value.includes(t.id))), U = C(() => H.value.filter((t) => !f.value.includes(t.id)).map((t) => t.value || 0).reduce((t, o) => t + o, 0)), ge = C({
-      get() {
-        let t = [...Z.value];
-        return e.value.style.chart.layout.sorted && (t = [...Z.value].sort((o, l) => l.value - o.value)), t.map((o) => ({
-          ...o
-        }));
-      },
-      set(t) {
-        return t;
-      }
-    });
-    function ye(t, o) {
-      return t.value / o;
-    }
-    function We(t, o, l) {
-      const u = e.value.style.chart.layout.rects.colorRatio - ye(o, l);
-      return Pe(t, u < 0 ? 0 : u);
-    }
-    function me(t, o, l, u) {
-      return t.map((g, M) => {
-        const le = We(oe(o) || Q.value[M] || x[M] || x[M % x.length], g, u), qe = ye(g, u);
-        return {
-          ...g,
-          color: le,
-          proportion: qe,
-          parentName: l,
-          children: g.children ? me(g.children, le, g.name, u) : void 0
-        };
-      });
-    }
-    const J = C(() => Tt(
-      ge.value.map((t, o) => {
-        const l = t.children ? t.children.reduce((u, g) => u + g.value, 0) : t.value;
-        return {
-          value: t.value,
-          id: t.id,
-          children: t.children ? me(t.children.sort((u, g) => g.value - u.value), t.color, t.name, l) : void 0,
-          color: t.color,
-          name: t.name
-        };
-      }),
-      { x0: W.value.left * 2, y0: W.value.top, x1: W.value.width, y1: W.value.height }
-    ));
-    function be({ y0: t, y1: o }) {
-      return o - t <= 0 ? 1e-4 : o - t;
-    }
-    function we({ x0: t, x1: o }) {
-      return o - t <= 0 ? 1e-4 : o - t;
-    }
-    function E(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 He(t) {
-      w.value = t, N.value += 1;
-    }
-    const G = C(() => ({
-      startX: 0,
-      startY: 0,
-      width: W.value.vbWidth,
-      height: W.value.vbHeight
-    })), P = y(!1);
-    function se(t, o = H.value) {
-      for (const l of o) {
-        if (l.id === t)
-          return l;
-        if (l.children) {
-          const u = se(t, l.children);
-          if (u)
-            return u;
-        }
-      }
-      return null;
-    }
-    function Ee(t) {
-      if (P.value)
-        s("selectDatapoint", void 0), ne.value = H.value;
-      else {
-        if (s("selectDatapoint", t), !se(t.parentId))
-          return;
-        ne.value = [se(t.parentId)];
-      }
-      P.value = !P.value;
-    }
-    const F = y(null), Ce = C(() => H.value.map((t, o) => ({
-      ...t,
-      color: oe(t.color) || Q.value[o] || x[o] || x[o % x.length],
-      shape: "square"
-    })).sort((t, o) => o.value - t.value).map((t, o) => ({
-      ...t,
-      proportion: t.value / H.value.map((l) => l.value).reduce((l, u) => l + u, 0),
-      opacity: f.value.includes(t.id) ? 0.5 : 1
-    }))), Ue = C(() => ({
-      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 ke(t) {
-      P.value = !1, F.value = null, f.value.includes(t.id) ? f.value = f.value.filter((o) => o !== t.id) : f.value.length < n.dataset.length - 1 && f.value.push(t.id), s("selectLegend", ge.value);
-    }
-    const re = y(null);
-    function Ge({ datapoint: t, seriesIndex: o }) {
-      F.value = t, re.value = { datapoint: t, seriesIndex: o, config: e.value, series: Z.value };
-      const l = e.value.style.chart.tooltip.customFormat;
-      if (Le(l) && ut(() => l({
-        seriesIndex: o,
-        datapoint: t,
-        series: Z.value,
-        config: e.value
-      })))
-        S.value = l({
-          seriesIndex: o,
-          datapoint: t,
-          series: Z.value,
-          config: e.value
-        });
-      else {
-        let u = "";
-        u += `<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>`, u += `<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>`, u += `<b>${ae(
-          e.value.style.chart.layout.labels.formatter,
-          t.value,
-          K({
-            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>`, S.value = `<div>${u}</div>`;
-      }
-      v.value = !0;
-    }
-    const L = C(() => {
-      const t = J.value.map((l) => ({
-        name: l.name,
-        color: l.color
-      })), o = J.value.map((l) => l.value);
-      return { head: t, body: o };
-    });
-    function xe() {
-      Ke(() => {
-        const t = L.value.head.map((u, g) => [[
-          u.name
-        ], [L.value.body[g]], [isNaN(L.value.body[g] / U.value) ? "-" : L.value.body[g] / U.value * 100]]), o = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(t), l = it(o);
-        ct({ csvContent: l, title: e.value.style.chart.title.text || "vue-ui-treemap" });
-      });
-    }
-    const te = C(() => {
-      const t = [
-        e.value.table.columnNames.series,
-        e.value.table.columnNames.value,
-        e.value.table.columnNames.percentage
-      ], o = L.value.head.map((g, M) => {
-        const le = ae(
-          e.value.style.chart.layout.labels.formatter,
-          L.value.body[M],
-          K({
-            p: e.value.style.chart.layout.labels.prefix,
-            v: L.value.body[M],
-            s: e.value.style.chart.layout.labels.suffix,
-            r: e.value.table.td.roundingValue
-          })
-        );
-        return [
-          {
-            color: g.color,
-            name: g.name,
-            shape: "square"
-          },
-          le,
-          isNaN(L.value.body[M] / U.value) ? "-" : K({
-            v: L.value.body[M] / U.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 Xe() {
-      return J.value;
-    }
-    function $e() {
-      D.value.showTable = !D.value.showTable;
-    }
-    function Te() {
-      D.value.showTooltip = !D.value.showTooltip;
-    }
-    return i({
-      getData: Xe,
-      generateCsv: xe,
-      generateImage: fe,
-      generatePdf: he,
-      toggleTable: $e,
-      toggleTooltip: Te
-    }), (t, o) => (m(), k("div", {
-      ref_key: "treemapChart",
-      ref: p,
-      class: _e(`vue-ui-treemap ${w.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
-      style: V(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height: 100%;" : ""} text-align:center;${e.value.style.chart.title.text ? "" : "padding-top:36px"};background:${e.value.style.chart.backgroundColor}`),
-      id: `treemap_${h.value}`
-    }, [
-      e.value.style.chart.title.text ? (m(), k("div", {
-        key: 0,
-        ref_key: "chartTitle",
-        ref: $,
-        style: V(`width:100%;background:${e.value.style.chart.backgroundColor};padding-bottom:6px`)
-      }, [
-        (m(), X(dt, {
-          key: `title_${R.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)) : B("", !0),
-      e.value.userOptions.show && c.value ? (m(), X(ht, {
-        ref: "details",
-        key: `user_option_${N.value}`,
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        isPrinting: b(de),
-        isImaging: b(ve),
-        uid: h.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,
-        hasTable: e.value.userOptions.buttons.table,
-        hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: w.value,
-        isTooltip: D.value.showTooltip,
-        titles: { ...e.value.userOptions.buttonTitles },
-        chartElement: p.value,
-        position: e.value.userOptions.position,
-        onToggleFullscreen: He,
-        onGeneratePdf: b(he),
-        onGenerateCsv: xe,
-        onGenerateImage: b(fe),
-        onToggleTable: $e,
-        onToggleTooltip: Te
-      }, Je({ _: 2 }, [
-        t.$slots.optionTooltip ? {
-          name: "optionTooltip",
-          fn: T(() => [
-            _(t.$slots, "optionTooltip", {}, void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        t.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: T(() => [
-            _(t.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        t.$slots.optionCsv ? {
-          name: "optionCsv",
-          fn: T(() => [
-            _(t.$slots, "optionCsv", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        t.$slots.optionImg ? {
-          name: "optionImg",
-          fn: T(() => [
-            _(t.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        t.$slots.optionTable ? {
-          name: "optionTable",
-          fn: T(() => [
-            _(t.$slots, "optionTable", {}, void 0, !0)
-          ]),
-          key: "4"
-        } : void 0,
-        t.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: T(({ toggleFullscreen: l, isFullscreen: u }) => [
-            _(t.$slots, "optionFullscreen", q(j({ toggleFullscreen: l, isFullscreen: u })), void 0, !0)
-          ]),
-          key: "5"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "onGeneratePdf", "onGenerateImage"])) : B("", !0),
-      c.value ? (m(), k("svg", {
-        key: 2,
-        xmlns: b(rt),
-        class: _e({ "vue-data-ui-fullscreen--on": w.value, "vue-data-ui-fulscreen--off": !w.value, "vue-data-ui-zoom-plus": !P.value, "vue-data-ui-zoom-minus": P.value }),
-        viewBox: `${G.value.startX} ${G.value.startY} ${G.value.width <= 0 ? 10 : G.value.width} ${G.value.height <= 0 ? 10 : G.value.height}`,
-        style: V(`max-width:100%; overflow: hidden; background:transparent;color:${e.value.style.chart.color}`)
-      }, [
-        Oe(Ct),
-        (m(!0), k(Se, null, Ne(J.value, (l, u) => (m(), k("g", null, [
-          e.value.style.chart.layout.rects.gradient.show ? (m(), k("defs", Lt, [
-            O("radialGradient", {
-              id: `tgrad_${l.id}`,
-              gradientTransform: "translate(-1, -1.000001) scale(2, 2)"
-            }, [
-              O("stop", {
-                offset: "18%",
-                "stop-color": l.color
-              }, null, 8, Dt),
-              O("stop", {
-                offset: "100%",
-                "stop-color": b(Pe)(l.color, e.value.style.chart.layout.rects.gradient.intensity / 100)
-              }, null, 8, At)
-            ], 8, Rt)
-          ])) : B("", !0)
-        ]))), 256)),
-        (m(!0), k(Se, null, Ne(J.value, (l, u) => (m(), k("g", null, [
-          O("rect", {
-            x: l.x0,
-            y: l.y0,
-            height: be(l),
-            width: we(l),
-            fill: d.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: F.value && F.value.id === l.id ? e.value.style.chart.layout.rects.selected.stroke : e.value.style.chart.layout.rects.stroke,
-            "stroke-width": F.value && F.value.id === l.id ? e.value.style.chart.layout.rects.selected.strokeWidth : e.value.style.chart.layout.rects.strokeWidth,
-            onClick: (g) => Ee(l),
-            onMouseenter: () => Ge({
-              datapoint: l,
-              seriesIndex: u
-            }),
-            onMouseleave: o[0] || (o[0] = (g) => {
-              F.value = null, v.value = !1;
-            }),
-            style: V(`opacity:${F.value ? F.value.id === l.id ? 1 : e.value.style.chart.layout.rects.selected.unselectedOpacity : 1}`),
-            class: "vue-ui-treemap-rect"
-          }, null, 44, Mt),
-          (m(), k("foreignObject", {
-            x: l.x0,
-            y: l.y0,
-            height: be(l),
-            width: we(l),
-            class: "vue-ui-treemap-cell-foreignObject"
-          }, [
-            O("div", Bt, [
-              e.value.style.chart.layout.labels.showDefaultLabels && (l.proportion > e.value.style.chart.layout.labels.hideUnderProportion || P.value) ? (m(), k("div", {
-                key: 0,
-                class: "vue-ui-treemap-cell-default",
-                style: V(`width:calc(100% - ${E(l) / 1.5}px);text-align:left;line-height:${E(l) < 14 ? 14 : E(l)}px;padding:${E(l) / 3}px; color:${b(Fe)(l.color)}`)
-              }, [
-                O("span", {
-                  style: V(`width:100%;font-size:${E(l)}px;`)
-                }, Y(l.name), 5),
-                Wt,
-                O("span", {
-                  style: V(`width:100%;font-size:${E(l)}px;`)
-                }, Y(b(ae)(
-                  e.value.style.chart.layout.labels.formatter,
-                  l.value,
-                  b(K)({
-                    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)) : B("", !0),
-              _(t.$slots, "rect", q(j({
-                rect: l,
-                shouldShow: l.proportion > e.value.style.chart.layout.labels.hideUnderProportion || P.value,
-                fontSize: E(l),
-                isZoom: P.value,
-                textColor: b(Fe)(l.color)
-              })), void 0, !0)
-            ])
-          ], 8, Vt))
-        ]))), 256)),
-        _(t.$slots, "svg", q(j({ svg: W.value, isZoom: P.value, rect: F.value, config: e.value })), void 0, !0)
-      ], 14, Ft)) : B("", !0),
-      t.$slots.watermark ? (m(), k("div", Ht, [
-        _(t.$slots, "watermark", q(j({ isPrinting: b(de) || b(ve) })), void 0, !0)
-      ])) : B("", !0),
-      c.value ? B("", !0) : (m(), X(gt, {
-        key: 4,
-        config: {
-          type: "treemap",
-          style: {
-            backgroundColor: e.value.style.chart.backgroundColor,
-            treemap: {
-              color: "#CCCCCC"
-            }
-          }
-        }
-      }, null, 8, ["config"])),
-      O("div", {
-        ref_key: "chartLegend",
-        ref: z
-      }, [
-        e.value.style.chart.legend.show ? (m(), X(pt, {
-          key: `legend_${ie.value}`,
-          legendSet: Ce.value,
-          config: Ue.value,
-          id: `treemap_legend_${h.value}`,
-          onClickMarker: o[1] || (o[1] = ({ legend: l }) => ke(l))
-        }, {
-          item: T(({ legend: l, index: u }) => [
-            O("div", {
-              onClick: (g) => ke(l),
-              style: V(`opacity:${f.value.includes(l.id) ? 0.5 : 1}`)
-            }, [
-              ze(Y(l.name) + ": " + Y(b(ae)(
-                e.value.style.chart.layout.labels.formatter,
-                l.value,
-                b(K)({
-                  p: e.value.style.chart.layout.labels.prefix,
-                  v: l.value,
-                  s: e.value.style.chart.layout.labels.suffix,
-                  r: e.value.style.chart.legend.roundingValue
-                }),
-                { datapoint: l }
-              )) + " ", 1),
-              f.value.includes(l.id) ? (m(), k("span", Gt, " ( - % ) ")) : (m(), k("span", Ut, " (" + Y(isNaN(l.value / U.value) ? "-" : (l.value / U.value * 100).toFixed(e.value.style.chart.legend.roundingPercentage)) + "%) ", 1))
-            ], 12, Et)
-          ]),
-          _: 1
-        }, 8, ["legendSet", "config", "id"])) : _(t.$slots, "legend", {
-          key: 1,
-          legend: Ce.value
-        }, void 0, !0)
-      ], 512),
-      Oe(ft, {
-        show: D.value.showTooltip && v.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: p.value,
-        content: S.value,
-        isCustom: b(Le)(e.value.style.chart.tooltip.customFormat)
-      }, {
-        "tooltip-before": T(() => [
-          _(t.$slots, "tooltip-before", q(j({ ...re.value })), void 0, !0)
-        ]),
-        "tooltip-after": T(() => [
-          _(t.$slots, "tooltip-after", q(j({ ...re.value })), void 0, !0)
-        ]),
-        _: 3
-      }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom"]),
-      c.value ? (m(), X(mt, {
-        key: 5,
-        hideDetails: "",
-        config: {
-          open: D.value.showTable,
-          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
-          }
-        }
-      }, {
-        content: T(() => [
-          (m(), X(yt, {
-            key: `table_${I.value}`,
-            colNames: te.value.colNames,
-            head: te.value.head,
-            body: te.value.body,
-            config: te.value.config,
-            title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
-            onClose: o[2] || (o[2] = (l) => D.value.showTable = !1)
-          }, {
-            th: T(({ th: l }) => [
-              O("div", {
-                innerHTML: l,
-                style: { display: "flex", "align-items": "center" }
-              }, null, 8, Xt)
-            ]),
-            td: T(({ td: l }) => [
-              ze(Y(l.name || l), 1)
-            ]),
-            _: 1
-          }, 8, ["colNames", "head", "body", "config", "title"]))
-        ]),
-        _: 1
-      }, 8, ["config"])) : B("", !0)
-    ], 14, Pt));
-  }
-}, rl = /* @__PURE__ */ kt(qt, [["__scopeId", "data-v-f7f2df00"]]);
-export {
-  rl as default
-};