vue-data-ui 3.5.2 → 3.7.0

package/dist/vue-ui-molecule-Bd1OXvl3.js

@@ -1,753 +0,0 @@
-import { useCssVars as bt, defineAsyncComponent as p, computed as h, onMounted as Ct, ref as u, toRefs as yt, watch as x, nextTick as H, createElementBlock as k, openBlock as v, unref as a, normalizeStyle as M, normalizeClass as Oe, createBlock as T, createCommentVNode as y, createVNode as D, withCtx as r, renderSlot as i, normalizeProps as f, guardReactiveProps as g, createSlots as Se, createElementVNode as P, Fragment as kt, renderList as At, resolveDynamicComponent as wt, mergeProps as $t, createTextVNode as De, toDisplayString as Pe } from "vue";
-import { o as Tt, f as _t, c as Ie, t as Ot, b as St, p as Fe, e as Dt, a7 as Pt, X as It, S as Ft, k as Nt, h as Ne, P as Lt, Q as Bt, G as Et, H as Rt } from "./lib-C_mNZmhD.js";
-import { u as Ut, a as Le } from "./useNestedProp-CReNavA0.js";
-import { u as xt, B as Ht } from "./BaseScanner-BgWxam9d.js";
-import { u as Mt } from "./usePrinter-DTzqpYKF.js";
-import { u as Gt } from "./useSvgExport-DrjCWun4.js";
-import { u as Vt } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as zt } from "./useChartAccessibility-9icAAmYg.js";
-import Wt from "./img-BecE5qXd.js";
-import { t as Xt } from "./themes-AUNCOb2G.js";
-import { u as jt } from "./usePanZoom-BVca3eMk.js";
-import { _ as Yt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Zt = ["id"], Qt = {
-  key: 1,
-  ref: "noTitle",
-  class: "vue-data-ui-no-title-space",
-  style: "height:36px; width: 100%;background:transparent"
-}, qt = {
-  key: 2,
-  style: "width:100%;background:transparent;"
-}, Jt = ["xmlns", "viewBox"], Kt = ["width", "height"], eo = ["id"], to = ["stop-color"], oo = ["stop-color"], lo = {
-  key: 4,
-  class: "vue-data-ui-watermark"
-}, ao = {
-  key: 5,
-  "data-dom-to-png-ignore": "",
-  class: "reset-wrapper"
-}, so = {
-  key: 6,
-  ref: "source",
-  dir: "auto"
-}, no = ["innerHTML"], ro = {
-  __name: "vue-ui-molecule",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-  emits: ["selectNode"],
-  setup(Be, { expose: Ee, emit: Re }) {
-    bt((t) => ({
-      f4051c3a: t.slicerColor
-    }));
-    const Ue = p(() => import("./Title-BzH_LEA3.js")), xe = p(() => import("./Tooltip-oWCO1HKy.js")), te = p(() => import("./BaseIcon-BmMbm4d0.js")), He = p(() => import("./vue-ui-accordion-BmFTVF1a.js")), Me = p(() => import("./DataTable-BT7VF2ua.js")), Ge = p(() => import("./PenAndPaper-SZQIAgkg.js")), Ve = p(() => import("./UserOptions-CGnQt6Fd.js")), ze = p(() => import("./PackageVersion-Y7t79Jtq.js")), We = p(() => import("./RecursiveLinks-00zGWPf9.js")), Xe = p(() => import("./RecursiveLabels-Bgcv0pzu.js")), je = p(() => import("./RecursiveCircles-BcLb1aRS.js")), Ye = p(() => import("./BaseDraggableDialog-ymf2sfB8.js")), { vue_ui_molecule: Ze } = Ut(), w = Be, Qe = Re, oe = h(() => !!w.dataset && w.dataset.length);
-    Ct(() => {
-      le();
-    });
-    const qe = h(() => e.value.debug);
-    function le() {
-      Tt(w.dataset) && _t({
-        componentName: "VueUiMolecule",
-        type: "dataset",
-        debug: qe.value
-      });
-    }
-    const G = u(Ie()), V = u(!1), B = u(""), $ = u(null), ae = u(0), se = u(0), ne = u(0), I = u(null), z = u(null), e = u(Y()), { loading: W, FINAL_DATASET: X } = xt({
-      ...yt(w),
-      FINAL_CONFIG: e,
-      prepareConfig: Y,
-      skeletonDataset: [
-        {
-          name: "_",
-          color: "#CACACA",
-          nodes: [
-            { name: "_", color: "#CACACA", nodes: [
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" }
-            ] },
-            { name: "_", color: "#CACACA", nodes: [
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" }
-            ] },
-            { name: "_", color: "#CACACA", nodes: [
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" }
-            ] },
-            { name: "_", color: "#CACACA", nodes: [
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" }
-            ] },
-            { name: "_", color: "#CACACA", nodes: [
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" }
-            ] },
-            { name: "_", color: "#CACACA", nodes: [
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" },
-              { name: "_", color: "#CACACA" }
-            ] }
-          ]
-        }
-      ],
-      skeletonConfig: Ot({
-        defaultConfig: e.value,
-        userConfig: {
-          userOptions: { show: !1 },
-          table: { show: !1 },
-          style: {
-            chart: {
-              backgroundColor: "#99999930",
-              nodes: { stroke: "#6A6A6A" },
-              links: { stroke: "#6A6A6A80" }
-            }
-          }
-        }
-      })
-    }), { userOptionsVisible: j, setUserOptionsVisibility: re, keepUserOptionState: ie } = Vt({ config: e.value }), { svgRef: E } = zt({ config: e.value.style.chart.title });
-    function Y() {
-      const t = Le({
-        userConfig: w.config,
-        defaultConfig: Ze
-      });
-      return t.theme ? {
-        ...Le({
-          userConfig: Xt.vue_ui_molecule[t.theme] || w.config,
-          defaultConfig: t
-        }),
-        customPalette: St[t.theme] || Fe
-      } : t;
-    }
-    x(() => w.config, (t) => {
-      e.value = Y(), j.value = !e.value.userOptions.showOnChartHover, le(), se.value += 1, ne.value += 1, d.value.showTable = e.value.table.show, d.value.showTooltip = e.value.style.chart.tooltip.show;
-    }, { deep: !0 });
-    const ue = u(0), Je = () => {
-      ue.value += 1;
-    };
-    x([() => W.value, () => X.value], async ([t]) => {
-      t || (await H(), m.value = fe(), await H(), Je(), await H(), ct({ x: 0, y: 0, width: 400, height: 400 }), J(!1));
-    }, { flush: "post", deep: !1 });
-    const { isPrinting: ce, isImaging: ve, generatePdf: de, generateImage: pe } = Mt({
-      elementId: `cluster_${G.value}`,
-      fileName: e.value.style.chart.title.text || "vue-ui-molecule",
-      options: e.value.userOptions.print
-    }), Ke = h(() => e.value.userOptions.show && !e.value.style.chart.title.text), et = h(() => Dt(e.value.customPalette)), d = u({
-      showTable: e.value.table.show,
-      showDataLabels: !0,
-      showTooltip: e.value.style.chart.tooltip.show
-    });
-    x(e, () => {
-      d.value = {
-        showTable: e.value.table.show,
-        showDataLabels: !0,
-        showTooltip: e.value.style.chart.tooltip.show
-      };
-    }, { immediate: !0 });
-    function he(t, l = 0) {
-      return Array.isArray(t) && t.length > 0 && t[0].nodes ? he(t[0].nodes, l + 1) : l;
-    }
-    function fe() {
-      const t = he(X.value);
-      let l = 100, o = l;
-      for (let n = 0; n < t; n += 1)
-        l /= 1, o += l;
-      return {
-        height: o,
-        width: o
-      };
-    }
-    const m = u(fe());
-    function ge(t, l = { x: -m.value.width / 2.43, y: m.value.height / 2 }, o = m.value.width / 1.1, n = 24, s = 0, c = 0, b = "#BBBBBB", K = 0) {
-      if (!Array.isArray(t) || t.length === 0) return t;
-      const mt = Nt({
-        plot: l,
-        radius: o,
-        sides: t.length,
-        rotation: s
-      });
-      return t.forEach((C, $e) => {
-        const Te = mt.coordinates[$e], _e = C.color ? (() => {
-          let ee = Ne(C.color);
-          return ee.startsWith("#") ? ee : `#${ee}`;
-        })() : null;
-        let S;
-        _e ? S = _e : K === 0 ? S = b : K === 1 ? (S = et.value[c] || Fe[c] || b, c += 1) : S = b, C.polygonPath = { coordinates: [Te] }, C.circleRadius = n, C.color = S, C.uid = Ie(), Array.isArray(C.nodes) && C.nodes.length && (C.nodes = ge(
-          C.nodes,
-          Te,
-          o / 2.9,
-          n / 2.2,
-          s + Math.PI * $e / C.nodes.length,
-          c,
-          S,
-          K + 1
-        ));
-      }), t;
-    }
-    function tt(t) {
-      const l = /* @__PURE__ */ new Set();
-      function o(s) {
-        s.forEach((c) => {
-          if (!c.color) return;
-          let b = c.color;
-          /^#?[0-9A-F]{6}$/i.test(b) || (b = Ne(b)), b.startsWith("#") || (b = `#${b}`), l.add(b), Array.isArray(c.nodes) && c.nodes.length && o(c.nodes);
-        });
-      }
-      o(t);
-      const n = {};
-      return Array.from(l).forEach((s) => {
-        const c = s.slice(1);
-        n[s] = `gradient_${c}`;
-      }), n;
-    }
-    const ot = h(() => tt(A.value)), A = h(() => {
-      const t = Pt(X.value);
-      return ge(t);
-    }), Z = u(null);
-    function lt(t) {
-      Z.value = {
-        datapoint: t,
-        seriesIndex: -1,
-        series: A.value,
-        config: e.value
-      };
-      const l = e.value.style.chart.tooltip.customFormat;
-      if (Et(l) && Rt(() => l({
-        seriesIndex: -1,
-        datapoint: t,
-        series: A.value,
-        config: e.value
-      })))
-        B.value = l({
-          seriesIndex: -1,
-          // well, ok
-          datapoint: t,
-          series: A.value,
-          config: e.value
-        });
-      else {
-        let o = "";
-        o += `<div style="display:flex;align-items:center;gap:3px"><div style="color:${t.color}">⬤</div><div>${t.name}</div></div>`, t.details && (o += `<div style="width:100%;border-top:1px solid ${e.value.style.chart.tooltip.borderColor};margin-top: 2px">${t.details}</div>`), B.value = `<div style="font-family:inherit">${o}</div>`;
-      }
-    }
-    const R = u(null), F = u(null), me = u(null);
-    function at(t) {
-      me.value = R.value, R.value = t, t ? e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: -1 }) : e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: me.value || R.value, seriesIndex: -1 }), t ? (V.value = !0, lt(t), F.value = t.uid) : (V.value = !1, B.value = "", F.value = null);
-    }
-    function st(t) {
-      const l = [];
-      function o(n) {
-        n.forEach((s) => {
-          const c = {
-            name: s.name,
-            details: s.details || "-",
-            ancestor: s.ancestor && s.ancestor.name || "-",
-            color: s.color || ""
-          };
-          l.push(c), s.nodes && s.nodes.length > 0 && o(s.nodes, s.name);
-        });
-      }
-      return o(t), l;
-    }
-    const nt = h(() => st(A.value)), _ = h(() => {
-      const t = [
-        e.value.table.translations.nodeName,
-        e.value.table.translations.details,
-        e.value.table.translations.ancestor
-      ], l = nt.value.map((s, c) => [
-        {
-          color: s.color,
-          name: s.name
-        },
-        s.details,
-        s.ancestor || ""
-      ]), o = {
-        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
-      }, n = [
-        e.value.table.translations.nodeName,
-        e.value.table.translations.details,
-        e.value.table.translations.ancestor
-      ];
-      return {
-        head: t,
-        body: l,
-        config: o,
-        colNames: n
-      };
-    });
-    function Q(t = null) {
-      H(() => {
-        const l = _.value.body.map((s, c) => [[s[0].name], [s[1]], [s[2]]]), o = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[..._.value.head]]].concat(l), n = Lt(o);
-        t ? t(n) : Bt({ csvContent: n, title: e.value.style.chart.title.text || "vue-ui-molecule" });
-      });
-    }
-    function rt() {
-      return A.value;
-    }
-    const O = u(!1);
-    function be(t) {
-      O.value = t, ae.value += 1;
-    }
-    function Ce() {
-      d.value.showTable = !d.value.showTable;
-    }
-    function ye() {
-      d.value.showDataLabels = !d.value.showDataLabels;
-    }
-    function ke() {
-      d.value.showTooltip = !d.value.showTooltip;
-    }
-    const N = u(!1);
-    function q() {
-      N.value = !N.value;
-    }
-    const it = h(() => !N.value), { viewBox: U, resetZoom: J, isZoom: ut, setInitialViewBox: ct } = jt(E, {
-      x: 0,
-      y: 0,
-      width: Math.max(10, m.value.width),
-      height: Math.max(10, m.value.height)
-    }, e.value.style.chart.zoom.speed, it);
-    function vt(t) {
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: -1 }), Qe("selectNode", t);
-    }
-    async function dt({ scale: t = 2 } = {}) {
-      if (!$.value) return;
-      const { width: l, height: o } = $.value.getBoundingClientRect(), n = l / o, { imageUri: s, base64: c } = await Wt({ domElement: $.value, base64: !0, img: !0, scale: t });
-      return {
-        imageUri: s,
-        base64: c,
-        title: e.value.style.chart.title.text,
-        width: l,
-        height: o,
-        aspectRatio: n
-      };
-    }
-    const L = h(() => {
-      const t = e.value.table.useDialog && !e.value.table.show, l = d.value.showTable;
-      return {
-        component: t ? Ye : He,
-        title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
-        props: t ? {
-          backgroundColor: e.value.table.th.backgroundColor,
-          color: e.value.table.th.color,
-          headerColor: e.value.table.th.color,
-          headerBg: e.value.table.th.backgroundColor,
-          isFullscreen: O.value,
-          fullscreenParent: $.value,
-          forcedWidth: Math.min(800, window.innerWidth * 0.8)
-        } : {
-          hideDetails: !0,
-          config: {
-            open: l,
-            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
-            }
-          }
-        }
-      };
-    });
-    x(() => d.value.showTable, (t) => {
-      e.value.table.show || (t && e.value.table.useDialog && I.value ? I.value.open() : "close" in I.value && I.value.close());
-    });
-    function Ae() {
-      d.value.showTable = !1, z.value && z.value.setTableIconState(!1);
-    }
-    const pt = h(() => e.value.style.chart.backgroundColor), ht = h(() => e.value.style.chart.title), { exportSvg: ft, getSvg: gt } = Gt({
-      svg: E,
-      title: ht,
-      backgroundColor: pt
-    });
-    async function we({ isCb: t }) {
-      if (t) {
-        const { blob: l, url: o, text: n, dataUrl: s } = await gt();
-        e.value.userOptions.callbacks.svg({ blob: l, url: o, text: n, dataUrl: s });
-      } else
-        ft();
-    }
-    return Ee({
-      getData: rt,
-      getImage: dt,
-      generatePdf: de,
-      generateCsv: Q,
-      generateImage: pe,
-      generateSvg: we,
-      toggleTable: Ce,
-      toggleLabels: ye,
-      toggleTooltip: ke,
-      toggleAnnotator: q,
-      toggleFullscreen: be
-    }), (t, l) => (v(), k("div", {
-      ref_key: "moleculeChart",
-      ref: $,
-      class: Oe(`vue-data-ui-component vue-ui-molecule ${O.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
-      style: M(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor}`),
-      id: `cluster_${G.value}`,
-      onMouseleave: l[2] || (l[2] = (o) => {
-        R.value = null, F.value = null, a(re)(!1);
-      }),
-      onMouseenter: l[3] || (l[3] = () => a(re)(!0))
-    }, [
-      e.value.userOptions.buttons.annotator ? (v(), T(a(Ge), {
-        key: 0,
-        svgRef: a(E),
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        active: N.value,
-        onClose: q
-      }, {
-        "annotator-action-close": r(() => [
-          i(t.$slots, "annotator-action-close", {}, void 0, !0)
-        ]),
-        "annotator-action-color": r(({ color: o }) => [
-          i(t.$slots, "annotator-action-color", f(g({ color: o })), void 0, !0)
-        ]),
-        "annotator-action-draw": r(({ mode: o }) => [
-          i(t.$slots, "annotator-action-draw", f(g({ mode: o })), void 0, !0)
-        ]),
-        "annotator-action-undo": r(({ disabled: o }) => [
-          i(t.$slots, "annotator-action-undo", f(g({ disabled: o })), void 0, !0)
-        ]),
-        "annotator-action-redo": r(({ disabled: o }) => [
-          i(t.$slots, "annotator-action-redo", f(g({ disabled: o })), void 0, !0)
-        ]),
-        "annotator-action-delete": r(({ disabled: o }) => [
-          i(t.$slots, "annotator-action-delete", f(g({ disabled: o })), void 0, !0)
-        ]),
-        _: 3
-      }, 8, ["svgRef", "backgroundColor", "color", "active"])) : y("", !0),
-      Ke.value ? (v(), k("div", Qt, null, 512)) : y("", !0),
-      e.value.style.chart.title.text ? (v(), k("div", qt, [
-        (v(), T(a(Ue), {
-          key: `title_${se.value}`,
-          config: {
-            title: {
-              cy: "molecule-div-title",
-              ...e.value.style.chart.title
-            },
-            subtitle: {
-              cy: "molecule-div-subtitle",
-              ...e.value.style.chart.title.subtitle
-            }
-          }
-        }, null, 8, ["config"]))
-      ])) : y("", !0),
-      e.value.userOptions.show && oe.value && (a(ie) || a(j)) ? (v(), T(a(Ve), {
-        ref_key: "userOptionsRef",
-        ref: z,
-        key: `user_options_${ae.value}`,
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        isPrinting: a(ce),
-        isImaging: a(ve),
-        uid: G.value,
-        hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
-        hasPdf: e.value.userOptions.buttons.pdf,
-        hasXls: e.value.userOptions.buttons.csv,
-        hasImg: e.value.userOptions.buttons.img,
-        hasSvg: e.value.userOptions.buttons.svg,
-        hasTable: e.value.userOptions.buttons.table,
-        hasLabel: e.value.userOptions.buttons.labels,
-        hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isTooltip: d.value.showTooltip,
-        titles: { ...e.value.userOptions.buttonTitles },
-        chartElement: $.value,
-        position: e.value.userOptions.position,
-        hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: N.value,
-        callbacks: e.value.userOptions.callbacks,
-        printScale: e.value.userOptions.print.scale,
-        tableDialog: e.value.table.useDialog,
-        onToggleFullscreen: be,
-        onGeneratePdf: a(de),
-        onGenerateCsv: Q,
-        onGenerateImage: a(pe),
-        onGenerateSvg: we,
-        onToggleTable: Ce,
-        onToggleLabels: ye,
-        onToggleTooltip: ke,
-        onToggleAnnotator: q,
-        style: M({
-          visibility: a(ie) ? a(j) ? "visible" : "hidden" : "visible"
-        })
-      }, Se({ _: 2 }, [
-        t.$slots.menuIcon ? {
-          name: "menuIcon",
-          fn: r(({ isOpen: o, color: n }) => [
-            i(t.$slots, "menuIcon", f(g({ isOpen: o, color: n })), void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        t.$slots.optionTooltip ? {
-          name: "optionTooltip",
-          fn: r(() => [
-            i(t.$slots, "optionTooltip", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        t.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: r(() => [
-            i(t.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        t.$slots.optionCsv ? {
-          name: "optionCsv",
-          fn: r(() => [
-            i(t.$slots, "optionCsv", {}, void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        t.$slots.optionImg ? {
-          name: "optionImg",
-          fn: r(() => [
-            i(t.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "4"
-        } : void 0,
-        t.$slots.optionSvg ? {
-          name: "optionSvg",
-          fn: r(() => [
-            i(t.$slots, "optionSvg", {}, void 0, !0)
-          ]),
-          key: "5"
-        } : void 0,
-        t.$slots.optionTable ? {
-          name: "optionTable",
-          fn: r(() => [
-            i(t.$slots, "optionTable", {}, void 0, !0)
-          ]),
-          key: "6"
-        } : void 0,
-        t.$slots.optionLabels ? {
-          name: "optionLabels",
-          fn: r(() => [
-            i(t.$slots, "optionLabels", {}, void 0, !0)
-          ]),
-          key: "7"
-        } : void 0,
-        t.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: r(({ toggleFullscreen: o, isFullscreen: n }) => [
-            i(t.$slots, "optionFullscreen", f(g({ toggleFullscreen: o, isFullscreen: n })), void 0, !0)
-          ]),
-          key: "8"
-        } : void 0,
-        t.$slots.optionAnnotator ? {
-          name: "optionAnnotator",
-          fn: r(({ toggleAnnotator: o, isAnnotator: n }) => [
-            i(t.$slots, "optionAnnotator", f(g({ toggleAnnotator: o, isAnnotator: n })), void 0, !0)
-          ]),
-          key: "9"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasSvg", "hasTable", "hasLabel", "hasFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : y("", !0),
-      (v(), k("svg", {
-        ref_key: "svgRef",
-        ref: E,
-        key: `svg_${ue.value}`,
-        xmlns: a(It),
-        viewBox: `${a(U).x} ${a(U).y} ${a(U).width} ${a(U).height}`,
-        class: Oe({ "vue-data-ui-fullscreen--on": O.value, "vue-data-ui-fulscreen--off": !O.value }),
-        style: M(`overflow: hidden; background:transparent;color:${e.value.style.chart.color}`)
-      }, [
-        D(a(ze)),
-        t.$slots["chart-background"] ? (v(), k("foreignObject", {
-          key: 0,
-          x: 0,
-          y: 0,
-          width: m.value.width <= 0 ? 10 : m.value.width,
-          height: m.value.height <= 0 ? 10 : m.value.height,
-          style: {
-            pointerEvents: "none"
-          }
-        }, [
-          i(t.$slots, "chart-background", {}, void 0, !0)
-        ], 8, Kt)) : y("", !0),
-        P("defs", null, [
-          (v(!0), k(kt, null, At(Object.keys(ot.value), (o) => (v(), k("radialGradient", {
-            id: `gradient_${o}`,
-            cx: "50%",
-            cy: "30%",
-            r: "50%",
-            fx: "50%",
-            fy: "50%"
-          }, [
-            P("stop", {
-              offset: "0%",
-              "stop-color": a(Ft)(o, 0.5)
-            }, null, 8, to),
-            P("stop", {
-              offset: "100%",
-              "stop-color": o
-            }, null, 8, oo)
-          ], 8, eo))), 256))
-        ]),
-        D(a(We), {
-          dataset: A.value,
-          color: e.value.style.chart.links.stroke,
-          backgroundColor: e.value.style.chart.backgroundColor
-        }, null, 8, ["dataset", "color", "backgroundColor"]),
-        D(a(je), {
-          dataset: A.value,
-          hoveredUid: F.value,
-          stroke: e.value.style.chart.nodes.stroke,
-          strokeHovered: e.value.style.chart.nodes.strokeHovered,
-          onClick: vt,
-          onHover: at
-        }, {
-          node: r(({ node: o }) => [
-            i(t.$slots, "node", f(g({ node: o })), void 0, !0)
-          ]),
-          _: 3
-        }, 8, ["dataset", "hoveredUid", "stroke", "strokeHovered"]),
-        d.value.showDataLabels && !a(W) ? (v(), T(a(Xe), {
-          key: 1,
-          dataset: A.value,
-          color: e.value.style.chart.color,
-          hoveredUid: F.value
-        }, null, 8, ["dataset", "color", "hoveredUid"])) : y("", !0),
-        i(t.$slots, "svg", { svg: m.value }, void 0, !0)
-      ], 14, Jt)),
-      t.$slots.watermark ? (v(), k("div", lo, [
-        i(t.$slots, "watermark", f(g({ isPrinting: a(ce) || a(ve) })), void 0, !0)
-      ])) : y("", !0),
-      a(ut) ? (v(), k("div", ao, [
-        i(t.$slots, "reset-action", { reset: a(J) }, () => [
-          P("button", {
-            "data-cy-reset": "",
-            tabindex: "0",
-            role: "button",
-            class: "vue-data-ui-refresh-button",
-            style: M({
-              background: e.value.style.chart.backgroundColor
-            }),
-            onClick: l[0] || (l[0] = (o) => a(J)(!0))
-          }, [
-            D(a(te), {
-              name: "refresh",
-              stroke: e.value.style.chart.color
-            }, null, 8, ["stroke"])
-          ], 4)
-        ], !0)
-      ])) : y("", !0),
-      t.$slots.source ? (v(), k("div", so, [
-        i(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : y("", !0),
-      D(a(xe), {
-        show: d.value.showTooltip && V.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: $.value,
-        content: B.value,
-        isFullscreen: O.value,
-        isCustom: e.value.style.chart.tooltip.customFormat && typeof e.value.style.chart.tooltip.customFormat == "function",
-        smooth: e.value.style.chart.tooltip.smooth,
-        backdropFilter: e.value.style.chart.tooltip.backdropFilter,
-        smoothForce: e.value.style.chart.tooltip.smoothForce,
-        smoothSnapThreshold: e.value.style.chart.tooltip.smoothSnapThreshold
-      }, {
-        "tooltip-before": r(() => [
-          i(t.$slots, "tooltip-before", f(g({ ...Z.value })), void 0, !0)
-        ]),
-        "tooltip-after": r(() => [
-          i(t.$slots, "tooltip-after", f(g({ ...Z.value })), void 0, !0)
-        ]),
-        _: 3
-      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      oe.value && e.value.userOptions.buttons.table ? (v(), T(wt(L.value.component), $t({ key: 7 }, L.value.props, {
-        ref_key: "tableUnit",
-        ref: I,
-        onClose: Ae
-      }), Se({
-        content: r(() => [
-          (v(), T(a(Me), {
-            key: `table_${ne.value}`,
-            colNames: _.value.colNames,
-            head: _.value.head,
-            body: _.value.body,
-            config: _.value.config,
-            title: e.value.table.useDialog ? "" : L.value.title,
-            withCloseButton: !e.value.table.useDialog,
-            onClose: Ae
-          }, {
-            th: r(({ th: o }) => [
-              P("div", {
-                innerHTML: o,
-                style: { display: "flex", "align-items": "center" }
-              }, null, 8, no)
-            ]),
-            td: r(({ td: o }) => [
-              De(Pe(o.name || o), 1)
-            ]),
-            _: 1
-          }, 8, ["colNames", "head", "body", "config", "title", "withCloseButton"]))
-        ]),
-        _: 2
-      }, [
-        e.value.table.useDialog ? {
-          name: "title",
-          fn: r(() => [
-            De(Pe(L.value.title), 1)
-          ]),
-          key: "0"
-        } : void 0,
-        e.value.table.useDialog ? {
-          name: "actions",
-          fn: r(() => [
-            P("button", {
-              tabindex: "0",
-              class: "vue-ui-user-options-button",
-              onClick: l[1] || (l[1] = (o) => Q(e.value.userOptions.callbacks.csv))
-            }, [
-              D(a(te), {
-                name: "excel",
-                stroke: L.value.props.color
-              }, null, 8, ["stroke"])
-            ])
-          ]),
-          key: "1"
-        } : void 0
-      ]), 1040)) : y("", !0),
-      a(W) ? (v(), T(Ht, { key: 8 })) : y("", !0)
-    ], 46, Zt));
-  }
-}, ko = /* @__PURE__ */ Yt(ro, [["__scopeId", "data-v-834b0111"]]);
-export {
-  ko as default
-};