vue-data-ui 3.17.13 → 3.18.1

package/dist/vue-ui-relation-circle-CkZ8oFVV.js

@@ -1,856 +0,0 @@
-import { useCssVars as St, defineAsyncComponent as ue, computed as g, ref as c, toRefs as It, watch as re, shallowRef as Re, onMounted as Mt, onBeforeUnmount as Et, openBlock as o, createElementBlock as i, unref as u, normalizeStyle as R, createElementVNode as J, toDisplayString as V, createBlock as G, createCommentVNode as h, withCtx as p, renderSlot as d, normalizeProps as w, guardReactiveProps as x, createSlots as Tt, normalizeClass as ce, createVNode as Ft, Fragment as S, renderList as N, mergeProps as Ne, createTextVNode as De, nextTick as Bt } from "vue";
-import { j as Rt, t as je, m as Nt, p as Ue, n as Dt, o as Ve, q as Ge, r as jt, X as Ut, W as We, k as ve, l as de, a2 as fe } from "./lib-DMzrGQHK.js";
-import { t as Vt, u as Gt } from "./useResponsive-DfdjqQps.js";
-import { u as Wt } from "./useConfig-CG4HT3wS.js";
-import { u as Kt, B as Xt } from "./BaseScanner-C2j3TsSY.js";
-import { u as Yt } from "./usePrinter-C4t8DdQ-.js";
-import { u as qt } from "./useSvgExport-BTG4hVPO.js";
-import { u as ye } from "./useNestedProp-DH0BEVVS.js";
-import { u as Ht } from "./useThemeCheck-C9Ccl7U9.js";
-import { u as Jt } from "./useUserOptionState-B7Ej974k.js";
-import { u as Qt } from "./useChartAccessibility-cp6XQtqi.js";
-import { u as Zt } from "./useAutoSizeLabelsInsideViewbox-izlGDfwu.js";
-import el from "./img-CjTQXS0U.js";
-import tl from "./Title-BbKoiBk2.js";
-import ll from "./vue_ui_relation_circle-CCroen7h.js";
-import { A as al } from "./A11yDataTable-BpmuNomI.js";
-import { _ as sl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const nl = ["id"], ol = ["id"], il = { style: { position: "relative" } }, ul = ["xmlns", "viewBox", "aria-describedby"], rl = ["width", "height"], cl = ["cx", "cy", "r", "stroke", "stroke-width"], vl = { key: 1 }, dl = ["stroke", "d", "stroke-width"], fl = { style: { "pointer-events": "none" } }, yl = ["cx", "cy", "fill", "r", "stroke"], gl = ["x", "y", "fill", "font-size"], hl = { key: 2 }, ml = ["stroke", "stroke-width", "x1", "x2", "y1", "y2"], pl = { style: { "pointer-events": "none" } }, bl = ["cx", "cy", "fill", "r", "stroke"], kl = ["x", "y", "fill", "font-size"], wl = ["text-anchor", "transform", "x", "y", "font-weight", "font-size", "fill", "text-decoration", "onClick", "onMouseenter", "onMouseleave"], xl = ["cx", "cy", "fill", "stroke", "r", "onClick", "onMouseenter", "onMouseleave"], Cl = {
-  key: 0,
-  style: { position: "absolute", top: "100%", left: "0", width: "100%" },
-  "data-dom-to-png-ignore": "",
-  "aria-hidden": "true"
-}, $l = {
-  key: 5,
-  class: "vue-data-ui-watermark"
-}, Al = {
-  __name: "vue-ui-relation-circle",
-  props: {
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    },
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  emits: ["copyAlt"],
-  setup(Ke, { expose: Xe, emit: Ye }) {
-    St((e) => ({
-      v0bd012f5: rt.value,
-      b9cbbb58: ut.value,
-      v6b1d3b36: ct.value
-    }));
-    const qe = ue(
-      () => import("./PenAndPaper-CJDoB5H9.js")
-    ), He = ue(
-      () => import("./UserOptions-DVduN6X7.js")
-    ), Je = ue(
-      () => import("./PackageVersion-BfrCAH6_.js")
-    ), { vue_ui_relation_circle: Qe } = Wt(), { isThemeValid: Ze, warnInvalidTheme: et } = Ht(), b = Ke, tt = Ye, lt = g(() => !!b.dataset && Object.keys(b.dataset).length), P = c(Rt()), ge = c(0), I = c(null), he = c(null), me = c(null), pe = c(null), be = c(0), W = c(!1), K = c(!1), m = c(null), X = c(!1), l = c(ee()), Y = g(
-      () => l.value.userOptions.useCursorPointer
-    ), at = g(() => je({
-      defaultConfig: {
-        userOptions: { show: !1 },
-        customPalette: new Array(7).fill("#CACACA"),
-        style: {
-          backgroundColor: "#99999930",
-          labels: { color: "#6A6A6A" },
-          circle: { stroke: "#6A6A6A" },
-          plot: { color: "#6A6A6A", useSerieColor: !0 },
-          links: { maxWidth: 2 }
-        }
-      },
-      userConfig: l.value.skeletonConfig ?? {}
-    })), { loading: ke, FINAL_DATASET: st, manualLoading: Q } = Kt({
-      ...It(b),
-      FINAL_CONFIG: l,
-      prepareConfig: ee,
-      skeletonDataset: b.config?.skeletonDataset ?? [
-        { id: "A", label: "_", relations: ["B", "C", "D", "E", "F", "G"] },
-        { id: "B", label: "_", relations: ["A"] },
-        { id: "C", label: "_", relations: ["A"] },
-        { id: "D", label: "_", relations: ["A"] },
-        { id: "E", label: "_", relations: ["A"] },
-        { id: "F", label: "_", relations: ["A"] },
-        { id: "G", label: "_", relations: ["A"] }
-      ],
-      skeletonConfig: je({
-        defaultConfig: l.value,
-        userConfig: at.value
-      })
-    }), { userOptionsVisible: Z, setUserOptionsVisibility: we, keepUserOptionState: xe } = Jt({ config: l.value }), { svgRef: T } = Qt({
-      config: l.value.style.title
-    });
-    function ee() {
-      const e = ye({
-        userConfig: b.config,
-        defaultConfig: Qe
-      }), a = e.theme;
-      if (!a) return e;
-      if (!Ze.value(e))
-        return et(e), e;
-      const t = ye({
-        userConfig: ll[a] || b.config,
-        defaultConfig: e
-      }), s = ye({
-        userConfig: b.config,
-        defaultConfig: t
-      });
-      return {
-        ...s,
-        customPalette: s.customPalette.length ? s.customPalette : Nt[a] || Ue
-      };
-    }
-    re(
-      () => b.config,
-      (e) => {
-        l.value = ee(), Z.value = !l.value.userOptions.showOnChartHover, M.value = l.value.style.size, k.value = l.value.style.weightLabels.size, q.value = l.value.style.plot.radius, D.value = l.value.style.labels.fontSize, v.value.height = l.value.style.size, v.value.width = l.value.style.size, Le(), be.value += 1;
-      },
-      { deep: !0 }
-    ), re(
-      () => b.dataset,
-      (e) => {
-        Array.isArray(e) && e.length > 0 && (Q.value = !1);
-      },
-      { deep: !0 }
-    );
-    const { isPrinting: te, isImaging: le, generatePdf: Ce, generateImage: $e } = Yt({
-      elementId: `relation_circle_${P.value}`,
-      fileName: l.value.style.title.text || "vue-ui-relation-circle",
-      options: l.value.userOptions.print
-    }), nt = g(() => l.value.userOptions.show && !l.value.style.title.text), Ae = g(() => Dt(l.value.customPalette)), y = c([]), C = c([]), f = c({}), $ = c([]), ot = c(0), L = g(() => st.value.slice(0, l.value.style.limit).map((e) => {
-      const a = Array.isArray(e.relations) ? e.relations : [];
-      return {
-        ...e,
-        weights: Array.isArray(e.weights) ? e.weights : new Array(a.length).fill(1),
-        relations: a
-      };
-    }));
-    re(L, () => {
-      y.value = [], C.value = [], ae(), se();
-    });
-    const M = c(l.value.style.size), k = c(l.value.style.weightLabels.size), q = c(l.value.style.plot.radius), D = c(l.value.style.labels.fontSize), v = c({
-      height: l.value.style.size,
-      width: l.value.style.size
-    }), E = g({
-      get() {
-        return M.value * l.value.style.circle.radiusProportion;
-      },
-      set(e) {
-        return e;
-      }
-    }), it = g(() => l.value.style.links.curved), ut = g(() => `${l.value.style.animation.speedMs}ms`), rt = g(() => E.value * 2), ct = g(() => E.value * 4), _ = Re(null), F = Re(null);
-    Mt(() => {
-      Le(), document.getElementById(`relation_circle_${P.value}`).addEventListener("click", Oe);
-    });
-    const Pe = g(() => l.value.debug);
-    function Le() {
-      if (Ve(b.dataset) ? (Ge({
-        componentName: "VueUiRelationCircle",
-        type: "dataset",
-        debug: Pe.value
-      }), Q.value = !0) : b.dataset.forEach((e, a) => {
-        jt({
-          datasetObject: e,
-          requiredAttributes: ["id", "label", "relations", "weights"]
-        }).forEach((t) => {
-          Ge({
-            componentName: "VueUiRelationCircle",
-            type: "datasetSerieAttribute",
-            property: t,
-            index: a,
-            debug: Pe.value
-          });
-        });
-      }), Ve(b.dataset) || (Q.value = l.value.loading), l.value.responsive) {
-        const e = Vt(() => {
-          const { width: a, height: t } = Gt({
-            chart: I.value,
-            title: l.value.style.title.text ? he.value : null,
-            source: me.value,
-            noTitle: pe.value
-          });
-          requestAnimationFrame(() => {
-            M.value = Math.min(a, t), v.value.width = Math.max(0.1, a), v.value.height = Math.max(0.1, t - 12), E.value = M.value * l.value.style.circle.radiusProportion, y.value = [], C.value = [], ae(), se(), _e(), l.value.responsiveProportionalSizing ? (k.value = fe({
-              relator: M.value,
-              adjuster: l.value.style.size,
-              source: l.value.style.weightLabels.size,
-              threshold: 6,
-              fallback: 6
-            }), q.value = fe({
-              relator: M.value,
-              adjuster: l.value.style.size,
-              source: l.value.style.plot.radius,
-              threshold: 1,
-              fallback: 1
-            }), D.value = fe({
-              relator: M.value,
-              adjuster: l.value.style.size,
-              source: l.value.style.labels.fontSize,
-              threshold: 6,
-              fallback: 6
-            })) : (k.value = l.value.style.weightLabels.size, q.value = l.value.style.plot.radius, D.value = l.value.style.labels.fontSize);
-          });
-        });
-        _.value && (F.value && _.value.unobserve(F.value), _.value.disconnect()), _.value = new ResizeObserver(e), F.value = I.value.parentNode, _.value.observe(F.value);
-      } else
-        y.value = [], C.value = [], ae(), se();
-      _e();
-    }
-    Et(() => {
-      document.getElementById(`relation_circle_${P.value}`).removeEventListener("click", Oe), _.value && (F.value && _.value.unobserve(F.value), _.value.disconnect());
-    });
-    const { autoSizeLabels: _e } = Zt({
-      svgRef: T,
-      fontSize: l.value.style.labels.fontSize,
-      minFontSize: l.value.style.labels.minFontSize,
-      sizeRef: D,
-      labelClass: ".vue-ui-relation-circle-legend"
-    });
-    function Oe(e) {
-      const a = e.target;
-      a && Array.from(a.classList).includes("vue-ui-user-options") || a && Array.from(a.classList).includes("vue-ui-user-options-summary") || a && Array.from(a.classList).includes("vue-data-ui-button") || a && Array.from(a.classList).includes("vue-ui-relation-circle-legend") || (f.value = {}, $.value = []);
-    }
-    function ae() {
-      const e = 6.28319 / L.value.length, a = 360 / L.value.length;
-      let t = 0, s = 0;
-      L.value.forEach((r, n) => {
-        const A = r.weights.reduce((Ot, zt) => Ot + zt, 0), z = E.value * Math.cos(t) + v.value.width / 2, _t = E.value * Math.sin(t) + v.value.height / 2 + l.value.style.circle.offsetY;
-        y.value.push({
-          x: z,
-          y: _t,
-          ...r,
-          color: r.color ? r.color : Ae.value[n] ? Ae.value[n] : Ue[n],
-          regAngle: s,
-          totalWeight: A
-        }), t += e, s += a;
-      });
-    }
-    function vt(e, a) {
-      const t = (e.x + a.x) / 2, s = (e.y + a.y) / 2;
-      return { x: t, y: s };
-    }
-    function se() {
-      C.value = [], y.value.forEach((e) => {
-        y.value.filter((t) => t.relations.includes(e.id)).forEach((t, s) => {
-          const r = t.relations.indexOf(e.id);
-          C.value.push({
-            weight: t.weights[r] ? t.weights[r] : 0,
-            relationId: `${e.id}_${t.id}`,
-            x1: e.x,
-            y1: e.y,
-            x2: t.x,
-            y2: t.y,
-            colorSource: e.color,
-            colorTarget: t.color,
-            midPointLine: vt(
-              { x: e.x, y: e.y },
-              { x: t.x, y: t.y }
-            ),
-            midPointBezier: dt({
-              x1: e.x,
-              x2: t.x,
-              y1: e.y,
-              y2: t.y
-            }),
-            ...e
-          });
-        });
-      });
-    }
-    function dt(e) {
-      const a = { x: e.x1, y: e.y1 }, t = { x: e.x2, y: e.y2 }, s = { x: e.x1, y: e.y1 }, r = {
-        x: v.value.width / 2,
-        y: v.value.height / 2 + l.value.style.circle.offsetY
-      }, n = 0.5, A = Math.pow(1 - n, 3) * a.x + 3 * Math.pow(1 - n, 2) * n * s.x + 3 * (1 - n) * Math.pow(n, 2) * r.x + Math.pow(n, 3) * t.x, z = Math.pow(1 - n, 3) * a.y + 3 * Math.pow(1 - n, 2) * n * s.y + 3 * (1 - n) * Math.pow(n, 2) * r.y + Math.pow(n, 3) * t.y;
-      return { x: A, y: z };
-    }
-    const ft = g(() => Math.max(...C.value.map((e) => e.weight)));
-    function yt(e) {
-      return Object.hasOwn(f.value, "x") ? $.value.includes(e.id) ? "opacity:1" : "opacity:0.1" : "opacity:1";
-    }
-    function O(e) {
-      return e.colorSource;
-    }
-    function ze(e) {
-      return Object.hasOwn(f.value, "x") ? $.value.includes(e.id) && e.relationId === `${e.id}_${f.value.id}` || e.relationId === `${f.value.id}_${e.id}` ? `opacity:1;stroke-width:${ne(e)}` : "opacity: 0" : "opacity: 1";
-    }
-    function B(e) {
-      return Object.hasOwn(f.value, "x") ? !!($.value.includes(e.id) && e.relationId === `${e.id}_${f.value.id}` || e.relationId === `${f.value.id}_${e.id}`) : !1;
-    }
-    function gt(e) {
-      return e.regAngle > 90 && e.regAngle < 270 ? "end" : "start";
-    }
-    function ht(e) {
-      return e.regAngle > 90 && e.regAngle < 270 ? e.x - 5 : e.x + 5;
-    }
-    function mt(e) {
-      return Object.hasOwn(f.value, "x") ? f.value.id === e.id || $.value.includes(e.id) ? "opacity:1" : "opacity:0.2" : "opacity:1";
-    }
-    function pt(e) {
-      return e.regAngle > 90 && e.regAngle < 270 ? `rotate(${e.regAngle + 180},${e.x},${e.y})` : `rotate(${e.regAngle},${e.x},${e.y})`;
-    }
-    const j = c(null);
-    function Se(e, a) {
-      j.value = a, m.value = a, l.value.events.datapointEnter && l.value.events.datapointEnter({
-        datapoint: e,
-        seriesIndex: a
-      });
-    }
-    function Ie(e, a) {
-      j.value = null, X.value || (m.value = null), l.value.events.datapointLeave && l.value.events.datapointLeave({
-        datapoint: e,
-        seriesIndex: a
-      });
-    }
-    function Me(e, a) {
-      e && (l.value.events.datapointClick && l.value.events.datapointClick({
-        datapoint: e,
-        seriesIndex: a
-      }), ot.value = 360 - e.regAngle, f.value.id && e.id === f.value.id ? (f.value = {}, $.value = []) : (f.value = e, $.value = [...e.relations]));
-    }
-    function Ee(e, a) {
-      m.value = a, Me(e, a);
-    }
-    function ne(e) {
-      const a = e.weight / ft.value * l.value.style.links.maxWidth;
-      return Math.max(0.3, a);
-    }
-    const H = c(!1);
-    function Te(e) {
-      H.value = e, ge.value += 1;
-    }
-    const U = c(!1);
-    function oe() {
-      U.value = !U.value;
-    }
-    async function bt({ scale: e = 2 } = {}) {
-      if (!I.value) return;
-      const { width: a, height: t } = I.value.getBoundingClientRect(), s = a / t, { imageUri: r, base64: n } = await el({
-        domElement: I.value,
-        base64: !0,
-        img: !0,
-        scale: e
-      });
-      return {
-        imageUri: r,
-        base64: n,
-        title: l.value.style.title.text,
-        width: a,
-        height: t,
-        aspectRatio: s
-      };
-    }
-    const kt = g(() => l.value.style.backgroundColor), wt = g(() => l.value.style.title), { exportSvg: xt, getSvg: Ct } = qt({
-      svg: T,
-      title: wt,
-      backgroundColor: kt
-    });
-    async function Fe({ isCb: e }) {
-      K.value = !0, await Bt();
-      try {
-        if (e) {
-          const { blob: a, url: t, text: s, dataUrl: r } = await Ct();
-          await Promise.resolve(
-            l.value.userOptions.callbacks.svg({
-              blob: a,
-              url: t,
-              text: s,
-              dataUrl: r
-            })
-          );
-        } else
-          await Promise.resolve(xt());
-      } finally {
-        K.value = !1;
-      }
-    }
-    function $t(e) {
-      if (e?.stage === "start") {
-        W.value = !0;
-        return;
-      }
-      if (e?.stage === "end") {
-        W.value = !1;
-        return;
-      }
-      $e();
-    }
-    async function Be() {
-      if (tt("copyAlt", {
-        config: l.value,
-        dataset: L.value
-      }), !l.value.userOptions.callbacks.altCopy) {
-        console.warn(
-          "Vue Data UI - A callback must be set for `altCopy` in userOptions."
-        );
-        return;
-      }
-      await Promise.resolve(
-        l.value.userOptions.callbacks.altCopy({
-          config: l.value,
-          dataset: L.value
-        })
-      );
-    }
-    function At() {
-      X.value = !0, y.value.length && m.value === null && (m.value = 0);
-    }
-    function Pt() {
-      X.value = !1, m.value = null;
-    }
-    function Lt(e) {
-      if (!T.value || U.value || document.activeElement !== T.value || !y.value.length) return;
-      const a = ["ArrowLeft", "ArrowUp"].includes(e.key), t = ["ArrowRight", "ArrowDown"].includes(e.key), s = e.key === "Enter" || e.key === " ", r = e.key === "Escape";
-      if (!a && !t && !s && !r)
-        return;
-      if (e.preventDefault(), e.stopPropagation(), r) {
-        m.value = null, f.value = {}, $.value = [];
-        return;
-      }
-      if (s) {
-        if (m.value === null) return;
-        const z = y.value[m.value];
-        if (!z) return;
-        Me(z, m.value);
-        return;
-      }
-      let n = m.value;
-      n === null || n < 0 || n >= y.value.length ? n = t ? 0 : y.value.length - 1 : t ? (n += 1, n >= y.value.length && (n = 0)) : a && (n -= 1, n < 0 && (n = y.value.length - 1)), m.value = n, j.value = n;
-      const A = y.value[n];
-      A && l.value.events.datapointEnter && l.value.events.datapointEnter({
-        datapoint: A,
-        seriesIndex: n
-      });
-    }
-    const ie = g(() => {
-      const e = [
-        "ID",
-        "Label",
-        "Total weight",
-        "Relations count",
-        "Relations"
-      ], a = L.value.map((t) => {
-        const s = t.relations.map((n) => L.value.find(
-          (z) => z.id === n
-        )?.label || n).join(", "), r = (t.weights || []).reduce(
-          (n, A) => n + Number(A || 0),
-          0
-        );
-        return [
-          t.id,
-          t.label,
-          r,
-          t.relations.length,
-          s
-        ];
-      });
-      return { headers: e, rows: a };
-    });
-    return Xe({
-      getImage: bt,
-      generatePdf: Ce,
-      generateSvg: Fe,
-      generateImage: $e,
-      toggleAnnotator: oe,
-      toggleFullscreen: Te,
-      copyAlt: Be
-    }), (e, a) => (o(), i("div", {
-      ref_key: "relationCircleChart",
-      ref: I,
-      class: "vue-data-ui-component vue-ui-relation-circle",
-      style: R(`width:100%;background:${l.value.style.backgroundColor};text-align:center;${l.value.responsive ? "height: 100%" : ""}`),
-      id: `relation_circle_${P.value}`,
-      onMouseenter: a[0] || (a[0] = () => u(we)(!0)),
-      onMouseleave: a[1] || (a[1] = () => u(we)(!1))
-    }, [
-      J("div", {
-        id: `chart-instructions-${P.value}`,
-        class: "sr-only"
-      }, [
-        J("p", null, V(l.value.a11y.translations.keyboardNavigation), 1)
-      ], 8, ol),
-      ie.value?.rows?.length ? (o(), G(al, {
-        key: 0,
-        uid: P.value,
-        head: ie.value.headers,
-        body: ie.value.rows,
-        notice: l.value.a11y.translations.tableAvailable,
-        caption: l.value.a11y.translations.tableCaption
-      }, null, 8, ["uid", "head", "body", "notice", "caption"])) : h("", !0),
-      l.value.userOptions.buttons.annotator ? (o(), G(u(qe), {
-        key: 1,
-        svgRef: u(T),
-        backgroundColor: l.value.style.backgroundColor,
-        color: l.value.style.color,
-        active: U.value,
-        isCursorPointer: Y.value,
-        onClose: oe
-      }, {
-        "annotator-action-close": p(() => [
-          d(e.$slots, "annotator-action-close", {}, void 0, !0)
-        ]),
-        "annotator-action-color": p(({ color: t }) => [
-          d(e.$slots, "annotator-action-color", w(x({ color: t })), void 0, !0)
-        ]),
-        "annotator-action-draw": p(({ mode: t }) => [
-          d(e.$slots, "annotator-action-draw", w(x({ mode: t })), void 0, !0)
-        ]),
-        "annotator-action-undo": p(({ disabled: t }) => [
-          d(e.$slots, "annotator-action-undo", w(x({ disabled: t })), void 0, !0)
-        ]),
-        "annotator-action-redo": p(({ disabled: t }) => [
-          d(e.$slots, "annotator-action-redo", w(x({ disabled: t })), void 0, !0)
-        ]),
-        "annotator-action-delete": p(({ disabled: t }) => [
-          d(e.$slots, "annotator-action-delete", w(x({ disabled: t })), void 0, !0)
-        ]),
-        _: 3
-      }, 8, ["svgRef", "backgroundColor", "color", "active", "isCursorPointer"])) : h("", !0),
-      nt.value ? (o(), i("div", {
-        key: 2,
-        ref_key: "noTitle",
-        ref: pe,
-        class: "vue-data-ui-no-title-space",
-        style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : h("", !0),
-      l.value.style.title.text ? (o(), i("div", {
-        key: 3,
-        ref_key: "chartTitle",
-        ref: he,
-        style: "width:100%;background:transparent"
-      }, [
-        (o(), G(tl, {
-          key: `title_${be.value}`,
-          config: {
-            title: {
-              cy: "relation-div-title",
-              ...l.value.style.title
-            },
-            subtitle: {
-              cy: "relation-div-subtitle",
-              ...l.value.style.title.subtitle
-            }
-          }
-        }, null, 8, ["config"]))
-      ], 512)) : h("", !0),
-      l.value.userOptions.show && lt.value && (u(xe) || u(Z)) ? (o(), G(u(He), {
-        ref: "details",
-        key: `user_options_${ge.value}`,
-        backgroundColor: l.value.style.backgroundColor,
-        color: l.value.style.color,
-        isPrinting: u(te),
-        isImaging: u(le),
-        uid: P.value,
-        hasPdf: l.value.userOptions.buttons.pdf,
-        hasImg: l.value.userOptions.buttons.img,
-        hasSvg: l.value.userOptions.buttons.svg,
-        hasFullscreen: l.value.userOptions.buttons.fullscreen,
-        hasAltCopy: l.value.userOptions.buttons.altCopy,
-        hasXls: !1,
-        isFullscreen: H.value,
-        titles: { ...l.value.userOptions.buttonTitles },
-        chartElement: I.value,
-        position: l.value.userOptions.position,
-        hasAnnotator: l.value.userOptions.buttons.annotator,
-        isAnnotation: U.value,
-        callbacks: l.value.userOptions.callbacks,
-        printScale: l.value.userOptions.print.scale,
-        isCursorPointer: Y.value,
-        onToggleFullscreen: Te,
-        onGeneratePdf: u(Ce),
-        onGenerateImage: $t,
-        onGenerateSvg: Fe,
-        onToggleAnnotator: oe,
-        onCopyAlt: Be,
-        style: R({
-          visibility: u(xe) ? u(Z) ? "visible" : "hidden" : "visible"
-        })
-      }, Tt({ _: 2 }, [
-        e.$slots.menuIcon ? {
-          name: "menuIcon",
-          fn: p(({ isOpen: t, color: s }) => [
-            d(e.$slots, "menuIcon", w(x({ isOpen: t, color: s })), void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        e.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: p(() => [
-            d(e.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        e.$slots.optionImg ? {
-          name: "optionImg",
-          fn: p(() => [
-            d(e.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        e.$slots.optionSvg ? {
-          name: "optionSvg",
-          fn: p(() => [
-            d(e.$slots, "optionSvg", {}, void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        e.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: p(({ toggleFullscreen: t, isFullscreen: s }) => [
-            d(e.$slots, "optionFullscreen", w(x({ toggleFullscreen: t, isFullscreen: s })), void 0, !0)
-          ]),
-          key: "4"
-        } : void 0,
-        e.$slots.optionAnnotator ? {
-          name: "optionAnnotator",
-          fn: p(({ toggleAnnotator: t, isAnnotator: s }) => [
-            d(e.$slots, "optionAnnotator", w(x({ toggleAnnotator: t, isAnnotator: s })), void 0, !0)
-          ]),
-          key: "5"
-        } : void 0,
-        e.$slots.optionAltCopy ? {
-          name: "optionAltCopy",
-          fn: p(({ altCopy: t }) => [
-            d(e.$slots, "optionAltCopy", w(x({ altCopy: t })), void 0, !0)
-          ]),
-          key: "6"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasImg", "hasSvg", "hasFullscreen", "hasAltCopy", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "isCursorPointer", "onGeneratePdf", "style"])) : h("", !0),
-      J("div", il, [
-        (o(), i("svg", {
-          ref_key: "svgRef",
-          ref: T,
-          xmlns: u(Ut),
-          class: ce([{
-            "vue-data-ui-fullscreen--on": H.value,
-            "vue-data-ui-fulscreen--off": !H.value
-          }, "relation-circle"]),
-          viewBox: `0 0 ${v.value.width <= 0 ? 10 : v.value.width} ${v.value.height <= 0 ? 10 : v.value.height}`,
-          width: "100%",
-          style: "user-select:none; background:transparent",
-          "aria-describedby": `chart-instructions-${P.value}`,
-          tabindex: "0",
-          onFocus: At,
-          onBlur: Pt,
-          onKeydown: Lt
-        }, [
-          Ft(u(Je)),
-          e.$slots["chart-background"] ? (o(), i("foreignObject", {
-            key: 0,
-            x: 0,
-            y: 0,
-            width: v.value.width <= 0 ? 10 : v.value.width,
-            height: v.value.height <= 0 ? 10 : v.value.height,
-            style: {
-              pointerEvents: "none"
-            }
-          }, [
-            d(e.$slots, "chart-background", {}, void 0, !0)
-          ], 8, rl)) : h("", !0),
-          J("circle", {
-            cx: (v.value.width <= 0 ? 1e-4 : v.value.width) / 2,
-            cy: (v.value.height <= 0 ? 1e-4 : v.value.height) / 2 + l.value.style.circle.offsetY,
-            r: E.value <= 0 ? 1e-4 : E.value,
-            stroke: l.value.style.circle.stroke,
-            "stroke-width": l.value.style.circle.strokeWidth,
-            fill: "transparent",
-            class: "main-circle"
-          }, null, 8, cl),
-          it.value ? (o(), i("g", vl, [
-            (o(!0), i(S, null, N(C.value, (t, s) => (o(), i("path", {
-              key: `relation_${s}`,
-              style: R(ze(t)),
-              stroke: O(t),
-              class: ce(["relation", {
-                "vue-ui-relation-circle-selected": f.value.hasOwnProperty("id") && $.value.includes(t.id)
-              }]),
-              d: `M${t.x1},${t.y1} C${t.x1},${t.y1} ${v.value.width / 2},${v.value.height / 2 + l.value.style.circle.offsetY} ${t.x2},${t.y2}`,
-              fill: "none",
-              "stroke-width": ne(t),
-              "stroke-linecap": "round"
-            }, null, 14, dl))), 128)),
-            (o(!0), i(S, null, N(C.value, (t, s) => (o(), i("g", fl, [
-              B(t) ? d(e.$slots, "dataLabel", Ne({
-                key: 0,
-                ref_for: !0
-              }, {
-                x: t.midPointBezier.x,
-                y: t.midPointBezier.y,
-                color: O(t),
-                weight: t.weight,
-                fontSize: k.value
-              }), void 0, !0) : h("", !0),
-              B(t) && !e.$slots.dataLabel ? (o(), i("circle", {
-                key: 1,
-                cx: t.midPointBezier.x,
-                cy: t.midPointBezier.y,
-                fill: O(t),
-                r: k.value,
-                stroke: l.value.style.backgroundColor,
-                "stroke-width": "1"
-              }, null, 8, yl)) : h("", !0),
-              B(t) && !e.$slots.dataLabel ? (o(), i("text", {
-                key: 2,
-                x: t.midPointBezier.x,
-                y: t.midPointBezier.y + k.value / 3,
-                fill: u(We)(O(t)),
-                "text-anchor": "middle",
-                "font-size": k.value
-              }, V(u(ve)(
-                l.value.style.weightLabels.formatter,
-                t.weight,
-                u(de)({
-                  p: l.value.style.weightLabels.prefix,
-                  v: t.weight,
-                  s: l.value.style.weightLabels.suffix,
-                  r: l.value.style.weightLabels.rounding
-                }),
-                { ...t }
-              )), 9, gl)) : h("", !0)
-            ]))), 256))
-          ])) : (o(), i("g", hl, [
-            (o(!0), i(S, null, N(C.value, (t, s) => (o(), i("line", {
-              key: `relation_${s}`,
-              stroke: O(t),
-              "stroke-width": ne(t),
-              style: R(ze(t)),
-              x1: t.x1,
-              x2: t.x2,
-              y1: t.y1,
-              y2: t.y2,
-              class: ce({
-                "vue-ui-relation-circle-selected": f.value.hasOwnProperty("id") && $.value.includes(t.id)
-              }),
-              "stroke-linecap": "round"
-            }, null, 14, ml))), 128)),
-            (o(!0), i(S, null, N(C.value, (t, s) => (o(), i("g", pl, [
-              B(t) ? d(e.$slots, "dataLabel", Ne({
-                key: 0,
-                ref_for: !0
-              }, {
-                x: t.midPointLine.x,
-                y: t.midPointLine.y,
-                color: O(t),
-                weight: t.weight,
-                fontSize: k.value
-              }), void 0, !0) : h("", !0),
-              B(t) && !e.$slots.dataLabel && l.value.style.weightLabels.show ? (o(), i("circle", {
-                key: 1,
-                cx: t.midPointLine.x,
-                cy: t.midPointLine.y,
-                fill: O(t),
-                r: k.value,
-                stroke: l.value.style.backgroundColor,
-                "stroke-width": "1"
-              }, null, 8, bl)) : h("", !0),
-              B(t) && !e.$slots.dataLabel && l.value.style.weightLabels.show ? (o(), i("text", {
-                key: 2,
-                x: t.midPointLine.x,
-                y: t.midPointLine.y + k.value / 3,
-                fill: u(We)(O(t)),
-                "text-anchor": "middle",
-                "font-size": k.value
-              }, V(u(ve)(
-                l.value.style.weightLabels.formatter,
-                t.weight,
-                u(de)({
-                  p: l.value.style.weightLabels.prefix,
-                  v: t.weight,
-                  s: l.value.style.weightLabels.suffix,
-                  r: l.value.style.weightLabels.rounding
-                }),
-                { ...t }
-              )), 9, kl)) : h("", !0)
-            ]))), 256))
-          ])),
-          (o(!0), i(S, null, N(y.value, (t, s) => (o(), i("text", {
-            key: `plot_text_${s}`,
-            "text-anchor": gt(t),
-            transform: pt(t),
-            x: ht(t),
-            y: t.y + 5,
-            class: "vue-ui-relation-circle-legend",
-            "transform-origin": "start",
-            "font-weight": f.value.id === t.id ? "900" : "400",
-            style: R(`font-family:${l.value.style.fontFamily};${mt(t)};cursor:${Y.value ? "pointer" : "default"}`),
-            "font-size": D.value,
-            fill: l.value.style.labels.color,
-            "text-decoration": s === j.value || s === m.value ? "underline" : void 0,
-            onClick: (r) => Ee(t, s),
-            onMouseenter: (r) => Se(t, s),
-            onMouseleave: (r) => Ie(t, s)
-          }, [
-            u(ke) ? (o(), i(S, { key: 0 }, [
-              De("--------")
-            ], 64)) : (o(), i(S, { key: 1 }, [
-              De(V(t.label) + " (" + V(u(ve)(
-                l.value.style.weightLabels.formatter,
-                t.totalWeight,
-                u(de)({
-                  p: l.value.style.weightLabels.prefix,
-                  v: t.totalWeight,
-                  s: l.value.style.weightLabels.suffix,
-                  r: l.value.style.weightLabels.rounding
-                }),
-                { ...t }
-              )) + ") ", 1)
-            ], 64))
-          ], 44, wl))), 128)),
-          (o(!0), i(S, null, N(y.value, (t, s) => (o(), i("circle", {
-            cx: t.x,
-            cy: t.y,
-            key: `plot_${s}`,
-            style: R(`${yt(t)}; transition: r 0.2s ease-in-out; cursor:${Y.value ? "pointer" : "default"}`),
-            class: "vue-ui-relation-circle-plot",
-            fill: l.value.style.plot.useSerieColor ? t.color : l.value.style.plot.color,
-            stroke: l.value.style.backgroundColor,
-            "stroke-width": "1",
-            r: q.value * (s === j.value || s === m.value ? 2 : 1),
-            onClick: (r) => Ee(t, s),
-            onMouseenter: (r) => Se(t, s),
-            onMouseleave: (r) => Ie(t, s)
-          }, null, 44, xl))), 128)),
-          d(e.$slots, "svg", {
-            svg: {
-              ...v.value,
-              isPrintingImg: u(te) | u(le) | W.value,
-              isPrintingSvg: K.value
-            }
-          }, void 0, !0)
-        ], 42, ul)),
-        e.$slots.hint ? (o(), i("div", Cl, [
-          d(e.$slots, "hint", w(x({
-            hint: l.value.a11y.translations.keyboardNavigation,
-            isVisible: X.value
-          })), void 0, !0)
-        ])) : h("", !0)
-      ]),
-      e.$slots.watermark ? (o(), i("div", $l, [
-        d(e.$slots, "watermark", w(x({
-          isPrinting: u(te) || u(le) || W.value || K.value
-        })), void 0, !0)
-      ])) : h("", !0),
-      e.$slots.source ? (o(), i("div", {
-        key: 6,
-        ref_key: "source",
-        ref: me,
-        dir: "auto"
-      }, [
-        d(e.$slots, "source", {}, void 0, !0)
-      ], 512)) : h("", !0),
-      d(e.$slots, "skeleton", {}, () => [
-        u(ke) ? (o(), G(Xt, { key: 0 })) : h("", !0)
-      ], !0)
-    ], 44, nl));
-  }
-}, Vl = /* @__PURE__ */ sl(Al, [["__scopeId", "data-v-2cc382ee"]]);
-export {
-  Vl as default
-};