vue-data-ui 3.2.0 → 3.2.2

package/dist/vue-ui-wheel-BI7-CsXF.js

@@ -1,380 +0,0 @@
-import { defineAsyncComponent as N, computed as y, ref as v, toRefs as Ce, watch as ae, shallowRef as le, onMounted as Ae, onBeforeUnmount as _e, createElementBlock as c, openBlock as s, unref as l, normalizeStyle as R, createBlock as O, createCommentVNode as h, createSlots as Oe, withCtx as b, renderSlot as d, normalizeProps as I, guardReactiveProps as $, normalizeClass as U, createVNode as Ie, Fragment as ne, renderList as oe, toDisplayString as $e } from "vue";
-import { c as xe, t as Pe, o as Se, f as Fe, i as se, n as ze, X as Te, a as Me, q as ue, d as Ne } from "./lib-p5pfHmOX.js";
-import { t as Re, u as Ue } from "./useResponsive-DfdjqQps.js";
-import { u as Be, a as re } from "./useNestedProp-DF7e2h1z.js";
-import { u as Ee } from "./usePrinter-Yeu5jOfm.js";
-import { u as Le } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as Xe } from "./useChartAccessibility-9icAAmYg.js";
-import { t as De } from "./themes-D3cUNuKw.js";
-import Ge from "./Title-pI68ZJsq.js";
-import Ye from "./img-CH7J0fYg.js";
-import { u as je, B as qe } from "./BaseScanner-BgWxam9d.js";
-import { _ as He } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const We = ["id"], Ve = ["xmlns", "viewBox"], Je = ["width", "height"], Ke = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-linecap"], Qe = ["d", "fill"], Ze = ["cx", "cy", "r", "stroke", "stroke-width"], et = { key: 4 }, tt = ["x", "y", "height"], at = ["x", "y", "font-size", "fill", "font-weight"], lt = {
-  key: 4,
-  class: "vue-data-ui-watermark"
-}, nt = {
-  __name: "vue-ui-wheel",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  setup(ie, { expose: ce }) {
-    const ve = N(() => import("./PenAndPaper-CtDMyIvW.js")), he = N(() => import("./UserOptions-Bn3u4JQu.js")), de = N(() => import("./PackageVersion-D242JXMq.js")), { vue_ui_wheel: fe } = Be(), g = ie, ye = y(() => !!g.dataset && Object.keys(g.dataset).length), x = v(xe()), ge = v(null), B = v(0), p = v(null), E = v(null), L = v(null), X = v(null), D = v(0), e = v(F()), { loading: G, FINAL_DATASET: P } = je({
-      ...Ce(g),
-      FINAL_CONFIG: e,
-      prepareConfig: F,
-      skeletonDataset: { percentage: 50 },
-      skeletonConfig: Pe({
-        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: S, setUserOptionsVisibility: Y, keepUserOptionState: j } = Le({ config: e.value }), { svgRef: q } = Xe({ config: e.value.style.chart.title });
-    function F() {
-      const t = re({
-        userConfig: g.config,
-        defaultConfig: fe
-      });
-      return t.theme ? {
-        ...re({
-          userConfig: De.vue_ui_wheel[t.theme] || g.config,
-          defaultConfig: t
-        })
-      } : t;
-    }
-    ae(() => g.config, (t) => {
-      e.value = F(), S.value = !e.value.userOptions.showOnChartHover, Q(), D.value += 1;
-    }, { deep: !0 });
-    const { isPrinting: H, isImaging: W, generatePdf: V, generateImage: J } = Ee({
-      elementId: x.value,
-      fileName: e.value.style.chart.title.text || "vue-ui-wheel",
-      options: e.value.userOptions.print
-    }), pe = y(() => e.value.userOptions.show && !e.value.style.chart.title.text), o = v({
-      size: 360,
-      height: 360,
-      width: 360
-    }), k = v(e.value.style.chart.layout.percentage.fontSize), u = y(() => ({
-      radius: Math.min(o.value.width, o.value.height) * 0.9 / 2,
-      centerX: o.value.width / 2,
-      centerY: o.value.height / 2
-    }));
-    function K(t, n = 1) {
-      return {
-        x: u.value.centerX + u.value.radius * Math.cos(29.85 + t * Math.PI / 180) * n,
-        y: u.value.centerY + u.value.radius * Math.sin(29.85 + t * Math.PI / 180) * n
-      };
-    }
-    const i = v(e.value.style.chart.animation.use ? 0 : P.value.percentage || 0);
-    ae(() => P.value, (t) => {
-      e.value.style.chart.animation.use ? Z(t.percentage) : i.value = t.percentage || 0;
-    }, { deep: !0 });
-    const f = le(null), m = le(null);
-    Ae(() => {
-      Q();
-    });
-    const me = y(() => !!e.value.debug);
-    function Q() {
-      if (Se(g.dataset) && Fe({
-        componentName: "VueUiWheel",
-        type: "dataset",
-        debug: me.value
-      }), e.value.responsive) {
-        const t = Re(() => {
-          const { width: n, height: a } = Ue({
-            chart: p.value,
-            title: e.value.style.chart.title.text ? E.value : null,
-            source: L.value,
-            noTitle: X.value
-          });
-          requestAnimationFrame(() => {
-            o.value.width = n, o.value.height = a, k.value = e.value.style.chart.layout.percentage.fontSize / 360 * Math.min(n, a);
-          });
-        });
-        f.value && (m.value && f.value.unobserve(m.value), f.value.disconnect()), f.value = new ResizeObserver(t), m.value = p.value.parentNode, f.value.observe(m.value);
-      }
-      Z(P.value.percentage || 0);
-    }
-    _e(() => {
-      f.value && (m.value && f.value.unobserve(m.value), f.value.disconnect());
-    });
-    function Z(t) {
-      let n = e.value.style.chart.animation.speed;
-      const a = Math.abs(t - i.value) / (n * 120);
-      function r() {
-        i.value < t ? i.value = Math.min(i.value + a, t) : i.value > t && (i.value = Math.max(i.value - a, t)), i.value !== t && requestAnimationFrame(r);
-      }
-      r();
-    }
-    const w = y(() => Math.max(100, e.value.style.chart.layout.wheel.ticks.quantity)), C = y(() => 100 / w.value), ee = y(() => {
-      const t = [];
-      for (let n = 0; n < w.value; n += 1) {
-        const a = i.value > n * C.value ? e.value.style.chart.layout.wheel.ticks.activeColor : e.value.style.chart.layout.wheel.ticks.inactiveColor, { x: r, y: T } = K(o.value.size / w.value * n), { x: M, y: be } = K(o.value.size / w.value * n, e.value.style.chart.layout.wheel.ticks.sizeRatio);
-        t.push({
-          x1: r,
-          y1: T,
-          x2: M,
-          y2: be,
-          color: e.value.style.chart.layout.wheel.ticks.gradient.show ? se(a, n * C.value / w.value * (e.value.style.chart.layout.wheel.ticks.gradient.shiftHueIntensity / 100)) : a
-        });
-      }
-      return t;
-    }), ke = y(() => ze({ series: ee.value.map((t) => ({
-      name: "",
-      value: 1,
-      color: t.color
-    })) }, u.value.centerX, u.value.centerY, u.value.radius, u.value.radius, 1.99999, 2, 1, 360, 105.25, u.value.radius * (1 - e.value.style.chart.layout.wheel.ticks.sizeRatio))), A = v(!1);
-    function te(t) {
-      A.value = t, B.value += 1;
-    }
-    const _ = v(!1);
-    function z() {
-      _.value = !_.value;
-    }
-    async function we({ scale: t = 2 } = {}) {
-      if (!p.value) return;
-      const { width: n, height: a } = p.value.getBoundingClientRect(), r = n / a, { imageUri: T, base64: M } = await Ye({ domElement: p.value, base64: !0, img: !0, scale: t });
-      return {
-        imageUri: T,
-        base64: M,
-        title: e.value.style.chart.title.text,
-        width: n,
-        height: a,
-        aspectRatio: r
-      };
-    }
-    return ce({
-      getImage: we,
-      generatePdf: V,
-      generateImage: J,
-      toggleAnnotator: z,
-      toggleFullscreen: te
-    }), (t, n) => (s(), c("div", {
-      class: "vue-ui-wheel",
-      ref_key: "wheelChart",
-      ref: p,
-      id: x.value,
-      style: R(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
-      onMouseenter: n[0] || (n[0] = () => l(Y)(!0)),
-      onMouseleave: n[1] || (n[1] = () => l(Y)(!1))
-    }, [
-      e.value.userOptions.buttons.annotator ? (s(), O(l(ve), {
-        key: 0,
-        svgRef: l(q),
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        active: _.value,
-        onClose: z
-      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : h("", !0),
-      pe.value ? (s(), c("div", {
-        key: 1,
-        ref_key: "noTitle",
-        ref: X,
-        class: "vue-data-ui-no-title-space",
-        style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : h("", !0),
-      e.value.style.chart.title.text ? (s(), c("div", {
-        key: 2,
-        ref_key: "chartTitle",
-        ref: E,
-        style: "width:100%;background:transparent;padding-bottom:12px"
-      }, [
-        (s(), O(Ge, {
-          key: `title_${D.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)) : h("", !0),
-      e.value.userOptions.show && ye.value && (l(j) || l(S)) ? (s(), O(l(he), {
-        ref_key: "details",
-        ref: ge,
-        key: `user_options_${B.value}`,
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        isPrinting: l(H),
-        isImaging: l(W),
-        uid: x.value,
-        hasPdf: e.value.userOptions.buttons.pdf,
-        hasImg: e.value.userOptions.buttons.img,
-        hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        hasXls: !1,
-        isFullscreen: A.value,
-        position: e.value.userOptions.position,
-        titles: { ...e.value.userOptions.buttonTitles },
-        hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: _.value,
-        chartElement: p.value,
-        callbacks: e.value.userOptions.callbacks,
-        printScale: e.value.userOptions.print.scale,
-        onToggleFullscreen: te,
-        onGeneratePdf: l(V),
-        onGenerateImage: l(J),
-        onToggleAnnotator: z,
-        style: R({
-          visibility: l(j) ? l(S) ? "visible" : "hidden" : "visible"
-        })
-      }, Oe({ _: 2 }, [
-        t.$slots.menuIcon ? {
-          name: "menuIcon",
-          fn: b(({ isOpen: a, color: r }) => [
-            d(t.$slots, "menuIcon", I($({ isOpen: a, color: r })), void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        t.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: b(() => [
-            d(t.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        t.$slots.optionImg ? {
-          name: "optionImg",
-          fn: b(() => [
-            d(t.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        t.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: b(({ toggleFullscreen: a, isFullscreen: r }) => [
-            d(t.$slots, "optionFullscreen", I($({ toggleFullscreen: a, isFullscreen: r })), void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        t.$slots.optionAnnotator ? {
-          name: "optionAnnotator",
-          fn: b(({ toggleAnnotator: a, isAnnotator: r }) => [
-            d(t.$slots, "optionAnnotator", I($({ toggleAnnotator: a, isAnnotator: r })), 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"])) : h("", !0),
-      (s(), c("svg", {
-        ref_key: "svgRef",
-        ref: q,
-        xmlns: l(Te),
-        class: U({ "vue-data-ui-fullscreen--on": A.value, "vue-data-ui-fulscreen--off": !A.value }),
-        viewBox: `0 0 ${o.value.width <= 0 ? 10 : o.value.width} ${o.value.height <= 0 ? 10 : o.value.height}`,
-        style: R(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
-      }, [
-        Ie(l(de)),
-        t.$slots["chart-background"] ? (s(), c("foreignObject", {
-          key: 0,
-          x: 0,
-          y: 0,
-          width: o.value.width <= 0 ? 10 : o.value.width,
-          height: o.value.height <= 0 ? 10 : o.value.height,
-          style: {
-            pointerEvents: "none"
-          }
-        }, [
-          d(t.$slots, "chart-background", {}, void 0, !0)
-        ], 8, Je)) : h("", !0),
-        e.value.style.chart.layout.wheel.ticks.type === "classic" ? (s(!0), c(ne, { key: 1 }, oe(ee.value, (a, r) => (s(), c("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(o.value.width, o.value.height),
-          "stroke-linecap": e.value.style.chart.layout.wheel.ticks.rounded ? "round" : "butt",
-          class: U({ "vue-ui-tick-animated": e.value.style.chart.animation.use && r * C.value <= i.value })
-        }, null, 10, Ke))), 256)) : (s(!0), c(ne, { key: 2 }, oe(ke.value, (a, r) => (s(), c("path", {
-          d: a.arcSlice,
-          fill: a.color,
-          class: U({ "vue-ui-tick-animated": e.value.style.chart.animation.use && r * C.value <= i.value })
-        }, null, 10, Qe))), 256)),
-        e.value.style.chart.layout.innerCircle.show ? (s(), c("circle", {
-          key: 3,
-          cx: u.value.centerX,
-          cy: u.value.centerY,
-          r: u.value.radius * 0.8 <= 0 ? 1e-4 : u.value.radius * 0.8,
-          stroke: e.value.style.chart.layout.innerCircle.stroke,
-          "stroke-width": e.value.style.chart.layout.innerCircle.strokeWidth,
-          fill: "none"
-        }, null, 8, Ze)) : h("", !0),
-        e.value.style.chart.layout.percentage.show ? (s(), c("g", et, [
-          l(G) ? (s(), c("rect", {
-            key: 0,
-            x: u.value.centerX - 40,
-            y: u.value.centerY - k.value / 2,
-            width: 80,
-            height: k.value,
-            fill: "#6A6A6A80",
-            rx: "3"
-          }, null, 8, tt)) : (s(), c("text", {
-            key: 1,
-            x: u.value.centerX,
-            y: u.value.centerY + k.value / 3,
-            "font-size": k.value,
-            fill: e.value.style.chart.layout.wheel.ticks.gradient.show ? l(se)(e.value.style.chart.layout.wheel.ticks.activeColor, i.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" }
-          }, $e(l(Me)(
-            e.value.style.chart.layout.percentage.formatter,
-            l(ue)(i.value),
-            l(Ne)({
-              v: l(ue)(i.value),
-              s: "%",
-              r: e.value.style.chart.layout.percentage.rounding
-            })
-          )), 9, at))
-        ])) : h("", !0),
-        d(t.$slots, "svg", { svg: o.value }, void 0, !0)
-      ], 14, Ve)),
-      t.$slots.watermark ? (s(), c("div", lt, [
-        d(t.$slots, "watermark", I($({ isPrinting: l(H) || l(W) })), void 0, !0)
-      ])) : h("", !0),
-      t.$slots.source ? (s(), c("div", {
-        key: 5,
-        ref_key: "source",
-        ref: L,
-        dir: "auto"
-      }, [
-        d(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : h("", !0),
-      l(G) ? (s(), O(qe, { key: 6 })) : h("", !0)
-    ], 44, We));
-  }
-}, pt = /* @__PURE__ */ He(nt, [["__scopeId", "data-v-11683b00"]]);
-export {
-  pt as default
-};