vue-data-ui 2.4.1 → 2.4.3

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

@@ -1,325 +0,0 @@
-import { useCssVars as _e, computed as c, ref as u, watch as ke, onMounted as $e, onBeforeUnmount as xe, openBlock as s, createElementBlock as o, normalizeStyle as _, createBlock as E, createCommentVNode as k, unref as h, createSlots as Ce, withCtx as z, renderSlot as $, normalizeProps as K, guardReactiveProps as Q, normalizeClass as L, createVNode as we, createElementVNode as be, Fragment as b, renderList as O, toDisplayString as Oe } from "vue";
-import { u as Pe, c as Ae, t as Ie, a as Fe, p as Z, b as Ee, o as ze, e as ee, g as Le, X as Ne } from "./index-DDXisDKy.js";
-import { t as Se, u as Re } from "./useResponsive-NZB-WLRF.js";
-import { _ as Te } from "./Title-DYNLqCCT.js";
-import { u as Me, U as je } from "./usePrinter-8ofTb2MJ.js";
-import Be from "./vue-ui-skeleton-B2sRnIXX.js";
-import { u as te } from "./useNestedProp-S1UXxUgm.js";
-import { _ as Ge } from "./PackageVersion-DtnhR89q.js";
-import { _ as Ue } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const De = ["id"], Ve = ["xmlns", "viewBox"], We = ["cx", "cy", "r", "stroke", "stroke-width"], Xe = { key: 0 }, Ye = ["stroke", "d", "stroke-width"], qe = { key: 1 }, He = ["stroke", "x1", "x2", "y1", "y2"], Je = ["text-anchor", "transform", "x", "y", "onClick", "font-weight", "font-size", "fill"], Ke = ["cx", "cy", "fill", "onClick", "r"], Qe = {
-  key: 3,
-  class: "vue-data-ui-watermark"
-}, Ze = {
-  __name: "vue-ui-relation-circle",
-  props: {
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    },
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  setup(le, { expose: re }) {
-    const d = le;
-    _e((e) => ({
-      db99e4e4: ue.value,
-      "1847af26": ae.value,
-      "36a818e2": oe.value
-    }));
-    const { vue_ui_relation_circle: se } = Pe(), P = c(() => !!d.dataset && Object.keys(d.dataset).length), m = u(Ae()), N = u(0), x = u(null), S = u(null), R = u(0), l = c({
-      get: () => T(),
-      set: (e) => e
-    });
-    function T() {
-      const e = te({
-        userConfig: d.config,
-        defaultConfig: se
-      });
-      return e.theme ? {
-        ...te({
-          userConfig: Ie.vue_ui_relation_circle[e.theme] || d.config,
-          defaultConfig: e
-        }),
-        customPalette: Fe[e.theme] || Z
-      } : e;
-    }
-    ke(() => d.config, (e) => {
-      l.value = T(), D(), R.value += 1;
-    }, { deep: !0 });
-    const { isPrinting: M, isImaging: j, generatePdf: B, generateImage: G } = Me({
-      elementId: `relation_circle_${m.value}`,
-      fileName: l.value.style.title.text || "vue-ui-relation-circle"
-    }), U = c(() => Ee(l.value.customPalette)), f = u([]), y = u([]), n = u({}), v = u([]), ne = u(0), A = c(() => d.dataset.slice(0, l.value.style.limit)), I = u(l.value.style.size), i = u({
-      height: l.value.style.size,
-      width: l.value.style.size
-    }), g = c({
-      get() {
-        return I.value * l.value.style.circle.radiusProportion;
-      },
-      set(e) {
-        return e;
-      }
-    }), ie = c(() => l.value.style.links.curved), ae = c(() => `${l.value.style.animation.speedMs}ms`), ue = c(() => g.value * 2), oe = c(() => g.value * 4), C = u(null);
-    $e(() => {
-      D(), document.getElementById(`relation_circle_${m.value}`).addEventListener("click", V);
-    });
-    function D() {
-      if (ze(d.dataset) ? ee({
-        componentName: "VueUiRelationCircle",
-        type: "dataset"
-      }) : d.dataset.forEach((e, r) => {
-        Le({
-          datasetObject: e,
-          requiredAttributes: ["id", "label", "relations", "weights"]
-        }).forEach((t) => {
-          ee({
-            componentName: "VueUiRelationCircle",
-            type: "datasetSerieAttribute",
-            property: t,
-            index: r
-          });
-        });
-      }), l.value.responsive) {
-        const e = Se(() => {
-          const { width: r, height: t } = Re({
-            chart: x.value,
-            title: l.value.style.title.text ? S.value : null
-          });
-          I.value = Math.min(r, t), i.value.width = r, i.value.height = t, g.value = I.value * l.value.style.circle.radiusProportion, f.value = [], y.value = [], W(), X();
-        });
-        C.value = new ResizeObserver(e), C.value.observe(x.value.parentNode);
-      } else
-        f.value = [], y.value = [], W(), X();
-    }
-    xe(() => {
-      document.getElementById(`relation_circle_${m.value}`).removeEventListener("click", V), C.value && C.value.disconnect();
-    });
-    function V(e) {
-      const r = e.target;
-      r && Array.from(r.classList).includes("vue-ui-user-options") || r && Array.from(r.classList).includes("vue-ui-user-options-summary") || r && Array.from(r.classList).includes("vue-data-ui-button") || r && Array.from(r.classList).includes("vue-ui-relation-circle-legend") || (n.value = {}, v.value = []);
-    }
-    function W() {
-      const e = 6.28319 / A.value.length, r = 360 / A.value.length;
-      let t = 0, a = 0;
-      A.value.forEach((p, F) => {
-        const me = g.value * Math.cos(t) + i.value.width / 2, pe = g.value * Math.sin(t) + i.value.height / 2 + l.value.style.circle.offsetY;
-        f.value.push({ x: me, y: pe, ...p, color: p.color ? p.color : U.value[F] ? U.value[F] : Z[F], regAngle: a }), t += e, a += r;
-      });
-    }
-    function X() {
-      f.value.forEach((e) => {
-        f.value.filter((t) => t.relations.includes(e.id)).forEach((t, a) => {
-          y.value.push({
-            weight: e.weights && e.weights[a] ? e.weights[a] : 1,
-            relationId: `${e.id}_${t.id}`,
-            x1: e.x,
-            y1: e.y,
-            x2: t.x,
-            y2: t.y,
-            colorSource: e.color,
-            colorTarget: t.color,
-            ...e
-          });
-        });
-      });
-    }
-    const ce = c(() => Math.max(...y.value.map((e) => e.weight)));
-    function de(e) {
-      return Object.hasOwn(n.value, "x") ? v.value.includes(e.id) ? "opacity:1" : "opacity:0.1" : "opacity:1";
-    }
-    function Y(e) {
-      return Object.hasOwn(n.value, "x") ? e.colorTarget : e.colorSource;
-    }
-    function q(e) {
-      return Object.hasOwn(n.value, "x") ? v.value.includes(e.id) && e.relationId === `${e.id}_${n.value.id}` || e.relationId === `${n.value.id}_${e.id}` ? `opacity:1;stroke-width:${J(e)}` : "opacity: 0" : "opacity: 1";
-    }
-    function ve(e) {
-      return e.regAngle > 90 && e.regAngle < 270 ? "end" : "start";
-    }
-    function fe(e) {
-      return e.regAngle > 90 && e.regAngle < 270 ? e.x - 5 : e.x + 5;
-    }
-    function ge(e) {
-      return Object.hasOwn(n.value, "x") ? n.value.id === e.id || v.value.includes(e.id) ? "opacity:1" : "opacity:0.2" : "opacity:1";
-    }
-    function he(e) {
-      return e.regAngle > 90 && e.regAngle < 270 ? `rotate(${e.regAngle + 180},${e.x},${e.y})` : `rotate(${e.regAngle},${e.x},${e.y})`;
-    }
-    function H(e) {
-      ne.value = 360 - e.regAngle, n.value.id && e.id === n.value.id ? (n.value = {}, v.value = []) : (n.value = e, v.value = [...e.relations]);
-    }
-    function J(e) {
-      return e.weight / ce.value * l.value.style.links.maxWidth;
-    }
-    const w = u(!1);
-    function ye(e) {
-      w.value = e, N.value += 1;
-    }
-    return re({
-      generatePdf: B,
-      generateImage: G
-    }), (e, r) => (s(), o("div", {
-      ref_key: "relationCircleChart",
-      ref: x,
-      class: "vue-ui-relation-circle",
-      style: _(`width:100%;background:${l.value.style.backgroundColor};text-align:center;${l.value.responsive ? "height: 100%" : ""}`),
-      id: `relation_circle_${m.value}`
-    }, [
-      l.value.style.title.text ? (s(), o("div", {
-        key: 0,
-        ref_key: "chartTitle",
-        ref: S,
-        style: "width:100%;background:transparent"
-      }, [
-        (s(), E(Te, {
-          key: `title_${R.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)) : k("", !0),
-      l.value.userOptions.show && P.value ? (s(), E(je, {
-        ref: "details",
-        key: `user_options_${N.value}`,
-        backgroundColor: l.value.style.backgroundColor,
-        color: l.value.style.color,
-        isPrinting: h(M),
-        isImaging: h(j),
-        uid: m.value,
-        hasPdf: l.value.userOptions.buttons.pdf,
-        hasImg: l.value.userOptions.buttons.img,
-        hasFullscreen: l.value.userOptions.buttons.img,
-        hasXls: !1,
-        isFullscreen: w.value,
-        titles: { ...l.value.userOptions.buttonTitles },
-        chartElement: x.value,
-        position: l.value.userOptions.position,
-        onToggleFullscreen: ye,
-        onGeneratePdf: h(B),
-        onGenerateImage: h(G)
-      }, Ce({ _: 2 }, [
-        e.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: z(() => [
-            $(e.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        e.$slots.optionImg ? {
-          name: "optionImg",
-          fn: z(() => [
-            $(e.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        e.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: z(({ toggleFullscreen: t, isFullscreen: a }) => [
-            $(e.$slots, "optionFullscreen", K(Q({ toggleFullscreen: t, isFullscreen: a })), void 0, !0)
-          ]),
-          key: "2"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasImg", "hasFullscreen", "isFullscreen", "titles", "chartElement", "position", "onGeneratePdf", "onGenerateImage"])) : k("", !0),
-      P.value ? (s(), o("svg", {
-        key: 2,
-        xmlns: h(Ne),
-        class: L([{ "vue-data-ui-fullscreen--on": w.value, "vue-data-ui-fulscreen--off": !w.value }, "relation-circle"]),
-        viewBox: `0 0 ${i.value.width <= 0 ? 10 : i.value.width} ${i.value.height <= 0 ? 10 : i.value.height}`,
-        width: "100%",
-        style: "user-select:none; background:transparent"
-      }, [
-        we(Ge),
-        be("circle", {
-          cx: (i.value.width <= 0 ? 1e-4 : i.value.width) / 2,
-          cy: (i.value.height <= 0 ? 1e-4 : i.value.height) / 2 + l.value.style.circle.offsetY,
-          r: g.value <= 0 ? 1e-4 : g.value,
-          stroke: l.value.style.circle.stroke,
-          "stroke-width": l.value.style.circle.strokeWidth,
-          fill: "transparent",
-          class: "main-circle"
-        }, null, 8, We),
-        ie.value ? (s(), o("g", Xe, [
-          (s(!0), o(b, null, O(y.value, (t, a) => (s(), o("path", {
-            key: `relation_${a}`,
-            style: _(q(t)),
-            stroke: Y(t),
-            class: L(["relation", { "vue-ui-relation-circle-selected": n.value.hasOwnProperty("id") && v.value.includes(t.id) }]),
-            d: `M${t.x1},${t.y1} C${t.x1},${t.y1} ${i.value.width / 2},${i.value.height / 2 + l.value.style.circle.offsetY} ${t.x2},${t.y2}`,
-            fill: "none",
-            "stroke-width": J(t),
-            "stroke-linecap": "round"
-          }, null, 14, Ye))), 128))
-        ])) : (s(), o("g", qe, [
-          (s(!0), o(b, null, O(y.value, (t, a) => (s(), o("line", {
-            key: `relation_${a}`,
-            stroke: Y(t),
-            style: _(q(t)),
-            x1: t.x1,
-            x2: t.x2,
-            y1: t.y1,
-            y2: t.y2,
-            class: L({ "vue-ui-relation-circle-selected": n.value.hasOwnProperty("id") && v.value.includes(t.id) }),
-            "stroke-linecap": "round"
-          }, null, 14, He))), 128))
-        ])),
-        (s(!0), o(b, null, O(f.value, (t, a) => (s(), o("text", {
-          key: `plot_text_${a}`,
-          "text-anchor": ve(t),
-          transform: he(t),
-          x: fe(t),
-          y: t.y + 5,
-          onClick: (p) => H(t),
-          class: "vue-ui-relation-circle-legend",
-          "transform-origin": "start",
-          "font-weight": n.value.id === t.id ? "900" : "400",
-          style: _(`font-family:${l.value.style.fontFamily};${ge(t)}`),
-          "font-size": l.value.style.labels.fontSize,
-          fill: l.value.style.labels.color
-        }, Oe(t.label), 13, Je))), 128)),
-        (s(!0), o(b, null, O(f.value, (t, a) => (s(), o("circle", {
-          cx: t.x,
-          cy: t.y,
-          key: `plot_${a}`,
-          style: _(de(t)),
-          class: "vue-ui-relation-circle-plot",
-          fill: l.value.style.plot.color,
-          onClick: (p) => H(t),
-          r: l.value.style.plot.radius
-        }, null, 12, Ke))), 128)),
-        $(e.$slots, "svg", { svg: i.value }, void 0, !0)
-      ], 10, Ve)) : k("", !0),
-      e.$slots.watermark ? (s(), o("div", Qe, [
-        $(e.$slots, "watermark", K(Q({ isPrinting: h(M) || h(j) })), void 0, !0)
-      ])) : k("", !0),
-      P.value ? k("", !0) : (s(), E(Be, {
-        key: 4,
-        config: {
-          type: "relationCircle",
-          style: {
-            backgroundColor: l.value.style.backgroundColor,
-            relationCircle: {
-              color: "#CCCCCC"
-            }
-          }
-        }
-      }, null, 8, ["config"]))
-    ], 12, De));
-  }
-}, ot = /* @__PURE__ */ Ue(Ze, [["__scopeId", "data-v-0d6438fc"]]);
-export {
-  ot as default
-};

package/dist/vue-ui-relation-circle-uNgJni4x.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),o=require("./index-C7_6YjWN.cjs"),q=require("./useResponsive-B3TrDDIG.cjs"),ae=require("./Title-C-lm3Mkl.cjs"),M=require("./usePrinter-8EP4iaGm.cjs"),se=require("./vue-ui-skeleton-CGV1dEUD.cjs"),j=require("./useNestedProp-CC9zGr7C.cjs"),oe=require("./PackageVersion-D4D0WicU.cjs"),ue=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),ce=["id"],de=["xmlns","viewBox"],ve=["cx","cy","r","stroke","stroke-width"],fe={key:0},ge=["stroke","d","stroke-width"],me={key:1},ye=["stroke","x1","x2","y1","y2"],he=["text-anchor","transform","x","y","onClick","font-weight","font-size","fill"],ke=["cx","cy","fill","onClick","r"],pe={key:3,class:"vue-data-ui-watermark"},_e={__name:"vue-ui-relation-circle",props:{dataset:{type:Array,default(){return[]}},config:{type:Object,default(){return{}}}},setup(G,{expose:U}){const u=G;e.useCssVars(t=>({db99e4e4:H.value,"1847af26":Y.value,"36a818e2":J.value}));const{vue_ui_relation_circle:D}=o.useConfig(),p=e.computed(()=>!!u.dataset&&Object.keys(u.dataset).length),g=e.ref(o.createUid()),$=e.ref(0),y=e.ref(null),w=e.ref(null),B=e.ref(0),r=e.computed({get:()=>b(),set:t=>t});function b(){const t=j.useNestedProp({userConfig:u.config,defaultConfig:D});return t.theme?{...j.useNestedProp({userConfig:o.themes.vue_ui_relation_circle[t.theme]||u.config,defaultConfig:t}),customPalette:o.themePalettes[t.theme]||o.palette}:t}e.watch(()=>u.config,t=>{r.value=b(),S(),B.value+=1},{deep:!0});const{isPrinting:P,isImaging:O,generatePdf:E,generateImage:A}=M.usePrinter({elementId:`relation_circle_${g.value}`,fileName:r.value.style.title.text||"vue-ui-relation-circle"}),I=e.computed(()=>o.convertCustomPalette(r.value.customPalette)),d=e.ref([]),f=e.ref([]),i=e.ref({}),c=e.ref([]),W=e.ref(0),_=e.computed(()=>u.dataset.slice(0,r.value.style.limit)),C=e.ref(r.value.style.size),a=e.ref({height:r.value.style.size,width:r.value.style.size}),v=e.computed({get(){return C.value*r.value.style.circle.radiusProportion},set(t){return t}}),X=e.computed(()=>r.value.style.links.curved),Y=e.computed(()=>`${r.value.style.animation.speedMs}ms`),H=e.computed(()=>v.value*2),J=e.computed(()=>v.value*4),h=e.ref(null);e.onMounted(()=>{S(),document.getElementById(`relation_circle_${g.value}`).addEventListener("click",z)});function S(){if(o.objectIsEmpty(u.dataset)?o.error({componentName:"VueUiRelationCircle",type:"dataset"}):u.dataset.forEach((t,n)=>{o.getMissingDatasetAttributes({datasetObject:t,requiredAttributes:["id","label","relations","weights"]}).forEach(l=>{o.error({componentName:"VueUiRelationCircle",type:"datasetSerieAttribute",property:l,index:n})})}),r.value.responsive){const t=q.throttle(()=>{const{width:n,height:l}=q.useResponsive({chart:y.value,title:r.value.style.title.text?w.value:null});C.value=Math.min(n,l),a.value.width=n,a.value.height=l,v.value=C.value*r.value.style.circle.radiusProportion,d.value=[],f.value=[],F(),N()});h.value=new ResizeObserver(t),h.value.observe(y.value.parentNode)}else d.value=[],f.value=[],F(),N()}e.onBeforeUnmount(()=>{document.getElementById(`relation_circle_${g.value}`).removeEventListener("click",z),h.value&&h.value.disconnect()});function z(t){const n=t.target;n&&Array.from(n.classList).includes("vue-ui-user-options")||n&&Array.from(n.classList).includes("vue-ui-user-options-summary")||n&&Array.from(n.classList).includes("vue-data-ui-button")||n&&Array.from(n.classList).includes("vue-ui-relation-circle-legend")||(i.value={},c.value=[])}function F(){const t=6.28319/_.value.length,n=360/_.value.length;let l=0,s=0;_.value.forEach((m,x)=>{const ne=v.value*Math.cos(l)+a.value.width/2,ie=v.value*Math.sin(l)+a.value.height/2+r.value.style.circle.offsetY;d.value.push({x:ne,y:ie,...m,color:m.color?m.color:I.value[x]?I.value[x]:o.palette[x],regAngle:s}),l+=t,s+=n})}function N(){d.value.forEach(t=>{d.value.filter(l=>l.relations.includes(t.id)).forEach((l,s)=>{f.value.push({weight:t.weights&&t.weights[s]?t.weights[s]:1,relationId:`${t.id}_${l.id}`,x1:t.x,y1:t.y,x2:l.x,y2:l.y,colorSource:t.color,colorTarget:l.color,...t})})})}const K=e.computed(()=>Math.max(...f.value.map(t=>t.weight)));function Q(t){return Object.hasOwn(i.value,"x")?c.value.includes(t.id)?"opacity:1":"opacity:0.1":"opacity:1"}function L(t){return Object.hasOwn(i.value,"x")?t.colorTarget:t.colorSource}function R(t){return Object.hasOwn(i.value,"x")?c.value.includes(t.id)&&t.relationId===`${t.id}_${i.value.id}`||t.relationId===`${i.value.id}_${t.id}`?`opacity:1;stroke-width:${V(t)}`:"opacity: 0":"opacity: 1"}function Z(t){return t.regAngle>90&&t.regAngle<270?"end":"start"}function ee(t){return t.regAngle>90&&t.regAngle<270?t.x-5:t.x+5}function te(t){return Object.hasOwn(i.value,"x")?i.value.id===t.id||c.value.includes(t.id)?"opacity:1":"opacity:0.2":"opacity:1"}function le(t){return t.regAngle>90&&t.regAngle<270?`rotate(${t.regAngle+180},${t.x},${t.y})`:`rotate(${t.regAngle},${t.x},${t.y})`}function T(t){W.value=360-t.regAngle,i.value.id&&t.id===i.value.id?(i.value={},c.value=[]):(i.value=t,c.value=[...t.relations])}function V(t){return t.weight/K.value*r.value.style.links.maxWidth}const k=e.ref(!1);function re(t){k.value=t,$.value+=1}return U({generatePdf:E,generateImage:A}),(t,n)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"relationCircleChart",ref:y,class:"vue-ui-relation-circle",style:e.normalizeStyle(`width:100%;background:${r.value.style.backgroundColor};text-align:center;${r.value.responsive?"height: 100%":""}`),id:`relation_circle_${g.value}`},[r.value.style.title.text?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"chartTitle",ref:w,style:"width:100%;background:transparent"},[(e.openBlock(),e.createBlock(ae._sfc_main,{key:`title_${B.value}`,config:{title:{cy:"relation-div-title",...r.value.style.title},subtitle:{cy:"relation-div-subtitle",...r.value.style.title.subtitle}}},null,8,["config"]))],512)):e.createCommentVNode("",!0),r.value.userOptions.show&&p.value?(e.openBlock(),e.createBlock(M.UserOptions,{ref:"details",key:`user_options_${$.value}`,backgroundColor:r.value.style.backgroundColor,color:r.value.style.color,isPrinting:e.unref(P),isImaging:e.unref(O),uid:g.value,hasPdf:r.value.userOptions.buttons.pdf,hasImg:r.value.userOptions.buttons.img,hasFullscreen:r.value.userOptions.buttons.img,hasXls:!1,isFullscreen:k.value,titles:{...r.value.userOptions.buttonTitles},chartElement:y.value,position:r.value.userOptions.position,onToggleFullscreen:re,onGeneratePdf:e.unref(E),onGenerateImage:e.unref(A)},e.createSlots({_:2},[t.$slots.optionPdf?{name:"optionPdf",fn:e.withCtx(()=>[e.renderSlot(t.$slots,"optionPdf",{},void 0,!0)]),key:"0"}:void 0,t.$slots.optionImg?{name:"optionImg",fn:e.withCtx(()=>[e.renderSlot(t.$slots,"optionImg",{},void 0,!0)]),key:"1"}:void 0,t.$slots.optionFullscreen?{name:"optionFullscreen",fn:e.withCtx(({toggleFullscreen:l,isFullscreen:s})=>[e.renderSlot(t.$slots,"optionFullscreen",e.normalizeProps(e.guardReactiveProps({toggleFullscreen:l,isFullscreen:s})),void 0,!0)]),key:"2"}:void 0]),1032,["backgroundColor","color","isPrinting","isImaging","uid","hasPdf","hasImg","hasFullscreen","isFullscreen","titles","chartElement","position","onGeneratePdf","onGenerateImage"])):e.createCommentVNode("",!0),p.value?(e.openBlock(),e.createElementBlock("svg",{key:2,xmlns:e.unref(o.XMLNS),class:e.normalizeClass([{"vue-data-ui-fullscreen--on":k.value,"vue-data-ui-fulscreen--off":!k.value},"relation-circle"]),viewBox:`0 0 ${a.value.width<=0?10:a.value.width} ${a.value.height<=0?10:a.value.height}`,width:"100%",style:"user-select:none; background:transparent"},[e.createVNode(oe._sfc_main),e.createElementVNode("circle",{cx:(a.value.width<=0?1e-4:a.value.width)/2,cy:(a.value.height<=0?1e-4:a.value.height)/2+r.value.style.circle.offsetY,r:v.value<=0?1e-4:v.value,stroke:r.value.style.circle.stroke,"stroke-width":r.value.style.circle.strokeWidth,fill:"transparent",class:"main-circle"},null,8,ve),X.value?(e.openBlock(),e.createElementBlock("g",fe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,(l,s)=>(e.openBlock(),e.createElementBlock("path",{key:`relation_${s}`,style:e.normalizeStyle(R(l)),stroke:L(l),class:e.normalizeClass(["relation",{"vue-ui-relation-circle-selected":i.value.hasOwnProperty("id")&&c.value.includes(l.id)}]),d:`M${l.x1},${l.y1} C${l.x1},${l.y1} ${a.value.width/2},${a.value.height/2+r.value.style.circle.offsetY} ${l.x2},${l.y2}`,fill:"none","stroke-width":V(l),"stroke-linecap":"round"},null,14,ge))),128))])):(e.openBlock(),e.createElementBlock("g",me,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,(l,s)=>(e.openBlock(),e.createElementBlock("line",{key:`relation_${s}`,stroke:L(l),style:e.normalizeStyle(R(l)),x1:l.x1,x2:l.x2,y1:l.y1,y2:l.y2,class:e.normalizeClass({"vue-ui-relation-circle-selected":i.value.hasOwnProperty("id")&&c.value.includes(l.id)}),"stroke-linecap":"round"},null,14,ye))),128))])),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,(l,s)=>(e.openBlock(),e.createElementBlock("text",{key:`plot_text_${s}`,"text-anchor":Z(l),transform:le(l),x:ee(l),y:l.y+5,onClick:m=>T(l),class:"vue-ui-relation-circle-legend","transform-origin":"start","font-weight":i.value.id===l.id?"900":"400",style:e.normalizeStyle(`font-family:${r.value.style.fontFamily};${te(l)}`),"font-size":r.value.style.labels.fontSize,fill:r.value.style.labels.color},e.toDisplayString(l.label),13,he))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,(l,s)=>(e.openBlock(),e.createElementBlock("circle",{cx:l.x,cy:l.y,key:`plot_${s}`,style:e.normalizeStyle(Q(l)),class:"vue-ui-relation-circle-plot",fill:r.value.style.plot.color,onClick:m=>T(l),r:r.value.style.plot.radius},null,12,ke))),128)),e.renderSlot(t.$slots,"svg",{svg:a.value},void 0,!0)],10,de)):e.createCommentVNode("",!0),t.$slots.watermark?(e.openBlock(),e.createElementBlock("div",pe,[e.renderSlot(t.$slots,"watermark",e.normalizeProps(e.guardReactiveProps({isPrinting:e.unref(P)||e.unref(O)})),void 0,!0)])):e.createCommentVNode("",!0),p.value?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(se.default,{key:4,config:{type:"relationCircle",style:{backgroundColor:r.value.style.backgroundColor,relationCircle:{color:"#CCCCCC"}}}},null,8,["config"]))],12,ce))}},Ce=ue._export_sfc(_e,[["__scopeId","data-v-0d6438fc"]]);exports.default=Ce;