vue-data-ui 2.3.2 → 2.3.4

package/dist/vue-ui-chestnut-BYHA6MT4.js

@@ -0,0 +1,1051 @@
+import { useCssVars as Pe, computed as $, ref as z, onMounted as Ve, openBlock as a, createElementBlock as o, normalizeClass as m, normalizeStyle as h, createBlock as Q, unref as y, createSlots as Re, withCtx as E, renderSlot as X, normalizeProps as Be, guardReactiveProps as Me, createCommentVNode as b, toDisplayString as n, createElementVNode as s, Fragment as p, renderList as _, createTextVNode as Y, withKeys as je, createVNode as Xe, nextTick as ve } from "vue";
+import { u as Oe, c as Ge, t as Ee, a as Ae, p as I, b as Ue, g as Z, e as H, d as ee, o as De, X as Ye, s as ye, r as F, C as he, m as fe, i as qe, j as L, k as q, n as He, q as We } from "./index-uOtklCCx.js";
+import { u as Ke, U as Je } from "./usePrinter-B6xQCyL-.js";
+import Qe from "./vue-ui-skeleton-BM9rwmxY.js";
+import Ze from "./BaseIcon-7_g11dRj.js";
+import et from "./vue-ui-accordion-HJPf7My0.js";
+import { u as be } from "./useNestedProp-BgWkUab_.js";
+import { _ as tt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const lt = ["id"], at = ["xmlns", "viewBox"], ot = { key: 0 }, st = ["fill", "font-weight", "font-size", "x", "y"], ut = ["fill", "font-weight", "font-size", "x", "y"], nt = ["id"], rt = ["stop-color"], it = ["stop-color"], ct = ["id"], dt = ["stop-color"], vt = ["stop-color"], yt = ["id"], ht = ["stop-color"], ft = ["stop-color"], bt = ["stop-color"], pt = ["id"], _t = ["stop-color"], gt = ["stop-color"], xt = ["stop-color"], mt = ["id"], kt = ["stop-color"], wt = ["stop-color"], $t = ["stop-color"], Ct = { key: 1 }, zt = ["x", "y", "font-size", "font-weight", "fill"], Tt = ["x", "y", "font-size", "font-weight", "fill"], Ft = ["d", "stroke"], Nt = ["cx", "cy", "r", "fill"], St = ["cx", "cy", "r", "fill", "stroke", "stroke-width", "onClick"], It = { key: 2 }, Lt = ["x", "y", "font-size", "fill", "onClick"], Pt = { key: 0 }, Vt = ["x", "y", "fill", "font-size", "font-weight"], Rt = ["x", "y", "height", "width", "fill", "rx", "onClick"], Bt = ["x", "y", "height", "width", "fill", "rx", "stroke", "stroke-width", "onClick"], Mt = { key: 3 }, jt = ["x", "y", "fill", "font-size", "onClick"], Xt = ["d", "stroke"], Ot = ["cx", "cy", "fill", "onClick"], Gt = ["fill", "cx", "cy", "r", "onClick"], Et = { key: 4 }, At = ["x", "y", "font-size", "font-weight", "fill"], Ut = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Dt = ["y", "height", "width"], Yt = { style: { width: "100%", height: "100%", display: "flex", "align-items": "center", "justify-content": "center", "flex-direction": "column" } }, qt = { style: { display: "flex", "align-items": "center", "justify-content": "center", gap: "12px", "flex-wrap": "wrap", "flex-direction": "row" } }, Ht = {
+  viewBox: "0 0 20 20",
+  height: "16",
+  width: "16"
+}, Wt = ["fill"], Kt = { key: 6 }, Jt = ["y", "height", "width"], Qt = { style: { width: "100%", height: "100%", display: "flex", "align-items": "center", "justify-content": "center", "flex-direction": "column" } }, Zt = { style: { display: "flex", "align-items": "center", "justify-content": "center", gap: "12px", "flex-wrap": "wrap", "flex-direction": "row" } }, el = {
+  viewBox: "0 0 20 20",
+  height: "16",
+  width: "16"
+}, tl = ["fill"], ll = ["d", "stroke"], al = ["cx", "cy", "fill"], ol = ["cx", "cy", "fill"], sl = ["d", "stroke"], ul = ["cx", "cy", "fill"], nl = ["cx", "cy", "fill"], rl = ["x", "y", "fill", "font-size", "font-weight"], il = ["x", "y", "fill", "font-size", "font-weight"], cl = ["x", "text-anchor", "y", "fill", "font-size"], dl = ["x", "text-anchor", "y", "fill", "font-size"], vl = ["x", "text-anchor", "y", "fill", "font-size"], yl = ["x", "text-anchor", "y", "fill", "font-size"], hl = ["x", "text-anchor", "y", "fill", "font-size"], fl = ["x", "y", "font-size", "fill"], bl = ["x", "y", "font-size", "fill"], pl = ["x", "y", "font-size", "fill"], _l = { style: { "padding-top": "36px", position: "relative" } }, gl = { class: "vue-ui-data-table" }, xl = { key: 0 }, ml = ["data-cell"], kl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, wl = { key: 0 }, $l = { key: 1 }, Cl = ["data-cell"], zl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Tl = { key: 0 }, Fl = { key: 1 }, Nl = ["data-cell"], Sl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Il = { key: 0 }, Ll = { key: 1 }, Pl = ["data-cell"], Vl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Rl = { key: 0 }, Bl = { key: 1 }, Ml = ["data-cell"], jl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Xl = { key: 0 }, Ol = { key: 1 }, Gl = ["data-cell"], El = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Al = { key: 0 }, Ul = { key: 1 }, Dl = ["data-cell"], Yl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ql = { key: 0 }, Hl = { key: 1 }, Wl = ["data-cell"], Kl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Jl = ["data-cell"], Ql = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Zl = ["data-cell"], ea = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ta = ["data-cell"], la = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, aa = ["data-cell"], oa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, sa = {
+  __name: "vue-ui-chestnut",
+  props: {
+    config: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    dataset: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  emits: ["selectRoot", "selectBranch", "selectNut"],
+  setup(pe, { expose: _e, emit: O }) {
+    const P = pe;
+    Pe((l) => ({
+      a08a8b28: l.tdo
+    }));
+    const { vue_ui_chestnut: ge } = Oe(), A = $(() => !!P.dataset && P.dataset.length), k = z(Ge()), te = z(null), xe = z(null), le = z(0), e = $(() => {
+      const l = be({
+        userConfig: P.config,
+        defaultConfig: ge
+      });
+      return l.theme ? {
+        ...be({
+          userConfig: Ee.vue_ui_chestnut[l.theme] || P.config,
+          defaultConfig: l
+        }),
+        customPalette: Ae[l.theme] || I
+      } : l;
+    }), { isPrinting: me, isImaging: ke, generatePdf: ae, generateImage: oe } = Ke({
+      elementId: `vue-ui-chestnut_${k.value}`,
+      fileName: e.value.style.chart.layout.title.text || "vue-ui-chestnut"
+    }), W = $(() => Ue(e.value.customPalette)), U = z({
+      showTable: e.value.table.show
+    }), se = z(null), ue = z(!1), we = $(() => e.value.table.responsiveBreakpoint), r = z({
+      gap: 6,
+      padding: {
+        top: 102,
+        left: 12,
+        right: 12,
+        bottom: 96
+      },
+      width: 1024,
+      height: 0,
+      branchSize: 32,
+      branchStart: 128
+    }), C = $(() => ({
+      left: r.value.padding.left,
+      top: r.value.padding.top,
+      right: r.value.width - r.value.padding.right,
+      bottom: r.value.height - r.value.padding.bottom,
+      width: r.value.width - (r.value.padding.left + r.value.padding.right),
+      height: r.value.height - (r.value.padding.top + r.value.padding.bottom),
+      seedX: r.value.padding.left + 64
+    })), V = $(() => A.value ? P.dataset.flatMap((l) => l.branches.map((i) => i.value)).reduce((l, i) => l + i) : 0), T = $(() => (P.dataset.forEach((l, i) => {
+      Z({
+        datasetObject: l,
+        requiredAttributes: ["name", "branches"]
+      }).forEach((t) => {
+        H({
+          componentName: "VueUiChestnut",
+          type: "datasetSerieAttribute",
+          property: t,
+          index: i
+        });
+      }), l.branches && l.branches.forEach((t, u) => {
+        Z({
+          datasetObject: t,
+          requiredAttributes: ["name", "value"]
+        }).forEach((f) => {
+          H({
+            componentName: "VueUiChestnut",
+            type: "datasetSerieAttribute",
+            property: f,
+            index: `${i} - ${u}`
+          });
+        }), t.breakdown && t.breakdown.forEach((f, v) => {
+          Z({
+            datasetObject: f,
+            requiredAttributes: ["name", "value"]
+          }).forEach((g) => {
+            H({
+              componentName: "VueUiChestnut",
+              type: "datasetSerieAttribute",
+              property: g,
+              index: `${i} - ${u} - ${v}`
+            });
+          });
+        });
+      });
+    }), P.dataset.map((l, i) => {
+      const t = l.branches.map((u) => u.value).reduce((u, f) => u + f);
+      return {
+        ...l,
+        color: ee(l.color) || W.value[i] || I[i] || I[i % I.length],
+        id: l.id || `root_${i}_${k.value}`,
+        type: "root",
+        total: t,
+        rootIndex: i,
+        branches: l.branches.map((u, f) => ({
+          ...u,
+          rootName: l.name,
+          rootIndex: i,
+          color: ee(l.color) || W.value[i] || I[i] || I[i % I.length],
+          value: u.value >= 0 ? u.value : 0,
+          id: u.id || `branch_${i}_${f}_${k.value}`,
+          proportionToRoot: u.value / t,
+          type: "branch",
+          breakdown: u.breakdown.map((v, g) => ({
+            table: {
+              rootName: l.name,
+              rootValue: t,
+              rootToTotal: t / V.value,
+              branchName: u.name,
+              branchValue: u.value,
+              branchToTotal: u.value / V.value,
+              branchToRoot: u.value / t,
+              nutName: v.name,
+              nutValue: v.value,
+              nutToTotal: v.value / V.value,
+              nutToRoot: v.value / t,
+              nutToBranch: v.value / u.value
+            },
+            ...v,
+            type: "nut",
+            branchName: u.name,
+            rootName: l.name,
+            branchTotal: u.value >= 0 ? u.value : 0,
+            proportionToBranch: v.value / u.value,
+            proportionToRoot: v.value / t,
+            proportionToTree: v.value / V.value,
+            rootIndex: i,
+            id: v.id || `nut_${i}_${f}_${g}_${k.value}`,
+            color: ee(v.color) || W.value[g] || I[g] || I[g % I.length],
+            value: v.value >= 0 ? v.value : 0
+          }))
+        }))
+      };
+    })));
+    function $e() {
+      return T.value;
+    }
+    const Ce = $(() => T.value.flatMap((l) => l.branches).length), ze = $(() => Math.max(...T.value.map((l) => l.branches.map((i) => i.value).reduce((i, t) => i + t, 0)))), Te = $(() => Math.max(...T.value.flatMap((l) => l.branches.map((i) => i.value)))), ne = $(() => 256 + r.value.padding.left), B = $(() => T.value.sort((l, i) => i.total - l.total).map((l, i) => {
+      const t = C.value.height / T.value.length / 2, u = l.total / ze.value * (t > 64 ? 64 : t);
+      return {
+        ...l,
+        x: C.value.seedX,
+        y: C.value.top + C.value.height / T.value.length * (i + 1) - (C.value.height / T.value.length / 2 + r.value.gap / 2),
+        r: u < r.value.branchSize / 2 ? r.value.branchSize / 2 : u
+      };
+    })), Fe = $(() => e.value.style.chart.layout.branches.widthRatio <= 0 ? 0.1 : e.value.style.chart.layout.branches.widthRatio > 1.8 ? 1.8 : e.value.style.chart.layout.branches.widthRatio), Ne = $(() => B.value.flatMap((l) => l.branches)), R = $(() => Ne.value.sort((l, i) => i.value - l.value).map((l, i) => ({
+      ...l,
+      y1: i * r.value.branchSize + C.value.top + i * r.value.gap,
+      y2: i * r.value.branchSize + r.value.branchSize,
+      x1: ne.value,
+      x2: 384 * l.value / Te.value * Fe.value + ne.value
+    })));
+    function K(l) {
+      const i = B.value.find((t) => t.rootIndex === l.rootIndex);
+      return { x: i.x, y: i.y, r: i.r };
+    }
+    const d = z(null), M = z(null), x = z(null), N = z(null);
+    function w() {
+      d.value = null, x.value = null, N.value = null;
+    }
+    function S(l) {
+      return N.value ? N.value === null ? !0 : l.type === "root" ? l.id === N.value.id : l.rootIndex === N.value.rootIndex : d.value === null && x.value === null ? !0 : l.type === "nut" ? d.value.id === l.id : l.type === "branch" ? x.value.id === l.id : l.type === "root" ? x.value && x.value.rootIndex === l.rootIndex || d.value && d.value.rootIndex === l.rootIndex : !1;
+    }
+    function re(l) {
+      w(), ve(() => {
+        d.value = l, x.value = l, M.value = fe(
+          { series: l.breakdown, base: 1 },
+          l.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+          l.y1 + r.value.branchSize / 2,
+          80,
+          80
+        ), O("selectNut", l.breakdown);
+      });
+    }
+    function j() {
+      d.value = null, M.value = null, O("selectNut", null);
+    }
+    function J(l) {
+      x.value && x.value.id === l.id ? (x.value = null, w(), O("selectBranch", null)) : (w(), x.value = l, O("selectBranch", l));
+    }
+    function ie(l) {
+      N.value && N.value.id === l.id ? (w(), O("selectRoot", null)) : (w(), N.value = l, O("selectRoot", l));
+    }
+    function Se() {
+      return C.value.bottom - (d.value.y1 + 180) < 0 ? 0 : C.value.bottom;
+    }
+    function G(l) {
+      return l.proportion * 100 > e.value.style.chart.layout.nuts.selected.labels.dataLabels.hideUnderValue;
+    }
+    function Ie() {
+      new ResizeObserver((i) => {
+        i.forEach((t) => {
+          ue.value = t.contentRect.width < we.value;
+        });
+      }).observe(se.value);
+    }
+    Ve(() => {
+      De(P.dataset) && H({
+        componentName: "VueUiChestnut",
+        type: "dataset"
+      });
+      const l = Ce.value * (r.value.branchSize + r.value.gap) + r.value.padding.top + r.value.padding.bottom;
+      r.value.height = l, Ie();
+    });
+    const c = $(() => {
+      const l = [
+        e.value.table.th.translations.rootName,
+        e.value.table.th.translations.rootValue,
+        e.value.table.th.translations.rootToTotal,
+        e.value.table.th.translations.branchName,
+        e.value.table.th.translations.branchValue,
+        e.value.table.th.translations.branchToRoot,
+        e.value.table.th.translations.branchToTotal,
+        e.value.table.th.translations.nutName,
+        e.value.table.th.translations.nutValue,
+        e.value.table.th.translations.nutToBranch,
+        e.value.table.th.translations.nutToRoot,
+        e.value.table.th.translations.nutToTotal
+      ], i = T.value.flatMap((t, u) => t.branches.flatMap((f, v) => f.breakdown.flatMap((g, ua) => g.table)));
+      return { head: l, body: i };
+    });
+    function ce() {
+      ve(() => {
+        const l = [[e.value.style.chart.layout.title.text], [e.value.style.chart.layout.title.subtitle.text], [""], ["Grand total", V.value], [""]], i = c.value.head, t = c.value.body.map((v, g) => [
+          c.value.body[g - 1] && c.value.body[g - 1].rootName === v.rootName ? "" : v.rootName,
+          c.value.body[g - 1] && c.value.body[g - 1].rootName === v.rootName ? "" : v.rootValue,
+          c.value.body[g - 1] && c.value.body[g - 1].rootName === v.rootName ? "" : v.rootToTotal,
+          c.value.body[g - 1] && c.value.body[g - 1].branchName === v.branchName ? "" : v.branchName,
+          c.value.body[g - 1] && c.value.body[g - 1].branchName === v.branchName ? "" : v.branchValue,
+          c.value.body[g - 1] && c.value.body[g - 1].branchName === v.branchName ? "" : v.branchToRoot,
+          c.value.body[g - 1] && c.value.body[g - 1].branchName === v.branchName ? "" : v.branchToTotal,
+          v.nutName,
+          v.nutValue,
+          v.nutToBranch,
+          v.nutToRoot,
+          v.nutToTotal
+        ]), u = l.concat([i]).concat(t), f = He(u);
+        We({ csvContent: f, title: e.value.style.chart.layout.title.text || "vue-ui-chestnut" });
+      });
+    }
+    const D = z(!1);
+    function Le(l) {
+      D.value = l, le.value += 1;
+    }
+    function de() {
+      U.value.showTable = !U.value.showTable;
+    }
+    return _e({
+      getData: $e,
+      generatePdf: ae,
+      generateCsv: ce,
+      generateImage: oe,
+      toggleTable: de
+    }), (l, i) => (a(), o("div", {
+      class: m(`vue-ui-chestnut ${D.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
+      ref_key: "chestnutChart",
+      ref: te,
+      id: `vue-ui-chestnut_${k.value}`,
+      style: h(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;padding-top:36px;background:${e.value.style.chart.backgroundColor}`)
+    }, [
+      e.value.userOptions.show && A.value ? (a(), Q(Je, {
+        ref_key: "details",
+        ref: xe,
+        key: `user_options_${le.value}`,
+        backgroundColor: e.value.style.chart.backgroundColor,
+        color: e.value.style.chart.color,
+        isImaging: y(ke),
+        isPrinting: y(me),
+        uid: k.value,
+        hasPdf: e.value.userOptions.buttons.pdf,
+        hasImg: e.value.userOptions.buttons.img,
+        hasXls: e.value.userOptions.buttons.csv,
+        hasTable: e.value.userOptions.buttons.table,
+        hasFullscreen: e.value.userOptions.buttons.fullscreen,
+        isFullscreen: D.value,
+        titles: { ...e.value.userOptions.buttonTitles },
+        chartElement: te.value,
+        onToggleFullscreen: Le,
+        onGeneratePdf: y(ae),
+        onGenerateCsv: ce,
+        onGenerateImage: y(oe),
+        onToggleTable: de
+      }, Re({ _: 2 }, [
+        l.$slots.optionPdf ? {
+          name: "optionPdf",
+          fn: E(() => [
+            X(l.$slots, "optionPdf", {}, void 0, !0)
+          ]),
+          key: "0"
+        } : void 0,
+        l.$slots.optionCsv ? {
+          name: "optionCsv",
+          fn: E(() => [
+            X(l.$slots, "optionCsv", {}, void 0, !0)
+          ]),
+          key: "1"
+        } : void 0,
+        l.$slots.optionImg ? {
+          name: "optionImg",
+          fn: E(() => [
+            X(l.$slots, "optionImg", {}, void 0, !0)
+          ]),
+          key: "2"
+        } : void 0,
+        l.$slots.optionTable ? {
+          name: "optionTable",
+          fn: E(() => [
+            X(l.$slots, "optionTable", {}, void 0, !0)
+          ]),
+          key: "3"
+        } : void 0,
+        l.$slots.optionFullscreen ? {
+          name: "optionFullscreen",
+          fn: E(({ toggleFullscreen: t, isFullscreen: u }) => [
+            X(l.$slots, "optionFullscreen", Be(Me({ toggleFullscreen: t, isFullscreen: u })), void 0, !0)
+          ]),
+          key: "4"
+        } : void 0
+      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "titles", "chartElement", "onGeneratePdf", "onGenerateImage"])) : b("", !0),
+      r.value.height > 0 && A.value ? (a(), o("svg", {
+        key: 1,
+        xmlns: y(Ye),
+        class: m({ "vue-data-ui-fullscreen--on": D.value, "vue-data-ui-fulscreen--off": !D.value }),
+        viewBox: `0 0 ${r.value.width} ${r.value.height}`,
+        style: h(`max-width:100%;overflow:visible;background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color}`)
+      }, [
+        d.value ? b("", !0) : (a(), o("g", ot, [
+          e.value.style.chart.layout.title.text ? (a(), o("text", {
+            key: 0,
+            "text-anchor": "middle",
+            fill: e.value.style.chart.layout.title.color,
+            "font-weight": e.value.style.chart.layout.title.bold ? "bold" : "normal",
+            "font-size": e.value.style.chart.layout.title.fontSize,
+            x: r.value.width / 2,
+            y: 12 + e.value.style.chart.layout.title.fontSize + e.value.style.chart.layout.title.offsetY,
+            onClick: w
+          }, n(e.value.style.chart.layout.title.text), 9, st)) : b("", !0),
+          e.value.style.chart.layout.title.subtitle.text ? (a(), o("text", {
+            key: 1,
+            "text-anchor": "middle",
+            fill: e.value.style.chart.layout.title.subtitle.color,
+            "font-weight": e.value.style.chart.layout.title.subtitle.bold ? "bold" : "normal",
+            "font-size": e.value.style.chart.layout.title.subtitle.fontSize,
+            x: r.value.width / 2,
+            y: 48 + e.value.style.chart.layout.title.subtitle.fontSize + e.value.style.chart.layout.title.subtitle.offsetY,
+            onClick: w
+          }, n(e.value.style.chart.layout.title.subtitle.text), 9, ut)) : b("", !0)
+        ])),
+        s("defs", null, [
+          (a(!0), o(p, null, _(T.value, (t, u) => (a(), o("radialGradient", {
+            cx: "50%",
+            cy: "50%",
+            r: "50%",
+            fx: "50%",
+            fy: "50%",
+            id: `root_gradient_${k.value}_${t.rootIndex}`
+          }, [
+            s("stop", {
+              offset: "0%",
+              "stop-color": `${y(ye)(t.color, 0.05)}${y(F)[100 - e.value.style.chart.layout.roots.gradientIntensity]}`
+            }, null, 8, rt),
+            s("stop", {
+              offset: "100%",
+              "stop-color": t.color
+            }, null, 8, it)
+          ], 8, nt))), 256)),
+          (a(!0), o(p, null, _(T.value, (t) => (a(), o("linearGradient", {
+            x1: "0%",
+            y1: "0%",
+            x2: "100%",
+            y2: "0%",
+            id: `branch_gradient_${k.value}_${t.rootIndex}`
+          }, [
+            s("stop", {
+              offset: "0%",
+              "stop-color": t.color
+            }, null, 8, dt),
+            s("stop", {
+              offset: "100%",
+              "stop-color": `${y(ye)(t.color, 0.02)}${y(F)[100 - e.value.style.chart.layout.branches.gradientIntensity]}`
+            }, null, 8, vt)
+          ], 8, ct))), 256)),
+          s("radialGradient", {
+            cx: "50%",
+            cy: "50%",
+            r: "50%",
+            fx: "50%",
+            fy: "50%",
+            id: `nutpick_${k.value}`
+          }, [
+            s("stop", {
+              offset: "0%",
+              "stop-color": `#FFFFFF${y(F)[0]}`
+            }, null, 8, ht),
+            s("stop", {
+              offset: "80%",
+              "stop-color": `#FFFFFF${y(F)[e.value.style.chart.layout.nuts.selected.gradientIntensity]}`
+            }, null, 8, ft),
+            s("stop", {
+              offset: "100%",
+              "stop-color": `#FFFFFF${y(F)[0]}`
+            }, null, 8, bt)
+          ], 8, yt),
+          s("radialGradient", {
+            cx: "50%",
+            cy: "50%",
+            r: "50%",
+            fx: "50%",
+            fy: "50%",
+            id: `nut_${k.value}`
+          }, [
+            s("stop", {
+              offset: "0%",
+              "stop-color": `#FFFFFF${y(F)[0]}`
+            }, null, 8, _t),
+            s("stop", {
+              offset: "80%",
+              "stop-color": `#FFFFFF${y(F)[e.value.style.chart.layout.nuts.gradientIntensity]}`
+            }, null, 8, gt),
+            s("stop", {
+              offset: "100%",
+              "stop-color": `#FFFFFF${y(F)[0]}`
+            }, null, 8, xt)
+          ], 8, pt),
+          s("radialGradient", {
+            cx: "50%",
+            cy: "50%",
+            r: "50%",
+            fx: "50%",
+            fy: "50%",
+            id: `nut_underlayer_${k.value}`
+          }, [
+            s("stop", {
+              offset: "0%",
+              "stop-color": `${e.value.style.chart.backgroundColor}${y(F)[100]}`
+            }, null, 8, kt),
+            s("stop", {
+              offset: "80%",
+              "stop-color": `${e.value.style.chart.backgroundColor}${y(F)[60]}`
+            }, null, 8, wt),
+            s("stop", {
+              offset: "100%",
+              "stop-color": `${e.value.style.chart.backgroundColor}${y(F)[0]}`
+            }, null, 8, $t)
+          ], 8, mt)
+        ]),
+        e.value.style.chart.layout.grandTotal.show ? (a(), o("g", Ct, [
+          s("text", {
+            x: C.value.seedX,
+            y: 32 + e.value.style.chart.layout.grandTotal.offsetY,
+            "font-size": e.value.style.chart.layout.grandTotal.fontSize,
+            "font-weight": e.value.style.chart.layout.grandTotal.bold ? "bold" : "normal",
+            fill: e.value.style.chart.layout.grandTotal.color,
+            "text-anchor": "middle",
+            onClick: w
+          }, n(e.value.style.chart.layout.grandTotal.text), 9, zt),
+          s("text", {
+            x: C.value.seedX,
+            y: 38 + e.value.style.chart.layout.grandTotal.fontSize + e.value.style.chart.layout.grandTotal.offsetY,
+            "font-size": e.value.style.chart.layout.grandTotal.fontSize,
+            "font-weight": e.value.style.chart.layout.grandTotal.bold ? "bold" : "normal",
+            fill: e.value.style.chart.layout.grandTotal.color,
+            "text-anchor": "middle",
+            onClick: w
+          }, n(e.value.style.chart.layout.grandTotal.prefix) + " " + n(V.value.toFixed(e.value.style.chart.layout.grandTotal.roundingValue)) + " " + n(e.value.style.chart.layout.grandTotal.suffix), 9, Tt)
+        ])) : b("", !0),
+        (a(!0), o(p, null, _(R.value, (t) => (a(), o("g", null, [
+          (a(!0), o(p, null, _(r.value.branchSize, (u, f) => (a(), o("path", {
+            d: `M
+                    ${t.x1},${t.y1 + f}
+                    C${t.x1 - 20},${t.y1 + f} 
+                    ${t.x1 - 80},${t.y1 + f} 
+                    ${K(t).x + K(t).r / 2}, ${K(t).y}
+                `,
+            stroke: `${t.color}${y(F)[e.value.style.chart.layout.links.opacity]}`,
+            fill: "none",
+            "stroke-width": "2",
+            "shape-rendering": "cirspEdges",
+            style: h(`opacity:${S(t) ? 1 : 0}`),
+            onClick: w
+          }, null, 12, Ft))), 256))
+        ]))), 256)),
+        (a(!0), o(p, null, _(B.value, (t) => (a(), o("circle", {
+          cx: t.x,
+          cy: t.y,
+          r: t.r,
+          fill: e.value.style.chart.layout.roots.underlayerColor,
+          stroke: "none",
+          style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`)
+        }, null, 12, Nt))), 256)),
+        (a(!0), o(p, null, _(B.value, (t, u) => (a(), o("circle", {
+          cx: t.x,
+          cy: t.y,
+          r: t.r,
+          fill: e.value.style.chart.layout.roots.useGradient ? `url(#root_gradient_${k.value}_${t.rootIndex})` : t.color,
+          stroke: e.value.style.chart.layout.roots.stroke,
+          "stroke-width": e.value.style.chart.layout.roots.strokeWidth,
+          style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`),
+          onClick: (f) => ie(t)
+        }, null, 12, St))), 256)),
+        e.value.style.chart.layout.roots.labels.show ? (a(), o("g", It, [
+          (a(!0), o(p, null, _(B.value, (t, u) => (a(), o("text", {
+            x: t.x,
+            y: t.y + e.value.style.chart.layout.roots.labels.fontSize / 2.6,
+            "text-anchor": "middle",
+            "font-size": e.value.style.chart.layout.roots.labels.fontSize,
+            fill: e.value.style.chart.layout.roots.labels.adaptColorToBackground ? y(he)(t.color) : e.value.style.chart.layout.roots.labels.color,
+            "font-weight": "bold",
+            style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`),
+            onClick: (f) => ie(t)
+          }, n(e.value.style.chart.layout.roots.labels.prefix) + " " + n(t.total.toFixed(e.value.style.chart.layout.roots.labels.roundingValue)) + " " + n(e.value.style.chart.layout.roots.labels.suffix), 13, Lt))), 256)),
+          (a(!0), o(p, null, _(B.value, (t) => (a(), o("g", null, [
+            d.value && t.rootIndex === d.value.rootIndex || x.value && t.rootIndex === x.value.rootIndex || N.value && t.rootIndex === N.value.rootIndex ? (a(), o("g", Pt, [
+              s("text", {
+                x: t.x,
+                y: t.y + t.r + 24,
+                "text-anchor": "middle",
+                fill: e.value.style.chart.layout.roots.labels.name.color,
+                "font-size": e.value.style.chart.layout.roots.labels.name.fontSize,
+                "font-weight": e.value.style.chart.layout.roots.labels.name.bold ? "bold" : "normal",
+                onClick: w
+              }, n(t.name), 9, Vt)
+            ])) : b("", !0)
+          ]))), 256))
+        ])) : b("", !0),
+        (a(!0), o(p, null, _(R.value, (t) => (a(), o("rect", {
+          x: t.x1,
+          y: t.y1,
+          height: r.value.branchSize,
+          width: t.x2 - t.x1,
+          fill: e.value.style.chart.layout.branches.underlayerColor,
+          rx: e.value.style.chart.layout.branches.borderRadius,
+          stroke: "none",
+          style: h(`opacity:${S(t) ? 1 : 0.05}`),
+          onClick: (u) => J(t)
+        }, null, 12, Rt))), 256)),
+        (a(!0), o(p, null, _(R.value, (t, u) => (a(), o("rect", {
+          x: t.x1,
+          y: t.y1,
+          height: r.value.branchSize,
+          width: t.x2 - t.x1,
+          fill: e.value.style.chart.layout.branches.useGradient ? `url(#branch_gradient_${k.value}_${t.rootIndex})` : t.color,
+          rx: e.value.style.chart.layout.branches.borderRadius,
+          stroke: e.value.style.chart.layout.branches.stroke,
+          "stroke-width": e.value.style.chart.layout.branches.strokeWidth,
+          style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`),
+          onClick: (f) => J(t)
+        }, null, 12, Bt))), 256)),
+        e.value.style.chart.layout.branches.labels.dataLabels.show ? (a(), o("g", Mt, [
+          (a(!0), o(p, null, _(R.value, (t) => (a(), o("g", null, [
+            t.proportionToRoot * 100 > e.value.style.chart.layout.branches.labels.dataLabels.hideUnderValue ? (a(), o("text", {
+              key: 0,
+              x: t.x1 + 6,
+              y: t.y1 + r.value.branchSize / 1.5,
+              "text-anchor": "start",
+              fill: y(he)(t.color),
+              "font-size": e.value.style.chart.layout.branches.labels.dataLabels.fontSize,
+              "font-weight": "bold",
+              style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`),
+              onClick: (u) => J(t)
+            }, n(e.value.style.chart.layout.branches.labels.dataLabels.prefix) + " " + n(t.value.toFixed(e.value.style.chart.layout.branches.labels.dataLabels.roundingValue)) + " " + n(e.value.style.chart.layout.branches.labels.dataLabels.suffix), 13, jt)) : b("", !0)
+          ]))), 256))
+        ])) : b("", !0),
+        (a(!0), o(p, null, _(R.value, (t, u) => (a(), o("g", null, [
+          (a(!0), o(p, null, _(y(fe)(
+            { series: t.breakdown, base: 1 },
+            t.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+            t.y1 + r.value.branchSize / 2,
+            r.value.branchSize / 3,
+            r.value.branchSize / 3
+          ), (f, v) => (a(), o("path", {
+            d: f.path,
+            stroke: f.color,
+            "stroke-width": 10,
+            fill: "none",
+            style: h(`opacity:${S(t) ? 1 : 0.1}`)
+          }, null, 12, Xt))), 256)),
+          (a(!0), o(p, null, _(R.value, (f) => (a(), o("circle", {
+            cx: f.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+            cy: f.y1 + r.value.branchSize / 2,
+            r: 6,
+            fill: e.value.style.chart.backgroundColor,
+            onClick: (v) => re(f),
+            style: { cursor: "pointer" }
+          }, null, 8, Ot))), 256)),
+          s("circle", {
+            fill: e.value.style.chart.layout.nuts.useGradient ? `url(#nut_${k.value})` : "transparent",
+            cx: t.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+            cy: t.y1 + r.value.branchSize / 2,
+            r: r.value.branchSize / 2 + 2,
+            onClick: (f) => re(t),
+            style: h(`cursor:pointer;opacity:${S(t) ? 1 : 0.1}`)
+          }, null, 12, Gt)
+        ]))), 256)),
+        e.value.style.chart.layout.branches.labels.show && !x.value ? (a(), o("g", Et, [
+          (a(!0), o(p, null, _(R.value, (t) => (a(), o("text", {
+            x: t.x2 + r.value.branchSize + 24 + e.value.style.chart.layout.nuts.offsetX,
+            y: t.y1 + r.value.branchSize / 2 + 5,
+            "font-size": e.value.style.chart.layout.branches.labels.fontSize,
+            "font-weight": e.value.style.chart.layout.branches.labels.bold ? "bold" : "normal",
+            fill: e.value.style.chart.layout.branches.labels.color,
+            "text-anchor": "start",
+            style: h(`opacity:${S(t) ? 1 : 0.1}`)
+          }, n(t.name), 13, At))), 256))
+        ])) : b("", !0),
+        s("line", {
+          x1: 256 + r.value.padding.left,
+          x2: 256 + r.value.padding.left,
+          y1: C.value.top,
+          y2: C.value.bottom,
+          stroke: e.value.style.chart.layout.verticalSeparator.stroke,
+          "stroke-width": e.value.style.chart.layout.verticalSeparator.strokeWidth
+        }, null, 8, Ut),
+        !d.value && !x.value ? (a(), o("foreignObject", {
+          key: 5,
+          x: 0,
+          y: C.value.bottom,
+          height: r.value.height - C.value.bottom,
+          width: r.value.width,
+          style: { overflow: "visible" },
+          onClick: w
+        }, [
+          s("div", Yt, [
+            s("div", qt, [
+              (a(!0), o(p, null, _(B.value, (t) => (a(), o("div", {
+                style: h(`display:flex;align-items:center;gap:3px;flex-direction:row;font-size:${e.value.style.chart.layout.legend.fontSize}px;`)
+              }, [
+                (a(), o("svg", Ht, [
+                  s("circle", {
+                    cx: "10",
+                    cy: "10",
+                    r: "10",
+                    fill: t.color,
+                    stroke: "none"
+                  }, null, 8, Wt)
+                ])),
+                s("span", null, n(t.name) + ":", 1),
+                Y(),
+                s("b", null, n(e.value.style.chart.layout.legend.prefix) + " " + n(t.total.toFixed(e.value.style.chart.layout.legend.roundingValue)) + " " + n(e.value.style.chart.layout.legend.suffix), 1),
+                Y("(" + n((t.total / V.value * 100).toFixed(e.value.style.chart.layout.legend.roundingPercentage)) + "%) ", 1)
+              ], 4))), 256))
+            ])
+          ])
+        ], 8, Dt)) : b("", !0),
+        d.value && M.value ? (a(), o("g", Kt, [
+          (a(), o("foreignObject", {
+            x: 0,
+            y: Se(),
+            height: r.value.height - C.value.bottom,
+            width: r.value.width,
+            style: { overflow: "visible" },
+            onClick: w
+          }, [
+            s("div", Qt, [
+              s("b", null, n(d.value.name), 1),
+              s("div", Zt, [
+                (a(!0), o(p, null, _(d.value.breakdown, (t, u) => (a(), o("div", {
+                  style: h(`display:flex;align-items:center;gap:6px;flex-direction:row;font-size:${e.value.style.chart.layout.legend.fontSize}px;`)
+                }, [
+                  (a(), o("svg", el, [
+                    s("circle", {
+                      cx: "10",
+                      cy: "10",
+                      r: "10",
+                      fill: t.color,
+                      stroke: "none"
+                    }, null, 8, tl)
+                  ])),
+                  s("span", null, [
+                    Y(n(t.name) + ": ", 1),
+                    s("b", null, n(e.value.style.chart.layout.legend.prefix) + " " + n(t.value.toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingValue)) + " " + n(e.value.style.chart.layout.legend.suffix), 1),
+                    Y(" (" + n((t.proportionToBranch * 100).toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingPercentage)) + "%)", 1)
+                  ])
+                ], 4))), 256))
+              ])
+            ])
+          ], 8, Jt)),
+          (a(!0), o(p, null, _(M.value, (t) => (a(), o("g", null, [
+            G(t) ? (a(), o("path", {
+              key: 0,
+              d: y(qe)(t),
+              stroke: t.color,
+              "stroke-width": "1",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round",
+              fill: "none",
+              class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+            }, null, 10, ll)) : b("", !0)
+          ]))), 256)),
+          s("circle", {
+            cx: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+            cy: d.value.y1 + r.value.branchSize / 2,
+            r: 256,
+            fill: `url(#nut_underlayer_${k.value})`,
+            onClick: j,
+            class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+          }, null, 10, al),
+          s("circle", {
+            cx: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+            cy: d.value.y1 + r.value.branchSize / 2,
+            r: 118,
+            fill: e.value.style.chart.backgroundColor,
+            onClick: j,
+            class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+          }, null, 10, ol),
+          (a(!0), o(p, null, _(M.value, (t) => (a(), o("path", {
+            d: t.path,
+            stroke: t.color,
+            "stroke-width": 64,
+            fill: "none",
+            onClick: j,
+            class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+          }, null, 10, sl))), 256)),
+          s("circle", {
+            cx: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+            cy: d.value.y1 + r.value.branchSize / 2,
+            r: 100,
+            fill: `url(#nutpick_${k.value})`,
+            onClick: j,
+            class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+          }, null, 10, ul),
+          s("circle", {
+            cx: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+            cy: d.value.y1 + r.value.branchSize / 2,
+            r: 48,
+            fill: e.value.style.chart.backgroundColor,
+            onClick: j,
+            class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+          }, null, 10, nl),
+          s("text", {
+            x: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+            y: d.value.y1 + 8,
+            fill: e.value.style.chart.layout.nuts.selected.labels.core.total.color,
+            "font-size": e.value.style.chart.layout.nuts.selected.labels.core.total.fontSize,
+            "font-weight": e.value.style.chart.layout.nuts.selected.labels.core.total.bold ? "bold" : "normal",
+            "text-anchor": "middle",
+            onClick: j,
+            class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+          }, n(e.value.translations.total), 11, rl),
+          s("text", {
+            x: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
+            y: d.value.y1 + 36,
+            fill: e.value.style.chart.layout.nuts.selected.labels.core.value.color,
+            "font-size": e.value.style.chart.layout.nuts.selected.labels.core.value.fontSize,
+            "font-weight": e.value.style.chart.layout.nuts.selected.labels.core.value.bold ? "bold" : "normal",
+            "text-anchor": "middle",
+            onClick: j,
+            class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+          }, n(e.value.style.chart.layout.nuts.selected.labels.core.value.prefix) + " " + n(d.value.value.toFixed(e.value.style.chart.layout.nuts.selected.roundingValue)) + " " + n(e.value.style.chart.layout.nuts.selected.labels.core.value.suffix), 11, il),
+          (a(!0), o(p, null, _(M.value, (t, u) => (a(), o("g", null, [
+            G(t) ? (a(), o("text", {
+              key: 0,
+              x: y(L)(t).x,
+              "text-anchor": y(L)(t).anchor,
+              y: y(q)(t),
+              fill: t.color,
+              "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
+              style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
+              class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+            }, " ⬤ ", 14, cl)) : b("", !0),
+            G(t) ? (a(), o("text", {
+              key: 1,
+              x: y(L)(t, !0).x,
+              "text-anchor": y(L)(t, !0).anchor,
+              y: y(q)(t),
+              fill: e.value.style.chart.layout.nuts.selected.labels.dataLabels.color,
+              "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
+              style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
+              class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+            }, n(d.value.breakdown[u].name), 15, dl)) : b("", !0)
+          ]))), 256)),
+          (a(!0), o(p, null, _(M.value, (t, u) => (a(), o("g", null, [
+            G(t) ? (a(), o("text", {
+              key: 0,
+              x: y(L)(t, !0).x,
+              "text-anchor": y(L)(t).anchor,
+              y: y(q)(t) + e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
+              fill: e.value.style.chart.layout.nuts.selected.labels.dataLabels.color,
+              "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
+              style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
+              class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+            }, n((d.value.breakdown[u].value / d.value.value * 100).toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingPercentage)) + "% " + n(e.value.translations.of) + " " + n(d.value.breakdown[u].branchName) + " (" + n(e.value.style.chart.layout.nuts.selected.labels.dataLabels.prefix) + " " + n(d.value.breakdown[u].value) + " " + n(e.value.style.chart.layout.nuts.selected.labels.dataLabels.suffix) + ") ", 15, vl)) : b("", !0),
+            G(t) ? (a(), o("text", {
+              key: 1,
+              x: y(L)(t, !0).x,
+              "text-anchor": y(L)(t).anchor,
+              y: y(q)(t) + e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize * 2,
+              fill: e.value.style.chart.layout.nuts.selected.labels.dataLabels.color,
+              "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
+              style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
+              class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+            }, n((d.value.breakdown[u].proportionToRoot * 100).toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingPercentage)) + "% " + n(e.value.translations.of) + " " + n(d.value.breakdown[u].rootName), 15, yl)) : b("", !0),
+            G(t) ? (a(), o("text", {
+              key: 2,
+              x: y(L)(t, !0).x,
+              "text-anchor": y(L)(t).anchor,
+              y: y(q)(t) + e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize * 3,
+              fill: e.value.style.chart.layout.nuts.selected.labels.dataLabels.color,
+              "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
+              style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
+              class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
+            }, n((d.value.breakdown[u].proportionToTree * 100).toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingPercentage)) + "% " + n(e.value.translations.proportionToTree), 15, hl)) : b("", !0)
+          ]))), 256))
+        ])) : b("", !0),
+        (a(!0), o(p, null, _(R.value, (t) => (a(), o("g", null, [
+          x.value && x.value.id === t.id && !d.value ? (a(), o("text", {
+            key: 0,
+            x: t.x1 + 6,
+            y: t.y1 + r.value.branchSize + 24,
+            "font-weight": "bold",
+            "text-anchor": "start",
+            "font-size": e.value.style.chart.layout.branches.labels.dataLabels.fontSize,
+            fill: e.value.style.chart.layout.branches.labels.color,
+            onClick: w
+          }, n(t.name) + ": " + n(e.value.style.chart.layout.branches.labels.dataLabels.prefix) + " " + n(t.value.toFixed(e.value.style.chart.layout.branches.labels.dataLabels.roundingValue)) + " " + n(e.value.style.chart.layout.branches.labels.dataLabels.suffix), 9, fl)) : b("", !0),
+          x.value && x.value.id === t.id && !d.value ? (a(), o("text", {
+            key: 1,
+            x: t.x1 + 6,
+            y: t.y1 + r.value.branchSize + 48,
+            "text-anchor": "start",
+            "font-size": e.value.style.chart.layout.branches.labels.dataLabels.fontSize,
+            fill: e.value.style.chart.layout.branches.labels.color,
+            onClick: w
+          }, n((t.proportionToRoot * 100).toFixed(e.value.style.chart.layout.branches.labels.dataLabels.roundingPercentage)) + "% " + n(e.value.translations.of) + " " + n(t.rootName), 9, bl)) : b("", !0),
+          x.value && x.value.id === t.id && !d.value ? (a(), o("text", {
+            key: 2,
+            x: t.x1 + 6,
+            y: t.y1 + r.value.branchSize + 72,
+            "text-anchor": "start",
+            "font-size": e.value.style.chart.layout.branches.labels.dataLabels.fontSize,
+            fill: e.value.style.chart.layout.branches.labels.color,
+            onClick: w
+          }, n((t.value / V.value * 100).toFixed(e.value.style.chart.layout.branches.labels.dataLabels.roundingPercentage)) + "% " + n(e.value.translations.proportionToTree), 9, pl)) : b("", !0)
+        ]))), 256)),
+        X(l.$slots, "svg", { svg: r.value }, void 0, !0)
+      ], 14, at)) : b("", !0),
+      A.value ? b("", !0) : (a(), Q(Qe, {
+        key: 2,
+        config: {
+          type: "chestnut",
+          style: {
+            backgroundColor: e.value.style.chart.backgroundColor,
+            chestnut: {
+              color: "#CCCCCC"
+            }
+          }
+        }
+      }, null, 8, ["config"])),
+      X(l.$slots, "legend", { legend: T.value }, void 0, !0),
+      A.value ? (a(), Q(et, {
+        key: 3,
+        hideDetails: "",
+        config: {
+          open: U.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: E(() => [
+          s("div", {
+            ref_key: "tableContainer",
+            ref: se,
+            class: "vue-ui-chestnut-table"
+          }, [
+            s("div", _l, [
+              s("div", {
+                role: "button",
+                tabindex: "0",
+                style: h(`width:32px; position: absolute; top: 0; left:4px; padding: 0 0px; display: flex; align-items:center;justify-content:center;height: 36px; width: 32px; cursor:pointer; background:${e.value.table.th.backgroundColor};`),
+                onClick: i[0] || (i[0] = (t) => U.value.showTable = !1),
+                onKeypress: i[1] || (i[1] = je((t) => U.value.showTable = !1, ["enter"]))
+              }, [
+                Xe(Ze, {
+                  name: "close",
+                  stroke: e.value.table.th.color,
+                  "stroke-width": 2
+                }, null, 8, ["stroke"])
+              ], 36),
+              s("div", {
+                style: { width: "100%" },
+                class: m({ "vue-ui-responsive": ue.value })
+              }, [
+                s("table", gl, [
+                  s("caption", {
+                    style: h({ backgroundColor: e.value.table.th.backgroundColor, color: e.value.table.th.color, outline: e.value.table.th.outline }),
+                    class: "vue-ui-data-table__caption"
+                  }, [
+                    Y(n(e.value.style.chart.layout.title.text) + " ", 1),
+                    e.value.style.chart.layout.title.subtitle.text ? (a(), o("span", xl, n(e.value.style.chart.layout.title.subtitle.text), 1)) : b("", !0)
+                  ], 4),
+                  s("thead", null, [
+                    s("tr", {
+                      role: "row",
+                      style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
+                    }, [
+                      (a(!0), o(p, null, _(c.value.head, (t) => (a(), o("th", {
+                        style: h(`outline:${e.value.table.th.outline}`)
+                      }, n(t), 5))), 256))
+                    ], 4)
+                  ]),
+                  s("tbody", null, [
+                    (a(!0), o(p, null, _(c.value.body, (t, u) => (a(), o("tr", {
+                      class: m({ "vue-ui-data-table__tbody__row": !0, "vue-ui-data-table__tbody__row-even": u % 2 === 0, "vue-ui-data-table__tbody__row-odd": u % 2 !== 0 }),
+                      style: h(`background:${e.value.table.td.backgroundColor};color:${e.value.table.td.color}`)
+                    }, [
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[0]
+                      }, [
+                        s("div", kl, [
+                          c.value.body[u - 1] && c.value.body[u - 1].rootName === t.rootName ? (a(), o("span", wl)) : (a(), o("span", $l, n(t.rootName), 1))
+                        ])
+                      ], 12, ml),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[1]
+                      }, [
+                        s("div", zl, [
+                          c.value.body[u - 1] && c.value.body[u - 1].rootName === t.rootName ? (a(), o("span", Tl)) : (a(), o("span", Fl, n(t.rootValue.toFixed(e.value.table.td.roundingValue)), 1))
+                        ])
+                      ], 12, Cl),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[2]
+                      }, [
+                        s("div", Sl, [
+                          c.value.body[u - 1] && c.value.body[u - 1].rootName === t.rootName ? (a(), o("span", Il)) : (a(), o("span", Ll, n((t.rootToTotal * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1))
+                        ])
+                      ], 12, Nl),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[3]
+                      }, [
+                        s("div", Vl, [
+                          c.value.body[u - 1] && c.value.body[u - 1].branchName === t.branchName ? (a(), o("span", Rl)) : (a(), o("span", Bl, n(t.branchName), 1))
+                        ])
+                      ], 12, Pl),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[4]
+                      }, [
+                        s("div", jl, [
+                          c.value.body[u - 1] && c.value.body[u - 1].branchName === t.branchName ? (a(), o("span", Xl)) : (a(), o("span", Ol, n(t.branchValue.toFixed(e.value.table.td.roundingValue)), 1))
+                        ])
+                      ], 12, Ml),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[5]
+                      }, [
+                        s("div", El, [
+                          c.value.body[u - 1] && c.value.body[u - 1].branchName === t.branchName ? (a(), o("span", Al)) : (a(), o("span", Ul, n((t.branchToRoot * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1))
+                        ])
+                      ], 12, Gl),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[6]
+                      }, [
+                        s("div", Yl, [
+                          c.value.body[u - 1] && c.value.body[u - 1].branchName === t.branchName ? (a(), o("span", ql)) : (a(), o("span", Hl, n((t.branchToTotal * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1))
+                        ])
+                      ], 12, Dl),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[7]
+                      }, [
+                        s("div", Kl, n(t.nutName), 1)
+                      ], 12, Wl),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[8]
+                      }, [
+                        s("div", Ql, n(t.nutValue.toFixed(e.value.table.td.roundingValue)), 1)
+                      ], 12, Jl),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[9]
+                      }, [
+                        s("div", ea, n((t.nutToBranch * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1)
+                      ], 12, Zl),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[10]
+                      }, [
+                        s("div", la, n((t.nutToRoot * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1)
+                      ], 12, ta),
+                      s("td", {
+                        class: "vue-ui-data-table__tbody__td",
+                        style: h(`outline:${e.value.table.td.outline}`),
+                        "data-cell": c.value.head[11]
+                      }, [
+                        s("div", oa, n((t.nutToTotal * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1)
+                      ], 12, aa)
+                    ], 6))), 256))
+                  ])
+                ])
+              ], 2)
+            ])
+          ], 512)
+        ]),
+        _: 1
+      }, 8, ["config"])) : b("", !0)
+    ], 14, lt));
+  }
+}, fa = /* @__PURE__ */ tt(sa, [["__scopeId", "data-v-bf0d15ab"]]);
+export {
+  fa as default
+};