vue-data-ui 2.10.5 → 2.10.6

package/dist/vue-ui-nested-donuts-6MGMcByL.js

@@ -1,937 +0,0 @@
-import { computed as b, ref as i, watch as Ue, onMounted as st, onBeforeUnmount as ut, createElementBlock as n, openBlock as u, unref as r, normalizeStyle as K, normalizeClass as D, createBlock as z, createCommentVNode as f, createVNode as Re, createSlots as nt, withCtx as g, renderSlot as m, normalizeProps as V, guardReactiveProps as M, createElementVNode as k, Fragment as C, renderList as F, toDisplayString as S, createTextVNode as Q, nextTick as rt } from "vue";
-import { u as it, c as dt, t as vt, p as Z, a as ct, o as ft, e as U, b as ht, H as Be, d as yt, m as Ee, f as x, X as pt, s as Ge, J as bt, k as ie, n as R, i as E, x as Ye, q as gt, r as mt, y as kt } from "./index-D2h9qRb4.js";
-import { t as wt, u as $t } from "./useResponsive-Cw4oZ8sQ.js";
-import { _ as Lt } from "./Title-BNsKKvQy.js";
-import { u as Ct, U as xt } from "./usePrinter-BGkHpXM9.js";
-import { D as _t } from "./DataTable-CGMCHKzY.js";
-import { _ as Tt } from "./Tooltip-Dm2APAls.js";
-import { L as Ft } from "./Legend-CLZW3_-V.js";
-import Nt from "./vue-ui-skeleton-CNP_4H8z.js";
-import St from "./vue-ui-accordion-C-v1kmEc.js";
-import { u as Xe } from "./useNestedProp-DlWfv-mw.js";
-import { _ as Ot } from "./PackageVersion-DrU5ubC-.js";
-import { _ as It } from "./PenAndPaper-BF6RVx_0.js";
-import { u as At } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as Dt } from "./useChartAccessibility-BWojgys7.js";
-import { _ as zt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Pt = ["id"], Vt = ["xmlns", "viewBox"], Mt = ["width", "height"], Ut = ["id"], Rt = ["offset", "stop-color"], Bt = ["offset", "stop-opacity"], Et = ["id"], Gt = ["id"], Yt = ["id"], Xt = ["flood-color"], Ht = ["d", "fill", "stroke", "stroke-width", "filter"], Wt = { key: 1 }, qt = ["d", "fill"], Jt = { key: 2 }, Kt = ["x", "y", "font-size", "font-weight", "fill"], Qt = { key: 3 }, Zt = ["filter"], jt = ["text-anchor", "x", "y", "fill", "font-size", "font-weight"], el = ["text-anchor", "x", "y", "fill", "font-size", "font-weight"], tl = ["text-anchor", "x", "y", "fill", "font-size", "font-weight"], ll = ["d", "fill", "onMouseenter", "onClick"], al = {
-  key: 5,
-  class: "vue-data-ui-watermark"
-}, ol = {
-  key: 0,
-  class: "vue-ui-nested-donuts-legend-title"
-}, sl = ["onClick"], ul = ["innerHTML"], nl = {
-  __name: "vue-ui-nested-donuts",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-  emits: ["selectLegend", "selectDatapoint"],
-  setup(He, { expose: We, emit: qe }) {
-    const { vue_ui_nested_donuts: Je } = it(), O = He, G = b(() => !!O.dataset && O.dataset.length), $ = i(dt()), j = i(!1), ee = i(""), Ke = i(null), de = i(0), B = i(null), ve = i(null), te = i(null), ce = i(null), fe = i(null), he = i(0), ye = i(0), pe = i(0), P = i(!1);
-    function Qe(t) {
-      P.value = t, de.value += 1;
-    }
-    const e = b({
-      get: () => ke(),
-      set: (t) => t
-    }), { userOptionsVisible: le, setUserOptionsVisibility: be, keepUserOptionState: ge } = At({ config: e.value }), { svgRef: me } = Dt({ config: e.value.style.chart.title });
-    function ke() {
-      const t = Xe({
-        userConfig: O.config,
-        defaultConfig: Je
-      });
-      return t.theme ? {
-        ...Xe({
-          userConfig: ct.vue_ui_nested_donuts[t.theme] || O.config,
-          defaultConfig: t
-        }),
-        customPalette: vt[t.theme] || Z
-      } : t;
-    }
-    Ue(() => O.config, (t) => {
-      e.value = ke(), le.value = !e.value.userOptions.showOnChartHover, $e(), he.value += 1, ye.value += 1, pe.value += 1, y.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, y.value.showTable = e.value.table.show, y.value.showTooltip = e.value.style.chart.tooltip.show;
-    }, { deep: !0 });
-    const we = b(() => {
-      const { top: t, right: s, bottom: a, left: o } = e.value.style.chart.padding;
-      return {
-        css: `padding:${t}px ${s}px ${a}px ${o}px`,
-        top: t,
-        right: s,
-        bottom: a,
-        left: o
-      };
-    }), Y = i(null);
-    st(() => {
-      $e();
-    });
-    function $e() {
-      if (ft(O.dataset) && U({
-        componentName: "VueUiNestedDonuts",
-        type: "dataset"
-      }), e.value.responsive) {
-        const t = wt(() => {
-          const { width: s, height: a } = $t({
-            chart: B.value,
-            title: e.value.style.chart.title.text ? ve.value : null,
-            legend: e.value.style.chart.legend.show ? te.value : null,
-            source: ce.value,
-            noTitle: fe.value,
-            padding: we.value
-          });
-          requestAnimationFrame(() => {
-            c.value.width = s, c.value.height = a;
-          });
-        });
-        Y.value = new ResizeObserver(t), Y.value.observe(B.value.parentNode);
-      }
-    }
-    ut(() => {
-      Y.value && Y.value.disconnect();
-    });
-    const { isPrinting: Le, isImaging: Ce, generatePdf: xe, generateImage: _e } = Ct({
-      elementId: `nested_donuts_${$.value}`,
-      fileName: e.value.style.chart.title.text || "vue-ui-nested-donuts",
-      options: e.value.userOptions.print
-    }), Ze = b(() => e.value.userOptions.show && !e.value.style.chart.title.text), je = b(() => ht(e.value.customPalette)), y = i({
-      dataLabels: {
-        show: e.value.style.chart.layout.labels.dataLabels.show
-      },
-      showTable: e.value.table.show,
-      showTooltip: e.value.style.chart.tooltip.show
-    }), c = i({
-      height: 512,
-      width: 512
-    }), Te = qe;
-    function et({ datapoint: t, index: s }) {
-      Te("selectDatapoint", { datapoint: t, index: s });
-    }
-    const p = i([]), _ = b(() => (O.dataset.forEach((t, s) => {
-      [null, void 0].includes(t.name) && U({
-        componentName: "VueUiNestedDonuts",
-        type: "datasetSerieAttribute",
-        property: "name",
-        index: s
-      }), [null, void 0].includes(t.series) ? U({
-        componentName: "VueUiNestedDonuts",
-        type: "datasetSerieAttribute",
-        property: "series",
-        index: s
-      }) : t.series.length === 0 ? U({
-        componentName: "VueUiNestedDonuts",
-        type: "datasetAttributeEmpty",
-        property: `series at index ${s}`
-      }) : t.series.forEach((a, o) => {
-        [null, void 0].includes(a.name) && U({
-          componentName: "VueUiNestedDonuts",
-          type: "datasetSerieAttribute",
-          property: "name",
-          index: o,
-          key: "serie"
-        }), [null, void 0].includes(a.values) && U({
-          componentName: "VueUiNestedDonuts",
-          type: "datasetSerieAttribute",
-          property: "values",
-          index: o,
-          key: "serie"
-        });
-      });
-    }), O.dataset.map((t, s) => ({
-      ...t,
-      total: t.series.filter((a) => !p.value.includes(a.id)).map((a) => Be(a.values).reduce((o, l) => o + l, 0)).reduce((a, o) => a + o, 0),
-      datasetIndex: s,
-      id: `${$.value}_${s}`,
-      series: t.series.map((a, o) => ({
-        name: a.name,
-        arcOf: t.name,
-        arcOfId: `${$.value}_${s}`,
-        id: `${$.value}_${s}_${o}`,
-        seriesIndex: o,
-        datasetIndex: s,
-        color: yt(a.color) || je.value[o] || Z[o] || Z[o % Z.length],
-        value: Be(a.values).reduce((l, d) => l + d, 0),
-        absoluteValues: a.values || []
-      }))
-    })))), T = b(() => Math.min(c.value.height, c.value.width) * (e.value.style.chart.layout.donut.strokeWidth / 512)), Fe = b(() => [..._.value].map((t, s) => {
-      const a = t.series.filter((o) => !p.value.includes(o.id)).map((o) => o.value).reduce((o, l) => o + l, 0);
-      return {
-        ...t,
-        total: a,
-        series: t.series.filter((o) => !p.value.includes(o.id)).map((o) => ({
-          ...o,
-          proportion: o.value / a
-        }))
-      };
-    }));
-    function tt(t, s, a) {
-      let o = 0;
-      for (let l = 0; l < t.length; l += 1)
-        a.includes(t[l]) && (o += 1);
-      return o < s;
-    }
-    const h = i(Fe.value);
-    Ue(() => Fe.value, (t) => h.value = t);
-    const Ne = i(null), Se = i(null);
-    function ae(t) {
-      Te("selectLegend", t);
-      const s = _.value.flatMap((v) => v.series).find((v) => v.id === t.id), a = h.value.flatMap((v) => v.series).find((v) => v.id === t.id);
-      let l = a ? a.value : 0;
-      const d = _.value.find((v) => v.id === s.arcOfId).series.map((v) => v.id), w = tt(d, d.length - 1, p.value);
-      if (p.value.includes(t.id)) {
-        let v = function() {
-          l > s.value ? (cancelAnimationFrame(Ne.value), h.value = h.value.map((L) => ({
-            ...L,
-            series: L.series.map((N) => N.id == t.id ? {
-              ...N,
-              value: s.value
-            } : N)
-          }))) : (l += s.value * 0.025, h.value = h.value.map((L) => ({
-            ...L,
-            series: L.series.map((N) => N.id === t.id ? {
-              ...N,
-              value: l
-            } : N)
-          })), Ne.value = requestAnimationFrame(v));
-        };
-        p.value = p.value.filter((L) => L !== t.id), v();
-      } else if (w) {
-        let v = function() {
-          l < 0.1 ? (cancelAnimationFrame(Se.value), p.value.push(t.id), h.value = h.value.map((L, N) => ({
-            ...L,
-            series: L.series.map((A) => A.id === t.id ? {
-              ...A,
-              value: 0
-            } : A)
-          }))) : (l /= 1.1, h.value = h.value.map((L, N) => ({
-            ...L,
-            series: L.series.map((A) => A.id === t.id ? {
-              ...A,
-              value: l
-            } : A)
-          })), Se.value = requestAnimationFrame(v));
-        };
-        v();
-      }
-    }
-    const oe = b(() => T.value / _.value.length * e.value.style.chart.layout.donut.spacingRatio), Oe = b(() => h.value.map((t, s) => T.value - s * T.value / _.value.length)), X = b(() => h.value.map((t, s) => {
-      const a = s * T.value / _.value.length;
-      return {
-        ...t,
-        radius: T.value - a,
-        donut: Ee(
-          { series: t.series },
-          c.value.width / 2,
-          c.value.height / 2,
-          T.value - a,
-          T.value - a,
-          1.99999,
-          2,
-          1,
-          360,
-          105.25,
-          oe.value
-        )
-      };
-    })), Ie = b(() => [..._.value].map((t, s) => {
-      const a = s * T.value / _.value.length;
-      return {
-        sizeRatio: a,
-        donut: Ee(
-          { series: [{ value: 1 }] },
-          c.value.width / 2,
-          c.value.height / 2,
-          T.value - a,
-          T.value - a,
-          1.99999,
-          2,
-          1,
-          360,
-          105.25,
-          T.value / _.value.length * e.value.style.chart.layout.donut.spacingRatio
-        )[0]
-      };
-    })), Ae = i(null), H = i(null), W = i(null), se = i(null);
-    function lt({ datapoint: t, _relativeIndex: s, seriesIndex: a }) {
-      Ae.value = t.arcOfId, H.value = t.id, W.value = a, se.value = {
-        datapoint: t,
-        seriesIndex: a,
-        series: h.value,
-        config: e.value
-      };
-      const o = e.value.style.chart.tooltip.customFormat;
-      if (Ye(o) && kt(() => o({
-        seriesIndex: a,
-        datapoint: t,
-        series: h.value,
-        config: e.value
-      })))
-        ee.value = o({
-          seriesIndex: a,
-          datapoint: t,
-          series: h.value,
-          config: e.value
-        });
-      else {
-        let l = "";
-        if (e.value.style.chart.tooltip.showAllItemsAtIndex && p.value.length === 0) {
-          const d = h.value.map((w) => w.series.find((v) => v.seriesIndex === a));
-          d.forEach((w, v) => {
-            if (!w) return "";
-            l += `
-                    <div style="display:flex; flex-direction: column; justify-content:flex-start; align-items:flex-start;padding:6px 0; ${v < d.length - 1 ? `border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor}` : ""}">
-                        <div style="display:flex; flex-direction: row; gap: 3px; justify-content:flex-start; align-items:center;">
-                            <svg viewBox="0 0 20 20" height="${e.value.style.chart.tooltip.fontSize}" width="${e.value.style.chart.tooltip.fontSize}">
-                                <circle cx="10" cy="10" r="10" fill="${w.color}"/>
-                            </svg>
-                            <span>
-                                ${w.arcOf ?? ""} - ${w.name}
-                            </span>
-                        </div>
-                        <span>
-                            ${e.value.style.chart.tooltip.showValue ? `<b>${E(
-              e.value.style.chart.layout.labels.dataLabels.formatter,
-              t.value,
-              x({
-                p: e.value.style.chart.layout.labels.dataLabels.prefix,
-                v: t.value,
-                s: e.value.style.chart.layout.labels.dataLabels.suffix,
-                r: e.value.style.chart.tooltip.roundingValue
-              }),
-              { datapoint: t, seriesIndex: a }
-            )}
-                        </b>` : ""}
-                            ${e.value.style.chart.tooltip.showPercentage ? `(${x({
-              v: w.proportion * 100,
-              s: "%",
-              r: e.value.style.chart.tooltip.roundingPercentage
-            })})` : ""}
-                        </span>
-                    </div>
-                `;
-          });
-        } else
-          l += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${t.arcOf ?? ""} - ${t.name}</div>`, l += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${t.color}"/></svg>`, e.value.style.chart.tooltip.showValue && (l += `<b>${E(
-            e.value.style.chart.layout.labels.dataLabels.formatter,
-            t.value,
-            x({
-              p: e.value.style.chart.layout.labels.dataLabels.prefix,
-              v: t.value,
-              s: e.value.style.chart.layout.labels.dataLabels.suffix,
-              r: e.value.style.chart.tooltip.roundingValue
-            }),
-            { datapoint: t, seriesIndex: a }
-          )}</b>`), e.value.style.chart.tooltip.showPercentage && (e.value.style.chart.tooltip.showValue ? l += `<span>(${x({
-            v: t.proportion * 100,
-            s: "%",
-            r: e.value.style.chart.tooltip.roundingPercentage
-          })})</span></div>` : l += `<b>${x({
-            v: t.proportion * 100,
-            s: "%",
-            r: e.value.style.chart.tooltip.roundingPercentage
-          })}</b></div>`);
-        ee.value = `<div style="font-size:${e.value.style.chart.tooltip.fontSize}px">${l}</div>`;
-      }
-      j.value = !0;
-    }
-    function ue(t) {
-      return t.proportion * 100 > e.value.style.chart.layout.labels.dataLabels.hideUnderValue;
-    }
-    function De(t, s) {
-      if (!e.value.useBlurOnHover)
-        return "";
-      if (e.value.style.chart.tooltip.showAllItemsAtIndex && p.value.length === 0)
-        return [null, void 0].includes(W.value) || W.value === s ? "" : `url(#blur_${$.value})`;
-      if (!e.value.style.chart.tooltip.showAllItemsAtIndex || p.value.length)
-        return [null, void 0].includes(H.value) || H.value === t.id ? "" : `url(#blur_${$.value})`;
-    }
-    const ne = b(() => _.value.map((t, s) => t.series.map((a, o) => ({
-      name: a.name,
-      color: a.color,
-      value: a.value,
-      shape: "circle",
-      arcOf: a.arcOf,
-      id: a.id,
-      seriesIndex: o,
-      datasetIndex: s,
-      total: t.series.filter((l) => !p.value.includes(l.id)).map((l) => l.value).reduce((l, d) => l + d, 0)
-    })).map((a) => ({
-      ...a,
-      opacity: p.value.includes(a.id) ? 0.5 : 1,
-      segregate: () => ae(a),
-      isSegregated: p.value.includes(a.id)
-    })))), at = b(() => ({
-      cy: "nested-donuts-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" : ""
-    })), I = b(() => {
-      const t = h.value.flatMap((a) => a.series.map((o) => ({
-        name: `${a.name} - ${o.name}`,
-        color: o.color,
-        total: a.total
-      }))), s = h.value.flatMap((a) => a.series.map((o) => o.value));
-      return { head: t, body: s };
-    });
-    function ze() {
-      rt(() => {
-        const t = I.value.head.map((o, l) => [[
-          o.name
-        ], [I.value.body[l]], [isNaN(I.value.body[l] / o.total) ? "-" : I.value.body[l] / o.total * 100]]), s = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(t), a = gt(s);
-        mt({ csvContent: a, title: e.value.style.chart.title.text || "vue-ui-nested-donuts" });
-      });
-    }
-    const q = b(() => {
-      const t = [
-        e.value.table.columnNames.series,
-        e.value.table.columnNames.value,
-        e.value.table.columnNames.percentage
-      ], s = I.value.head.map((l, d) => {
-        const w = x({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: I.value.body[d], s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.table.td.roundingValue });
-        return [
-          {
-            color: l.color,
-            name: l.name
-          },
-          w,
-          isNaN(I.value.body[d] / l.total) ? "-" : x({
-            v: I.value.body[d] / l.total * 100,
-            s: "%",
-            r: e.value.table.td.roundingPercentage
-          })
-        ];
-      }), a = {
-        th: {
-          backgroundColor: e.value.table.th.backgroundColor,
-          color: e.value.table.th.color,
-          outline: e.value.table.th.outline
-        },
-        td: {
-          backgroundColor: e.value.table.td.backgroundColor,
-          color: e.value.table.td.color,
-          outline: e.value.table.td.outline
-        },
-        breakpoint: e.value.table.responsiveBreakpoint
-      };
-      return {
-        colNames: [
-          e.value.table.columnNames.series,
-          e.value.table.columnNames.value,
-          e.value.table.columnNames.percentage
-        ],
-        head: t,
-        body: s,
-        config: a
-      };
-    });
-    function ot() {
-      return _.value;
-    }
-    function Pe() {
-      y.value.showTable = !y.value.showTable;
-    }
-    function Ve() {
-      y.value.dataLabels.show = !y.value.dataLabels.show;
-    }
-    function Me() {
-      y.value.showTooltip = !y.value.showTooltip;
-    }
-    const J = i(!1);
-    function re() {
-      J.value = !J.value;
-    }
-    return We({
-      getData: ot,
-      generatePdf: xe,
-      generateCsv: ze,
-      generateImage: _e,
-      toggleTable: Pe,
-      toggleLabels: Ve,
-      toggleTooltip: Me,
-      toggleAnnotator: re
-    }), (t, s) => (u(), n("div", {
-      ref_key: "nestedDonutsChart",
-      ref: B,
-      class: D(`vue-ui-nested-donuts ${P.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
-      style: K(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor}`),
-      id: `nested_donuts_${$.value}`,
-      onMouseenter: s[3] || (s[3] = () => r(be)(!0)),
-      onMouseleave: s[4] || (s[4] = () => r(be)(!1))
-    }, [
-      e.value.userOptions.buttons.annotator ? (u(), z(It, {
-        key: 0,
-        svgRef: r(me),
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        active: J.value,
-        onClose: re
-      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : f("", !0),
-      Ze.value ? (u(), n("div", {
-        key: 1,
-        ref_key: "noTitle",
-        ref: fe,
-        class: "vue-data-ui-no-title-space",
-        style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : f("", !0),
-      e.value.style.chart.title.text ? (u(), n("div", {
-        key: 2,
-        ref_key: "chartTitle",
-        ref: ve
-      }, [
-        (u(), z(Lt, {
-          key: `title_${he.value}`,
-          config: {
-            title: {
-              cy: "donut-div-title",
-              ...e.value.style.chart.title
-            },
-            subtitle: {
-              cy: "donut-div-subtitle",
-              ...e.value.style.chart.title.subtitle
-            }
-          }
-        }, null, 8, ["config"]))
-      ], 512)) : f("", !0),
-      e.value.userOptions.show && G.value && (r(ge) || r(le)) ? (u(), z(xt, {
-        ref: "details",
-        key: `user_option_${de.value}`,
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        isPrinting: r(Le),
-        isImaging: r(Ce),
-        uid: $.value,
-        hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
-        hasPdf: e.value.userOptions.buttons.pdf,
-        hasXls: e.value.userOptions.buttons.csv,
-        hasImg: e.value.userOptions.buttons.img,
-        hasTable: e.value.userOptions.buttons.table,
-        hasLabel: e.value.userOptions.buttons.labels,
-        hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: P.value,
-        isTooltip: y.value.showTooltip,
-        titles: { ...e.value.userOptions.buttonTitles },
-        chartElement: B.value,
-        position: e.value.userOptions.position,
-        hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: J.value,
-        onToggleFullscreen: Qe,
-        onGeneratePdf: r(xe),
-        onGenerateCsv: ze,
-        onGenerateImage: r(_e),
-        onToggleTable: Pe,
-        onToggleLabels: Ve,
-        onToggleTooltip: Me,
-        onToggleAnnotator: re,
-        style: K({
-          visibility: r(ge) ? r(le) ? "visible" : "hidden" : "visible"
-        })
-      }, nt({ _: 2 }, [
-        t.$slots.menuIcon ? {
-          name: "menuIcon",
-          fn: g(({ isOpen: a, color: o }) => [
-            m(t.$slots, "menuIcon", V(M({ isOpen: a, color: o })), void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        t.$slots.optionTooltip ? {
-          name: "optionTooltip",
-          fn: g(() => [
-            m(t.$slots, "optionTooltip", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        t.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: g(() => [
-            m(t.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        t.$slots.optionCsv ? {
-          name: "optionCsv",
-          fn: g(() => [
-            m(t.$slots, "optionCsv", {}, void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        t.$slots.optionImg ? {
-          name: "optionImg",
-          fn: g(() => [
-            m(t.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "4"
-        } : void 0,
-        t.$slots.optionTable ? {
-          name: "optionTable",
-          fn: g(() => [
-            m(t.$slots, "optionTable", {}, void 0, !0)
-          ]),
-          key: "5"
-        } : void 0,
-        t.$slots.optionLabels ? {
-          name: "optionLabels",
-          fn: g(() => [
-            m(t.$slots, "optionLabels", {}, void 0, !0)
-          ]),
-          key: "6"
-        } : void 0,
-        t.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: g(({ toggleFullscreen: a, isFullscreen: o }) => [
-            m(t.$slots, "optionFullscreen", V(M({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
-          ]),
-          key: "7"
-        } : void 0,
-        t.$slots.optionAnnotator ? {
-          name: "optionAnnotator",
-          fn: g(({ toggleAnnotator: a, isAnnotator: o }) => [
-            m(t.$slots, "optionAnnotator", V(M({ toggleAnnotator: a, isAnnotator: o })), void 0, !0)
-          ]),
-          key: "8"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasTable", "hasLabel", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage", "style"])) : f("", !0),
-      G.value ? (u(), n("svg", {
-        key: 4,
-        ref_key: "svgRef",
-        ref: me,
-        xmlns: r(pt),
-        class: D({ "vue-data-ui-fullscreen--on": P.value, "vue-data-ui-fulscreen--off": !P.value }),
-        viewBox: `0 0 ${c.value.width <= 0 ? 1e-3 : c.value.width} ${c.value.height < 0 ? 1e-3 : c.value.height}`,
-        style: K(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color};${we.value.css}`)
-      }, [
-        Re(Ot),
-        t.$slots["chart-background"] ? (u(), n("foreignObject", {
-          key: 0,
-          x: 0,
-          y: 0,
-          width: c.value.width <= 0 ? 1e-3 : c.value.width,
-          height: c.value.height < 0 ? 1e-3 : c.value.height,
-          style: {
-            pointerEvents: "none"
-          }
-        }, [
-          m(t.$slots, "chart-background", {}, void 0, !0)
-        ], 8, Mt)) : f("", !0),
-        k("defs", null, [
-          (u(!0), n(C, null, F(Ie.value, (a, o) => (u(), n("radialGradient", {
-            id: `radial_${$.value}_${o}`
-          }, [
-            s[5] || (s[5] = k("stop", {
-              offset: "0%",
-              "stop-color": "#FFFFFF",
-              "stop-opacity": "0"
-            }, null, -1)),
-            k("stop", {
-              offset: `${(1 - oe.value / Oe.value[o]) * 100}%`,
-              "stop-color": r(Ge)("#FFFFFF", 0),
-              "stop-opacity": "0"
-            }, null, 8, Rt),
-            k("stop", {
-              offset: `${(1 - oe.value / Oe.value[o] / 2) * 100}%`,
-              "stop-color": "#FFFFFF",
-              "stop-opacity": e.value.style.chart.gradientIntensity / 100
-            }, null, 8, Bt),
-            s[6] || (s[6] = k("stop", {
-              offset: "100%",
-              "stop-color": "#FFFFFF",
-              "stop-opacity": "0"
-            }, null, -1))
-          ], 8, Ut))), 256))
-        ]),
-        k("defs", null, [
-          k("filter", {
-            id: `blur_${$.value}`,
-            x: "-50%",
-            y: "-50%",
-            width: "200%",
-            height: "200%"
-          }, [
-            k("feGaussianBlur", {
-              in: "SourceGraphic",
-              stdDeviation: 2,
-              id: `blur_std_${$.value}`
-            }, null, 8, Gt),
-            s[7] || (s[7] = k("feColorMatrix", {
-              type: "saturate",
-              values: "0"
-            }, null, -1))
-          ], 8, Et),
-          k("filter", {
-            id: `shadow_${$.value}`,
-            "color-interpolation-filters": "sRGB"
-          }, [
-            k("feDropShadow", {
-              dx: "0",
-              dy: "0",
-              stdDeviation: "10",
-              "flood-opacity": "0.5",
-              "flood-color": e.value.style.chart.layout.donut.shadowColor
-            }, null, 8, Xt)
-          ], 8, Yt)
-        ]),
-        (u(!0), n(C, null, F(X.value, (a, o) => (u(), n("g", null, [
-          (u(!0), n(C, null, F(a.donut, (l, d) => (u(), n("g", null, [
-            k("path", {
-              class: "vue-ui-donut-arc-path",
-              d: l.arcSlice,
-              fill: r(Ge)(l.color, 80),
-              stroke: e.value.style.chart.backgroundColor,
-              "stroke-width": e.value.style.chart.layout.donut.borderWidth,
-              filter: De(l, d)
-            }, null, 8, Ht)
-          ]))), 256))
-        ]))), 256)),
-        e.value.style.chart.useGradient ? (u(), n("g", Wt, [
-          (u(!0), n(C, null, F(Ie.value, (a, o) => (u(), n("g", null, [
-            k("path", {
-              d: a.donut.arcSlice,
-              fill: `url(#radial_${$.value}_${o})`,
-              stroke: "transparent",
-              "stroke-width": "0"
-            }, null, 8, qt)
-          ]))), 256))
-        ])) : f("", !0),
-        e.value.style.chart.layout.labels.dataLabels.showDonutName ? (u(), n("g", Jt, [
-          (u(!0), n(C, null, F(X.value, (a, o) => (u(), n("g", null, [
-            (u(!0), n(C, null, F(a.donut, (l, d) => (u(), n("g", null, [
-              d === 0 && c.value.width && c.value.height ? (u(), n("text", {
-                key: 0,
-                class: D({ animated: e.value.useCssAnimation }),
-                x: c.value.width / 2,
-                y: l.startY - e.value.style.chart.layout.labels.dataLabels.fontSize + e.value.style.chart.layout.labels.dataLabels.donutNameOffsetY,
-                "text-anchor": "middle",
-                "font-size": e.value.style.chart.layout.labels.dataLabels.fontSize,
-                "font-weight": e.value.style.chart.layout.labels.dataLabels.boldDonutName ? "bold" : "normal",
-                fill: e.value.style.chart.layout.labels.dataLabels.color
-              }, S(e.value.style.chart.layout.labels.dataLabels.donutNameAbbreviation ? r(bt)({ source: a.name, length: e.value.style.chart.layout.labels.dataLabels.donutNameMaxAbbreviationSize }) : a.name), 11, Kt)) : f("", !0)
-            ]))), 256))
-          ]))), 256))
-        ])) : f("", !0),
-        e.value.style.chart.layout.labels.dataLabels.show ? (u(), n("g", Qt, [
-          (u(!0), n(C, null, F(X.value, (a, o) => (u(), n("g", null, [
-            (u(!0), n(C, null, F(a.donut, (l, d) => (u(), n("g", {
-              filter: De(l, d)
-            }, [
-              ue(l) && y.value.dataLabels.show && e.value.style.chart.layout.labels.dataLabels.showPercentage ? (u(), n("text", {
-                key: 0,
-                class: D({ animated: e.value.useCssAnimation }),
-                "text-anchor": r(R)(l, !0).anchor,
-                x: r(R)(l, !1, e.value.style.chart.layout.labels.dataLabels.offsetX).x || 0,
-                y: r(ie)(l, e.value.style.chart.layout.labels.dataLabels.offsetY, e.value.style.chart.layout.labels.dataLabels.offsetY),
-                fill: e.value.style.chart.layout.labels.dataLabels.useSerieColor ? l.color : e.value.style.chart.layout.labels.dataLabels.color,
-                "font-size": e.value.style.chart.layout.labels.dataLabels.fontSize,
-                "font-weight": e.value.style.chart.layout.labels.dataLabels.boldPercentage ? "bold" : "normal"
-              }, S(r(x)({ v: l.proportion * 100, s: "%", r: e.value.style.chart.layout.labels.dataLabels.roundingPercentage })), 11, jt)) : f("", !0),
-              ue(l) && y.value.dataLabels.show && e.value.style.chart.layout.labels.dataLabels.showPercentage && e.value.style.chart.layout.labels.dataLabels.showValue ? (u(), n("text", {
-                key: 1,
-                class: D({ animated: e.value.useCssAnimation }),
-                "text-anchor": r(R)(l, !0).anchor,
-                x: r(R)(l, !1, e.value.style.chart.layout.labels.dataLabels.offsetX).x || 0,
-                y: r(ie)(l, e.value.style.chart.layout.labels.dataLabels.offsetY, e.value.style.chart.layout.labels.dataLabels.offsetY) + e.value.style.chart.layout.labels.dataLabels.fontSize,
-                fill: e.value.style.chart.layout.labels.dataLabels.useSerieColor ? l.color : e.value.style.chart.layout.labels.dataLabels.color,
-                "font-size": e.value.style.chart.layout.labels.dataLabels.fontSize,
-                "font-weight": e.value.style.chart.layout.labels.dataLabels.boldValue ? "bold" : "normal"
-              }, " (" + S(r(E)(
-                e.value.style.chart.layout.labels.dataLabels.formatter,
-                l.value,
-                r(x)({
-                  p: e.value.style.chart.layout.labels.dataLabels.prefix,
-                  v: l.value,
-                  s: e.value.style.chart.layout.labels.dataLabels.suffix,
-                  r: e.value.style.chart.layout.labels.dataLabels.roundingValue
-                }),
-                { datapoint: l, seriesIndex: o, datapointIndex: d }
-              )) + ") ", 11, el)) : f("", !0),
-              ue(l) && y.value.dataLabels.show && !e.value.style.chart.layout.labels.dataLabels.showPercentage && e.value.style.chart.layout.labels.dataLabels.showValue ? (u(), n("text", {
-                key: 2,
-                class: D({ animated: e.value.useCssAnimation }),
-                "text-anchor": r(R)(l, !0).anchor,
-                x: r(R)(l, !1, e.value.style.chart.layout.labels.dataLabels.offsetX).x || 0,
-                y: r(ie)(l, e.value.style.chart.layout.labels.dataLabels.offsetY, e.value.style.chart.layout.labels.dataLabels.offsetY),
-                fill: e.value.style.chart.layout.labels.dataLabels.useSerieColor ? l.color : e.value.style.chart.layout.labels.dataLabels.color,
-                "font-size": e.value.style.chart.layout.labels.dataLabels.fontSize,
-                "font-weight": e.value.style.chart.layout.labels.dataLabels.boldValue ? "bold" : "normal"
-              }, S(r(E)(
-                e.value.style.chart.layout.labels.dataLabels.formatter,
-                l.value,
-                r(x)({
-                  p: e.value.style.chart.layout.labels.dataLabels.prefix,
-                  v: l.value,
-                  s: e.value.style.chart.layout.labels.dataLabels.suffix,
-                  r: e.value.style.chart.layout.labels.dataLabels.roundingValue
-                }),
-                { datapoint: l, seriesIndex: o, datapointIndex: d }
-              )), 11, tl)) : f("", !0)
-            ], 8, Zt))), 256))
-          ]))), 256))
-        ])) : f("", !0),
-        (u(!0), n(C, null, F(X.value, (a, o) => (u(), n("g", null, [
-          (u(!0), n(C, null, F(a.donut, (l, d) => (u(), n("g", null, [
-            k("path", {
-              d: l.arcSlice,
-              fill: Ke.value === o ? "rgba(0,0,0,0.1)" : "transparent",
-              onMouseenter: (w) => lt({
-                datapoint: l,
-                seriesIndex: l.seriesIndex
-              }),
-              onClick: (w) => et({ datapoint: l, index: d }),
-              onMouseleave: s[0] || (s[0] = (w) => {
-                j.value = !1, Ae.value = null, H.value = null, W.value = null;
-              })
-            }, null, 40, ll)
-          ]))), 256))
-        ]))), 256)),
-        m(t.$slots, "svg", { svg: c.value }, void 0, !0)
-      ], 14, Vt)) : f("", !0),
-      t.$slots.watermark ? (u(), n("div", al, [
-        m(t.$slots, "watermark", V(M({ isPrinting: r(Le) || r(Ce) })), void 0, !0)
-      ])) : f("", !0),
-      G.value ? f("", !0) : (u(), z(Nt, {
-        key: 6,
-        config: {
-          type: "donut",
-          style: {
-            backgroundColor: e.value.style.chart.backgroundColor,
-            donut: {
-              color: "#CCCCCC"
-            }
-          }
-        }
-      }, null, 8, ["config"])),
-      Re(Tt, {
-        show: y.value.showTooltip && j.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: B.value,
-        content: ee.value,
-        isFullscreen: P.value,
-        isCustom: r(Ye)(e.value.style.chart.tooltip.customFormat)
-      }, {
-        "tooltip-before": g(() => [
-          m(t.$slots, "tooltip-before", V(M({ ...se.value })), void 0, !0)
-        ]),
-        "tooltip-after": g(() => [
-          m(t.$slots, "tooltip-after", V(M({ ...se.value })), void 0, !0)
-        ]),
-        _: 3
-      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom"]),
-      e.value.style.chart.legend.show ? (u(), n("div", {
-        key: 7,
-        ref_key: "chartLegend",
-        ref: te,
-        class: D({ "vue-ui-nested-donuts-legend": ne.value.length > 1 })
-      }, [
-        (u(!0), n(C, null, F(ne.value, (a, o) => (u(), z(Ft, {
-          key: `legend_${o}_${pe.value}`,
-          legendSet: a,
-          config: at.value,
-          onClickMarker: s[1] || (s[1] = ({ legend: l }) => ae(l))
-        }, {
-          legendTitle: g(({ titleSet: l }) => [
-            l[0] && l[0].arcOf ? (u(), n("div", ol, S(l[0].arcOf), 1)) : f("", !0)
-          ]),
-          item: g(({ legend: l, index: d }) => [
-            k("div", {
-              onClick: (w) => ae(l),
-              style: K(`opacity:${p.value.includes(l.id) ? 0.5 : 1}`)
-            }, [
-              Q(S(l.name) + ": " + S(r(E)(
-                e.value.style.chart.layout.labels.dataLabels.formatter,
-                l.value,
-                r(x)({
-                  p: e.value.style.chart.layout.labels.dataLabels.prefix,
-                  v: l.value,
-                  s: e.value.style.chart.layout.labels.dataLabels.suffix,
-                  r: e.value.style.chart.legend.roundingValue
-                }),
-                { datapoint: l, seriesIndex: d }
-              )) + " ", 1),
-              p.value.includes(l.id) ? (u(), n(C, { key: 1 }, [
-                Q(" ( - % ) ")
-              ], 64)) : (u(), n(C, { key: 0 }, [
-                Q(" (" + S(isNaN(l.value / l.total) ? "-" : r(x)({ v: l.value / l.total * 100, s: "%", r: e.value.style.chart.legend.roundingPercentage })) + ") ", 1)
-              ], 64))
-            ], 12, sl)
-          ]),
-          _: 2
-        }, 1032, ["legendSet", "config"]))), 128))
-      ], 2)) : f("", !0),
-      e.value.style.chart.legend.show ? f("", !0) : (u(), n("div", {
-        key: 8,
-        ref_key: "chartLegend",
-        ref: te
-      }, [
-        m(t.$slots, "legend", { legend: ne.value }, void 0, !0)
-      ], 512)),
-      t.$slots.source ? (u(), n("div", {
-        key: 9,
-        ref_key: "source",
-        ref: ce,
-        dir: "auto"
-      }, [
-        m(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : f("", !0),
-      G.value ? (u(), z(St, {
-        key: 10,
-        hideDetails: "",
-        config: {
-          open: y.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: g(() => [
-          (u(), z(_t, {
-            key: `table_${ye.value}`,
-            colNames: q.value.colNames,
-            head: q.value.head,
-            body: q.value.body,
-            config: q.value.config,
-            title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
-            onClose: s[2] || (s[2] = (a) => y.value.showTable = !1)
-          }, {
-            th: g(({ th: a }) => [
-              k("div", {
-                innerHTML: a,
-                style: { display: "flex", "align-items": "center" }
-              }, null, 8, ul)
-            ]),
-            td: g(({ td: a }) => [
-              Q(S(a.name || a), 1)
-            ]),
-            _: 1
-          }, 8, ["colNames", "head", "body", "config", "title"]))
-        ]),
-        _: 1
-      }, 8, ["config"])) : f("", !0)
-    ], 46, Pt));
-  }
-}, Cl = /* @__PURE__ */ zt(nl, [["__scopeId", "data-v-23284122"]]);
-export {
-  Cl as default
-};