vue-data-ui 3.2.1 → 3.2.3

package/dist/vue-ui-wheel-DfNXrsTY.js

@@ -1,587 +0,0 @@
-import { useCssVars as wt, computed as g, defineAsyncComponent as ve, ref as b, toRefs as bt, watch as We, shallowRef as Xe, onMounted as xt, onBeforeUnmount as Ct, createElementBlock as r, openBlock as n, unref as c, normalizeStyle as de, normalizeClass as W, createBlock as te, createCommentVNode as A, createSlots as Mt, withCtx as G, renderSlot as _, normalizeProps as ae, guardReactiveProps as le, createVNode as At, Fragment as X, renderList as H, toDisplayString as $t } from "vue";
-import { c as _t, t as It, o as Rt, f as zt, i as q, n as St, X as Pt, a as Ot, q as Ne, d as Dt } from "./lib-p5pfHmOX.js";
-import { t as Ft, u as Tt } from "./useResponsive-DfdjqQps.js";
-import { u as Wt, a as Le } from "./useNestedProp-7BbqoAYu.js";
-import { u as Xt } from "./usePrinter-Yeu5jOfm.js";
-import { u as Nt } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as Lt } from "./useChartAccessibility-9icAAmYg.js";
-import { t as Yt } from "./themes-D3cUNuKw.js";
-import Bt from "./Title-BIaVNiUQ.js";
-import Ut from "./img-CH7J0fYg.js";
-import { u as Et, B as jt } from "./BaseScanner-BgWxam9d.js";
-import { _ as Gt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Ht = ["id"], qt = ["xmlns", "viewBox"], Vt = ["x", "y", "width", "height"], Zt = { key: 0 }, Jt = ["x1", "y1", "x2", "y2", "stroke", "stroke-width", "stroke-linecap"], Kt = { key: 1 }, Qt = ["d", "fill", "stroke", "stroke-width"], ea = ["d", "fill", "stroke", "stroke-width"], ta = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-linecap"], aa = ["d", "fill", "stroke", "stroke-width"], la = ["d", "stroke", "stroke-width"], sa = ["cx", "cy", "r", "stroke", "stroke-width"], oa = { key: 5 }, na = ["x", "y", "height"], ua = ["x", "y", "font-size", "fill", "font-weight", "stroke", "stroke-width"], ia = {
-  key: 4,
-  class: "vue-data-ui-watermark"
-}, ra = {
-  __name: "vue-ui-wheel",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  setup(Ye, { expose: Be }) {
-    wt((t) => ({
-      f3b568d0: lt.value,
-      "083efa04": st.value,
-      "083f34de": ot.value
-    }));
-    const Ue = ve(() => import("./PenAndPaper-CtDMyIvW.js")), Ee = ve(() => import("./UserOptions-Bn3u4JQu.js")), je = ve(() => import("./PackageVersion-BB7joYAK.js")), { vue_ui_wheel: Ge } = Wt(), P = Ye, He = g(() => !!P.dataset && Object.keys(P.dataset).length), se = b(_t()), qe = b(null), ye = b(0), O = b(null), ke = b(null), fe = b(null), pe = b(null), ge = b(0), e = b(ue()), { loading: me, FINAL_DATASET: oe } = Et({
-      ...bt(P),
-      FINAL_CONFIG: e,
-      prepareConfig: ue,
-      skeletonDataset: { percentage: 50 },
-      skeletonConfig: It({
-        defaultConfig: e.value,
-        userConfig: {
-          userOptions: { show: !1 },
-          style: {
-            chart: {
-              backgroundColor: "#99999930",
-              animation: { use: !1 },
-              layout: {
-                wheel: {
-                  ticks: {
-                    activeColor: "#6A6A6A80",
-                    inactiveColor: "#CACACA80"
-                  }
-                },
-                innerCircle: {
-                  stroke: "#CACACA80"
-                }
-              }
-            }
-          }
-        }
-      })
-    }), { userOptionsVisible: ne, setUserOptionsVisibility: we, keepUserOptionState: be } = Nt({ config: e.value }), { svgRef: xe } = Lt({ config: e.value.style.chart.title });
-    function ue() {
-      const t = Le({
-        userConfig: P.config,
-        defaultConfig: Ge
-      });
-      return t.theme ? {
-        ...Le({
-          userConfig: Yt.vue_ui_wheel[t.theme] || P.config,
-          defaultConfig: t
-        })
-      } : t;
-    }
-    We(() => P.config, (t) => {
-      e.value = ue(), ne.value = !e.value.userOptions.showOnChartHover, Ie(), ge.value += 1;
-    }, { deep: !0 });
-    const { isPrinting: Ce, isImaging: Me, generatePdf: Ae, generateImage: $e } = Xt({
-      elementId: se.value,
-      fileName: e.value.style.chart.title.text || "vue-ui-wheel",
-      options: e.value.userOptions.print
-    }), Ve = g(() => e.value.userOptions.show && !e.value.style.chart.title.text), u = b({
-      size: 360,
-      height: 360,
-      width: 360
-    }), B = b(e.value.style.chart.layout.percentage.fontSize), i = g(() => ({
-      radius: Math.min(u.value.width, u.value.height) * 0.9 / 2 * e.value.style.chart.layout.wheel.radiusRatio,
-      centerX: u.value.width / 2,
-      centerY: u.value.height / 2
-    }));
-    function _e(t, l = 1) {
-      return {
-        x: i.value.centerX + i.value.radius * Math.cos(29.85 + t * Math.PI / 180) * l,
-        y: i.value.centerY + i.value.radius * Math.sin(29.85 + t * Math.PI / 180) * l
-      };
-    }
-    const d = b(e.value.style.chart.animation.use ? 0 : oe.value.percentage || 0);
-    We(() => oe.value, (t) => {
-      e.value.style.chart.animation.use ? Oe(t.percentage) : d.value = t.percentage || 0;
-    }, { deep: !0 });
-    const I = Xe(null), N = Xe(null);
-    xt(() => {
-      Ie();
-    });
-    const Ze = g(() => !!e.value.debug);
-    function Ie() {
-      if (Rt(P.dataset) && zt({
-        componentName: "VueUiWheel",
-        type: "dataset",
-        debug: Ze.value
-      }), e.value.responsive) {
-        const t = Ft(() => {
-          const { width: l, height: a } = Tt({
-            chart: O.value,
-            title: e.value.style.chart.title.text ? ke.value : null,
-            source: fe.value,
-            noTitle: pe.value
-          });
-          requestAnimationFrame(() => {
-            u.value.width = l, u.value.height = a, B.value = e.value.style.chart.layout.percentage.fontSize / 360 * Math.min(l, a);
-          });
-        });
-        I.value && (N.value && I.value.unobserve(N.value), I.value.disconnect()), I.value = new ResizeObserver(t), N.value = O.value.parentNode, I.value.observe(N.value);
-      }
-      Oe(oe.value.percentage || 0);
-    }
-    Ct(() => {
-      I.value && (N.value && I.value.unobserve(N.value), I.value.disconnect());
-    });
-    function V([t, l, a], s) {
-      const o = Math.cos(s), h = Math.sin(s);
-      return [t, l * o - a * h, l * h + a * o];
-    }
-    function Z([t, l, a], s) {
-      const o = s / (s - a);
-      return [t * o, l * o, a, o];
-    }
-    function Re(t, l) {
-      const a = t.replace("#", ""), s = parseInt(a.substring(0, 2), 16), o = parseInt(a.substring(2, 4), 16), h = parseInt(a.substring(4, 6), 16), y = 1 - Math.min(1, Math.max(0, e.value.style.chart.layout.wheel.ticks.shadeColorRatio3d)) * l, v = Math.max(0, Math.min(255, Math.round(s * y))), p = Math.max(0, Math.min(255, Math.round(o * y))), x = Math.max(0, Math.min(255, Math.round(h * y)));
-      return `#${v.toString(16).padStart(2, "0")}${p.toString(16).padStart(2, "0")}${x.toString(16).padStart(2, "0")}`;
-    }
-    function Je({
-      cx: t,
-      cy: l,
-      radius: a,
-      innerRatio: s = 0.8,
-      count: o = 120,
-      startDeg: h = 0,
-      axDeg: m = 50,
-      // tilt angle (bigger = more perspective)
-      f: y = 520,
-      // focal length (smaller = stronger perspective)
-      baseStroke: v = 5,
-      activeColor: p,
-      inactiveColor: x,
-      getActive: C
-    }) {
-      const k = m * Math.PI / 180, M = a, D = a * s, $ = [];
-      for (let f = 0; f < o; f += 1) {
-        const w = (f / o * 360 + h) * Math.PI / 180, L = t + M * Math.cos(w), F = l + M * Math.sin(w), T = t + D * Math.cos(w), U = l + D * Math.sin(w), E = [L - t, F - l, 0], ee = [T - t, U - l, 0], [Te, re, j] = V(E, k), [ce, he, Y] = V(ee, k), [nt, ut, , it] = Z([Te, re, j], y), [rt, ct, , ca] = Z([ce, he, Y], y), ht = t + nt, vt = l + ut, dt = t + rt, yt = l + ct, kt = (Math.max(j, Y) - -M * Math.sin(k)) / (2 * M * Math.sin(k) || 1), ft = C ? C(f) : !0, pt = e.value.style.chart.layout.wheel.ticks.gradient.show ? q(p, f * S.value / z.value * (e.value.style.chart.layout.wheel.ticks.gradient.shiftHueIntensity / 100)) : p, gt = Re(ft ? pt : x, kt), mt = Math.max(1.25, v * it * (Math.min(u.value.width, u.value.height) / 360));
-        $.push({ i: f, x1: ht, y1: vt, x2: dt, y2: yt, stroke: mt, color: gt, z: Math.max(j, Y) });
-      }
-      return $.sort((f, w) => f.z - w.z), $;
-    }
-    const Ke = g(() => {
-      if (!e.value.layout === "3d") return null;
-      const t = z.value, l = e.value.style.chart.layout.wheel.ticks.gradient.show ? q(e.value.style.chart.layout.wheel.ticks.activeColor, 0) : e.value.style.chart.layout.wheel.ticks.activeColor, a = e.value.style.chart.layout.wheel.ticks.inactiveColor, s = e.value.style.chart.layout.wheel.ticks.strokeWidth;
-      return Je({
-        cx: i.value.centerX,
-        cy: i.value.centerY,
-        radius: i.value.radius,
-        innerRatio: e.value.style.chart.layout.wheel.ticks.sizeRatio,
-        count: t,
-        startDeg: -90,
-        axDeg: e.value.style.chart.layout.wheel.tiltAngle3d,
-        f: Math.min(u.value.width, u.value.height) * 1.45,
-        baseStroke: s,
-        activeColor: l,
-        inactiveColor: a,
-        getActive: (o) => d.value > o * S.value
-      });
-    });
-    function ze({ cx: t, cy: l, r: a, count: s = 180, startDeg: o = -90, axDeg: h = 50, f: m }) {
-      const y = h * Math.PI / 180, v = [];
-      let p = 0;
-      for (let k = 0; k < s; k += 1) {
-        const M = (k / s * 360 + o) * Math.PI / 180, D = [a * Math.cos(M), a * Math.sin(M), 0], [$, f, w] = V(D, y), [L, F, , T] = Z([$, f, w], m);
-        p += T, v.push([t + L, l + F]);
-      }
-      let x = `M ${v[0][0]} ${v[0][1]}`;
-      for (let k = 1; k < v.length; k += 1)
-        x += ` L ${v[k][0]} ${v[k][1]}`;
-      x += " Z";
-      const C = p / s;
-      return { d: x, avgScale: C, pts: v };
-    }
-    const R = g(() => {
-      if (e.value.layout !== "3d") return null;
-      const t = Math.min(u.value.width, u.value.height) * 1.45, l = e.value.style.chart.layout.wheel.tiltAngle3d, a = i.value.radius, { pts: s } = ze({
-        cx: i.value.centerX,
-        cy: i.value.centerY,
-        r: a,
-        startDeg: -90,
-        axDeg: l,
-        f: t
-      });
-      let o = 1 / 0, h = 1 / 0, m = -1 / 0, y = -1 / 0;
-      for (const [v, p] of s)
-        v < o && (o = v), p < h && (h = p), v > m && (m = v), p > y && (y = p);
-      return {
-        x: o,
-        y: h,
-        w: m - o,
-        h: y - h
-      };
-    });
-    function Qe(t) {
-      const l = Math.min(u.value.width, u.value.height) * 1.45, { d: a, avgScale: s } = ze({
-        cx: i.value.centerX,
-        cy: i.value.centerY,
-        r: t,
-        startDeg: -90,
-        axDeg: e.value.style.chart.layout.wheel.tiltAngle3d,
-        f: l
-      }), h = (e.value.style.chart.layout.innerCircle.strokeWidth || 1) * s;
-      return {
-        d: a,
-        stroke: e.value.style.chart.layout.innerCircle.stroke,
-        strokeWidth: h
-      };
-    }
-    const Se = g(() => Qe(Math.max(0, i.value.radius * 0.8 * e.value.style.chart.layout.innerCircle.radiusRatio)));
-    function J({ cx: t, cy: l, r: a, aRad: s, ax: o, f: h }) {
-      const m = [a * Math.cos(s), a * Math.sin(s), 0], [y, v, p] = V(m, o), [x, C, , k] = Z([y, v, p], h);
-      return { x: t + x, y: l + C, z: p, s: k };
-    }
-    function et({
-      cx: t,
-      cy: l,
-      radius: a,
-      innerRatio: s = 0.8,
-      count: o = 120,
-      startDeg: h = -87,
-      axDeg: m = 45,
-      f: y = 600,
-      activeColor: v,
-      inactiveColor: p,
-      getActive: x
-    }) {
-      const C = m * Math.PI / 180, k = a, M = a * s, D = 2 * Math.PI / o, $ = [];
-      for (let f = 0; f < o; f += 1) {
-        const w = h * Math.PI / 180 + D * f, L = w + D * Math.min(1, e.value.style.chart.layout.wheel.ticks.spacingRatio3d), F = J({ cx: t, cy: l, r: k, aRad: w, ax: C, f: y }), T = J({ cx: t, cy: l, r: k, aRad: L, ax: C, f: y }), U = J({ cx: t, cy: l, r: M, aRad: L, ax: C, f: y }), E = J({ cx: t, cy: l, r: M, aRad: w, ax: C, f: y }), ee = (F.z + T.z + E.z + U.z) / 4, re = (x ? x(f) : !0) ? e.value.style.chart.layout.wheel.ticks.gradient.show ? q(
-          e.value.style.chart.layout.wheel.ticks.activeColor,
-          f * (100 / o) / 100 * (e.value.style.chart.layout.wheel.ticks.gradient.shiftHueIntensity / 100)
-        ) : v : p, j = (() => {
-          const Y = k * Math.sin(C) || 1;
-          return (ee - -Y) / (2 * Y);
-        })(), ce = Re(re, j), he = `M ${F.x} ${F.y} L ${T.x} ${T.y} L ${U.x} ${U.y} L ${E.x} ${E.y} Z`;
-        $.push({ i: f, d: he, fill: ce, z: ee });
-      }
-      return $.sort((f, w) => f.z - w.z), $;
-    }
-    const Pe = g(() => {
-      if (e.value.layout !== "3d") return null;
-      const t = z.value;
-      return et({
-        cx: i.value.centerX,
-        cy: i.value.centerY,
-        radius: i.value.radius,
-        innerRatio: e.value.style.chart.layout.wheel.ticks.sizeRatio,
-        count: t,
-        startDeg: -90,
-        axDeg: e.value.style.chart.layout.wheel.tiltAngle3d,
-        f: Math.min(u.value.width, u.value.height) * 1.45,
-        activeColor: e.value.style.chart.layout.wheel.ticks.activeColor,
-        inactiveColor: e.value.style.chart.layout.wheel.ticks.inactiveColor,
-        getActive: (l) => d.value > l * (100 / t)
-      });
-    });
-    function Oe(t) {
-      let l = e.value.style.chart.animation.speed;
-      const a = Math.abs(t - d.value) / (l * 120);
-      function s() {
-        d.value < t ? d.value = Math.min(d.value + a, t) : d.value > t && (d.value = Math.max(d.value - a, t)), d.value !== t && requestAnimationFrame(s);
-      }
-      s();
-    }
-    const z = g(() => (e.value.debug && e.value.style.chart.layout.wheel.ticks.quantity < 12 && console.warn("VueUiWheel - The minimal number of ticks is 12"), Math.max(12, e.value.style.chart.layout.wheel.ticks.quantity))), S = g(() => 100 / z.value), De = g(() => {
-      const t = [];
-      for (let l = 0; l < z.value; l += 1) {
-        const a = d.value > l * S.value ? e.value.style.chart.layout.wheel.ticks.activeColor : e.value.style.chart.layout.wheel.ticks.inactiveColor, { x: s, y: o } = _e(u.value.size / z.value * l), { x: h, y: m } = _e(u.value.size / z.value * l, e.value.style.chart.layout.wheel.ticks.sizeRatio);
-        t.push({
-          x1: s,
-          y1: o,
-          x2: h,
-          y2: m,
-          color: e.value.style.chart.layout.wheel.ticks.gradient.show ? q(a, l * S.value / z.value * (e.value.style.chart.layout.wheel.ticks.gradient.shiftHueIntensity / 100)) : a
-        });
-      }
-      return t;
-    }), tt = g(() => St({ series: De.value.map((t) => ({
-      name: "",
-      value: 1,
-      color: t.color
-    })) }, i.value.centerX, i.value.centerY, i.value.radius, i.value.radius, 1.99999, 2, 1, 360, 105.25, i.value.radius * (1 - e.value.style.chart.layout.wheel.ticks.sizeRatio))), K = b(!1);
-    function Fe(t) {
-      K.value = t, ye.value += 1;
-    }
-    const Q = b(!1);
-    function ie() {
-      Q.value = !Q.value;
-    }
-    async function at({ scale: t = 2 } = {}) {
-      if (!O.value) return;
-      const { width: l, height: a } = O.value.getBoundingClientRect(), s = l / a, { imageUri: o, base64: h } = await Ut({ domElement: O.value, base64: !0, img: !0, scale: t });
-      return {
-        imageUri: o,
-        base64: h,
-        title: e.value.style.chart.title.text,
-        width: l,
-        height: a,
-        aspectRatio: s
-      };
-    }
-    const lt = g(() => e.value.style.chart.layout.wheel.ticks.strokeWidth * 2), st = g(() => e.value.style.chart.layout.wheel.ticks.strokeWidth * 2 * 0.75), ot = g(() => e.value.style.chart.layout.wheel.ticks.strokeWidth);
-    return Be({
-      getImage: at,
-      generatePdf: Ae,
-      generateImage: $e,
-      toggleAnnotator: ie,
-      toggleFullscreen: Fe
-    }), (t, l) => (n(), r("div", {
-      class: W(["vue-ui-wheel", { "vue-ui-wheel-3d-wrap": e.value.layout === "3d" }]),
-      ref_key: "wheelChart",
-      ref: O,
-      id: se.value,
-      style: de(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
-      onMouseenter: l[0] || (l[0] = () => c(we)(!0)),
-      onMouseleave: l[1] || (l[1] = () => c(we)(!1))
-    }, [
-      e.value.userOptions.buttons.annotator ? (n(), te(c(Ue), {
-        key: 0,
-        svgRef: c(xe),
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        active: Q.value,
-        onClose: ie
-      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : A("", !0),
-      Ve.value ? (n(), r("div", {
-        key: 1,
-        ref_key: "noTitle",
-        ref: pe,
-        class: "vue-data-ui-no-title-space",
-        style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : A("", !0),
-      e.value.style.chart.title.text ? (n(), r("div", {
-        key: 2,
-        ref_key: "chartTitle",
-        ref: ke,
-        style: "width:100%;background:transparent;padding-bottom:12px"
-      }, [
-        (n(), te(Bt, {
-          key: `title_${ge.value}`,
-          config: {
-            title: {
-              cy: "wheel-title",
-              ...e.value.style.chart.title
-            },
-            subtitle: {
-              cy: "wheel-subtitle",
-              ...e.value.style.chart.title.subtitle
-            }
-          }
-        }, null, 8, ["config"]))
-      ], 512)) : A("", !0),
-      e.value.userOptions.show && He.value && (c(be) || c(ne)) ? (n(), te(c(Ee), {
-        ref_key: "details",
-        ref: qe,
-        key: `user_options_${ye.value}`,
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        isPrinting: c(Ce),
-        isImaging: c(Me),
-        uid: se.value,
-        hasPdf: e.value.userOptions.buttons.pdf,
-        hasImg: e.value.userOptions.buttons.img,
-        hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        hasXls: !1,
-        isFullscreen: K.value,
-        position: e.value.userOptions.position,
-        titles: { ...e.value.userOptions.buttonTitles },
-        hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: Q.value,
-        chartElement: O.value,
-        callbacks: e.value.userOptions.callbacks,
-        printScale: e.value.userOptions.print.scale,
-        onToggleFullscreen: Fe,
-        onGeneratePdf: c(Ae),
-        onGenerateImage: c($e),
-        onToggleAnnotator: ie,
-        style: de({
-          visibility: c(be) ? c(ne) ? "visible" : "hidden" : "visible"
-        })
-      }, Mt({ _: 2 }, [
-        t.$slots.menuIcon ? {
-          name: "menuIcon",
-          fn: G(({ isOpen: a, color: s }) => [
-            _(t.$slots, "menuIcon", ae(le({ isOpen: a, color: s })), void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        t.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: G(() => [
-            _(t.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        t.$slots.optionImg ? {
-          name: "optionImg",
-          fn: G(() => [
-            _(t.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        t.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: G(({ toggleFullscreen: a, isFullscreen: s }) => [
-            _(t.$slots, "optionFullscreen", ae(le({ toggleFullscreen: a, isFullscreen: s })), void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        t.$slots.optionAnnotator ? {
-          name: "optionAnnotator",
-          fn: G(({ toggleAnnotator: a, isAnnotator: s }) => [
-            _(t.$slots, "optionAnnotator", ae(le({ toggleAnnotator: a, isAnnotator: s })), void 0, !0)
-          ]),
-          key: "4"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasImg", "hasFullscreen", "isFullscreen", "position", "titles", "hasAnnotator", "isAnnotation", "chartElement", "callbacks", "printScale", "onGeneratePdf", "onGenerateImage", "style"])) : A("", !0),
-      (n(), r("svg", {
-        ref_key: "svgRef",
-        ref: xe,
-        xmlns: c(Pt),
-        class: W({ "vue-data-ui-fullscreen--on": K.value, "vue-data-ui-fulscreen--off": !K.value, "vue-ui-wheel-3d-svg": e.value.layout === "3d" }),
-        viewBox: e.value.layout === "3d" && !e.value.responsive ? `${R.value?.x - 10} ${R.value?.y ?? 0} ${R.value?.w + 20} ${R.value?.h ?? Math.max(10, u.value.height)}` : `0 0 ${Math.max(10, u.value.width)} ${Math.max(10, u.value.height)}`,
-        style: de(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
-      }, [
-        At(c(je)),
-        t.$slots["chart-background"] ? (n(), r("foreignObject", {
-          key: 0,
-          x: e.value.layout === "3d" && !e.value.responsive ? R.value?.x - 10 : 0,
-          y: e.value.layout === "3d" && !e.value.responsive ? R.value?.y ?? 0 : 0,
-          width: e.value.layout === "3d" && !e.value.responsive ? R.value?.w + 20 : Math.max(10, u.value.width),
-          height: e.value.layout === "3d" && !e.value.responsive ? R.value?.h ?? Math.max(10, u.value.height) : Math.max(10, u.value.height),
-          style: {
-            pointerEvents: "none"
-          }
-        }, [
-          _(t.$slots, "chart-background", {}, void 0, !0)
-        ], 8, Vt)) : A("", !0),
-        e.value.layout === "3d" ? (n(), r(X, { key: 1 }, [
-          e.value.style.chart.layout.wheel.ticks.type === "classic" ? (n(), r("g", Zt, [
-            (n(!0), r(X, null, H(Ke.value || [], (a) => (n(), r("line", {
-              key: a.i,
-              x1: a.x1,
-              y1: a.y1,
-              x2: a.x2,
-              y2: a.y2,
-              stroke: a.color,
-              "stroke-width": e.value.style.chart.layout.wheel.ticks.strokeWidth / 360 * Math.min(u.value.width, u.value.height),
-              "stroke-linecap": e.value.style.chart.layout.wheel.ticks.rounded ? "round" : "butt",
-              class: W({ "vue-ui-wheel-tick": !0, "vue-ui-tick-animated": e.value.style.chart.animation.use && a.i * S.value <= d.value })
-            }, null, 10, Jt))), 128))
-          ])) : (n(), r("g", Kt, [
-            (n(!0), r(X, null, H(Pe.value || [], (a) => (n(), r("path", {
-              key: a.i,
-              d: a.d,
-              fill: e.value.style.chart.layout.wheel.ticks.inactiveColor,
-              stroke: e.value.style.chart.layout.wheel.ticks.stroke,
-              "stroke-width": e.value.style.chart.layout.wheel.ticks.strokeWidth,
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              class: "vue-ui-wheel-tick"
-            }, null, 8, Qt))), 128)),
-            (n(!0), r(X, null, H(Pe.value || [], (a) => (n(), r("path", {
-              key: a.i,
-              d: a.d,
-              fill: a.fill,
-              stroke: e.value.style.chart.layout.wheel.ticks.stroke,
-              "stroke-width": e.value.style.chart.layout.wheel.ticks.strokeWidth,
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              class: W({ "vue-ui-wheel-tick": !0, "vue-ui-tick-animated-3d": e.value.style.chart.animation.use && a.i * S.value <= d.value })
-            }, null, 10, ea))), 128))
-          ]))
-        ], 64)) : (n(), r(X, { key: 2 }, [
-          e.value.style.chart.layout.wheel.ticks.type === "classic" ? (n(!0), r(X, { key: 0 }, H(De.value, (a, s) => (n(), r("line", {
-            x1: a.x1,
-            x2: a.x2,
-            y1: a.y1,
-            y2: a.y2,
-            stroke: a.color,
-            "stroke-width": e.value.style.chart.layout.wheel.ticks.strokeWidth / 360 * Math.min(u.value.width, u.value.height),
-            "stroke-linecap": e.value.style.chart.layout.wheel.ticks.rounded ? "round" : "butt",
-            class: W({ "vue-ui-wheel-tick": !0, "vue-ui-tick-animated": e.value.style.chart.animation.use && s * S.value <= d.value })
-          }, null, 10, ta))), 256)) : (n(!0), r(X, { key: 1 }, H(tt.value, (a, s) => (n(), r("path", {
-            d: a.arcSlice,
-            fill: a.color,
-            class: W({ "vue-ui-wheel-tick": !0, "vue-ui-tick-animated": e.value.style.chart.animation.use && s * S.value <= d.value }),
-            stroke: e.value.style.chart.layout.wheel.ticks.stroke,
-            "stroke-width": e.value.style.chart.layout.wheel.ticks.strokeWidth
-          }, null, 10, aa))), 256))
-        ], 64)),
-        e.value.layout === "3d" && Se.value ? (n(), r("path", {
-          key: 3,
-          class: "vue-ui-wheel-inner-circle",
-          d: Se.value.d,
-          stroke: e.value.style.chart.layout.innerCircle.stroke,
-          "stroke-width": e.value.style.chart.layout.innerCircle.strokeWidth,
-          fill: "none"
-        }, null, 8, la)) : e.value.style.chart.layout.innerCircle.show ? (n(), r("circle", {
-          key: 4,
-          class: "vue-ui-wheel-inner-circle",
-          cx: i.value.centerX,
-          cy: i.value.centerY,
-          r: Math.max(0, i.value.radius * e.value.style.chart.layout.innerCircle.radiusRatio * 0.8),
-          stroke: e.value.style.chart.layout.innerCircle.stroke,
-          "stroke-width": e.value.style.chart.layout.innerCircle.strokeWidth,
-          fill: "none"
-        }, null, 8, sa)) : A("", !0),
-        e.value.style.chart.layout.percentage.show ? (n(), r("g", oa, [
-          c(me) ? (n(), r("rect", {
-            key: 0,
-            x: i.value.centerX - 40,
-            y: i.value.centerY - B.value / 2,
-            width: 80,
-            height: B.value,
-            fill: "#6A6A6A80",
-            rx: "3"
-          }, null, 8, na)) : (n(), r("text", {
-            key: 1,
-            x: i.value.centerX + e.value.style.chart.layout.percentage.offsetX,
-            y: i.value.centerY + B.value / 3 + e.value.style.chart.layout.percentage.offsetY,
-            "font-size": B.value,
-            fill: e.value.style.chart.layout.wheel.ticks.gradient.show ? c(q)(e.value.style.chart.layout.wheel.ticks.activeColor, d.value / 100 * (e.value.style.chart.layout.wheel.ticks.gradient.shiftHueIntensity / 100)) : e.value.style.chart.layout.wheel.ticks.activeColor,
-            "text-anchor": "middle",
-            "font-weight": e.value.style.chart.layout.percentage.bold ? "bold" : "normal",
-            style: { "font-variant-numeric": "tabluar-nums" },
-            stroke: e.value.style.chart.layout.percentage.stroke,
-            "stroke-width": e.value.style.chart.layout.percentage.strokeWidth,
-            "paint-order": "stroke fill",
-            class: W({ "vue-ui-wheel-label": e.value.layout === "3d" })
-          }, $t(c(Ot)(
-            e.value.style.chart.layout.percentage.formatter,
-            c(Ne)(d.value),
-            c(Dt)({
-              v: c(Ne)(d.value),
-              s: "%",
-              r: e.value.style.chart.layout.percentage.rounding
-            })
-          )), 11, ua))
-        ])) : A("", !0),
-        _(t.$slots, "svg", { svg: u.value }, void 0, !0)
-      ], 14, qt)),
-      t.$slots.watermark ? (n(), r("div", ia, [
-        _(t.$slots, "watermark", ae(le({ isPrinting: c(Ce) || c(Me) })), void 0, !0)
-      ])) : A("", !0),
-      t.$slots.source ? (n(), r("div", {
-        key: 5,
-        ref_key: "source",
-        ref: fe,
-        dir: "auto"
-      }, [
-        _(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : A("", !0),
-      c(me) ? (n(), te(jt, { key: 6 })) : A("", !0)
-    ], 46, Ht));
-  }
-}, Ma = /* @__PURE__ */ Gt(ra, [["__scopeId", "data-v-58a3fb91"]]);
-export {
-  Ma as default
-};