vue-data-ui 2.4.1 → 2.4.3

package/dist/vue-ui-onion-D9o6Rcgu.js

@@ -1,617 +0,0 @@
-import { computed as d, ref as n, watch as he, onMounted as Ne, onBeforeUnmount as Re, openBlock as s, createElementBlock as u, normalizeClass as z, normalizeStyle as W, createBlock as C, createCommentVNode as b, unref as v, createSlots as Ae, withCtx as h, renderSlot as g, normalizeProps as Y, guardReactiveProps as B, createVNode as fe, Fragment as M, renderList as F, createElementVNode as _, toDisplayString as T, createTextVNode as De, nextTick as Le } from "vue";
-import { u as ze, c as Ye, t as Be, a as Ve, p as ge, b as Xe, o as Ge, e as j, d as Ue, X as Ee, f as N, i as q, x as pe, q as He, r as We, y as je } from "./index-DDXisDKy.js";
-import { t as qe, u as Je } from "./useResponsive-NZB-WLRF.js";
-import { _ as Ke } from "./Title-DYNLqCCT.js";
-import { u as Qe, U as Ze } from "./usePrinter-8ofTb2MJ.js";
-import { L as et } from "./Legend-DXLiSLHd.js";
-import { D as tt } from "./DataTable-DL2agEJ3.js";
-import { _ as at } from "./Tooltip-CICAYyQj.js";
-import lt from "./vue-ui-skeleton-B2sRnIXX.js";
-import ot from "./vue-ui-accordion-D_1fE5EF.js";
-import { u as ye } from "./useNestedProp-S1UXxUgm.js";
-import { _ as rt } from "./PackageVersion-DtnhR89q.js";
-import { _ as st } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const nt = ["id"], ut = ["xmlns", "viewBox"], it = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], ct = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], dt = ["id"], vt = ["stdDeviation"], ht = ["filter"], ft = ["cx", "cy", "r", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], gt = ["cx", "cy", "r", "stroke-width", "stroke-dasharray", "stroke-dashoffset", "onMouseenter"], pt = { key: 1 }, yt = ["onMouseenter"], mt = ["x", "y", "font-size", "fill", "font-weight"], bt = {
-  key: 3,
-  class: "vue-data-ui-watermark"
-}, kt = ["onClick"], $t = ["innerHTML"], wt = {
-  __name: "vue-ui-onion",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-  emits: ["selectLegend"],
-  setup(me, { expose: be, emit: ke }) {
-    const k = me, { vue_ui_onion: $e } = ze(), R = d(() => !!k.dataset && k.dataset.length), x = n(Ye()), we = n(null), J = n(0), A = n(!1), V = n(""), p = n([]), P = n(null), K = n(null), Q = n(null), Z = n(0), ee = n(0), te = n(0), e = d({
-      get: () => ae(),
-      set: (a) => a
-    });
-    function ae() {
-      const a = ye({
-        userConfig: k.config,
-        defaultConfig: $e
-      });
-      return a.theme ? {
-        ...ye({
-          userConfig: Be.vue_ui_onion[a.theme] || k.config,
-          defaultConfig: a
-        }),
-        customPalette: Ve[a.theme] || ge
-      } : a;
-    }
-    he(() => k.config, (a) => {
-      e.value = ae(), ne(), Z.value += 1, ee.value += 1, te.value += 1;
-    }, { deep: !0 });
-    const { isPrinting: le, isImaging: oe, generatePdf: re, generateImage: se } = Qe({
-      elementId: `vue-ui-onion_${x.value}`,
-      fileName: e.value.style.chart.title.text || "vue-ui-onion"
-    }), xe = d(() => Xe(e.value.customPalette)), $ = n({
-      showTable: e.value.table.show,
-      showTooltip: e.value.style.chart.tooltip.show
-    }), r = n({
-      height: 512,
-      width: 512,
-      padding: {
-        top: 64,
-        left: 64,
-        right: 64,
-        bottom: 64
-      },
-      minRadius: 64
-    }), D = n(null);
-    Ne(() => {
-      ne();
-    });
-    function ne() {
-      if (Ge(k.dataset) && j({
-        componentName: "VueUiOnion",
-        type: "dataset"
-      }), e.value.responsive) {
-        const o = qe(() => {
-          const { width: t, height: l } = Je({
-            chart: P.value,
-            title: e.value.style.chart.title.text ? K.value : null,
-            legend: e.value.style.chart.legend.show ? Q.value : null
-          });
-          r.value.width = t, r.value.height = l, r.value.padding.top = Math.max(t, l) * 0.125, r.value.padding.right = Math.max(t, l) * 0.125, r.value.padding.bottom = Math.max(t, l) * 0.125, r.value.padding.left = Math.max(t, l) * 0.125, r.value.minRadius = Math.min(t, l) * 0.125;
-        });
-        D.value = new ResizeObserver(o), D.value.observe(P.value.parentNode);
-      }
-    }
-    Re(() => {
-      D.value && D.value.disconnect();
-    });
-    const i = d(() => ({
-      top: r.value.padding.top,
-      left: r.value.padding.left,
-      right: r.value.width - r.value.padding.right,
-      bottom: r.value.height - r.value.padding.bottom,
-      centerX: r.value.width / 2,
-      centerY: r.value.height / 2,
-      width: r.value.width - r.value.padding.right - r.value.padding.left,
-      height: r.value.height - r.value.padding.bottom - r.value.padding.top,
-      minRadius: r.value.minRadius,
-      maxRadius: Math.min(r.value.width, r.value.height) - r.value.padding.top * 2
-    })), c = d(() => (k.dataset.forEach((a, o) => {
-      [null, void 0].includes(a.name) && j({
-        componentName: "VueUiOnion",
-        type: "datasetSerieAttribute",
-        property: "name",
-        index: o
-      }), [void 0].includes(a.percentage) && j({
-        componentName: "VueUiOnion",
-        type: "datasetSerieAttribute",
-        property: "percentage",
-        index: o
-      });
-    }), k.dataset.map((a, o) => {
-      const t = `onion_serie_${o}_${x.value}`;
-      return {
-        ...a,
-        percentage: a.percentage || 0,
-        targetPercentage: a.percentage || 0,
-        color: Ue(a.color) || xe.value[o] || ge[o],
-        id: t,
-        shape: "circle",
-        opacity: p.value.includes(t) ? 0.5 : 1,
-        absoluteIndex: o,
-        segregate: () => ue(t),
-        isSegregated: p.value.includes(t)
-      };
-    }))), O = n(c.value), Ce = d(() => e.value.useStartAnimation), _e = n(null), Te = d(() => Math.max(...c.value.map((a) => a.percentage))), X = n(!1);
-    he(() => c.value, Pe, { immediate: !0 });
-    function Pe() {
-      if (Ce.value && !X.value) {
-        let o = function() {
-          a >= Te.value ? (cancelAnimationFrame(_e.value), O.value = c.value, X.value = !0) : (O.value = c.value.map((t) => ({
-            ...t,
-            percentage: a < t.targetPercentage ? a : t.targetPercentage
-          })), a += 1, requestAnimationFrame(o), X.value = !0);
-        };
-        O.value = c.value.map((t) => ({
-          ...t,
-          percentage: 0
-        }));
-        let a = 0;
-        o();
-      } else
-        O.value = c.value;
-    }
-    const Oe = d(() => ({
-      cy: "onion-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" : ""
-    })), Ie = d(() => c.value.filter((a) => !p.value.includes(a.id)).length), w = d(() => {
-      const a = Math.min(i.value.width, i.value.height) / 2 / c.value.length;
-      return {
-        gutter: (a > e.value.style.chart.layout.maxThickness ? e.value.style.chart.layout.maxThickness : a) * e.value.style.chart.layout.gutter.width,
-        track: (a > e.value.style.chart.layout.maxThickness ? e.value.style.chart.layout.maxThickness : a) * e.value.style.chart.layout.track.width
-      };
-    }), y = d(() => O.value.filter((a) => !p.value.includes(a.id)).map((a, o) => {
-      const t = (i.value.maxRadius - w.value.track) / Ie.value / 2 * (1 + o), l = i.value.centerY - t;
-      return {
-        percentage: a.percentage || 0,
-        ...a,
-        labelY: l,
-        radius: t,
-        path: Se(t, a.percentage || 0)
-      };
-    }));
-    function Se(a, o) {
-      const t = 2 * Math.PI * a, l = t * 0.75, f = `${l} ${t}`, S = l * (1 - o / 100);
-      return {
-        bgDashArray: `${l} ${t}`,
-        bgDashOffset: 0,
-        dashArray: f,
-        dashOffset: S,
-        fullOffset: 0,
-        active: `
-            M ${i.value.centerX},${i.value.centerY - a} 
-            A ${a},${a} 0 1 1 
-            ${i.value.centerX + a * Math.cos(Math.PI * 3 / 4)},${i.value.centerY + a * Math.sin(Math.PI * 3 / 4)}
-        `.trim()
-      };
-    }
-    function ue(a) {
-      p.value.includes(a) ? p.value = p.value.filter((o) => o !== a) : p.value.push(a), ke("selectLegend", y.value);
-    }
-    function Me() {
-      return y.value;
-    }
-    const G = d(() => {
-      const a = [e.value.table.translations.serie, e.value.table.translations.percentage, e.value.table.translations.value], o = y.value.map((t) => [
-        t.name,
-        t.percentage,
-        t.value
-      ]);
-      return { head: a, body: o };
-    }), L = d(() => {
-      const a = G.value.head, o = y.value.map((l) => [
-        `<span style="color:${l.color}">⬤</span> ${l.name}`,
-        `${Number(l.percentage ?? 0).toFixed(e.value.table.td.roundingPercentage).toLocaleString()}%`,
-        `${l.prefix || ""}${[null, void 0, NaN, "NaN"].includes(l.value) ? "-" : l.value.toFixed(e.value.table.td.roundingValue).toLocaleString()}${l.suffix || ""}`
-      ]), t = {
-        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 { head: a, body: o, config: t, colNames: a };
-    });
-    function ie() {
-      Le(() => {
-        const a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], o = G.value.head, t = G.value.body, l = a.concat([o]).concat(t), f = He(l);
-        We({ csvContent: f, title: e.value.style.chart.title.text || "vue-ui-onion" });
-      });
-    }
-    const m = n(void 0), I = n(!1);
-    function Fe(a) {
-      I.value = a, J.value += 1;
-    }
-    const U = n(null);
-    function ce({ datapoint: a, seriesIndex: o, show: t = !0 }) {
-      const l = a.absoluteIndex;
-      m.value = o, U.value = {
-        datapoint: a,
-        seriesIndex: l,
-        series: c.value,
-        config: e.value
-      }, A.value = t;
-      let f = "";
-      const S = e.value.style.chart.tooltip.customFormat;
-      if (pe(S) && je(() => S({
-        seriesIndex: l,
-        datapoint: a,
-        series: c.value,
-        config: e.value
-      })))
-        V.value = S({
-          seriesIndex: l,
-          datapoint: a,
-          series: c.value,
-          config: e.value
-        });
-      else {
-        const E = e.value.style.chart.tooltip.showPercentage, H = e.value.style.chart.tooltip.showValue;
-        f += `<div style="width: 100%; border-bottom: 1px solid ${e.value.style.chart.tooltip.borderColor}; padding-bottom: 6px;margin-bottom:3px;display:flex;flex-direction:row;gap:3px;align-items:center"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${a.color}"/></svg><span></span>${a.name}</span></div>`, f += `<div style="width:100%;text-align:left;"><b>${E ? N({ p: "", v: a.percentage, s: "%", r: e.value.style.chart.tooltip.roundingPercentage }) : ""}</b> ${E && H ? "(" : ""}${H ? q(
-          e.value.style.chart.layout.labels.value.formatter,
-          a.value,
-          N({
-            p: a.prefix || "",
-            v: a.value,
-            s: a.suffix || "",
-            r: e.value.style.chart.tooltip.roundingValue
-          }),
-          { datapoint: a, seriesIndex: o }
-        ) : ""}${E && H ? ")" : ""}</div>`, V.value = `<div>${f}</div>`;
-      }
-    }
-    function de() {
-      $.value.showTable = !$.value.showTable;
-    }
-    function ve() {
-      $.value.showTooltip = !$.value.showTooltip;
-    }
-    return be({
-      getData: Me,
-      generatePdf: re,
-      generateCsv: ie,
-      generateImage: se,
-      toggleTable: de,
-      toggleTooltip: ve
-    }), (a, o) => (s(), u("div", {
-      class: z(`vue-ui-onion ${I.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
-      ref_key: "onionChart",
-      ref: P,
-      id: `vue-ui-onion_${x.value}`,
-      style: W(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height: 100%;" : ""} text-align:center;background:${e.value.style.chart.backgroundColor}`)
-    }, [
-      e.value.style.chart.title.text ? (s(), u("div", {
-        key: 0,
-        ref_key: "chartTitle",
-        ref: K,
-        style: "width:100%;background:transparent"
-      }, [
-        (s(), C(Ke, {
-          key: `title_${Z.value}`,
-          config: {
-            title: {
-              cy: "onion-div-title",
-              ...e.value.style.chart.title
-            },
-            subtitle: {
-              cy: "onion-div-subtitle",
-              ...e.value.style.chart.title.subtitle
-            }
-          }
-        }, null, 8, ["config"]))
-      ], 512)) : b("", !0),
-      e.value.userOptions.show && R.value ? (s(), C(Ze, {
-        ref_key: "details",
-        ref: we,
-        key: `user_options${J.value}`,
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        isImaging: v(oe),
-        isPrinting: v(le),
-        uid: x.value,
-        hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
-        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: I.value,
-        isTooltip: $.value.showTooltip,
-        titles: { ...e.value.userOptions.buttonTitles },
-        chartElement: P.value,
-        position: e.value.userOptions.position,
-        onToggleFullscreen: Fe,
-        onGeneratePdf: v(re),
-        onGenerateCsv: ie,
-        onGenerateImage: v(se),
-        onToggleTable: de,
-        onToggleTooltip: ve
-      }, Ae({ _: 2 }, [
-        a.$slots.optionTooltip ? {
-          name: "optionTooltip",
-          fn: h(() => [
-            g(a.$slots, "optionTooltip", {}, void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        a.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: h(() => [
-            g(a.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        a.$slots.optionCsv ? {
-          name: "optionCsv",
-          fn: h(() => [
-            g(a.$slots, "optionCsv", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        a.$slots.optionImg ? {
-          name: "optionImg",
-          fn: h(() => [
-            g(a.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        a.$slots.optionTable ? {
-          name: "optionTable",
-          fn: h(() => [
-            g(a.$slots, "optionTable", {}, void 0, !0)
-          ]),
-          key: "4"
-        } : void 0,
-        a.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: h(({ toggleFullscreen: t, isFullscreen: l }) => [
-            g(a.$slots, "optionFullscreen", Y(B({ toggleFullscreen: t, isFullscreen: l })), void 0, !0)
-          ]),
-          key: "5"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "onGeneratePdf", "onGenerateImage"])) : b("", !0),
-      R.value ? (s(), u("svg", {
-        key: 2,
-        xmlns: v(Ee),
-        class: z({ "vue-data-ui-fullscreen--on": I.value, "vue-data-ui-fulscreen--off": !I.value }),
-        viewBox: `0 0 ${r.value.width <= 0 ? 1e-4 : r.value.width} ${r.value.height <= 0 ? 1e-4 : r.value.height}`,
-        style: W(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
-      }, [
-        fe(rt),
-        (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("circle", {
-          cx: i.value.centerX,
-          cy: i.value.centerY,
-          r: t.radius <= 0 ? 1e-4 : t.radius,
-          stroke: e.value.style.chart.layout.gutter.color,
-          "stroke-width": w.value.gutter,
-          fill: "none",
-          "stroke-dasharray": t.path.bgDashArray,
-          "stroke-dashoffset": t.path.fullOffset,
-          "stroke-linecap": "round",
-          class: z({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(m.value) && m.value !== l }),
-          style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
-        }, null, 10, it))), 256)),
-        (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("circle", {
-          cx: i.value.centerX,
-          cy: i.value.centerY,
-          r: t.radius < 0 ? 1e-4 : t.radius,
-          stroke: `${t.color}`,
-          "stroke-width": w.value.track,
-          fill: "none",
-          "stroke-dasharray": t.path.dashArray,
-          "stroke-dashoffset": t.path.dashOffset,
-          class: z({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(m.value) && m.value !== l }),
-          "stroke-linecap": "round",
-          style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
-        }, null, 10, ct))), 256)),
-        _("defs", null, [
-          _("filter", {
-            id: `blur_${x.value}`,
-            x: "-50%",
-            y: "-50%",
-            width: "200%",
-            height: "200%"
-          }, [
-            _("feGaussianBlur", {
-              in: "SourceGraphic",
-              stdDeviation: 100 / e.value.style.chart.gradientIntensity
-            }, null, 8, vt)
-          ], 8, dt)
-        ]),
-        e.value.style.chart.useGradient ? (s(), u("g", {
-          key: 0,
-          filter: `url(#blur_${x.value})`
-        }, [
-          (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("circle", {
-            cx: i.value.centerX,
-            cy: i.value.centerY,
-            r: t.radius <= 0 ? 1e-4 : t.radius,
-            stroke: "white",
-            "stroke-width": w.value.track / 3,
-            fill: "none",
-            "stroke-linecap": "round",
-            "stroke-dasharray": t.path.dashArray,
-            "stroke-dashoffset": t.path.dashOffset,
-            style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
-          }, null, 8, ft))), 256))
-        ], 8, ht)) : b("", !0),
-        (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("circle", {
-          "data-cy-trap": "",
-          cx: i.value.centerX,
-          cy: i.value.centerY,
-          r: t.radius <= 0 ? 1e-4 : t.radius,
-          stroke: "transparent",
-          "stroke-width": Math.max(w.value.track, w.value.gutter),
-          fill: "none",
-          "stroke-dasharray": t.path.bgDashArray,
-          "stroke-dashoffset": t.path.fullOffset,
-          "stroke-linecap": "round",
-          class: "vue-ui-onion-path",
-          style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" },
-          onMouseenter: (f) => ce({
-            datapoint: t,
-            show: !0,
-            seriesIndex: l
-          }),
-          onMouseleave: o[0] || (o[0] = (f) => {
-            m.value = void 0, A.value = !1;
-          })
-        }, null, 40, gt))), 256)),
-        e.value.style.chart.layout.labels.show ? (s(), u("g", pt, [
-          (s(!0), u(M, null, F(y.value, (t, l) => (s(), u("g", {
-            onMouseenter: (f) => ce({
-              datapoint: t,
-              show: !0,
-              seriesIndex: l
-            }),
-            onMouseleave: o[1] || (o[1] = (f) => {
-              m.value = void 0, A.value = !1;
-            })
-          }, [
-            p.value.includes(t.id) ? b("", !0) : (s(), u("text", {
-              key: 0,
-              x: r.value.width / 2 - w.value.gutter * 0.8 + e.value.style.chart.layout.labels.offsetX,
-              y: t.labelY + e.value.style.chart.layout.labels.offsetY,
-              "text-anchor": "end",
-              "font-size": e.value.style.chart.layout.labels.fontSize,
-              fill: e.value.useBlurOnHover && ![null, void 0].includes(m.value) && m.value === l ? t.color : e.value.style.chart.layout.labels.color,
-              "font-weight": e.value.style.chart.layout.labels.bold ? "bold" : "normal"
-            }, T(t.name ? t.name + ": " : "") + " " + T(e.value.style.chart.layout.labels.percentage.show ? v(N)({
-              v: t.percentage,
-              s: "%",
-              r: e.value.style.chart.layout.labels.roundingPercentage
-            }) : "") + " " + T(!e.value.style.chart.layout.labels.percentage.show && e.value.style.chart.layout.labels.value.show ? `: ${v(q)(
-              e.value.style.chart.layout.labels.value.formatter,
-              t.value,
-              v(N)({
-                p: t.prefix || "",
-                v: t.value || 0,
-                s: t.suffix || "",
-                r: e.value.style.chart.layout.labels.roundingValue
-              }),
-              { datapoint: t, seriesIndex: l }
-            )}` : `${e.value.style.chart.layout.labels.value.show && t.value ? `(${v(q)(
-              e.value.style.chart.layout.labels.value.formatter,
-              t.value,
-              v(N)({
-                p: t.prefix || "",
-                v: t.value || 0,
-                s: t.suffix || "",
-                r: e.value.style.chart.layout.labels.roundingValue
-              }),
-              { datapoint: t, seriesIndex: l }
-            )})` : ""}`), 9, mt))
-          ], 40, yt))), 256))
-        ])) : b("", !0),
-        g(a.$slots, "svg", { svg: r.value }, void 0, !0)
-      ], 14, ut)) : b("", !0),
-      a.$slots.watermark ? (s(), u("div", bt, [
-        g(a.$slots, "watermark", Y(B({ isPrinting: v(le) || v(oe) })), void 0, !0)
-      ])) : b("", !0),
-      R.value ? b("", !0) : (s(), C(lt, {
-        key: 4,
-        config: {
-          type: "onion",
-          style: {
-            backgroundColor: e.value.style.chart.backgroundColor,
-            onion: {
-              color: e.value.style.chart.layout.gutter.color
-            }
-          }
-        }
-      }, null, 8, ["config"])),
-      _("div", {
-        ref_key: "chartLegend",
-        ref: Q
-      }, [
-        e.value.style.chart.legend.show ? (s(), C(et, {
-          key: `legend_${te.value}`,
-          legendSet: c.value,
-          config: Oe.value,
-          onClickMarker: o[2] || (o[2] = ({ legend: t }) => ue(t.id))
-        }, {
-          item: h(({ legend: t }) => [
-            _("div", {
-              "data-cy-legend-item": "",
-              onClick: (l) => t.segregate(),
-              style: W(`opacity:${p.value.includes(t.id) ? 0.5 : 1}`)
-            }, T(t.name ? t.name + ": " : "") + " " + T((t.percentage || 0).toFixed(e.value.style.chart.legend.roundingPercentage)) + "% ", 13, kt)
-          ]),
-          _: 1
-        }, 8, ["legendSet", "config"])) : g(a.$slots, "legend", {
-          key: 1,
-          legend: c.value
-        }, void 0, !0)
-      ], 512),
-      fe(at, {
-        show: $.value.showTooltip && A.value,
-        backgroundColor: e.value.style.chart.tooltip.backgroundColor,
-        color: e.value.style.chart.tooltip.color,
-        borderRadius: e.value.style.chart.tooltip.borderRadius,
-        borderColor: e.value.style.chart.tooltip.borderColor,
-        borderWidth: e.value.style.chart.tooltip.borderWidth,
-        fontSize: e.value.style.chart.tooltip.fontSize,
-        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: V.value,
-        isCustom: v(pe)(e.value.style.chart.tooltip.customFormat)
-      }, {
-        "tooltip-before": h(() => [
-          g(a.$slots, "tooltip-before", Y(B({ ...U.value })), void 0, !0)
-        ]),
-        "tooltip-after": h(() => [
-          g(a.$slots, "tooltip-after", Y(B({ ...U.value })), void 0, !0)
-        ]),
-        _: 3
-      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom"]),
-      R.value ? (s(), C(ot, {
-        key: 5,
-        hideDetails: "",
-        config: {
-          open: $.value.showTable,
-          maxHeight: 1e4,
-          head: {
-            backgroundColor: e.value.style.chart.backgroundColor,
-            color: e.value.style.chart.color
-          },
-          body: {
-            backgroundColor: e.value.style.chart.backgroundColor,
-            color: e.value.style.chart.color
-          }
-        }
-      }, {
-        content: h(() => [
-          (s(), C(tt, {
-            key: `table_${ee.value}`,
-            colNames: L.value.colNames,
-            head: L.value.head,
-            body: L.value.body,
-            config: L.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[3] || (o[3] = (t) => $.value.showTable = !1)
-          }, {
-            th: h(({ th: t }) => [
-              De(T(t), 1)
-            ]),
-            td: h(({ td: t }) => [
-              _("div", { innerHTML: t }, null, 8, $t)
-            ]),
-            _: 1
-          }, 8, ["colNames", "head", "body", "config", "title"]))
-        ]),
-        _: 1
-      }, 8, ["config"])) : b("", !0)
-    ], 14, nt));
-  }
-}, Dt = /* @__PURE__ */ st(wt, [["__scopeId", "data-v-3e9f72db"]]);
-export {
-  Dt as default
-};

package/dist/vue-ui-onion-N3tRNc4u.cjs

@@ -1,5 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),u=require("./index-C7_6YjWN.cjs"),j=require("./useResponsive-B3TrDDIG.cjs"),he=require("./Title-C-lm3Mkl.cjs"),J=require("./usePrinter-8EP4iaGm.cjs"),pe=require("./Legend-Dj9KiaLv.cjs"),fe=require("./DataTable-BTgMVOwp.cjs"),ge=require("./Tooltip-t-3mVhcz.cjs"),me=require("./vue-ui-skeleton-CGV1dEUD.cjs"),ye=require("./vue-ui-accordion-Cc9958th.cjs"),K=require("./useNestedProp-CC9zGr7C.cjs"),be=require("./PackageVersion-D4D0WicU.cjs"),ke=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),we=["id"],Ce=["xmlns","viewBox"],xe=["cx","cy","r","stroke","stroke-width","stroke-dasharray","stroke-dashoffset"],$e=["cx","cy","r","stroke","stroke-width","stroke-dasharray","stroke-dashoffset"],Be=["id"],Te=["stdDeviation"],_e=["filter"],Se=["cx","cy","r","stroke-width","stroke-dasharray","stroke-dashoffset"],Pe=["cx","cy","r","stroke-width","stroke-dasharray","stroke-dashoffset","onMouseenter"],Ne={key:1},Oe=["onMouseenter"],Fe=["x","y","font-size","fill","font-weight"],Ie={key:3,class:"vue-data-ui-watermark"},Ve=["onClick"],Ee=["innerHTML"],Le={__name:"vue-ui-onion",props:{config:{type:Object,default(){return{}}},dataset:{type:Array,default(){return[]}}},emits:["selectLegend"],setup(Q,{expose:Z,emit:ee}){const p=Q,{vue_ui_onion:te}=u.useConfig(),C=e.computed(()=>!!p.dataset&&p.dataset.length),m=e.ref(u.createUid()),ae=e.ref(null),F=e.ref(0),x=e.ref(!1),T=e.ref(""),d=e.ref([]),y=e.ref(null),I=e.ref(null),V=e.ref(null),E=e.ref(0),L=e.ref(0),M=e.ref(0),t=e.computed({get:()=>D(),set:l=>l});function D(){const l=K.useNestedProp({userConfig:p.config,defaultConfig:te});return l.theme?{...K.useNestedProp({userConfig:u.themes.vue_ui_onion[l.theme]||p.config,defaultConfig:l}),customPalette:u.themePalettes[l.theme]||u.palette}:l}e.watch(()=>p.config,l=>{t.value=D(),Y(),E.value+=1,L.value+=1,M.value+=1},{deep:!0});const{isPrinting:R,isImaging:z,generatePdf:A,generateImage:q}=J.usePrinter({elementId:`vue-ui-onion_${m.value}`,fileName:t.value.style.chart.title.text||"vue-ui-onion"}),le=e.computed(()=>u.convertCustomPalette(t.value.customPalette)),f=e.ref({showTable:t.value.table.show,showTooltip:t.value.style.chart.tooltip.show}),n=e.ref({height:512,width:512,padding:{top:64,left:64,right:64,bottom:64},minRadius:64}),$=e.ref(null);e.onMounted(()=>{Y()});function Y(){if(u.objectIsEmpty(p.dataset)&&u.error({componentName:"VueUiOnion",type:"dataset"}),t.value.responsive){const r=j.throttle(()=>{const{width:a,height:o}=j.useResponsive({chart:y.value,title:t.value.style.chart.title.text?I.value:null,legend:t.value.style.chart.legend.show?V.value:null});n.value.width=a,n.value.height=o,n.value.padding.top=Math.max(a,o)*.125,n.value.padding.right=Math.max(a,o)*.125,n.value.padding.bottom=Math.max(a,o)*.125,n.value.padding.left=Math.max(a,o)*.125,n.value.minRadius=Math.min(a,o)*.125});$.value=new ResizeObserver(r),$.value.observe(y.value.parentNode)}}e.onBeforeUnmount(()=>{$.value&&$.value.disconnect()});const s=e.computed(()=>({top:n.value.padding.top,left:n.value.padding.left,right:n.value.width-n.value.padding.right,bottom:n.value.height-n.value.padding.bottom,centerX:n.value.width/2,centerY:n.value.height/2,width:n.value.width-n.value.padding.right-n.value.padding.left,height:n.value.height-n.value.padding.bottom-n.value.padding.top,minRadius:n.value.minRadius,maxRadius:Math.min(n.value.width,n.value.height)-n.value.padding.top*2})),i=e.computed(()=>(p.dataset.forEach((l,r)=>{[null,void 0].includes(l.name)&&u.error({componentName:"VueUiOnion",type:"datasetSerieAttribute",property:"name",index:r}),[void 0].includes(l.percentage)&&u.error({componentName:"VueUiOnion",type:"datasetSerieAttribute",property:"percentage",index:r})}),p.dataset.map((l,r)=>{const a=`onion_serie_${r}_${m.value}`;return{...l,percentage:l.percentage||0,targetPercentage:l.percentage||0,color:u.convertColorToHex(l.color)||le.value[r]||u.palette[r],id:a,shape:"circle",opacity:d.value.includes(a)?.5:1,absoluteIndex:r,segregate:()=>X(a),isSegregated:d.value.includes(a)}}))),b=e.ref(i.value),oe=e.computed(()=>t.value.useStartAnimation),re=e.ref(null),ne=e.computed(()=>Math.max(...i.value.map(l=>l.percentage))),_=e.ref(!1);e.watch(()=>i.value,ue,{immediate:!0});function ue(){if(oe.value&&!_.value){let r=function(){l>=ne.value?(cancelAnimationFrame(re.value),b.value=i.value,_.value=!0):(b.value=i.value.map(a=>({...a,percentage:l<a.targetPercentage?l:a.targetPercentage})),l+=1,requestAnimationFrame(r),_.value=!0)};b.value=i.value.map(a=>({...a,percentage:0}));let l=0;r()}else b.value=i.value}const se=e.computed(()=>({cy:"onion-div-legend",backgroundColor:t.value.style.chart.legend.backgroundColor,color:t.value.style.chart.legend.color,fontSize:t.value.style.chart.legend.fontSize,paddingBottom:12,fontWeight:t.value.style.chart.legend.bold?"bold":""})),ie=e.computed(()=>i.value.filter(l=>!d.value.includes(l.id)).length),g=e.computed(()=>{const l=Math.min(s.value.width,s.value.height)/2/i.value.length;return{gutter:(l>t.value.style.chart.layout.maxThickness?t.value.style.chart.layout.maxThickness:l)*t.value.style.chart.layout.gutter.width,track:(l>t.value.style.chart.layout.maxThickness?t.value.style.chart.layout.maxThickness:l)*t.value.style.chart.layout.track.width}}),v=e.computed(()=>b.value.filter(l=>!d.value.includes(l.id)).map((l,r)=>{const a=(s.value.maxRadius-g.value.track)/ie.value/2*(1+r),o=s.value.centerY-a;return{percentage:l.percentage||0,...l,labelY:o,radius:a,path:ce(a,l.percentage||0)}}));function ce(l,r){const a=2*Math.PI*l,o=a*.75,c=`${o} ${a}`,w=o*(1-r/100);return{bgDashArray:`${o} ${a}`,bgDashOffset:0,dashArray:c,dashOffset:w,fullOffset:0,active:`
-            M ${s.value.centerX},${s.value.centerY-l} 
-            A ${l},${l} 0 1 1 
-            ${s.value.centerX+l*Math.cos(Math.PI*3/4)},${s.value.centerY+l*Math.sin(Math.PI*3/4)}
-        `.trim()}}function X(l){d.value.includes(l)?d.value=d.value.filter(r=>r!==l):d.value.push(l),ee("selectLegend",v.value)}function de(){return v.value}const S=e.computed(()=>{const l=[t.value.table.translations.serie,t.value.table.translations.percentage,t.value.table.translations.value],r=v.value.map(a=>[a.name,a.percentage,a.value]);return{head:l,body:r}}),B=e.computed(()=>{const l=S.value.head,r=v.value.map(o=>[`<span style="color:${o.color}">⬤</span> ${o.name}`,`${Number(o.percentage??0).toFixed(t.value.table.td.roundingPercentage).toLocaleString()}%`,`${o.prefix||""}${[null,void 0,NaN,"NaN"].includes(o.value)?"-":o.value.toFixed(t.value.table.td.roundingValue).toLocaleString()}${o.suffix||""}`]),a={th:{backgroundColor:t.value.table.th.backgroundColor,color:t.value.table.th.color,outline:t.value.table.th.outline},td:{backgroundColor:t.value.table.td.backgroundColor,color:t.value.table.td.color,outline:t.value.table.td.outline},breakpoint:t.value.table.responsiveBreakpoint};return{head:l,body:r,config:a,colNames:l}});function U(){e.nextTick(()=>{const l=[[t.value.style.chart.title.text],[t.value.style.chart.title.subtitle.text],[""]],r=S.value.head,a=S.value.body,o=l.concat([r]).concat(a),c=u.createCsvContent(o);u.downloadCsv({csvContent:c,title:t.value.style.chart.title.text||"vue-ui-onion"})})}const h=e.ref(void 0),k=e.ref(!1);function ve(l){k.value=l,F.value+=1}const P=e.ref(null);function G({datapoint:l,seriesIndex:r,show:a=!0}){const o=l.absoluteIndex;h.value=r,P.value={datapoint:l,seriesIndex:o,series:i.value,config:t.value},x.value=a;let c="";const w=t.value.style.chart.tooltip.customFormat;if(u.isFunction(w)&&u.functionReturnsString(()=>w({seriesIndex:o,datapoint:l,series:i.value,config:t.value})))T.value=w({seriesIndex:o,datapoint:l,series:i.value,config:t.value});else{const N=t.value.style.chart.tooltip.showPercentage,O=t.value.style.chart.tooltip.showValue;c+=`<div style="width: 100%; border-bottom: 1px solid ${t.value.style.chart.tooltip.borderColor}; padding-bottom: 6px;margin-bottom:3px;display:flex;flex-direction:row;gap:3px;align-items:center"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${l.color}"/></svg><span></span>${l.name}</span></div>`,c+=`<div style="width:100%;text-align:left;"><b>${N?u.dataLabel({p:"",v:l.percentage,s:"%",r:t.value.style.chart.tooltip.roundingPercentage}):""}</b> ${N&&O?"(":""}${O?u.applyDataLabel(t.value.style.chart.layout.labels.value.formatter,l.value,u.dataLabel({p:l.prefix||"",v:l.value,s:l.suffix||"",r:t.value.style.chart.tooltip.roundingValue}),{datapoint:l,seriesIndex:r}):""}${N&&O?")":""}</div>`,T.value=`<div>${c}</div>`}}function H(){f.value.showTable=!f.value.showTable}function W(){f.value.showTooltip=!f.value.showTooltip}return Z({getData:de,generatePdf:A,generateCsv:U,generateImage:q,toggleTable:H,toggleTooltip:W}),(l,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(`vue-ui-onion ${k.value?"vue-data-ui-wrapper-fullscreen":""} ${t.value.useCssAnimation?"":"vue-ui-dna"}`),ref_key:"onionChart",ref:y,id:`vue-ui-onion_${m.value}`,style:e.normalizeStyle(`font-family:${t.value.style.fontFamily};width:100%; ${t.value.responsive?"height: 100%;":""} text-align:center;background:${t.value.style.chart.backgroundColor}`)},[t.value.style.chart.title.text?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"chartTitle",ref:I,style:"width:100%;background:transparent"},[(e.openBlock(),e.createBlock(he._sfc_main,{key:`title_${E.value}`,config:{title:{cy:"onion-div-title",...t.value.style.chart.title},subtitle:{cy:"onion-div-subtitle",...t.value.style.chart.title.subtitle}}},null,8,["config"]))],512)):e.createCommentVNode("",!0),t.value.userOptions.show&&C.value?(e.openBlock(),e.createBlock(J.UserOptions,{ref_key:"details",ref:ae,key:`user_options${F.value}`,backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color,isImaging:e.unref(z),isPrinting:e.unref(R),uid:m.value,hasTooltip:t.value.userOptions.buttons.tooltip&&t.value.style.chart.tooltip.show,hasPdf:t.value.userOptions.buttons.pdf,hasImg:t.value.userOptions.buttons.img,hasXls:t.value.userOptions.buttons.csv,hasTable:t.value.userOptions.buttons.table,hasFullscreen:t.value.userOptions.buttons.fullscreen,isFullscreen:k.value,isTooltip:f.value.showTooltip,titles:{...t.value.userOptions.buttonTitles},chartElement:y.value,position:t.value.userOptions.position,onToggleFullscreen:ve,onGeneratePdf:e.unref(A),onGenerateCsv:U,onGenerateImage:e.unref(q),onToggleTable:H,onToggleTooltip:W},e.createSlots({_:2},[l.$slots.optionTooltip?{name:"optionTooltip",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionTooltip",{},void 0,!0)]),key:"0"}:void 0,l.$slots.optionPdf?{name:"optionPdf",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionPdf",{},void 0,!0)]),key:"1"}:void 0,l.$slots.optionCsv?{name:"optionCsv",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionCsv",{},void 0,!0)]),key:"2"}:void 0,l.$slots.optionImg?{name:"optionImg",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionImg",{},void 0,!0)]),key:"3"}:void 0,l.$slots.optionTable?{name:"optionTable",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"optionTable",{},void 0,!0)]),key:"4"}:void 0,l.$slots.optionFullscreen?{name:"optionFullscreen",fn:e.withCtx(({toggleFullscreen:a,isFullscreen:o})=>[e.renderSlot(l.$slots,"optionFullscreen",e.normalizeProps(e.guardReactiveProps({toggleFullscreen:a,isFullscreen:o})),void 0,!0)]),key:"5"}:void 0]),1032,["backgroundColor","color","isImaging","isPrinting","uid","hasTooltip","hasPdf","hasImg","hasXls","hasTable","hasFullscreen","isFullscreen","isTooltip","titles","chartElement","position","onGeneratePdf","onGenerateImage"])):e.createCommentVNode("",!0),C.value?(e.openBlock(),e.createElementBlock("svg",{key:2,xmlns:e.unref(u.XMLNS),class:e.normalizeClass({"vue-data-ui-fullscreen--on":k.value,"vue-data-ui-fulscreen--off":!k.value}),viewBox:`0 0 ${n.value.width<=0?1e-4:n.value.width} ${n.value.height<=0?1e-4:n.value.height}`,style:e.normalizeStyle(`max-width:100%;overflow:visible;background:transparent;color:${t.value.style.chart.color}`)},[e.createVNode(be._sfc_main),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(a,o)=>(e.openBlock(),e.createElementBlock("circle",{cx:s.value.centerX,cy:s.value.centerY,r:a.radius<=0?1e-4:a.radius,stroke:t.value.style.chart.layout.gutter.color,"stroke-width":g.value.gutter,fill:"none","stroke-dasharray":a.path.bgDashArray,"stroke-dashoffset":a.path.fullOffset,"stroke-linecap":"round",class:e.normalizeClass({"vue-ui-onion-path":!0,"vue-ui-onion-blur":t.value.useBlurOnHover&&![null,void 0].includes(h.value)&&h.value!==o}),style:{transform:"rotate(-90deg)","transform-origin":"50% 50%"}},null,10,xe))),256)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(a,o)=>(e.openBlock(),e.createElementBlock("circle",{cx:s.value.centerX,cy:s.value.centerY,r:a.radius<0?1e-4:a.radius,stroke:`${a.color}`,"stroke-width":g.value.track,fill:"none","stroke-dasharray":a.path.dashArray,"stroke-dashoffset":a.path.dashOffset,class:e.normalizeClass({"vue-ui-onion-path":!0,"vue-ui-onion-blur":t.value.useBlurOnHover&&![null,void 0].includes(h.value)&&h.value!==o}),"stroke-linecap":"round",style:{transform:"rotate(-90deg)","transform-origin":"50% 50%"}},null,10,$e))),256)),e.createElementVNode("defs",null,[e.createElementVNode("filter",{id:`blur_${m.value}`,x:"-50%",y:"-50%",width:"200%",height:"200%"},[e.createElementVNode("feGaussianBlur",{in:"SourceGraphic",stdDeviation:100/t.value.style.chart.gradientIntensity},null,8,Te)],8,Be)]),t.value.style.chart.useGradient?(e.openBlock(),e.createElementBlock("g",{key:0,filter:`url(#blur_${m.value})`},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(a,o)=>(e.openBlock(),e.createElementBlock("circle",{cx:s.value.centerX,cy:s.value.centerY,r:a.radius<=0?1e-4:a.radius,stroke:"white","stroke-width":g.value.track/3,fill:"none","stroke-linecap":"round","stroke-dasharray":a.path.dashArray,"stroke-dashoffset":a.path.dashOffset,style:{transform:"rotate(-90deg)","transform-origin":"50% 50%"}},null,8,Se))),256))],8,_e)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(a,o)=>(e.openBlock(),e.createElementBlock("circle",{"data-cy-trap":"",cx:s.value.centerX,cy:s.value.centerY,r:a.radius<=0?1e-4:a.radius,stroke:"transparent","stroke-width":Math.max(g.value.track,g.value.gutter),fill:"none","stroke-dasharray":a.path.bgDashArray,"stroke-dashoffset":a.path.fullOffset,"stroke-linecap":"round",class:"vue-ui-onion-path",style:{transform:"rotate(-90deg)","transform-origin":"50% 50%"},onMouseenter:c=>G({datapoint:a,show:!0,seriesIndex:o}),onMouseleave:r[0]||(r[0]=c=>{h.value=void 0,x.value=!1})},null,40,Pe))),256)),t.value.style.chart.layout.labels.show?(e.openBlock(),e.createElementBlock("g",Ne,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,(a,o)=>(e.openBlock(),e.createElementBlock("g",{onMouseenter:c=>G({datapoint:a,show:!0,seriesIndex:o}),onMouseleave:r[1]||(r[1]=c=>{h.value=void 0,x.value=!1})},[d.value.includes(a.id)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("text",{key:0,x:n.value.width/2-g.value.gutter*.8+t.value.style.chart.layout.labels.offsetX,y:a.labelY+t.value.style.chart.layout.labels.offsetY,"text-anchor":"end","font-size":t.value.style.chart.layout.labels.fontSize,fill:t.value.useBlurOnHover&&![null,void 0].includes(h.value)&&h.value===o?a.color:t.value.style.chart.layout.labels.color,"font-weight":t.value.style.chart.layout.labels.bold?"bold":"normal"},e.toDisplayString(a.name?a.name+": ":"")+" "+e.toDisplayString(t.value.style.chart.layout.labels.percentage.show?e.unref(u.dataLabel)({v:a.percentage,s:"%",r:t.value.style.chart.layout.labels.roundingPercentage}):"")+" "+e.toDisplayString(!t.value.style.chart.layout.labels.percentage.show&&t.value.style.chart.layout.labels.value.show?`: ${e.unref(u.applyDataLabel)(t.value.style.chart.layout.labels.value.formatter,a.value,e.unref(u.dataLabel)({p:a.prefix||"",v:a.value||0,s:a.suffix||"",r:t.value.style.chart.layout.labels.roundingValue}),{datapoint:a,seriesIndex:o})}`:`${t.value.style.chart.layout.labels.value.show&&a.value?`(${e.unref(u.applyDataLabel)(t.value.style.chart.layout.labels.value.formatter,a.value,e.unref(u.dataLabel)({p:a.prefix||"",v:a.value||0,s:a.suffix||"",r:t.value.style.chart.layout.labels.roundingValue}),{datapoint:a,seriesIndex:o})})`:""}`),9,Fe))],40,Oe))),256))])):e.createCommentVNode("",!0),e.renderSlot(l.$slots,"svg",{svg:n.value},void 0,!0)],14,Ce)):e.createCommentVNode("",!0),l.$slots.watermark?(e.openBlock(),e.createElementBlock("div",Ie,[e.renderSlot(l.$slots,"watermark",e.normalizeProps(e.guardReactiveProps({isPrinting:e.unref(R)||e.unref(z)})),void 0,!0)])):e.createCommentVNode("",!0),C.value?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(me.default,{key:4,config:{type:"onion",style:{backgroundColor:t.value.style.chart.backgroundColor,onion:{color:t.value.style.chart.layout.gutter.color}}}},null,8,["config"])),e.createElementVNode("div",{ref_key:"chartLegend",ref:V},[t.value.style.chart.legend.show?(e.openBlock(),e.createBlock(pe.Legend,{key:`legend_${M.value}`,legendSet:i.value,config:se.value,onClickMarker:r[2]||(r[2]=({legend:a})=>X(a.id))},{item:e.withCtx(({legend:a})=>[e.createElementVNode("div",{"data-cy-legend-item":"",onClick:o=>a.segregate(),style:e.normalizeStyle(`opacity:${d.value.includes(a.id)?.5:1}`)},e.toDisplayString(a.name?a.name+": ":"")+" "+e.toDisplayString((a.percentage||0).toFixed(t.value.style.chart.legend.roundingPercentage))+"% ",13,Ve)]),_:1},8,["legendSet","config"])):e.renderSlot(l.$slots,"legend",{key:1,legend:i.value},void 0,!0)],512),e.createVNode(ge._sfc_main,{show:f.value.showTooltip&&x.value,backgroundColor:t.value.style.chart.tooltip.backgroundColor,color:t.value.style.chart.tooltip.color,borderRadius:t.value.style.chart.tooltip.borderRadius,borderColor:t.value.style.chart.tooltip.borderColor,borderWidth:t.value.style.chart.tooltip.borderWidth,fontSize:t.value.style.chart.tooltip.fontSize,backgroundOpacity:t.value.style.chart.tooltip.backgroundOpacity,position:t.value.style.chart.tooltip.position,offsetY:t.value.style.chart.tooltip.offsetY,parent:y.value,content:T.value,isCustom:e.unref(u.isFunction)(t.value.style.chart.tooltip.customFormat)},{"tooltip-before":e.withCtx(()=>[e.renderSlot(l.$slots,"tooltip-before",e.normalizeProps(e.guardReactiveProps({...P.value})),void 0,!0)]),"tooltip-after":e.withCtx(()=>[e.renderSlot(l.$slots,"tooltip-after",e.normalizeProps(e.guardReactiveProps({...P.value})),void 0,!0)]),_:3},8,["show","backgroundColor","color","borderRadius","borderColor","borderWidth","fontSize","backgroundOpacity","position","offsetY","parent","content","isCustom"]),C.value?(e.openBlock(),e.createBlock(ye.default,{key:5,hideDetails:"",config:{open:f.value.showTable,maxHeight:1e4,head:{backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color},body:{backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color}}},{content:e.withCtx(()=>[(e.openBlock(),e.createBlock(fe.DataTable,{key:`table_${L.value}`,colNames:B.value.colNames,head:B.value.head,body:B.value.body,config:B.value.config,title:`${t.value.style.chart.title.text}${t.value.style.chart.title.subtitle.text?` : ${t.value.style.chart.title.subtitle.text}`:""}`,onClose:r[3]||(r[3]=a=>f.value.showTable=!1)},{th:e.withCtx(({th:a})=>[e.createTextVNode(e.toDisplayString(a),1)]),td:e.withCtx(({td:a})=>[e.createElementVNode("div",{innerHTML:a},null,8,Ee)]),_:1},8,["colNames","head","body","config","title"]))]),_:1},8,["config"])):e.createCommentVNode("",!0)],14,we))}},Me=ke._export_sfc(Le,[["__scopeId","data-v-3e9f72db"]]);exports.default=Me;