vue-data-ui 3.6.0 → 3.7.0

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

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