vue-data-ui 2.6.6 → 2.6.8

package/dist/{vue-ui-timer-DBP_fRcm.js → vue-ui-timer-DjKCOw9A.js}

@@ -1,15 +1,16 @@
-import { ref as n, onMounted as Y, computed as A, onBeforeUnmount as Z, watch as ee, createElementBlock as r, openBlock as l, normalizeStyle as f, createCommentVNode as h, createElementVNode as _, createBlock as te, unref as ae, createVNode as M, renderSlot as z, mergeProps as X, normalizeProps as U, guardReactiveProps as W, toDisplayString as se } from "vue";
-import { u as le } from "./useNestedProp-g5oKzlVy.js";
-import { u as oe, c as re, X as ue, F as G } from "./index-B9qF6XbP.js";
-import { t as ie, u as ne } from "./useResponsive-BWapHhVH.js";
-import I from "./BaseIcon-t20JEZNG.js";
-import { _ as ce } from "./Title-D6h1gTvZ.js";
-import { _ as de } from "./PackageVersion-DqmHcoqz.js";
-import { _ as he } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-class ve {
-  constructor(H, L, P, S = !0, w = !0) {
-    this.interval = L, this.elapsed = 0, this.isPaused = !1;
-    const C = `
+import { ref as i, onMounted as Z, computed as z, onBeforeUnmount as ee, watch as te, createElementBlock as o, openBlock as l, normalizeStyle as p, createCommentVNode as d, createElementVNode as _, createBlock as ae, unref as se, createVNode as C, renderSlot as H, mergeProps as q, normalizeProps as W, guardReactiveProps as G, toDisplayString as le } from "vue";
+import { u as oe } from "./useNestedProp-Cg0NIwr6.js";
+import { u as re, c as ue, X as ie, F as V } from "./index-CZlI7PiS.js";
+import { t as ne, u as ce } from "./useResponsive-BWapHhVH.js";
+import R from "./BaseIcon-dThl5uNa.js";
+import { _ as de } from "./Title-DePxeqVl.js";
+import { _ as he } from "./PackageVersion-J_USnljf.js";
+import { u as ve } from "./useChartAccessibility-BWojgys7.js";
+import { _ as pe } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+class fe {
+  constructor(L, N, P, S = !0, w = !0) {
+    this.interval = N, this.elapsed = 0, this.isPaused = !1;
+    const M = `
             let interval;
             let elapsed = 0;
             let paused = false;
@@ -72,53 +73,53 @@ class ve {
                         break;
                 }
             };
-        `, R = new Blob([C], { type: "application/javascript" }), D = URL.createObjectURL(R), u = new Worker(D);
-    function T(c) {
-      let v = Math.floor(c / 1e3), e = Math.floor(c % 1e3 / 10), k = Math.floor(v / 3600), $ = Math.floor(v % 3600 / 60), t = v % 60, o = "";
-      return w && (o += String(k).padStart(2, "0") + ":"), o += String($).padStart(2, "0") + ":", o += String(t).padStart(2, "0"), S && (o += "." + String(e).padStart(2, "0")), o;
+        `, D = new Blob([M], { type: "application/javascript" }), F = URL.createObjectURL(D), r = new Worker(F);
+    function T(n) {
+      let h = Math.floor(n / 1e3), e = Math.floor(n % 1e3 / 10), g = Math.floor(h / 3600), m = Math.floor(h % 3600 / 60), $ = h % 60, t = "";
+      return w && (t += String(g).padStart(2, "0") + ":"), t += String(m).padStart(2, "0") + ":", t += String($).padStart(2, "0"), S && (t += "." + String(e).padStart(2, "0")), t;
     }
     this.start = () => {
-      this.isPaused = !1, u.postMessage({ action: "start", data: { interval: this.interval } });
+      this.isPaused = !1, r.postMessage({ action: "start", data: { interval: this.interval } });
     }, this.pause = () => {
-      this.isPaused ? this.resume() : (this.isPaused = !0, u.postMessage({ action: "pause" }));
+      this.isPaused ? this.resume() : (this.isPaused = !0, r.postMessage({ action: "pause" }));
     }, this.resume = () => {
-      this.isPaused && (u.postMessage({ action: "resume" }), this.isPaused = !1);
+      this.isPaused && (r.postMessage({ action: "resume" }), this.isPaused = !1);
     }, this.stop = () => {
-      u.postMessage({ action: "stop" }), this.isPaused = !1;
+      r.postMessage({ action: "stop" }), this.isPaused = !1;
     }, this.reset = () => {
-      u.postMessage({ action: "reset" }), this.elapsed = 0, this.isPaused = !1;
+      r.postMessage({ action: "reset" }), this.elapsed = 0, this.isPaused = !1;
     }, this.restart = () => {
       this.stop(), this.start();
-    }, this.lap = () => new Promise((c) => {
-      u.postMessage({ action: "lap" });
-      const v = (e) => {
-        const { elapsed: k, timestamp: $, action: t } = e.data;
-        if (t === "lap") {
-          const o = T(k);
-          c({
-            timestamp: $ || 0,
-            elapsed: k,
-            formatted: o
+    }, this.lap = () => new Promise((n) => {
+      r.postMessage({ action: "lap" });
+      const h = (e) => {
+        const { elapsed: g, timestamp: m, action: $ } = e.data;
+        if ($ === "lap") {
+          const t = T(g);
+          n({
+            timestamp: m || 0,
+            elapsed: g,
+            formatted: t
           });
         }
       };
-      u.addEventListener("message", v, { once: !0 });
-    }), u.onmessage = (c) => {
-      const { elapsed: v, timestamp: e } = c.data;
-      this.elapsed = v, H({
+      r.addEventListener("message", h, { once: !0 });
+    }), r.onmessage = (n) => {
+      const { elapsed: h, timestamp: e } = n.data;
+      this.elapsed = h, L({
         timestamp: e || 0,
         elapsed: this.elapsed,
         formatted: T(this.elapsed)
       });
-    }, u.onerror = (c) => {
-      P && P(c);
+    }, r.onerror = (n) => {
+      P && P(n);
     };
   }
 }
-const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke = ["id"], ge = ["stop-color"], me = ["stop-color"], ye = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], be = ["d", "stroke", "stroke-width"], _e = ["r", "fill", "stroke", "stroke-width"], Me = ["r", "fill", "stroke", "stroke-width"], Ce = ["x", "y"], Te = ["x", "y", "font-size", "fill", "font-weight"], $e = {
+const we = ["xmlns", "viewBox"], ke = ["width", "height"], ge = { key: 1 }, me = ["id"], ye = ["stop-color"], be = ["stop-color"], _e = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Ce = ["d", "stroke", "stroke-width"], Me = ["r", "fill", "stroke", "stroke-width"], Te = ["r", "fill", "stroke", "stroke-width"], $e = ["x", "y"], xe = ["x", "y", "font-size", "fill", "font-weight"], Ie = {
   key: 0,
   class: "vue-ui-timer-controls"
-}, xe = ["title"], Ie = ["title"], Pe = ["title"], Se = ["title"], Re = ["title"], De = {
+}, Re = ["title"], Pe = ["title"], Se = ["title"], De = ["title"], Fe = ["title"], Ae = {
   __name: "vue-ui-timer",
   props: {
     config: {
@@ -129,34 +130,34 @@ const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke =
     }
   },
   emits: ["start", "pause", "reset", "restart", "lap"],
-  setup(V, { expose: H, emit: L }) {
-    const { vue_ui_timer: P } = oe(), S = V, w = L, C = n(null), R = n(null), D = n(null), u = n(null), T = n(re()), c = n(0);
-    Y(() => {
-      v();
+  setup(X, { expose: L, emit: N }) {
+    const { vue_ui_timer: P } = re(), S = X, w = N, M = i(null), D = i(null), F = i(null), r = i(null), T = i(ue()), n = i(0);
+    Z(() => {
+      h();
     });
-    function v() {
+    function h() {
       if (e.value.responsive) {
-        const a = ie(() => {
-          const { width: i, height: d } = ne({
-            chart: C.value,
-            title: e.value.style.title.text ? R.value : null,
-            legend: D.value
+        const a = ne(() => {
+          const { width: u, height: c } = ce({
+            chart: M.value,
+            title: e.value.style.title.text ? D.value : null,
+            legend: F.value
           });
           requestAnimationFrame(() => {
-            t.value.width = i, t.value.height = d, t.value.tracker.core = G({
-              relator: Math.min(i, d),
+            t.value.width = u, t.value.height = c, t.value.tracker.core = V({
+              relator: Math.min(u, c),
               adjuster: e.value.style.width,
               source: 6 * e.value.stopwatch.tracker.radiusRatio,
               threshold: 1,
               fallback: 1
-            }), t.value.tracker.aura = G({
-              relator: Math.min(i, d),
+            }), t.value.tracker.aura = V({
+              relator: Math.min(u, c),
               adjuster: e.value.style.width,
               source: 12 * e.value.stopwatch.tracker.aura.radiusRatio,
               threshold: 1,
               fallback: 1
-            }), t.value.label = G({
-              relator: Math.min(i, d),
+            }), t.value.label = V({
+              relator: Math.min(u, c),
               adjuster: e.value.style.width,
               source: e.value.stopwatch.label.fontSize,
               threshold: 10,
@@ -164,26 +165,26 @@ const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke =
             });
           });
         });
-        u.value = new ResizeObserver(a), u.value.observe(C.value.parentNode);
+        r.value = new ResizeObserver(a), r.value.observe(M.value.parentNode);
       }
     }
-    Z(() => {
-      u.value && u.value.disconnect();
+    ee(() => {
+      r.value && r.value.disconnect();
     });
-    const e = A({
-      get: () => k(),
+    const e = z({
+      get: () => m(),
       set: (a) => a
-    });
-    function k() {
-      return le({
+    }), { svgRef: g } = ve({ config: e.value.style.title });
+    function m() {
+      return oe({
         userConfig: S.config,
         defaultConfig: P
       });
     }
-    ee(() => S.config, (a) => {
-      e.value = k(), v(), c.value += 1;
+    te(() => S.config, (a) => {
+      e.value = m(), h(), n.value += 1;
     }, { deep: !0 });
-    const $ = A(() => {
+    const $ = z(() => {
       if (e.value.stopwatch.showHours && e.value.stopwatch.showHundredth)
         return "00:00:00.00";
       if (e.value.stopwatch.showHours && !e.value.stopwatch.showHundredth)
@@ -192,7 +193,7 @@ const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke =
         return "00:00.00";
       if (!e.value.stopwatch.showHours && !e.value.stopwatch.showHundredth)
         return "00:00";
-    }), t = n({
+    }), t = i({
       height: e.value.style.height,
       width: e.value.style.width,
       tracker: {
@@ -200,80 +201,80 @@ const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke =
         aura: 12 * e.value.stopwatch.tracker.aura.radiusRatio
       },
       label: e.value.stopwatch.label.fontSize
-    }), o = n(0), m = new ve(
-      (a) => q(a),
+    }), f = i(0), x = new fe(
+      (a) => J(a),
       10,
       "",
       e.value.stopwatch.showHundredth,
       e.value.stopwatch.showHours
-    ), N = n(!0), s = n(!1), p = n(!1);
-    function j() {
-      w("start"), N.value && m.start(), N.value = !1, s.value = !0;
-    }
+    ), j = i(!0), s = i(!1), v = i(!1);
     function B() {
-      s.value && (w("reset"), m.stop(), y.value = [], N.value = !0, s.value = !1);
+      w("start"), j.value && x.start(), j.value = !1, s.value = !0;
     }
     function O() {
-      p.value = !p.value, w("pause", o.value), m.pause();
+      s.value && (w("reset"), x.stop(), y.value = [], j.value = !0, s.value = !1);
     }
     function E() {
-      s.value && (p.value = !1, w("restart"), y.value = [], m.restart());
+      v.value = !v.value, w("pause", f.value), x.pause();
     }
-    const y = n([]);
-    async function F() {
-      if (!s.value || p.value) return;
-      const a = await m.lap();
+    function U() {
+      s.value && (v.value = !1, w("restart"), y.value = [], x.restart());
+    }
+    const y = i([]);
+    async function A() {
+      if (!s.value || v.value) return;
+      const a = await x.lap();
       a && (y.value.push(a), w("lap", y.value));
     }
-    function q({ timestamp: a, elapsed: i, formatted: d }) {
-      o.value = { timestamp: a, elapsed: i, formatted: d };
+    function J({ timestamp: a, elapsed: u, formatted: c }) {
+      f.value = { timestamp: a, elapsed: u, formatted: c };
     }
-    const g = A(() => Math.min(t.value.width, t.value.height) / 2.5 * e.value.stopwatch.track.radiusRatio);
-    function J(a, i) {
-      const x = 360 / (i * 1e3);
-      return a * x % 360;
+    const k = z(() => Math.min(t.value.width, t.value.height) / 2.5 * e.value.stopwatch.track.radiusRatio);
+    function K(a, u) {
+      const I = 360 / (u * 1e3);
+      return a * I % 360;
     }
-    function K(a) {
-      let i = a * (Math.PI / 180), d = t.value.width / 2 + g.value * Math.cos(i), x = t.value.height / 2 + g.value * Math.sin(i);
-      return { cx: d, cy: x };
+    function Q(a) {
+      let u = a * (Math.PI / 180), c = t.value.width / 2 + k.value * Math.cos(u), I = t.value.height / 2 + k.value * Math.sin(u);
+      return { cx: c, cy: I };
     }
-    const b = A(() => {
-      const a = J(o.value.elapsed, e.value.stopwatch.cycleSeconds), { cx: i, cy: d } = K(a - 90), x = a > 180 ? 1 : 0;
+    const b = z(() => {
+      const a = K(f.value.elapsed, e.value.stopwatch.cycleSeconds), { cx: u, cy: c } = Q(a - 90), I = a > 180 ? 1 : 0;
       return {
-        cx: i || t.value.width / 2,
-        cy: d || t.value.height / 2 - g.value,
-        largeArcFlag: x,
+        cx: u || t.value.width / 2,
+        cy: c || t.value.height / 2 - k.value,
+        largeArcFlag: I,
         sweepFlag: 1
       };
     });
-    return H({
-      start: j,
-      pause: O,
-      reset: B,
-      restart: E,
-      lap: F
-    }), (a, i) => (l(), r("div", {
+    return L({
+      start: B,
+      pause: E,
+      reset: O,
+      restart: U,
+      lap: A
+    }), (a, u) => (l(), o("div", {
       ref_key: "timerChart",
-      ref: C,
+      ref: M,
       class: "vue-ui-timer",
-      style: f({
+      style: p({
         fontFamily: e.value.style.fontFamily,
         width: "100%",
         height: e.value.responsive ? "100%" : "auto",
         textAlign: "center"
       })
     }, [
-      e.value.style.title.text ? (l(), r("div", {
+      e.value.style.title.text ? (l(), o("div", {
         key: 0,
         ref_key: "chartTitle",
-        ref: R,
-        style: f({
+        ref: D,
+        style: p({
           width: "100%",
           background: e.value.style.backgroundColor
         })
       }, [
-        (l(), te(ce, {
-          key: `title_${c.value}`,
+        (l(), ae(de, {
+          key: `title_${n.value}`,
           config: {
             title: {
               cy: "title",
@@ -285,18 +286,20 @@ const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke =
             }
           }
         }, null, 8, ["config"]))
-      ], 4)) : h("", !0),
-      (l(), r("svg", {
-        xmlns: ae(ue),
+      ], 4)) : d("", !0),
+      (l(), o("svg", {
+        ref_key: "svgRef",
+        ref: g,
+        xmlns: se(ie),
         viewBox: `0 0 ${t.value.width <= 0 ? 10 : t.value.width} ${t.value.height <= 0 ? 10 : t.value.height}`,
-        style: f({
+        style: p({
           maxWidth: "100%",
           overflow: "visible",
           background: e.value.style.backgroundColor
         })
       }, [
-        M(de),
-        a.$slots["chart-background"] ? (l(), r("foreignObject", {
+        C(he),
+        a.$slots["chart-background"] ? (l(), o("foreignObject", {
           key: 0,
           x: 0,
           y: 0,
@@ -306,9 +309,9 @@ const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke =
             pointerEvents: "none"
           }
         }, [
-          z(a.$slots, "chart-background", {}, void 0, !0)
-        ], 8, fe)) : h("", !0),
-        e.value.stopwatch.tracker.gradient.show ? (l(), r("defs", we, [
+          H(a.$slots, "chart-background", {}, void 0, !0)
+        ], 8, ke)) : d("", !0),
+        e.value.stopwatch.tracker.gradient.show ? (l(), o("defs", ge, [
           _("radialGradient", {
             id: `tracker_gradient_${T.value}`,
             cx: "50%",
@@ -320,42 +323,42 @@ const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke =
             _("stop", {
               offset: "0%",
               "stop-color": e.value.stopwatch.tracker.gradient.color
-            }, null, 8, ge),
+            }, null, 8, ye),
             _("stop", {
               offset: "100%",
               "stop-color": e.value.stopwatch.tracker.fill
-            }, null, 8, me)
-          ], 8, ke)
-        ])) : h("", !0),
+            }, null, 8, be)
+          ], 8, me)
+        ])) : d("", !0),
         _("circle", {
           cx: t.value.width / 2,
           cy: t.value.height / 2,
-          r: g.value,
+          r: k.value,
           fill: e.value.stopwatch.track.fill,
           stroke: e.value.stopwatch.track.stroke,
           "stroke-width": e.value.stopwatch.track.strokeWidth
-        }, null, 8, ye),
-        e.value.stopwatch.cycleTrack.show ? (l(), r("path", {
+        }, null, 8, _e),
+        e.value.stopwatch.cycleTrack.show ? (l(), o("path", {
           key: 2,
-          d: `M ${t.value.width / 2},${t.value.height / 2 - g.value} A ${g.value},${g.value} 0 ${b.value.largeArcFlag},${b.value.sweepFlag} ${b.value.cx},${b.value.cy}`,
+          d: `M ${t.value.width / 2},${t.value.height / 2 - k.value} A ${k.value},${k.value} 0 ${b.value.largeArcFlag},${b.value.sweepFlag} ${b.value.cx},${b.value.cy}`,
           stroke: e.value.stopwatch.cycleTrack.stroke,
           "stroke-width": e.value.stopwatch.cycleTrack.strokeWidth,
           "stroke-linecap": "round",
           fill: "none"
-        }, null, 8, be)) : h("", !0),
-        _("circle", X(b.value, {
+        }, null, 8, Ce)) : d("", !0),
+        _("circle", q(b.value, {
           r: t.value.tracker.core,
           fill: e.value.stopwatch.tracker.gradient.show ? `url(#tracker_gradient_${T.value})` : e.value.stopwatch.tracker.fill,
           stroke: e.value.stopwatch.tracker.stroke,
           "stroke-width": e.value.stopwatch.tracker.strokeWidth
-        }), null, 16, _e),
-        e.value.stopwatch.tracker.aura.show ? (l(), r("circle", X({ key: 3 }, b.value, {
+        }), null, 16, Me),
+        e.value.stopwatch.tracker.aura.show ? (l(), o("circle", q({ key: 3 }, b.value, {
           r: t.value.tracker.aura,
           fill: `${e.value.stopwatch.tracker.aura.fill}20`,
           stroke: e.value.stopwatch.tracker.aura.stroke,
           "stroke-width": e.value.stopwatch.tracker.aura.strokeWidth
-        }), null, 16, Me)) : h("", !0),
-        a.$slots.time ? (l(), r("foreignObject", {
+        }), null, 16, Te)) : d("", !0),
+        a.$slots.time ? (l(), o("foreignObject", {
           key: 4,
           x: t.value.width / 2,
           y: t.value.height / 2,
@@ -363,8 +366,8 @@ const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke =
           width: "0.1",
           style: { overflow: "visible" }
         }, [
-          z(a.$slots, "time", U(W({ ...o.value })), void 0, !0)
-        ], 8, Ce)) : (l(), r("text", {
+          H(a.$slots, "time", W(G({ ...f.value })), void 0, !0)
+        ], 8, $e)) : (l(), o("text", {
           key: 5,
           x: t.value.width / 2,
           y: t.value.height / 2 + t.value.label / 4,
@@ -373,112 +376,112 @@ const pe = ["xmlns", "viewBox"], fe = ["width", "height"], we = { key: 1 }, ke =
           fill: e.value.stopwatch.label.color,
           "font-weight": e.value.stopwatch.label.bold ? "bold" : "normal",
           style: { "font-variant-numeric": "tabular-nums !important" }
-        }, se(o.value.formatted || $.value), 9, Te))
-      ], 12, pe)),
+        }, le(f.value.formatted || $.value), 9, xe))
+      ], 12, we)),
       _("div", {
         ref_key: "chartLegend",
-        ref: D,
-        style: f({ width: "100%", backgroundColor: e.value.stopwatch.legend.backgroundColor })
+        ref: F,
+        style: p({ width: "100%", backgroundColor: e.value.stopwatch.legend.backgroundColor })
       }, [
-        a.$slots.controls ? h("", !0) : (l(), r("div", $e, [
-          e.value.stopwatch.legend.buttons.start ? (l(), r("button", {
+        a.$slots.controls ? d("", !0) : (l(), o("div", Ie, [
+          e.value.stopwatch.legend.buttons.start ? (l(), o("button", {
             key: 0,
             title: e.value.stopwatch.legend.buttonTitles.start,
-            onClick: j,
+            onClick: B,
             class: "vue-ui-timer-button",
-            style: f({
+            style: p({
               opacity: s.value ? 0.2 : 1,
               cursor: s.value ? "default" : "pointer"
             })
           }, [
-            M(I, {
+            C(R, {
               name: "play",
               stroke: e.value.stopwatch.legend.buttons.iconColor
             }, null, 8, ["stroke"])
-          ], 12, xe)) : h("", !0),
-          e.value.stopwatch.legend.buttons.pause ? (l(), r("button", {
+          ], 12, Re)) : d("", !0),
+          e.value.stopwatch.legend.buttons.pause ? (l(), o("button", {
             key: 1,
-            title: p.value ? e.value.stopwatch.legend.buttonTitles.resume : e.value.stopwatch.legend.buttonTitles.pause,
-            onClick: O,
+            title: v.value ? e.value.stopwatch.legend.buttonTitles.resume : e.value.stopwatch.legend.buttonTitles.pause,
+            onClick: E,
             class: "vue-ui-timer-button",
-            style: f({
+            style: p({
               opacity: s.value ? 1 : 0.2,
               cursor: s.value ? "pointer" : "default"
             })
           }, [
-            M(I, {
+            C(R, {
               name: "pause",
               stroke: e.value.stopwatch.legend.buttons.iconColor
             }, null, 8, ["stroke"])
-          ], 12, Ie)) : h("", !0),
-          e.value.stopwatch.legend.buttons.reset ? (l(), r("button", {
+          ], 12, Pe)) : d("", !0),
+          e.value.stopwatch.legend.buttons.reset ? (l(), o("button", {
             key: 2,
             title: e.value.stopwatch.legend.buttonTitles.reset,
-            onClick: B,
+            onClick: O,
             class: "vue-ui-timer-button",
-            style: f({
+            style: p({
               opacity: s.value ? 1 : 0.2,
               cursor: s.value ? "pointer" : "default"
             })
           }, [
-            M(I, {
+            C(R, {
               name: "stop",
               stroke: e.value.stopwatch.legend.buttons.iconColor
             }, null, 8, ["stroke"])
-          ], 12, Pe)) : h("", !0),
-          e.value.stopwatch.legend.buttons.restart ? (l(), r("button", {
+          ], 12, Se)) : d("", !0),
+          e.value.stopwatch.legend.buttons.restart ? (l(), o("button", {
             key: 3,
             title: e.value.stopwatch.legend.buttonTitles.restart,
-            onClick: E,
+            onClick: U,
             class: "vue-ui-timer-button",
-            style: f({
+            style: p({
               opacity: s.value ? 1 : 0.2,
               cursor: s.value ? "pointer" : "default"
             })
           }, [
-            M(I, {
+            C(R, {
               name: "restart",
               stroke: e.value.stopwatch.legend.buttons.iconColor
             }, null, 8, ["stroke"])
-          ], 12, Se)) : h("", !0),
-          e.value.stopwatch.legend.buttons.lap ? (l(), r("button", {
+          ], 12, De)) : d("", !0),
+          e.value.stopwatch.legend.buttons.lap ? (l(), o("button", {
             key: 4,
             title: e.value.stopwatch.legend.buttonTitles.lap,
-            onClick: F,
+            onClick: A,
             class: "vue-ui-timer-button",
-            style: f({
-              opacity: s.value && !p.value ? 1 : 0.2,
-              cursor: s.value && !p.value ? "pointer" : "default"
+            style: p({
+              opacity: s.value && !v.value ? 1 : 0.2,
+              cursor: s.value && !v.value ? "pointer" : "default"
             })
           }, [
-            M(I, {
+            C(R, {
               name: "lap",
               stroke: e.value.stopwatch.legend.buttons.iconColor
             }, null, 8, ["stroke"])
-          ], 12, Re)) : h("", !0)
+          ], 12, Fe)) : d("", !0)
         ])),
-        z(a.$slots, "controls", U(W({
-          start: j,
-          pause: O,
-          reset: B,
-          restart: E,
-          lap: F,
+        H(a.$slots, "controls", W(G({
+          start: B,
+          pause: E,
+          reset: O,
+          restart: U,
+          lap: A,
           laps: y.value,
           isRunning: s.value,
-          isPaused: p.value,
-          ...o.value
+          isPaused: v.value,
+          ...f.value
         })), void 0, !0),
-        z(a.$slots, "laps", U(W({
+        H(a.$slots, "laps", W(G({
           laps: y.value,
-          lap: F,
+          lap: A,
           isRunning: s.value,
-          isPaused: p.value,
-          ...o.value
+          isPaused: v.value,
+          ...f.value
         })), void 0, !0)
       ], 4)
     ], 4));
   }
-}, Oe = /* @__PURE__ */ he(De, [["__scopeId", "data-v-be90052b"]]);
+}, We = /* @__PURE__ */ pe(Ae, [["__scopeId", "data-v-19145f1f"]]);
 export {
-  Oe as default
+  We as default
 };

package/dist/vue-ui-tiremarks--XDyJeJg.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),L=require("./useNestedProp-DU7JFxpL.cjs"),c=require("./index-DD4PT0Pl.cjs"),K=require("./Title-BQSh4ukk.cjs"),j=require("./usePrinter-BtJq2wwh.cjs"),Q=require("./vue-ui-skeleton-Tk4j6G2D.cjs"),W=require("./PackageVersion-CCgJTyH9.cjs"),Z=require("./PenAndPaper-DvNBHCpq.cjs"),ee=require("./useUserOptionState-BgepsfED.cjs"),te=require("./useChartAccessibility-Cm7nkzTG.cjs"),oe=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),ae=["id"],le={key:2,style:"width:100%;background:transparent;padding-bottom:12px"},re=["xmlns","viewBox"],ne=["width","height"],se={key:1},ue=["d","stroke-width","stroke"],ie={key:2},ce=["x1","y1","x2","y2","stroke-width","stroke"],ve=["x","y","font-size","fill","font-weight","text-anchor"],de={key:5,class:"vue-data-ui-watermark"},he={key:6,ref:"source",dir:"auto"},pe={__name:"vue-ui-tiremarks",props:{config:{type:Object,default(){return{}}},dataset:{type:Object,default(){return{}}}},setup(G,{expose:H}){const{vue_ui_tiremarks:R}=c.useConfig(),v=G,$=e.computed(()=>!!v.dataset&&Object.keys(v.dataset).length),B=e.ref(c.createUid()),P=e.ref(null),D=e.ref(null),S=e.ref(0),A=e.ref(0),t=e.computed({get:()=>E(),set:o=>o}),{userOptionsVisible:x,setUserOptionsVisibility:N,keepUserOptionState:z}=ee.useUserOptionState({config:t.value}),{svgRef:X}=te.useChartAccessibility({config:t.value.style.chart.title});function E(){const o=L.useNestedProp({userConfig:v.config,defaultConfig:R});return o.theme?{...L.useNestedProp({userConfig:c.themes.vue_ui_tiremarks[o.theme]||v.config,defaultConfig:o})}:o}e.watch(()=>v.config,o=>{t.value=E(),x.value=!t.value.userOptions.showOnChartHover,M(),A.value+=1},{deep:!0});const{isPrinting:I,isImaging:F,generatePdf:V,generateImage:q}=j.usePrinter({elementId:B.value,fileName:t.value.style.chart.title.text||"vue-ui-tiremarks"}),Y=e.computed(()=>t.value.userOptions.show&&!t.value.style.chart.title.text),s=e.ref(t.value.style.chart.animation.use?0:c.checkNaN(v.dataset.percentage));e.watch(()=>v.dataset,o=>{t.value.style.chart.animation.use?T(o.percentage):s.value=o.percentage||0},{deep:!0}),e.onMounted(()=>{M()});function T(o){let n=t.value.style.chart.animation.speed;const a=Math.abs(o-s.value)/(n*120);function r(){s.value<o?s.value=Math.min(s.value+a,o):s.value>o&&(s.value=Math.max(s.value-a,o)),s.value!==o&&requestAnimationFrame(r)}r()}function M(){c.objectIsEmpty(v.dataset)&&c.error({componentName:"VueUiTiremarks",type:"dataset"}),T(v.dataset.percentage||0)}const f=e.computed(()=>t.value.style.chart.layout.display==="vertical"),u=e.computed(()=>{const o={top:48,left:64,right:64,bottom:48};return f.value?{top:t.value.style.chart.percentage.verticalPosition==="top"?o.top:3,left:3,right:3,bottom:t.value.style.chart.percentage.verticalPosition==="bottom"?o.bottom:3}:{top:0,bottom:0,left:t.value.style.chart.percentage.horizontalPosition==="left"?o.left:3,right:t.value.style.chart.percentage.horizontalPosition==="right"?o.right:10}}),C=e.computed(()=>Object.values(u.value).reduce((o,n)=>o+n,0)),l=e.computed(()=>({height:f.value?312:56,width:f.value?56:312})),i=e.computed(()=>f.value?{mark:(l.value.height-C.value)/100*.5,space:(l.value.height-C.value)/100*.5}:{mark:(l.value.width-C.value)/100*.5,space:(l.value.width-C.value)/100*.5}),U=e.computed(()=>{const o=[];for(let a=0;a<100;a+=1){const r=t.value.style.chart.layout.ticks.gradient.show?c.shiftHue(t.value.style.chart.layout.activeColor,a/100*(t.value.style.chart.layout.ticks.gradient.shiftHueIntensity/100)):t.value.style.chart.layout.activeColor;if(f.value){const y=t.value.style.chart.layout.crescendo?(100-a)*(l.value.width-u.value.left-u.value.right)/100/3:0,d=u.value.left+4+y,h=l.value.width-u.value.right-4-y,p=l.value.height-u.value.bottom-a*i.value.mark-a*i.value.space-i.value.mark,m=l.value.height-u.value.bottom-a*i.value.mark-a*i.value.space-i.value.mark,k=(h-d)/t.value.style.chart.layout.curveAngleX,b=t.value.style.chart.layout.curveAngleY*((1+a)/100);o.push({x1:d,x2:h,y1:p,y2:m,curve:`M ${d} ${p} C ${d+k} ${p-b}, ${h-k} ${m-b}, ${h} ${m}`,color:r})}else{const y=t.value.style.chart.layout.crescendo?(100-a)*(l.value.height-u.value.top-u.value.bottom)/100/3:0,d=u.value.left+a*i.value.mark+a*i.value.space-i.value.mark,h=d,p=u.value.top+4+y,m=l.value.height-u.value.bottom-4-y,k=t.value.style.chart.layout.curveAngleY*((1+a)/100),b=(m-p)/t.value.style.chart.layout.curveAngleX;o.push({x1:d,x2:h,y1:p,y2:m,curve:`M ${d} ${p} C ${d+k} ${p+b}, ${h+k} ${m-b}, ${h} ${m}`,color:r})}}return o}),g=e.computed(()=>{let o,n,a;const r=t.value.style.chart.percentage.fontSize/3;return f.value?t.value.style.chart.percentage.verticalPosition==="top"?(o=l.value.width/2,n=u.value.top/2,a="middle"):t.value.style.chart.percentage.verticalPosition==="bottom"&&(o=l.value.width/2,n=l.value.height-u.value.bottom/2+r,a="middle"):t.value.style.chart.percentage.horizontalPosition==="left"?(o=4,n=l.value.height/2+r,a="start"):t.value.style.chart.percentage.horizontalPosition==="right"&&(o=l.value.width-u.value.right+8,n=l.value.height/2+r,a="start"),{x:o,y:n,textAnchor:a,bold:t.value.style.chart.percentage.bold,fontSize:t.value.style.chart.percentage.fontSize,fill:t.value.style.chart.percentage.color}}),_=e.ref(!1);function J(o){_.value=o,S.value+=1}const w=e.ref(!1);function O(){w.value=!w.value}return H({generatePdf:V,generateImage:q,toggleAnnotator:O}),(o,n)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"tiremarksChart",ref:P,class:e.normalizeClass(`vue-ui-tiremarks ${t.value.useCssAnimation?"":"vue-ui-dna"}`),style:e.normalizeStyle(`font-family:${t.value.style.fontFamily};width:100%; text-align:center;background:${t.value.style.chart.backgroundColor}`),id:B.value,onMouseenter:n[0]||(n[0]=()=>e.unref(N)(!0)),onMouseleave:n[1]||(n[1]=()=>e.unref(N)(!1))},[t.value.userOptions.buttons.annotator?(e.openBlock(),e.createBlock(Z.PenAndPaper,{key:0,parent:P.value,backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color,active:w.value,onClose:O},null,8,["parent","backgroundColor","color","active"])):e.createCommentVNode("",!0),Y.value?(e.openBlock(),e.createElementBlock("div",{key:1,ref_key:"noTitle",ref:D,class:"vue-data-ui-no-title-space",style:"height:36px; width: 100%;background:transparent"},null,512)):e.createCommentVNode("",!0),t.value.style.chart.title.text?(e.openBlock(),e.createElementBlock("div",le,[(e.openBlock(),e.createBlock(K._sfc_main,{key:`title_${A.value}`,config:{title:{cy:"wheel-title",...t.value.style.chart.title},subtitle:{cy:"wheel-subtitle",...t.value.style.chart.title.subtitle}}},null,8,["config"]))])):e.createCommentVNode("",!0),t.value.userOptions.show&&$.value&&(e.unref(z)||e.unref(x))?(e.openBlock(),e.createBlock(j.UserOptions,{ref:"details",key:`user_options_${S.value}`,backgroundColor:t.value.style.chart.backgroundColor,color:t.value.style.chart.color,isPrinting:e.unref(I),isImaging:e.unref(F),uid:B.value,hasPdf:t.value.userOptions.buttons.pdf,hasImg:t.value.userOptions.buttons.img,hasFullscreen:t.value.userOptions.buttons.fullscreen,hasXls:!1,isFullscreen:_.value,titles:{...t.value.userOptions.buttonTitles},chartElement:P.value,position:t.value.userOptions.position,hasAnnotator:t.value.userOptions.buttons.annotator,isAnnotation:w.value,onToggleFullscreen:J,onGeneratePdf:e.unref(V),onGenerateImage:e.unref(q),onToggleAnnotator:O,style:e.normalizeStyle({visibility:e.unref(z)?e.unref(x)?"visible":"hidden":"visible"})},e.createSlots({_:2},[o.$slots.optionPdf?{name:"optionPdf",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"optionPdf",{},void 0,!0)]),key:"0"}:void 0,o.$slots.optionImg?{name:"optionImg",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"optionImg",{},void 0,!0)]),key:"1"}:void 0,o.$slots.optionFullscreen?{name:"optionFullscreen",fn:e.withCtx(({toggleFullscreen:a,isFullscreen:r})=>[e.renderSlot(o.$slots,"optionFullscreen",e.normalizeProps(e.guardReactiveProps({toggleFullscreen:a,isFullscreen:r})),void 0,!0)]),key:"2"}:void 0,o.$slots.optionAnnotator?{name:"optionAnnotator",fn:e.withCtx(({toggleAnnotator:a,isAnnotator:r})=>[e.renderSlot(o.$slots,"optionAnnotator",e.normalizeProps(e.guardReactiveProps({toggleAnnotator:a,isAnnotator:r})),void 0,!0)]),key:"3"}:void 0]),1032,["backgroundColor","color","isPrinting","isImaging","uid","hasPdf","hasImg","hasFullscreen","isFullscreen","titles","chartElement","position","hasAnnotator","isAnnotation","onGeneratePdf","onGenerateImage","style"])):e.createCommentVNode("",!0),$.value?(e.openBlock(),e.createElementBlock("svg",{key:4,ref_key:"svgRef",ref:X,xmlns:e.unref(c.XMLNS),class:e.normalizeClass({"vue-data-ui-fullscreen--on":_.value,"vue-data-ui-fulscreen--off":!_.value}),viewBox:`0 0 ${l.value.width} ${l.value.height}`,style:e.normalizeStyle(`max-width:100%; overflow: visible; background:transparent;color:${t.value.style.chart.color}`)},[e.createVNode(W._sfc_main),o.$slots["chart-background"]?(e.openBlock(),e.createElementBlock("foreignObject",{key:0,x:0,y:0,width:l.value.width,height:l.value.height,style:{pointerEvents:"none"}},[e.renderSlot(o.$slots,"chart-background",{},void 0,!0)],8,ne)):e.createCommentVNode("",!0),t.value.style.chart.layout.curved?(e.openBlock(),e.createElementBlock("g",se,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(U.value,(a,r)=>(e.openBlock(),e.createElementBlock("path",{d:a.curve,"stroke-width":i.value.mark,stroke:s.value>=r?a.color:t.value.style.chart.layout.inactiveColor,"stroke-linecap":"round",fill:"none",class:e.normalizeClass({"vue-ui-tick-animated":t.value.style.chart.animation.use&&r<=s.value})},null,10,ue))),256))])):(e.openBlock(),e.createElementBlock("g",ie,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(U.value,(a,r)=>(e.openBlock(),e.createElementBlock("line",{x1:a.x1,y1:a.y1,x2:a.x2,y2:a.y2,"stroke-width":i.value.mark,stroke:s.value>=r?a.color:t.value.style.chart.layout.inactiveColor,"stroke-linecap":"round"},null,8,ce))),256))])),t.value.style.chart.percentage.show?(e.openBlock(),e.createElementBlock("text",{key:3,x:g.value.x,y:g.value.y,"font-size":g.value.fontSize,fill:t.value.style.chart.layout.ticks.gradient.show&&t.value.style.chart.percentage.useGradientColor?e.unref(c.shiftHue)(t.value.style.chart.layout.activeColor,s.value/100*(t.value.style.chart.layout.ticks.gradient.shiftHueIntensity/100)):t.value.style.chart.percentage.color,"font-weight":g.value.bold?"bold":"normal","text-anchor":g.value.textAnchor},e.toDisplayString(e.unref(c.applyDataLabel)(t.value.style.chart.percentage.formatter,s.value,e.unref(c.dataLabel)({v:s.value,s:"%",r:t.value.style.chart.percentage.rounding}))),9,ve)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"svg",{svg:l.value},void 0,!0)],14,re)):e.createCommentVNode("",!0),o.$slots.watermark?(e.openBlock(),e.createElementBlock("div",de,[e.renderSlot(o.$slots,"watermark",e.normalizeProps(e.guardReactiveProps({isPrinting:e.unref(I)||e.unref(F)})),void 0,!0)])):e.createCommentVNode("",!0),o.$slots.source?(e.openBlock(),e.createElementBlock("div",he,[e.renderSlot(o.$slots,"source",{},void 0,!0)],512)):e.createCommentVNode("",!0),$.value?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(Q.default,{key:7,config:{type:"tiremarks",style:{backgroundColor:t.value.style.chart.backgroundColor,tiremarks:{color:"#CCCCCC"}}}},null,8,["config"]))],46,ae))}},me=oe._export_sfc(pe,[["__scopeId","data-v-85afd94d"]]);exports.default=me;