vue-data-ui 2.3.74 → 2.3.75

package/dist/{vue-ui-gizmo-D2RfM55X.js → vue-ui-gizmo-bV148qAf.js}

@@ -1,12 +1,12 @@
-import { ref as p, onMounted as x, computed as d, openBlock as s, createElementBlock as a, normalizeStyle as w, createElementVNode as t, createCommentVNode as r, Fragment as _, toDisplayString as v, unref as u } from "vue";
-import { u as C, c as z, e as G, i as y, f as g } from "./index-C8SH0f2u.js";
-import { u as L } from "./useNestedProp-lS_T5lM3.js";
-const b = ["viewBox", "width"], N = { key: 0 }, $ = ["id"], F = ["stop-color"], B = ["stop-color"], P = ["stroke"], D = ["stroke"], I = ["width", "fill"], M = ["fill"], U = { key: 0 }, V = ["id"], E = /* @__PURE__ */ t("feGaussianBlur", {
+import { ref as x, onMounted as C, computed as c, watch as z, openBlock as a, createElementBlock as s, normalizeStyle as G, createElementVNode as t, createCommentVNode as r, Fragment as g, toDisplayString as y, unref as d } from "vue";
+import { u as L, c as b, e as N, i as p, f as k } from "./index-Cm4Iry5c.js";
+import { u as $ } from "./useNestedProp-CurQIHTa.js";
+const F = ["viewBox", "width"], B = { key: 0 }, P = ["id"], D = ["stop-color"], I = ["stop-color"], M = ["stroke"], U = ["stroke"], V = ["width", "fill"], E = ["fill"], O = { key: 0 }, S = ["id"], A = /* @__PURE__ */ t("feGaussianBlur", {
   in: "SourceGraphic",
   stdDeviation: 1
-}, null, -1), O = [
-  E
-], S = ["stroke"], A = ["stroke", "stroke-dasharray", "stroke-dashoffset"], j = ["filter"], T = ["stroke", "stroke-dasharray", "stroke-dashoffset"], q = ["fill"], Q = {
+}, null, -1), j = [
+  A
+], T = ["stroke"], q = ["stroke", "stroke-dasharray", "stroke-dashoffset"], H = ["filter"], J = ["stroke", "stroke-dasharray", "stroke-dashoffset"], K = ["fill"], X = {
   __name: "vue-ui-gizmo",
   props: {
     config: {
@@ -20,37 +20,50 @@ const b = ["viewBox", "width"], N = { key: 0 }, $ = ["id"], F = ["stop-color"],
       default: 0
     }
   },
-  setup(c) {
-    const o = c, { vue_ui_gizmo: k } = C(), l = p(z());
-    x(() => {
-      !o.dataset && o.dataset !== 0 && G({
+  setup(f) {
+    const o = f, { vue_ui_gizmo: m } = L(), l = x(b());
+    C(() => {
+      h();
+    });
+    function h() {
+      !o.dataset && o.dataset !== 0 && N({
         componentName: "VueUiGizmo",
         type: "dataset"
       }), o.dataset < 0 && console.warn("VueUiGizmo: dataset cannot be negative.");
+    }
+    const e = c({
+      get: () => _(),
+      set: (i) => i
     });
-    const e = d(() => L({
-      userConfig: o.config,
-      defaultConfig: k
-    })), f = d(() => ({
+    function _() {
+      return $({
+        userConfig: o.config,
+        defaultConfig: m
+      });
+    }
+    z(() => o.config, (i) => {
+      e.value = _(), h();
+    }, { deep: !0 });
+    const v = c(() => ({
       battery: { width: e.value.showPercentage ? 140 : 80, height: 50 },
       gauge: { width: 80, height: 80 }
-    })[e.value.type]), n = d(() => {
-      const i = 2 * Math.PI * 35, m = i - o.dataset / 100 * i;
+    })[e.value.type]), u = c(() => {
+      const n = 2 * Math.PI * 35, w = n - o.dataset / 100 * n;
       return {
-        dasharray: `${i} ${i}`,
-        dashoffset: m
+        dasharray: `${n} ${n}`,
+        dashoffset: w
       };
     });
-    return (h, i) => (s(), a("svg", {
+    return (i, n) => (a(), s("svg", {
       class: "vue-ui-gizmo",
-      viewBox: `0 0 ${f.value.width} ${f.value.height}`,
+      viewBox: `0 0 ${v.value.width} ${v.value.height}`,
       width: e.value.size,
-      style: w({
+      style: G({
         background: "transparent",
         fontFamily: e.value.fontFamily
       })
     }, [
-      e.value.useGradient ? (s(), a("defs", N, [
+      e.value.useGradient ? (a(), s("defs", B, [
         t("linearGradient", {
           id: `gizmo_gradient_${l.value}`,
           x1: "0%",
@@ -61,60 +74,60 @@ const b = ["viewBox", "width"], N = { key: 0 }, $ = ["id"], F = ["stop-color"],
           t("stop", {
             offset: "0%",
             "stop-color": e.value.gradientColor
-          }, null, 8, F),
+          }, null, 8, D),
           t("stop", {
             offset: "100%",
             "stop-color": e.value.color
-          }, null, 8, B)
-        ], 8, $)
+          }, null, 8, I)
+        ], 8, P)
       ])) : r("", !0),
-      e.value.type === "battery" ? (s(), a(_, { key: 1 }, [
+      e.value.type === "battery" ? (a(), s(g, { key: 1 }, [
         t("path", {
           d: "M 5 10 L 5 40 C 5 43 7 45 9 45 L 65 45 C 68 45 70 43 70 40 L 70 38 C 73 38 75 38 75 33 L 75 17 C 75 12 73 12 70 12 L 70 10 C 70 7 68 5 65 5 L 10 5 C 7 5 5 7 5 10",
           stroke: e.value.stroke,
           "stroke-width": 2,
           fill: "none"
-        }, null, 8, P),
+        }, null, 8, M),
         t("path", {
           d: "M 70 16 L 70 34",
           stroke: e.value.stroke,
           "stroke-width": 2,
           fill: "none",
           style: { opacity: "0.5" }
-        }, null, 8, D),
+        }, null, 8, U),
         t("rect", {
           x: 10,
           y: 10,
           height: 30,
-          width: 55 * (c.dataset / 100),
+          width: 55 * (f.dataset / 100),
           fill: e.value.useGradient ? `url(#gizmo_gradient_${l.value})` : e.value.color,
           rx: 2
-        }, null, 8, I),
-        e.value.showPercentage ? (s(), a("text", {
+        }, null, 8, V),
+        e.value.showPercentage ? (a(), s("text", {
           key: 0,
           x: 85,
           y: 32,
           "text-anchor": "start",
           "font-size": "20",
           fill: e.value.textColor
-        }, v(u(y)(
+        }, y(d(p)(
           e.value.formatter,
           o.dataset,
-          u(g)({
+          d(k)({
             v: o.dataset,
             s: "%"
           })
-        )), 9, M)) : r("", !0)
+        )), 9, E)) : r("", !0)
       ], 64)) : r("", !0),
-      e.value.type === "gauge" ? (s(), a(_, { key: 2 }, [
-        e.value.useGradient ? (s(), a("defs", U, [
+      e.value.type === "gauge" ? (a(), s(g, { key: 2 }, [
+        e.value.useGradient ? (a(), s("defs", O, [
           t("filter", {
             id: `blur_${l.value}`,
             x: "-50%",
             y: "-50%",
             width: "200%",
             height: "200%"
-          }, O, 8, V)
+          }, j, 8, S)
         ])) : r("", !0),
         t("circle", {
           cx: 40,
@@ -123,20 +136,20 @@ const b = ["viewBox", "width"], N = { key: 0 }, $ = ["id"], F = ["stop-color"],
           stroke: e.value.stroke,
           "stroke-width": 2 * 4,
           fill: "none"
-        }, null, 8, S),
+        }, null, 8, T),
         t("circle", {
           cx: 40,
           cy: 40,
           r: 35,
           stroke: e.value.color,
           "stroke-width": 2 * 4,
-          "stroke-dasharray": n.value.dasharray,
-          "stroke-dashoffset": n.value.dashoffset,
+          "stroke-dasharray": u.value.dasharray,
+          "stroke-dashoffset": u.value.dashoffset,
           "stroke-linecap": "round",
           fill: "none",
           style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
-        }, null, 8, A),
-        e.value.useGradient ? (s(), a("g", {
+        }, null, 8, q),
+        e.value.useGradient ? (a(), s("g", {
           key: 1,
           filter: `url(#blur_${l.value})`
         }, [
@@ -147,30 +160,30 @@ const b = ["viewBox", "width"], N = { key: 0 }, $ = ["id"], F = ["stop-color"],
             stroke: e.value.gradientColor,
             "stroke-width": 1,
             fill: "none",
-            "stroke-dasharray": n.value.dasharray,
-            "stroke-dashoffset": n.value.dashoffset,
+            "stroke-dasharray": u.value.dasharray,
+            "stroke-dashoffset": u.value.dashoffset,
             style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
-          }, null, 8, T)
-        ], 8, j)) : r("", !0),
-        e.value.showPercentage ? (s(), a("text", {
+          }, null, 8, J)
+        ], 8, H)) : r("", !0),
+        e.value.showPercentage ? (a(), s("text", {
           key: 2,
           x: 40,
           y: 47,
           "text-anchor": "middle",
           "font-size": "20",
           fill: e.value.textColor
-        }, v(u(y)(
+        }, y(d(p)(
           e.value.formatter,
           o.dataset,
-          u(g)({
+          d(k)({
             v: o.dataset,
             s: "%"
           })
-        )), 9, q)) : r("", !0)
+        )), 9, K)) : r("", !0)
       ], 64)) : r("", !0)
-    ], 12, b));
+    ], 12, F));
   }
 };
 export {
-  Q as default
+  X as default
 };