import { toRef as ct, resolveComponent as dt, openBlock as l, createElementBlock as a, Fragment as b, renderList as A, withModifiers as z, createBlock as S, createCommentVNode as v, createElementVNode as T, toDisplayString as It, normalizeStyle as _, createVNode as L, computed as D, onMounted as ee, ref as f, watch as oe, normalizeClass as Ot, unref as t, createSlots as ne, withCtx as w, renderSlot as $, normalizeProps as q, guardReactiveProps as Z, createTextVNode as se, nextTick as Lt } from "vue";
import { u as le, o as re, e as ae, c as Ut, t as ie, a as ue, p as Dt, b as ce, X as de, l as he, O as fe, q as pe, r as ve, x as ge, y as ye } from "./index-WrV3SAID.js";
import { _ as me } from "./Title-BR-xoRp4.js";
import { u as be, U as ke } from "./usePrinter-kVpf1iV8.js";
import { D as Ce } from "./DataTable-DNPvKWC0.js";
import { _ as $e } from "./Tooltip-ho4JxRm-.js";
import J from "./BaseIcon-MqKW8Nkx.js";
import we from "./vue-ui-skeleton-Qec_XSRf.js";
import xe from "./vue-ui-accordion-BQCDXXDs.js";
import { u as At } from "./useNestedProp-Cj0kHD7k.js";
import { _ as Pe } from "./PackageVersion-1NslmM8M.js";
import { P as Te } from "./PenAndPaper-BF1ZRVm3.js";
import { u as Fe } from "./useUserOptionState-BIvW1Kz7.js";
import { _ as Re } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const Se = ["cx", "cy", "r", "fill", "stroke", "stroke-width", "onClick", "onMouseover"], Oe = {
  __name: "RecursiveCircles",
  props: {
    color: {
      type: String,
      default: "#000000"
    },
    dataset: {
      type: Array,
      default: () => []
    },
    hoveredUid: {
      type: String,
      default: null
    },
    linkColor: {
      type: String,
      default: "#CCCCCC"
    },
    stroke: {
      type: String,
      default: "#FFFFFF"
    },
    strokeHovered: {
      type: String,
      default: "#000000"
    }
  },
  emits: ["zoom", "hover"],
  setup(r, { emit: I }) {
    const F = r, g = I;
    function i(u) {
      g("zoom", u);
    }
    function k(u) {
      g("hover", u);
    }
    return ct(F, "dataset").value.forEach((u) => {
      u.nodes && u.nodes.length > 0 && u.nodes.forEach((x) => {
        x.ancestor = u;
      });
    }), (u, x) => {
      const B = dt("RecursiveCircles", !0);
      return l(!0), a(b, null, A(r.dataset, (p) => (l(), a(b, null, [
        p.polygonPath && p.polygonPath.coordinates ? (l(), a(b, { key: 0 }, [
          (l(!0), a(b, null, A(p.polygonPath.coordinates, (M, H) => (l(), a("circle", {
            cx: M.x,
            cy: M.y,
            r: p.circleRadius,
            fill: `url(#gradient_${p.color})`,
            stroke: r.hoveredUid && r.hoveredUid === p.uid ? r.strokeHovered : r.stroke,
            "stroke-width": r.hoveredUid && r.hoveredUid === p.uid ? p.circleRadius / 6 : p.circleRadius / 12,
            style: { cursor: "pointer" },
            onClick: z((C) => i(p), ["stop"]),
            onMouseover: (C) => k(p),
            onMouseleave: x[0] || (x[0] = (C) => k(null))
          }, null, 40, Se))), 256)),
          p.nodes && p.nodes.length > 0 ? (l(), S(B, {
            key: 0,
            dataset: p.nodes,
            color: r.color,
            stroke: r.stroke,
            strokeHovered: r.strokeHovered,
            hoveredUid: r.hoveredUid,
            onZoom: i,
            onHover: k
          }, null, 8, ["dataset", "color", "stroke", "strokeHovered", "hoveredUid"])) : v("", !0)
        ], 64)) : v("", !0)
      ], 64))), 256);
    };
  }
}, Le = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], Ue = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], De = {
  __name: "RecursiveLinks",
  props: {
    dataset: {
      type: Array,
      default: () => []
    },
    color: {
      type: String,
      default: "#DDDDDD"
    },
    backgroundColor: {
      type: String,
      default: "#FFFFFF"
    }
  },
  setup(r) {
    return ct(r, "dataset").value.forEach((g) => {
      g.nodes && g.nodes.length > 0 && g.nodes.forEach((i) => {
        i.ancestor = g;
      });
    }), (g, i) => {
      const k = dt("RecursiveLinks", !0);
      return l(), a(b, null, [
        (l(!0), a(b, null, A(r.dataset, (d) => (l(), a(b, null, [
          d.polygonPath && d.polygonPath.coordinates ? (l(!0), a(b, { key: 0 }, A(d.polygonPath.coordinates, (u, x) => (l(), a(b, null, [
            d.ancestor && d.ancestor.polygonPath ? (l(), a(b, { key: 0 }, [
              T("line", {
                x1: u.x,
                y1: u.y,
                x2: d.ancestor.polygonPath.coordinates[0].x,
                y2: d.ancestor.polygonPath.coordinates[0].y,
                stroke: r.backgroundColor,
                "stroke-width": d.circleRadius / 1.5
              }, null, 8, Le),
              T("line", {
                x1: u.x,
                y1: u.y,
                x2: d.ancestor.polygonPath.coordinates[0].x,
                y2: d.ancestor.polygonPath.coordinates[0].y,
                stroke: r.color,
                "stroke-width": d.circleRadius / 2
              }, null, 8, Ue)
            ], 64)) : v("", !0)
          ], 64))), 256)) : v("", !0)
        ], 64))), 256)),
        (l(!0), a(b, null, A(r.dataset, (d) => (l(), a(b, null, [
          d.polygonPath && d.polygonPath.coordinates ? (l(), a(b, { key: 0 }, [
            d.nodes && d.nodes.length > 0 ? (l(), S(k, {
              key: 0,
              dataset: d.nodes,
              color: r.color,
              backgroundColor: r.backgroundColor
            }, null, 8, ["dataset", "color", "backgroundColor"])) : v("", !0)
          ], 64)) : v("", !0)
        ], 64))), 256))
      ], 64);
    };
  }
}, Ae = ["x", "y", "fill", "font-size"], Ie = {
  __name: "RecursiveLabels",
  props: {
    color: {
      type: String,
      default: "#000000"
    },
    dataset: {
      type: Array,
      default: () => []
    },
    hoveredUid: {
      type: String,
      default: null
    }
  },
  emits: ["zoom", "hover"],
  setup(r, { emit: I }) {
    return ct(r, "dataset").value.forEach((i) => {
      i.nodes && i.nodes.length > 0 && i.nodes.forEach((k) => {
        k.ancestor = i;
      });
    }), (i, k) => {
      const d = dt("RecursiveLabels", !0);
      return l(!0), a(b, null, A(r.dataset, (u) => (l(), a(b, null, [
        u.polygonPath && u.polygonPath.coordinates ? (l(), a(b, { key: 0 }, [
          (l(!0), a(b, null, A(u.polygonPath.coordinates, (x) => (l(), a("text", {
            x: x.x,
            y: x.y + u.circleRadius * 2,
            fill: r.color,
            "font-size": u.circleRadius,
            "text-anchor": "middle",
            style: { opacity: "0.8", "pointer-events": "none" }
          }, It(u.name), 9, Ae))), 256)),
          u.nodes && u.nodes.length > 0 ? (l(), S(d, {
            key: 0,
            dataset: u.nodes,
            color: r.color,
            hoveredUid: r.hoveredUid
          }, null, 8, ["dataset", "color", "hoveredUid"])) : v("", !0)
        ], 64)) : v("", !0)
      ], 64))), 256);
    };
  }
}, Ne = { style: { position: "relative", height: "100%", width: "100%" } }, ze = {
  __name: "BaseDirectionPad",
  props: {
    color: {
      type: String,
      default: "#FF0000"
    },
    isFullscreen: {
      type: Boolean,
      default: !1
    }
  },
  emits: ["moveLeft", "moveTop", "moveRight", "moveBottom", "reset"],
  setup(r, { emit: I }) {
    const F = I;
    return (g, i) => (l(), a("div", {
      style: _(`position: ${r.isFullscreen ? "fixed" : "absolute"};bottom:0;right:${r.isFullscreen ? "12px" : "0"};width:80px;height:80px`),
      "data-html2canvas-ignore": ""
    }, [
      T("div", Ne, [
        T("button", {
          onClick: i[0] || (i[0] = z((k) => F("moveLeft"), ["stop"])),
          style: { position: "absolute", left: "0", top: "50%", transform: "translateY(-50%)", height: "24px", width: "24px", padding: "0", background: "transparent", border: "none", display: "flex", "align-items": "center", "justify-content": "center" }
        }, [
          L(J, {
            stroke: r.color,
            name: "arrowLeft",
            style: { cursor: "pointer" }
          }, null, 8, ["stroke"])
        ]),
        T("button", {
          onClick: i[1] || (i[1] = z((k) => F("moveTop"), ["stop"])),
          style: { position: "absolute", top: "0", left: "50%", transform: "translateX(-50%)", height: "24px", width: "24px", padding: "0", background: "transparent", border: "none", display: "flex", "align-items": "center", "justify-content": "center" }
        }, [
          L(J, {
            stroke: r.color,
            name: "arrowTop",
            style: { cursor: "pointer" }
          }, null, 8, ["stroke"])
        ]),
        T("button", {
          onClick: i[2] || (i[2] = z((k) => F("moveRight"), ["stop"])),
          style: { position: "absolute", right: "0", top: "50%", transform: "translateY(-50%)", height: "24px", width: "24px", padding: "0", background: "transparent", border: "none", display: "flex", "align-items": "center", "justify-content": "center" }
        }, [
          L(J, {
            stroke: r.color,
            name: "arrowRight",
            style: { cursor: "pointer" }
          }, null, 8, ["stroke"])
        ]),
        T("button", {
          onClick: i[3] || (i[3] = z((k) => F("moveBottom"), ["stop"])),
          style: { position: "absolute", bottom: "0", left: "50%", transform: "translateX(-50%)", height: "24px", width: "24px", padding: "0", background: "transparent", border: "none", display: "flex", "align-items": "center", "justify-content": "center" }
        }, [
          L(J, {
            stroke: r.color,
            name: "arrowBottom",
            style: { cursor: "pointer" }
          }, null, 8, ["stroke"])
        ]),
        T("button", {
          onClick: i[4] || (i[4] = z((k) => F("reset"), ["stop"])),
          style: { position: "absolute", top: "50%", left: "50%", transform: "translate(-50%,-50%)", height: "24px", width: "24px", padding: "0", background: "transparent", border: "none", display: "flex", "align-items": "center", "justify-content": "center" }
        }, [
          L(J, {
            stroke: r.color,
            name: "close",
            style: { cursor: "pointer" },
            strokeWidth: 2
          }, null, 8, ["stroke"])
        ])
      ])
    ], 4));
  }
}, Be = ["id"], Me = {
  key: 1,
  ref: "noTitle",
  class: "vue-data-ui-no-title-space",
  style: "height:36px; width: 100%;background:transparent"
}, He = {
  key: 2,
  style: "width:100%;background:transparent;"
}, Ee = ["xmlns", "viewBox"], Ve = ["width", "height"], Xe = ["id"], je = ["stop-color"], Ge = ["stop-color"], Ye = {
  key: 6,
  class: "vue-data-ui-watermark"
}, We = {
  key: 8,
  ref: "source",
  dir: "auto"
}, qe = ["innerHTML"], Ze = {
  __name: "vue-ui-molecule",
  props: {
    config: {
      type: Object,
      default() {
        return {};
      }
    },
    dataset: {
      type: Array,
      default() {
        return [];
      }
    }
  },
  setup(r, { expose: I }) {
    const { vue_ui_molecule: F } = le(), g = r, i = D(() => !!g.dataset && g.dataset.length);
    ee(() => {
      k();
    });
    function k() {
      re(g.dataset) && ae({
        componentName: "VueUiMolecule",
        type: "dataset"
      });
    }
    const d = f(Ut()), u = f(null), x = f(!1), B = f(""), p = f(null), M = f(null), H = f(!1), C = f(null), ht = f(null), tt = f(0), ft = f(0), pt = f(0), o = D({
      get: () => yt(),
      set: (e) => e
    }), { userOptionsVisible: et, setUserOptionsVisibility: vt, keepUserOptionState: gt } = Fe({ config: o.value });
    function yt() {
      const e = At({
        userConfig: g.config,
        defaultConfig: F
      });
      return e.theme ? {
        ...At({
          userConfig: ie.vue_ui_molecule[e.theme] || g.config,
          defaultConfig: e
        }),
        customPalette: ue[e.theme] || Dt
      } : e;
    }
    oe(() => g.config, (e) => {
      o.value = yt(), et.value = !o.value.showOnChartHover, k(), ft.value += 1, pt.value += 1;
    }, { deep: !0 });
    const { isPrinting: mt, isImaging: bt, generatePdf: kt, generateImage: Ct } = be({
      elementId: `cluster_${d.value}`,
      fileName: o.value.style.chart.title.text || "vue-ui-molecule"
    }), Nt = D(() => o.value.userOptions.show && !o.value.style.chart.title.text), zt = D(() => ce(o.value.customPalette)), R = f({
      showTable: o.value.table.show,
      showDataLabels: !0,
      showTooltip: o.value.style.chart.tooltip.show
    });
    function $t(e, n = 0) {
      return Array.isArray(e) && e.length > 0 && e[0].nodes ? $t(e[0].nodes, n + 1) : n;
    }
    function Bt() {
      const e = $t(g.dataset);
      let n = 100, s = n;
      for (let h = 0; h < e; h += 1)
        n /= 1, s += n;
      return {
        height: s,
        width: s
      };
    }
    const P = f(Bt()), ot = f(`0 0 ${P.value.width} ${P.value.height}`);
    function wt(e, n = { x: -P.value.width / 2.43, y: P.value.height / 2 }, s = P.value.width / 1.1, h = 24, c = 0, y = 0, G = "#BBBBBB") {
      if (e && e.length > 0) {
        const it = fe({
          plot: n,
          radius: s,
          sides: e.length,
          rotation: c
        });
        e.forEach((m, N) => {
          const Y = it.coordinates[N];
          let U;
          if (m.ancestor ? m.ancestor.ancestor ? U = m.ancestor.color || G : (U = zt.value[y] || Dt[y] || G, y += 1) : U = G, m.polygonPath = {
            coordinates: [Y]
          }, m.circleRadius = h, m.color = U, m.uid = Ut(), m.nodes && m.nodes.length > 0) {
            const ut = !m.ancestor || !m.ancestor.ancestor ? y : 0;
            m.nodes = wt(
              m.nodes,
              Y,
              s / 2.9,
              h / 2.2,
              c + Math.PI * N / m.nodes.length,
              ut,
              U
            );
          }
        });
      }
      return e;
    }
    function Mt(e) {
      const n = /* @__PURE__ */ new Set();
      function s(c) {
        c.forEach((y) => {
          y.color && !n.has(y.color) && n.add(y.color), y.nodes && y.nodes.length > 0 && s(y.nodes);
        });
      }
      s(e);
      const h = {};
      return Array.from(n).forEach((c, y) => {
        h[c] = `gradient_${y}`;
      }), h;
    }
    const Ht = D(() => Mt(O.value)), O = D(() => wt(g.dataset));
    function nt() {
      H.value = !1, M.value = null, ht.value = null, C.value = null, lt({
        polygonPath: {
          coordinates: [{ x: P.value.width / 2, y: P.value.height / 2 }]
        },
        circleRadius: 24
      });
    }
    const st = f(null);
    function lt(e) {
      p.value.focus(), Lt(() => {
        st.value && cancelAnimationFrame(st.value);
        const n = ot.value.split(" "), s = parseFloat(n[0]), h = parseFloat(n[1]), c = parseFloat(n[2]), y = parseFloat(n[3]), { x: G, y: it } = e.polygonPath.coordinates[0], { circleRadius: m } = e, N = 8.34, Y = G - m * N, U = it - m * N, ut = m * N * 2, Zt = m * N * 2, Jt = Math.sqrt((Y - s) ** 2 + (U - h) ** 2), W = Math.min(1200, Math.max(20, Math.floor(Jt / 10))), Kt = (Y - s) / W, Qt = (U - h) / W, _t = (ut - c) / W, te = (Zt - y) / W;
        let X = 0;
        function St() {
          ot.value = `${s + Kt * X} ${h + Qt * X} ${c + _t * X} ${y + te * X}`, X += o.value.style.chart.zoom.speed, X <= W && (st.value = requestAnimationFrame(St));
        }
        St();
      });
    }
    function Et(e) {
      M.value === e.uid ? nt() : (M.value = e.uid, ht.value = e, C.value = {
        circleRadius: e.circleRadius,
        polygonPath: {
          coordinates: [{ x: e.polygonPath.coordinates[0].x, y: e.polygonPath.coordinates[0].y }]
        }
      }, lt(e), H.value = e.uid !== O.value[0].uid);
    }
    function Vt(e) {
      if (e.target.nodeName !== "circle")
        nt(), H.value = !1;
      else
        return;
    }
    const rt = f(null);
    function Xt(e) {
      rt.value = {
        datapoint: e,
        seriesIndex: -1,
        series: O.value,
        config: o.value
      };
      const n = o.value.style.chart.tooltip.customFormat;
      if (ge(n) && ye(() => n({
        seriesIndex: -1,
        datapoint: e,
        series: O.value,
        config: o.value
      })))
        B.value = n({
          seriesIndex: -1,
          // well, ok
          datapoint: e,
          series: O.value,
          config: o.value
        });
      else {
        let s = "";
        s += `<div style="display:flex;align-items:center;gap:3px"><div style="color:${e.color}">⬤</div><div>${e.name}</div></div>`, e.details && (s += `<div style="width:100%;border-top:1px solid ${o.value.style.chart.tooltip.borderColor};margin-top: 2px">${e.details}</div>`), B.value = `<div style="font-family:inherit">${s}</div>`;
      }
    }
    const xt = f(null), j = f(null);
    function jt(e) {
      xt.value = e, e ? (x.value = !0, Xt(e), j.value = e.uid) : (x.value = !1, B.value = "", j.value = null);
    }
    function K(e) {
      e === "right" && (C.value.polygonPath.coordinates[0].x += C.value.circleRadius), e === "left" && (C.value.polygonPath.coordinates[0].x -= C.value.circleRadius), e === "top" && (C.value.polygonPath.coordinates[0].y -= C.value.circleRadius), e === "bottom" && (C.value.polygonPath.coordinates[0].y += C.value.circleRadius), lt(C.value);
    }
    function Gt(e) {
      const n = [];
      function s(h) {
        h.forEach((c) => {
          const y = {
            name: c.name,
            details: c.details || "-",
            ancestor: c.ancestor && c.ancestor.name || "-",
            color: c.color || ""
          };
          n.push(y), c.nodes && c.nodes.length > 0 && s(c.nodes, c.name);
        });
      }
      return s(e), n;
    }
    const Yt = D(() => Gt(O.value)), E = D(() => {
      const e = [
        o.value.table.translations.nodeName,
        o.value.table.translations.details,
        o.value.table.translations.ancestor
      ], n = Yt.value.map((c, y) => [
        {
          color: c.color,
          name: c.name
        },
        c.details,
        c.ancestor || ""
      ]), s = {
        th: {
          backgroundColor: o.value.table.th.backgroundColor,
          color: o.value.table.th.color,
          outline: o.value.table.th.outline
        },
        td: {
          backgroundColor: o.value.table.td.backgroundColor,
          color: o.value.table.td.color,
          outline: o.value.table.td.outline
        },
        breakpoint: o.value.table.responsiveBreakpoint
      }, h = [
        o.value.table.translations.nodeName,
        o.value.table.translations.details,
        o.value.table.translations.ancestor
      ];
      return {
        head: e,
        body: n,
        config: s,
        colNames: h
      };
    });
    function Pt() {
      Lt(() => {
        const e = E.value.body.map((h, c) => [[h[0].name], [h[1]], [h[2]]]), n = [[o.value.style.chart.title.text], [o.value.style.chart.title.subtitle.text], [[...E.value.head]]].concat(e), s = pe(n);
        ve({ csvContent: s, title: o.value.style.chart.title.text || "vue-ui-molecule" });
      });
    }
    function Wt() {
      return O.value;
    }
    const V = f(!1);
    function qt(e) {
      V.value = e, tt.value += 1;
    }
    function Tt() {
      R.value.showTable = !R.value.showTable;
    }
    function Ft() {
      R.value.showDataLabels = !R.value.showDataLabels;
    }
    function Rt() {
      R.value.showTooltip = !R.value.showTooltip;
    }
    const Q = f(!1);
    function at() {
      Q.value = !Q.value;
    }
    return I({
      getData: Wt,
      generatePdf: kt,
      generateCsv: Pt,
      generateImage: Ct,
      toggleTable: Tt,
      toggleLabels: Ft,
      toggleTooltip: Rt,
      toggleAnnotator: at
    }), (e, n) => (l(), a("div", {
      ref_key: "moleculeChart",
      ref: p,
      class: Ot(`vue-ui-molecule ${t(V) ? "vue-data-ui-wrapper-fullscreen" : ""}`),
      style: _(`font-family:${t(o).style.fontFamily};width:100%; text-align:center;background:${t(o).style.chart.backgroundColor}`),
      id: `cluster_${t(d)}`,
      onMouseleave: n[7] || (n[7] = (s) => {
        xt.value = null, j.value = null, t(vt)(!1);
      }),
      onMouseenter: n[8] || (n[8] = () => t(vt)(!0))
    }, [
      t(o).userOptions.buttons.annotator ? (l(), S(Te, {
        key: 0,
        parent: t(p),
        backgroundColor: t(o).style.chart.backgroundColor,
        color: t(o).style.chart.color,
        active: t(Q),
        onClose: at
      }, null, 8, ["parent", "backgroundColor", "color", "active"])) : v("", !0),
      t(Nt) ? (l(), a("div", Me, null, 512)) : v("", !0),
      t(o).style.chart.title.text ? (l(), a("div", He, [
        (l(), S(me, {
          key: `title_${t(ft)}`,
          config: {
            title: {
              cy: "molecule-div-title",
              ...t(o).style.chart.title
            },
            subtitle: {
              cy: "molecule-div-subtitle",
              ...t(o).style.chart.title.subtitle
            }
          }
        }, null, 8, ["config"]))
      ])) : v("", !0),
      t(o).userOptions.show && t(i) && (t(gt) || t(et)) ? (l(), S(ke, {
        ref_key: "details",
        ref: u,
        key: `user_options_${t(tt)}`,
        backgroundColor: t(o).style.chart.backgroundColor,
        color: t(o).style.chart.color,
        isPrinting: t(mt),
        isImaging: t(bt),
        uid: t(d),
        hasTooltip: t(o).userOptions.buttons.tooltip && t(o).style.chart.tooltip.show,
        hasPdf: t(o).userOptions.buttons.pdf,
        hasXls: t(o).userOptions.buttons.csv,
        hasImg: t(o).userOptions.buttons.img,
        hasTable: t(o).userOptions.buttons.table,
        hasLabel: t(o).userOptions.buttons.labels,
        hasFullscreen: t(o).userOptions.buttons.fullscreen,
        isTooltip: t(R).showTooltip,
        titles: { ...t(o).userOptions.buttonTitles },
        chartElement: t(p),
        position: t(o).userOptions.position,
        hasAnnotator: t(o).userOptions.buttons.annotator,
        isAnnotation: t(Q),
        onToggleFullscreen: qt,
        onGeneratePdf: t(kt),
        onGenerateCsv: Pt,
        onGenerateImage: t(Ct),
        onToggleTable: Tt,
        onToggleLabels: Ft,
        onToggleTooltip: Rt,
        onToggleAnnotator: at,
        style: _({
          visibility: t(gt) ? t(et) ? "visible" : "hidden" : "visible"
        })
      }, ne({ _: 2 }, [
        e.$slots.optionTooltip ? {
          name: "optionTooltip",
          fn: w(() => [
            $(e.$slots, "optionTooltip", {}, void 0, !0)
          ]),
          key: "0"
        } : void 0,
        e.$slots.optionPdf ? {
          name: "optionPdf",
          fn: w(() => [
            $(e.$slots, "optionPdf", {}, void 0, !0)
          ]),
          key: "1"
        } : void 0,
        e.$slots.optionCsv ? {
          name: "optionCsv",
          fn: w(() => [
            $(e.$slots, "optionCsv", {}, void 0, !0)
          ]),
          key: "2"
        } : void 0,
        e.$slots.optionImg ? {
          name: "optionImg",
          fn: w(() => [
            $(e.$slots, "optionImg", {}, void 0, !0)
          ]),
          key: "3"
        } : void 0,
        e.$slots.optionTable ? {
          name: "optionTable",
          fn: w(() => [
            $(e.$slots, "optionTable", {}, void 0, !0)
          ]),
          key: "4"
        } : void 0,
        e.$slots.optionLabels ? {
          name: "optionLabels",
          fn: w(() => [
            $(e.$slots, "optionLabels", {}, void 0, !0)
          ]),
          key: "5"
        } : void 0,
        e.$slots.optionFullscreen ? {
          name: "optionFullscreen",
          fn: w(({ toggleFullscreen: s, isFullscreen: h }) => [
            $(e.$slots, "optionFullscreen", q(Z({ toggleFullscreen: s, isFullscreen: h })), void 0, !0)
          ]),
          key: "6"
        } : void 0,
        e.$slots.optionAnnotator ? {
          name: "optionAnnotator",
          fn: w(({ toggleAnnotator: s, isAnnotator: h }) => [
            $(e.$slots, "optionAnnotator", q(Z({ toggleAnnotator: s, isAnnotator: h })), void 0, !0)
          ]),
          key: "7"
        } : void 0
      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasTable", "hasLabel", "hasFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage", "style"])) : v("", !0),
      t(i) ? (l(), a("svg", {
        key: 4,
        xmlns: t(de),
        viewBox: t(ot),
        class: Ot({ "vue-data-ui-fullscreen--on": t(V), "vue-data-ui-fulscreen--off": !t(V) }),
        style: _(`overflow: hidden; background:transparent;color:${t(o).style.chart.color}`),
        onClick: n[0] || (n[0] = z((s) => Vt(s), ["stop"]))
      }, [
        L(Pe),
        e.$slots["chart-background"] ? (l(), a("foreignObject", {
          key: 0,
          x: 0,
          y: 0,
          width: t(P).width <= 0 ? 10 : t(P).width,
          height: t(P).height <= 0 ? 10 : t(P).height,
          style: {
            pointerEvents: "none"
          }
        }, [
          $(e.$slots, "chart-background", {}, void 0, !0)
        ], 8, Ve)) : v("", !0),
        T("defs", null, [
          (l(!0), a(b, null, A(Object.keys(t(Ht)), (s) => (l(), a("radialGradient", {
            id: `gradient_${s}`,
            cx: "50%",
            cy: "30%",
            r: "50%",
            fx: "50%",
            fy: "50%"
          }, [
            T("stop", {
              offset: "0%",
              "stop-color": t(he)(s, 0.5)
            }, null, 8, je),
            T("stop", {
              offset: "100%",
              "stop-color": s
            }, null, 8, Ge)
          ], 8, Xe))), 256))
        ]),
        L(De, {
          dataset: t(O),
          color: t(o).style.chart.links.stroke,
          backgroundColor: t(o).style.chart.backgroundColor
        }, null, 8, ["dataset", "color", "backgroundColor"]),
        L(Oe, {
          dataset: t(O),
          hoveredUid: t(j),
          stroke: t(o).style.chart.nodes.stroke,
          strokeHovered: t(o).style.chart.nodes.strokeHovered,
          onZoom: Et,
          onHover: jt
        }, null, 8, ["dataset", "hoveredUid", "stroke", "strokeHovered"]),
        t(R).showDataLabels ? (l(), S(Ie, {
          key: 1,
          dataset: t(O),
          color: t(o).style.chart.color,
          hoveredUid: t(j)
        }, null, 8, ["dataset", "color", "hoveredUid"])) : v("", !0),
        $(e.$slots, "svg", { svg: t(P) }, void 0, !0)
      ], 14, Ee)) : v("", !0),
      t(H) ? (l(), S(ze, {
        key: `direction_pad_${t(tt)}`,
        color: t(o).style.chart.color,
        isFullscreen: t(V),
        onMoveLeft: n[1] || (n[1] = (s) => K("left")),
        onMoveRight: n[2] || (n[2] = (s) => K("right")),
        onMoveTop: n[3] || (n[3] = (s) => K("top")),
        onMoveBottom: n[4] || (n[4] = (s) => K("bottom")),
        onReset: n[5] || (n[5] = (s) => {
          nt(), H.value = !1;
        })
      }, null, 8, ["color", "isFullscreen"])) : v("", !0),
      e.$slots.watermark ? (l(), a("div", Ye, [
        $(e.$slots, "watermark", q(Z({ isPrinting: t(mt) || t(bt) })), void 0, !0)
      ])) : v("", !0),
      t(i) ? v("", !0) : (l(), S(we, {
        key: 7,
        config: {
          type: "molecule",
          style: {
            backgroundColor: t(o).style.chart.backgroundColor,
            molecule: {
              color: "#CCCCCC"
            }
          }
        }
      }, null, 8, ["config"])),
      e.$slots.source ? (l(), a("div", We, [
        $(e.$slots, "source", {}, void 0, !0)
      ], 512)) : v("", !0),
      L($e, {
        show: t(R).showTooltip && t(x),
        backgroundColor: t(o).style.chart.tooltip.backgroundColor,
        color: t(o).style.chart.tooltip.color,
        borderRadius: t(o).style.chart.tooltip.borderRadius,
        borderColor: t(o).style.chart.tooltip.borderColor,
        borderWidth: t(o).style.chart.tooltip.borderWidth,
        fontSize: t(o).style.chart.tooltip.fontSize,
        backgroundOpacity: t(o).style.chart.tooltip.backgroundOpacity,
        position: t(o).style.chart.tooltip.position,
        offsetY: t(o).style.chart.tooltip.offsetY,
        parent: t(p),
        content: t(B),
        isFullscreen: t(V),
        isCustom: t(o).style.chart.tooltip.customFormat && typeof t(o).style.chart.tooltip.customFormat == "function"
      }, {
        "tooltip-before": w(() => [
          $(e.$slots, "tooltip-before", q(Z({ ...t(rt) })), void 0, !0)
        ]),
        "tooltip-after": w(() => [
          $(e.$slots, "tooltip-after", q(Z({ ...t(rt) })), void 0, !0)
        ]),
        _: 3
      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom"]),
      t(i) ? (l(), S(xe, {
        key: 9,
        hideDetails: "",
        config: {
          open: t(R).showTable,
          maxHeight: 1e4,
          body: {
            backgroundColor: t(o).style.chart.backgroundColor,
            color: t(o).style.chart.color
          },
          head: {
            backgroundColor: t(o).style.chart.backgroundColor,
            color: t(o).style.chart.color
          }
        }
      }, {
        content: w(() => [
          (l(), S(Ce, {
            key: `table_${t(pt)}`,
            colNames: t(E).colNames,
            head: t(E).head,
            body: t(E).body,
            config: t(E).config,
            title: `${t(o).style.chart.title.text}${t(o).style.chart.title.subtitle.text ? ` : ${t(o).style.chart.title.subtitle.text}` : ""}`,
            onClose: n[6] || (n[6] = (s) => t(R).showTable = !1)
          }, {
            th: w(({ th: s }) => [
              T("div", {
                innerHTML: s,
                style: { display: "flex", "align-items": "center" }
              }, null, 8, qe)
            ]),
            td: w(({ td: s }) => [
              se(It(s.name || s), 1)
            ]),
            _: 1
          }, 8, ["colNames", "head", "body", "config", "title"]))
        ]),
        _: 1
      }, 8, ["config"])) : v("", !0)
    ], 46, Be));
  }
}, co = /* @__PURE__ */ Re(Ze, [["__scopeId", "data-v-a6682d9a"]]);
export {
  co as default
};
