vue-data-ui 2.4.57 → 2.4.59

package/dist/{vue-ui-thermometer-Vr2IP_p0.js → vue-ui-thermometer-Dvk3S7jR.js}

@@ -1,32 +1,32 @@
-import { useCssVars as me, computed as d, onMounted as ke, ref as g, watch as be, openBlock as l, createElementBlock as n, normalizeClass as P, normalizeStyle as ee, unref as c, createBlock as F, createCommentVNode as i, createSlots as xe, withCtx as I, renderSlot as p, normalizeProps as G, guardReactiveProps as W, createVNode as _e, createElementVNode as v, Fragment as O, renderList as te, toDisplayString as we } from "vue";
-import { u as Ce, o as $e, e as se, g as Pe, c as Fe, t as Ie, a as Oe, p as x, b as Ae, v as f, d as A, X as Me, s as Ue, i as Ye, f as Ne } from "./index-CI-N9klv.js";
-import { _ as Se } from "./Title-DLjHHdyq.js";
-import { u as Te, U as qe } from "./usePrinter-CXc8xCKk.js";
-import Le from "./vue-ui-skeleton-owIhXtQF.js";
-import { u as oe } from "./useNestedProp-D1eJ0dvv.js";
-import { _ as Ve } from "./PackageVersion-S3SzpuwC.js";
-import { P as Ge } from "./PenAndPaper-v846FwcH.js";
-import { u as We } from "./useUserOptionState-BIvW1Kz7.js";
-import { _ as Ee } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const ze = ["id"], Be = {
+import { useCssVars as me, computed as d, onMounted as ke, ref as p, watch as be, openBlock as a, createElementBlock as n, normalizeClass as P, normalizeStyle as ee, unref as h, createBlock as F, createCommentVNode as i, createSlots as xe, withCtx as O, renderSlot as g, normalizeProps as E, guardReactiveProps as G, createVNode as _e, createElementVNode as v, Fragment as I, renderList as te, toDisplayString as we } from "vue";
+import { u as Ce, o as $e, e as se, g as Pe, c as Fe, t as Oe, a as Ie, p as x, b as Ae, v as f, d as A, X as Me, s as Ue, i as Ye, f as Ne } from "./index-B9RAElpI.js";
+import { _ as Se } from "./Title-zZtEcB9F.js";
+import { u as Te, U as qe } from "./usePrinter-CwTAwqtF.js";
+import Le from "./vue-ui-skeleton-DVYD_VSe.js";
+import { u as oe } from "./useNestedProp-DuruL3Nt.js";
+import { _ as Ve } from "./PackageVersion-C_FFs0BP.js";
+import { P as Ee } from "./PenAndPaper-Dx24BtRW.js";
+import { u as Ge } from "./useUserOptionState-BIvW1Kz7.js";
+import { _ as We } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const je = ["id"], ze = {
   key: 1,
   ref: "noTitle",
   class: "vue-data-ui-no-title-space",
   style: "height:36px; width: 100%;background:transparent"
-}, je = {
+}, Be = {
   key: 2,
   style: "width:100%"
-}, De = ["xmlns", "viewBox"], He = {
+}, De = ["xmlns", "viewBox"], He = ["width", "height"], Xe = {
   id: "vueUiPill",
   clipPathUnits: "objectBoundingBox"
-}, Xe = ["fill"], Re = ["id"], Je = ["stop-color"], Ke = ["stop-color"], Qe = ["stop-color"], Ze = { "clip-path": "url(#vueUiPill)" }, et = ["x", "y", "height", "width"], tt = ["x", "y", "height", "width", "fill"], st = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], ot = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], at = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], lt = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], rt = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], ut = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], nt = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], it = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], ct = ["x", "y", "height", "width"], ht = ["y", "x", "fill", "font-size", "font-weight"], dt = {
+}, Re = ["fill"], Je = ["id"], Ke = ["stop-color"], Qe = ["stop-color"], Ze = ["stop-color"], et = { "clip-path": "url(#vueUiPill)" }, tt = ["x", "y", "height", "width"], st = ["x", "y", "height", "width", "fill"], ot = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], at = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], lt = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], rt = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], nt = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], ut = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], it = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], ht = ["x1", "x2", "y1", "y2", "stroke-width", "stroke"], ct = ["x", "y", "height", "width"], dt = ["y", "x", "fill", "font-size", "font-weight"], vt = {
   key: 5,
   class: "vue-data-ui-watermark"
-}, vt = {
+}, yt = {
   key: 6,
   ref: "source",
   dir: "auto"
-}, yt = {
+}, ft = {
   __name: "vue-ui-thermometer",
   props: {
     dataset: {
@@ -43,22 +43,22 @@ const ze = ["id"], Be = {
     }
   },
   setup(_, { expose: ae }) {
-    const a = _;
+    const l = _;
     me((s) => ({
-      "47ac6abe": he.value,
-      cafb14e0: ce.value,
-      "02502e7d": ie.value
+      "7f5072bd": ce.value,
+      "575f6d71": he.value,
+      "041baa9e": ie.value
     }));
-    const { vue_ui_thermometer: le } = Ce(), M = d(() => !!a.dataset && Object.keys(a.dataset).length);
+    const { vue_ui_thermometer: le } = Ce(), M = d(() => !!l.dataset && Object.keys(l.dataset).length);
     ke(() => {
-      E();
+      W();
     });
-    function E() {
-      $e(a.dataset) ? se({
+    function W() {
+      $e(l.dataset) ? se({
         componentName: "VueUiThermometer",
         type: "dataset"
       }) : Pe({
-        datasetObject: a.dataset,
+        datasetObject: l.dataset,
         requiredAttributes: ["value", "from", "to"]
       }).forEach((s) => {
         se({
@@ -68,30 +68,30 @@ const ze = ["id"], Be = {
         });
       });
     }
-    const m = g(Fe()), U = g(null), z = g(0), B = g(0), e = d({
+    const m = p(Fe()), U = p(null), j = p(0), z = p(0), e = d({
       get: () => H(),
       set: (s) => s
-    }), { userOptionsVisible: Y, setUserOptionsVisibility: j, keepUserOptionState: D } = We({ config: e.value });
+    }), { userOptionsVisible: Y, setUserOptionsVisibility: B, keepUserOptionState: D } = Ge({ config: e.value });
     function H() {
       const s = oe({
-        userConfig: a.config,
+        userConfig: l.config,
         defaultConfig: le
       });
       return s.theme ? {
         ...oe({
-          userConfig: Ie.vue_ui_thermometer[s.theme] || a.config,
+          userConfig: Oe.vue_ui_thermometer[s.theme] || l.config,
           defaultConfig: s
         }),
-        customPalette: Oe[s.theme] || x
+        customPalette: Ie[s.theme] || x
       } : s;
     }
-    be(() => a.config, (s) => {
-      e.value = H(), Y.value = !e.value.showOnChartHover, E(), B.value += 1;
+    be(() => l.config, (s) => {
+      e.value = H(), Y.value = !e.value.showOnChartHover, W(), z.value += 1;
     }, { deep: !0 });
     const { isPrinting: X, isImaging: R, generatePdf: J, generateImage: K } = Te({
       elementId: `thermometer__${m.value}`,
       fileName: e.value.style.title.text || "vue-ui-thermometer"
-    }), re = d(() => e.value.userOptions.show && !e.value.style.title.text), w = d(() => Ae(e.value.customPalette)), ue = d(() => e.value.style.chart.thermometer.width), y = d(() => a.dataset.steps || 10), h = g({
+    }), re = d(() => e.value.userOptions.show && !e.value.style.title.text), w = d(() => Ae(e.value.customPalette)), ne = d(() => e.value.style.chart.thermometer.width), y = d(() => l.dataset.steps || 10), c = p({
       top: e.value.style.chart.padding.top,
       left: e.value.style.chart.padding.left,
       right: e.value.style.chart.padding.right,
@@ -120,32 +120,32 @@ const ze = ["id"], Be = {
       return s.toString(16).padStart(2, "0");
     }
     const o = d(() => {
-      const s = ue.value + h.value.left + h.value.right, r = e.value.style.chart.height;
+      const s = ne.value + c.value.left + c.value.right, r = e.value.style.chart.height;
       return {
         width: s,
-        left: h.value.left,
-        right: s - h.value.right,
-        top: h.value.top,
-        bottom: r - h.value.bottom,
+        left: c.value.left,
+        right: s - c.value.right,
+        top: c.value.top,
+        bottom: r - c.value.bottom,
         height: r
       };
-    }), ne = d(() => o.value), T = d(() => {
-      const s = f(a.dataset.from) < 0 ? Math.abs(f(a.dataset.from)) : f(a.dataset.from), r = f(a.dataset.to) < 0 ? Math.abs(f(a.dataset.to)) : f(a.dataset.to);
+    }), ue = d(() => o.value), T = d(() => {
+      const s = f(l.dataset.from) < 0 ? Math.abs(f(l.dataset.from)) : f(l.dataset.from), r = f(l.dataset.to) < 0 ? Math.abs(f(l.dataset.to)) : f(l.dataset.to);
       let t = 0;
-      return f(a.dataset.to) > 0 ? t = s + r : s > r ? t = s - r : t = r - s, (1 - (Math.abs(f(a.dataset.from)) + f(a.dataset.value)) / t) * (o.value.height - h.value.top - h.value.bottom);
-    }), ie = d(() => `${T.value}px`), ce = d(() => `${o.value.height - e.value.style.chart.padding.bottom - h.value.top}px`), he = d(() => `${e.value.style.chart.animation.speedMs}ms`), de = d(() => {
-      if (a.dataset.colors) {
-        if (!a.dataset.colors.from)
-          return C(w.value[0] || x[0], A(a.dataset.colors.to), y.value || 10);
-        if (!a.dataset.colors.to)
-          return C(A(a.dataset.colors.from), w.value[1] || x[1], y.value || 10);
+      return f(l.dataset.to) > 0 ? t = s + r : s > r ? t = s - r : t = r - s, (1 - (Math.abs(f(l.dataset.from)) + f(l.dataset.value)) / t) * (o.value.height - c.value.top - c.value.bottom);
+    }), ie = d(() => `${T.value}px`), he = d(() => `${o.value.height - e.value.style.chart.padding.bottom - c.value.top}px`), ce = d(() => `${e.value.style.chart.animation.speedMs}ms`), de = d(() => {
+      if (l.dataset.colors) {
+        if (!l.dataset.colors.from)
+          return C(w.value[0] || x[0], A(l.dataset.colors.to), y.value || 10);
+        if (!l.dataset.colors.to)
+          return C(A(l.dataset.colors.from), w.value[1] || x[1], y.value || 10);
       } else
         return C(w.value[1] || x[1], w.value[0] || x[0], y.value || 10);
-      return C(A(a.dataset.colors.from), A(a.dataset.colors.to), y.value || 10);
+      return C(A(l.dataset.colors.from), A(l.dataset.colors.to), y.value || 10);
     }), Z = d(() => {
       const s = [];
       let r = 0;
-      const t = o.value.height - h.value.top - h.value.bottom;
+      const t = o.value.height - c.value.top - c.value.bottom;
       for (let u = 0; u < t - 1; u += t / y.value)
         s.push({
           x: o.value.left,
@@ -157,11 +157,11 @@ const ze = ["id"], Be = {
           height: t / y.value
         }), r += 1;
       return s;
-    }), k = g(!1);
+    }), k = p(!1);
     function ve(s) {
-      k.value = s, z.value += 1;
+      k.value = s, j.value += 1;
     }
-    const $ = g(!1);
+    const $ = p(!1);
     function q() {
       $.value = !$.value;
     }
@@ -169,16 +169,16 @@ const ze = ["id"], Be = {
       generatePdf: J,
       generateImage: K,
       toggleAnnotator: q
-    }), (s, r) => (l(), n("div", {
+    }), (s, r) => (a(), n("div", {
       ref_key: "thermoChart",
       ref: U,
       class: P(`vue-ui-thermometer ${k.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
       style: ee(`width:100%;background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color};font-family:${e.value.style.fontFamily}`),
       id: `thermometer__${m.value}`,
-      onMouseenter: r[0] || (r[0] = () => c(j)(!0)),
-      onMouseleave: r[1] || (r[1] = () => c(j)(!1))
+      onMouseenter: r[0] || (r[0] = () => h(B)(!0)),
+      onMouseleave: r[1] || (r[1] = () => h(B)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (l(), F(Ge, {
+      e.value.userOptions.buttons.annotator ? (a(), F(Ee, {
         key: 0,
         parent: U.value,
         backgroundColor: e.value.style.chart.backgroundColor,
@@ -186,10 +186,10 @@ const ze = ["id"], Be = {
         active: $.value,
         onClose: q
       }, null, 8, ["parent", "backgroundColor", "color", "active"])) : i("", !0),
-      re.value ? (l(), n("div", Be, null, 512)) : i("", !0),
-      e.value.style.title.text ? (l(), n("div", je, [
-        (l(), F(Se, {
-          key: `title_${B.value}`,
+      re.value ? (a(), n("div", ze, null, 512)) : i("", !0),
+      e.value.style.title.text ? (a(), n("div", Be, [
+        (a(), F(Se, {
+          key: `title_${z.value}`,
           config: {
             title: {
               cy: "thermometer-div-title",
@@ -202,13 +202,13 @@ const ze = ["id"], Be = {
           }
         }, null, 8, ["config"]))
       ])) : i("", !0),
-      e.value.userOptions.show && M.value && (c(D) || c(Y)) ? (l(), F(qe, {
+      e.value.userOptions.show && M.value && (h(D) || h(Y)) ? (a(), F(qe, {
         ref: "details",
-        key: `user_options_${z.value}`,
+        key: `user_options_${j.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        isImaging: c(R),
-        isPrinting: c(X),
+        isImaging: h(R),
+        isPrinting: h(X),
         uid: m.value,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasImg: e.value.userOptions.buttons.img,
@@ -221,53 +221,65 @@ const ze = ["id"], Be = {
         hasAnnotator: e.value.userOptions.buttons.annotator,
         isAnnotation: $.value,
         onToggleFullscreen: ve,
-        onGeneratePdf: c(J),
-        onGenerateImage: c(K),
+        onGeneratePdf: h(J),
+        onGenerateImage: h(K),
         onToggleAnnotator: q,
         style: ee({
-          visibility: c(D) ? c(Y) ? "visible" : "hidden" : "visible"
+          visibility: h(D) ? h(Y) ? "visible" : "hidden" : "visible"
         })
       }, xe({ _: 2 }, [
         s.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: I(() => [
-            p(s.$slots, "optionPdf", {}, void 0, !0)
+          fn: O(() => [
+            g(s.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "0"
         } : void 0,
         s.$slots.optionImg ? {
           name: "optionImg",
-          fn: I(() => [
-            p(s.$slots, "optionImg", {}, void 0, !0)
+          fn: O(() => [
+            g(s.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         s.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: I(({ toggleFullscreen: t, isFullscreen: u }) => [
-            p(s.$slots, "optionFullscreen", G(W({ toggleFullscreen: t, isFullscreen: u })), void 0, !0)
+          fn: O(({ toggleFullscreen: t, isFullscreen: u }) => [
+            g(s.$slots, "optionFullscreen", E(G({ toggleFullscreen: t, isFullscreen: u })), void 0, !0)
           ]),
           key: "2"
         } : void 0,
         s.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: I(({ toggleAnnotator: t, isAnnotator: u }) => [
-            p(s.$slots, "optionAnnotator", G(W({ toggleAnnotator: t, isAnnotator: u })), void 0, !0)
+          fn: O(({ toggleAnnotator: t, isAnnotator: u }) => [
+            g(s.$slots, "optionAnnotator", E(G({ toggleAnnotator: t, isAnnotator: u })), void 0, !0)
           ]),
           key: "3"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasPdf", "hasImg", "hasFullscreen", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage", "style"])) : i("", !0),
-      M.value ? (l(), n("svg", {
+      M.value ? (a(), n("svg", {
         key: 4,
-        xmlns: c(Me),
+        xmlns: h(Me),
         class: P({ "vue-data-ui-fullscreen--on": k.value, "vue-data-ui-fulscreen--off": !k.value }),
         width: "100%",
         viewBox: `0 0 ${o.value.width} ${o.value.height}`,
         style: "background:transparent"
       }, [
         _e(Ve),
+        s.$slots["chart-background"] ? (a(), n("foreignObject", {
+          key: 0,
+          x: 0,
+          y: 0,
+          width: o.value.width,
+          height: o.value.height,
+          style: {
+            pointerEvents: "none"
+          }
+        }, [
+          g(s.$slots, "chart-background", {}, void 0, !0)
+        ], 8, He)) : i("", !0),
         v("defs", null, [
-          v("clipPath", He, [
+          v("clipPath", Xe, [
             v("rect", {
               x: "0",
               y: "0",
@@ -276,9 +288,9 @@ const ze = ["id"], Be = {
               rx: "0.5",
               ry: "0.07",
               fill: e.value.style.chart.backgroundColor
-            }, null, 8, Xe)
+            }, null, 8, Re)
           ]),
-          (l(!0), n(O, null, te(Z.value, (t, u) => (l(), n("linearGradient", {
+          (a(!0), n(I, null, te(Z.value, (t, u) => (a(), n("linearGradient", {
             id: `vueUiThermometerGradient_${u}_${m.value}`,
             x1: "0%",
             y1: "0%",
@@ -288,26 +300,26 @@ const ze = ["id"], Be = {
             v("stop", {
               offset: "0%",
               "stop-color": t.color
-            }, null, 8, Je),
+            }, null, 8, Ke),
             v("stop", {
               offset: "50%",
-              "stop-color": c(Ue)(t.color, 100 - e.value.style.chart.graduations.gradient.intensity)
-            }, null, 8, Ke),
+              "stop-color": h(Ue)(t.color, 100 - e.value.style.chart.graduations.gradient.intensity)
+            }, null, 8, Qe),
             v("stop", {
               offset: "100%",
               "stop-color": t.color
-            }, null, 8, Qe)
-          ], 8, Re))), 256))
+            }, null, 8, Ze)
+          ], 8, Je))), 256))
         ]),
-        v("g", Ze, [
+        v("g", et, [
           v("rect", {
             x: o.value.left,
             y: o.value.top,
-            height: o.value.height - h.value.top - h.value.bottom,
-            width: o.value.width - h.value.left - h.value.right,
+            height: o.value.height - c.value.top - c.value.bottom,
+            width: o.value.width - c.value.left - c.value.right,
             fill: "#FFFFFF"
-          }, null, 8, et),
-          (l(!0), n(O, null, te(Z.value, (t, u) => (l(), n("g", {
+          }, null, 8, tt),
+          (a(!0), n(I, null, te(Z.value, (t, u) => (a(), n("g", {
             key: `graduation_${u}`
           }, [
             v("rect", {
@@ -317,8 +329,8 @@ const ze = ["id"], Be = {
               width: o.value.width - e.value.style.chart.padding.left - e.value.style.chart.padding.right,
               fill: e.value.style.chart.graduations.gradient.show ? `url(#vueUiThermometerGradient_${u}_${m.value})` : t.color,
               "shape-rendering": "crispEdges"
-            }, null, 8, tt),
-            e.value.style.chart.graduations.show && ["both", "left"].includes(e.value.style.chart.graduations.sides) ? (l(), n("line", {
+            }, null, 8, st),
+            e.value.style.chart.graduations.show && ["both", "left"].includes(e.value.style.chart.graduations.sides) ? (a(), n("line", {
               key: 0,
               x1: t.x,
               x2: t.x + 10,
@@ -327,9 +339,9 @@ const ze = ["id"], Be = {
               "stroke-width": e.value.style.chart.graduations.strokeWidth,
               stroke: e.value.style.chart.graduations.stroke,
               "stroke-linecap": "round"
-            }, null, 8, st)) : i("", !0),
-            e.value.style.chart.graduations.showIntermediate ? (l(), n(O, { key: 1 }, [
-              e.value.style.chart.graduations.show && ["both", "left"].includes(e.value.style.chart.graduations.sides) ? (l(), n("line", {
+            }, null, 8, ot)) : i("", !0),
+            e.value.style.chart.graduations.showIntermediate ? (a(), n(I, { key: 1 }, [
+              e.value.style.chart.graduations.show && ["both", "left"].includes(e.value.style.chart.graduations.sides) ? (a(), n("line", {
                 key: 0,
                 x1: t.x,
                 x2: t.x + 5,
@@ -338,8 +350,8 @@ const ze = ["id"], Be = {
                 "stroke-width": e.value.style.chart.graduations.strokeWidth / 2,
                 stroke: e.value.style.chart.graduations.stroke,
                 "stroke-linecap": "round"
-              }, null, 8, ot)) : i("", !0),
-              e.value.style.chart.graduations.show && ["both", "left"].includes(e.value.style.chart.graduations.sides) ? (l(), n("line", {
+              }, null, 8, at)) : i("", !0),
+              e.value.style.chart.graduations.show && ["both", "left"].includes(e.value.style.chart.graduations.sides) ? (a(), n("line", {
                 key: 1,
                 x1: t.x,
                 x2: t.x + 2.5,
@@ -348,8 +360,8 @@ const ze = ["id"], Be = {
                 "stroke-width": e.value.style.chart.graduations.strokeWidth / 2,
                 stroke: e.value.style.chart.graduations.stroke,
                 "stroke-linecap": "round"
-              }, null, 8, at)) : i("", !0),
-              e.value.style.chart.graduations.show && ["both", "left"].includes(e.value.style.chart.graduations.sides) ? (l(), n("line", {
+              }, null, 8, lt)) : i("", !0),
+              e.value.style.chart.graduations.show && ["both", "left"].includes(e.value.style.chart.graduations.sides) ? (a(), n("line", {
                 key: 2,
                 x1: t.x,
                 x2: t.x + 2.5,
@@ -358,9 +370,9 @@ const ze = ["id"], Be = {
                 "stroke-width": e.value.style.chart.graduations.strokeWidth / 2,
                 stroke: e.value.style.chart.graduations.stroke,
                 "stroke-linecap": "round"
-              }, null, 8, lt)) : i("", !0)
+              }, null, 8, rt)) : i("", !0)
             ], 64)) : i("", !0),
-            e.value.style.chart.graduations.show && ["both", "right"].includes(e.value.style.chart.graduations.sides) ? (l(), n("line", {
+            e.value.style.chart.graduations.show && ["both", "right"].includes(e.value.style.chart.graduations.sides) ? (a(), n("line", {
               key: 2,
               x1: o.value.right,
               x2: o.value.right - 10,
@@ -369,9 +381,9 @@ const ze = ["id"], Be = {
               "stroke-width": e.value.style.chart.graduations.strokeWidth,
               stroke: e.value.style.chart.graduations.stroke,
               "stroke-linecap": "round"
-            }, null, 8, rt)) : i("", !0),
-            e.value.style.chart.graduations.showIntermediate ? (l(), n(O, { key: 3 }, [
-              e.value.style.chart.graduations.show && ["both", "right"].includes(e.value.style.chart.graduations.sides) ? (l(), n("line", {
+            }, null, 8, nt)) : i("", !0),
+            e.value.style.chart.graduations.showIntermediate ? (a(), n(I, { key: 3 }, [
+              e.value.style.chart.graduations.show && ["both", "right"].includes(e.value.style.chart.graduations.sides) ? (a(), n("line", {
                 key: 0,
                 x1: o.value.right,
                 x2: o.value.right - 5,
@@ -381,7 +393,7 @@ const ze = ["id"], Be = {
                 stroke: e.value.style.chart.graduations.stroke,
                 "stroke-linecap": "round"
               }, null, 8, ut)) : i("", !0),
-              e.value.style.chart.graduations.show && ["both", "right"].includes(e.value.style.chart.graduations.sides) ? (l(), n("line", {
+              e.value.style.chart.graduations.show && ["both", "right"].includes(e.value.style.chart.graduations.sides) ? (a(), n("line", {
                 key: 1,
                 x1: o.value.right,
                 x2: o.value.right - 2.5,
@@ -390,8 +402,8 @@ const ze = ["id"], Be = {
                 "stroke-width": e.value.style.chart.graduations.strokeWidth / 2,
                 stroke: e.value.style.chart.graduations.stroke,
                 "stroke-linecap": "round"
-              }, null, 8, nt)) : i("", !0),
-              e.value.style.chart.graduations.show && ["both", "right"].includes(e.value.style.chart.graduations.sides) ? (l(), n("line", {
+              }, null, 8, it)) : i("", !0),
+              e.value.style.chart.graduations.show && ["both", "right"].includes(e.value.style.chart.graduations.sides) ? (a(), n("line", {
                 key: 2,
                 x1: o.value.right,
                 x2: o.value.right - 2.5,
@@ -400,7 +412,7 @@ const ze = ["id"], Be = {
                 "stroke-width": e.value.style.chart.graduations.strokeWidth / 2,
                 stroke: e.value.style.chart.graduations.stroke,
                 "stroke-linecap": "round"
-              }, null, 8, it)) : i("", !0)
+              }, null, 8, ht)) : i("", !0)
             ], 64)) : i("", !0)
           ]))), 128)),
           v("rect", {
@@ -420,26 +432,26 @@ const ze = ["id"], Be = {
           fill: e.value.style.chart.label.color,
           "font-size": e.value.style.chart.label.fontSize,
           "font-weight": e.value.style.chart.label.bold ? "bold" : "normal"
-        }, we(c(Ye)(
+        }, we(h(Ye)(
           e.value.style.chart.label.formatter,
           _.dataset.value,
-          c(Ne)({
+          h(Ne)({
             p: e.value.style.chart.label.prefix,
             v: _.dataset.value,
             s: e.value.style.chart.label.suffix,
             r: e.value.style.chart.label.rounding
           }),
           { datapoint: _.dataset }
-        )), 11, ht),
-        p(s.$slots, "svg", { svg: ne.value }, void 0, !0)
+        )), 11, dt),
+        g(s.$slots, "svg", { svg: ue.value }, void 0, !0)
       ], 10, De)) : i("", !0),
-      s.$slots.watermark ? (l(), n("div", dt, [
-        p(s.$slots, "watermark", G(W({ isPrinting: c(X) || c(R) })), void 0, !0)
+      s.$slots.watermark ? (a(), n("div", vt, [
+        g(s.$slots, "watermark", E(G({ isPrinting: h(X) || h(R) })), void 0, !0)
       ])) : i("", !0),
-      s.$slots.source ? (l(), n("div", vt, [
-        p(s.$slots, "source", {}, void 0, !0)
+      s.$slots.source ? (a(), n("div", yt, [
+        g(s.$slots, "source", {}, void 0, !0)
       ], 512)) : i("", !0),
-      M.value ? i("", !0) : (l(), F(Le, {
+      M.value ? i("", !0) : (a(), F(Le, {
         key: 7,
         config: {
           type: "thermometer",
@@ -451,9 +463,9 @@ const ze = ["id"], Be = {
           }
         }
       }, null, 8, ["config"]))
-    ], 46, ze));
+    ], 46, je));
   }
-}, $t = /* @__PURE__ */ Ee(yt, [["__scopeId", "data-v-90584bea"]]);
+}, Pt = /* @__PURE__ */ We(ft, [["__scopeId", "data-v-f7910f15"]]);
 export {
-  $t as default
+  Pt as default
 };

package/dist/vue-ui-timer-BUuk2p4C.cjs

@@ -0,0 +1,64 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),L=require("./useNestedProp-DkpuL8Iv.cjs"),g=require("./index-DaDv7p0W.cjs"),R=require("./useResponsive-BJ7DTGpm.cjs"),B=require("./BaseIcon-DD3GLrhS.cjs"),j=require("./Title-CpfNWbUc.cjs"),O=require("./PackageVersion-nr7f_VNw.cjs"),q=require("./_plugin-vue_export-helper-BHFhmbuH.cjs");class U{constructor(P,p,y,T=!0,b=!0){this.interval=p,this.elapsed=0,this.isPaused=!1;const S=`
+            let interval;
+            let elapsed = 0;
+            let paused = false;
+            let startTime;
+            let tickInterval;
+
+            onmessage = function(e) {
+                const { action, data } = e.data;
+
+                switch(action) {
+                    case 'start':
+                        startTime = Date.now();
+                        tickInterval = data.interval;
+                        elapsed = 0;
+                        paused = false;
+                        interval = setInterval(() => {
+                            elapsed += tickInterval;
+                            postMessage({ elapsed, timestamp: Date.now() });
+                        }, tickInterval);
+                        break;
+                    
+                    case 'pause':
+                        paused = true;
+                        clearInterval(interval);
+                        elapsed = Date.now() - startTime;
+                        break;
+
+                    case 'resume':
+                        if (paused) {
+                            startTime = Date.now() - elapsed;
+                            interval = setInterval(() => {
+                                elapsed += tickInterval;
+                                postMessage({ elapsed, timestamp: Date.now() });
+                            }, tickInterval);
+                        }
+                        paused = false;
+                        break;
+
+                    case 'stop':
+                        clearInterval(interval);
+                        elapsed = 0;
+                        postMessage({ elapsed });
+                        break;
+
+                    case 'reset':
+                        elapsed = 0;
+                        clearInterval(interval);
+                        postMessage({ elapsed });
+                        break;
+
+                    case 'lap':
+                        postMessage({
+                            elapsed,
+                            timestamp: Date.now(),
+                            action: 'lap'
+                        });
+                        break;
+
+                    default:
+                        break;
+                }
+            };
+        `,M=new Blob([S],{type:"application/javascript"}),k=URL.createObjectURL(M),n=new Worker(k);function _(u){let t=Math.floor(u/1e3),h=Math.floor(u%1e3/10),f=Math.floor(t/3600),a=Math.floor(t%3600/60),i=t%60,r="";return b&&(r+=String(f).padStart(2,"0")+":"),r+=String(a).padStart(2,"0")+":",r+=String(i).padStart(2,"0"),T&&(r+="."+String(h).padStart(2,"0")),r}this.start=()=>{this.isPaused=!1,n.postMessage({action:"start",data:{interval:this.interval}})},this.pause=()=>{this.isPaused?this.resume():(this.isPaused=!0,n.postMessage({action:"pause"}))},this.resume=()=>{this.isPaused&&(n.postMessage({action:"resume"}),this.isPaused=!1)},this.stop=()=>{n.postMessage({action:"stop"}),this.isPaused=!1},this.reset=()=>{n.postMessage({action:"reset"}),this.elapsed=0,this.isPaused=!1},this.restart=()=>{this.stop(),this.start()},this.lap=()=>new Promise(u=>{n.postMessage({action:"lap"});const t=h=>{const{elapsed:f,timestamp:a,action:i}=h.data;if(i==="lap"){const r=_(f);u({timestamp:a||0,elapsed:f,formatted:r})}};n.addEventListener("message",t,{once:!0})}),n.onmessage=u=>{const{elapsed:t,timestamp:h}=u.data;this.elapsed=t,P({timestamp:h||0,elapsed:this.elapsed,formatted:_(this.elapsed)})},n.onerror=u=>{y&&y(u)}}}const W=["xmlns","viewBox"],G=["width","height"],X={key:1},J=["id"],K=["stop-color"],Q=["stop-color"],Y=["cx","cy","r","fill","stroke","stroke-width"],Z=["d","stroke","stroke-width"],ee=["r","fill","stroke","stroke-width"],te=["r","fill","stroke","stroke-width"],ae=["x","y"],le=["x","y","font-size","fill","font-weight"],se={key:0,class:"vue-ui-timer-controls"},oe=["title"],re=["title"],ne=["title"],ue=["title"],ie=["title"],ce={__name:"vue-ui-timer",props:{config:{type:Object,default(){return{}}}},emits:["start","pause","reset","restart","lap"],setup($,{expose:P,emit:p}){const y=$,{vue_ui_timer:T}=g.useConfig(),b=e.ref(null),S=e.ref(null),M=e.ref(null),k=e.ref(null),n=e.ref(g.createUid()),_=e.ref(0);e.onMounted(()=>{u()});function u(){if(t.value.responsive){const l=R.throttle(()=>{const{width:o,height:c}=R.useResponsive({chart:b.value,title:t.value.style.title.text?S.value:null,legend:M.value});a.value.width=o,a.value.height=c,a.value.tracker.core=g.translateSize({relator:Math.min(o,c),adjuster:t.value.style.width,source:6*t.value.stopwatch.tracker.radiusRatio,threshold:1,fallback:1}),a.value.tracker.aura=g.translateSize({relator:Math.min(o,c),adjuster:t.value.style.width,source:12*t.value.stopwatch.tracker.aura.radiusRatio,threshold:1,fallback:1}),a.value.label=g.translateSize({relator:Math.min(o,c),adjuster:t.value.style.width,source:t.value.stopwatch.label.fontSize,threshold:10,fallback:10})});k.value=new ResizeObserver(l),k.value.observe(b.value.parentNode)}}e.onBeforeUnmount(()=>{k.value&&k.value.disconnect()});const t=e.computed({get:()=>h(),set:l=>l});function h(){return L.useNestedProp({userConfig:y.config,defaultConfig:T})}e.watch(()=>y.config,l=>{t.value=h(),u(),_.value+=1},{deep:!0});const f=e.computed(()=>{if(t.value.stopwatch.showHours&&t.value.stopwatch.showHundredth)return"00:00:00.00";if(t.value.stopwatch.showHours&&!t.value.stopwatch.showHundredth)return"00:00:00";if(!t.value.stopwatch.showHours&&t.value.stopwatch.showHundredth)return"00:00.00";if(!t.value.stopwatch.showHours&&!t.value.stopwatch.showHundredth)return"00:00"}),a=e.ref({height:t.value.style.height,width:t.value.style.width,tracker:{core:6*t.value.stopwatch.tracker.radiusRatio,aura:12*t.value.stopwatch.tracker.aura.radiusRatio},label:t.value.stopwatch.label.fontSize}),i=e.ref(0),r=new U(l=>D(l),10,"",t.value.stopwatch.showHundredth,t.value.stopwatch.showHours),N=e.ref(!0),s=e.ref(!1),d=e.ref(!1);function V(){p("start"),N.value&&r.start(),N.value=!1,s.value=!0}function x(){s.value&&(p("reset"),r.stop(),m.value=[],N.value=!0,s.value=!1)}function z(){d.value=!d.value,p("pause",i.value),r.pause()}function I(){s.value&&(d.value=!1,p("restart"),m.value=[],r.restart())}const m=e.ref([]);async function E(){if(!s.value||d.value)return;const l=await r.lap();l&&(m.value.push(l),p("lap",m.value))}function D({timestamp:l,elapsed:o,formatted:c}){i.value={timestamp:l,elapsed:o,formatted:c}}const v=e.computed(()=>Math.min(a.value.width,a.value.height)/2.5*t.value.stopwatch.track.radiusRatio);function F(l,o){const C=360/(o*1e3);return l*C%360}function H(l){let o=l*(Math.PI/180),c=a.value.width/2+v.value*Math.cos(o),C=a.value.height/2+v.value*Math.sin(o);return{cx:c,cy:C}}const w=e.computed(()=>{const l=F(i.value.elapsed,t.value.stopwatch.cycleSeconds),{cx:o,cy:c}=H(l-90),C=l>180?1:0;return{cx:o||a.value.width/2,cy:c||a.value.height/2-v.value,largeArcFlag:C,sweepFlag:1}});return P({start:V,pause:z,reset:x,restart:I,lap:E}),(l,o)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"timerChart",ref:b,class:"vue-ui-timer",style:e.normalizeStyle({fontFamily:t.value.style.fontFamily,width:"100%",height:t.value.responsive?"100%":"auto",textAlign:"center"})},[t.value.style.title.text?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"chartTitle",ref:S,style:e.normalizeStyle({width:"100%",background:t.value.style.backgroundColor})},[(e.openBlock(),e.createBlock(j._sfc_main,{key:`title_${_.value}`,config:{title:{cy:"title",...t.value.style.title},subtitle:{cy:"subtitle",...t.value.style.title.subtitle}}},null,8,["config"]))],4)):e.createCommentVNode("",!0),(e.openBlock(),e.createElementBlock("svg",{xmlns:e.unref(g.XMLNS),viewBox:`0 0 ${a.value.width<=0?10:a.value.width} ${a.value.height<=0?10:a.value.height}`,style:e.normalizeStyle({maxWidth:"100%",overflow:"visible",background:t.value.style.backgroundColor})},[e.createVNode(O._sfc_main),l.$slots["chart-background"]?(e.openBlock(),e.createElementBlock("foreignObject",{key:0,x:0,y:0,width:a.value.width<=0?10:a.value.width,height:a.value.height<=0?10:a.value.height,style:{pointerEvents:"none"}},[e.renderSlot(l.$slots,"chart-background",{},void 0,!0)],8,G)):e.createCommentVNode("",!0),t.value.stopwatch.tracker.gradient.show?(e.openBlock(),e.createElementBlock("defs",X,[e.createElementVNode("radialGradient",{id:`tracker_gradient_${n.value}`,cx:"50%",cy:"50%",r:"50%",fx:"50%",fy:"50%"},[e.createElementVNode("stop",{offset:"0%","stop-color":t.value.stopwatch.tracker.gradient.color},null,8,K),e.createElementVNode("stop",{offset:"100%","stop-color":t.value.stopwatch.tracker.fill},null,8,Q)],8,J)])):e.createCommentVNode("",!0),e.createElementVNode("circle",{cx:a.value.width/2,cy:a.value.height/2,r:v.value,fill:t.value.stopwatch.track.fill,stroke:t.value.stopwatch.track.stroke,"stroke-width":t.value.stopwatch.track.strokeWidth},null,8,Y),t.value.stopwatch.cycleTrack.show?(e.openBlock(),e.createElementBlock("path",{key:2,d:`M ${a.value.width/2},${a.value.height/2-v.value} A ${v.value},${v.value} 0 ${w.value.largeArcFlag},${w.value.sweepFlag} ${w.value.cx},${w.value.cy}`,stroke:t.value.stopwatch.cycleTrack.stroke,"stroke-width":t.value.stopwatch.cycleTrack.strokeWidth,"stroke-linecap":"round",fill:"none"},null,8,Z)):e.createCommentVNode("",!0),e.createElementVNode("circle",e.mergeProps(w.value,{r:a.value.tracker.core,fill:t.value.stopwatch.tracker.gradient.show?`url(#tracker_gradient_${n.value})`:t.value.stopwatch.tracker.fill,stroke:t.value.stopwatch.tracker.stroke,"stroke-width":t.value.stopwatch.tracker.strokeWidth}),null,16,ee),t.value.stopwatch.tracker.aura.show?(e.openBlock(),e.createElementBlock("circle",e.mergeProps({key:3},w.value,{r:a.value.tracker.aura,fill:`${t.value.stopwatch.tracker.aura.fill}20`,stroke:t.value.stopwatch.tracker.aura.stroke,"stroke-width":t.value.stopwatch.tracker.aura.strokeWidth}),null,16,te)):e.createCommentVNode("",!0),l.$slots.time?(e.openBlock(),e.createElementBlock("foreignObject",{key:4,x:a.value.width/2,y:a.value.height/2,height:"0.1",width:"0.1",style:{overflow:"visible"}},[e.renderSlot(l.$slots,"time",e.normalizeProps(e.guardReactiveProps({...i.value})),void 0,!0)],8,ae)):(e.openBlock(),e.createElementBlock("text",{key:5,x:a.value.width/2,y:a.value.height/2+a.value.label/4,"font-size":a.value.label,"text-anchor":"middle",fill:t.value.stopwatch.label.color,"font-weight":t.value.stopwatch.label.bold?"bold":"normal",style:{"font-variant-numeric":"tabular-nums !important"}},e.toDisplayString(i.value.formatted||f.value),9,le))],12,W)),e.createElementVNode("div",{ref_key:"chartLegend",ref:M,style:e.normalizeStyle({width:"100%",backgroundColor:t.value.stopwatch.legend.backgroundColor})},[l.$slots.controls?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",se,[t.value.stopwatch.legend.buttons.start?(e.openBlock(),e.createElementBlock("button",{key:0,title:t.value.stopwatch.legend.buttonTitles.start,onClick:V,class:"vue-ui-timer-button",style:e.normalizeStyle({opacity:s.value?.2:1,cursor:s.value?"default":"pointer"})},[e.createVNode(B.default,{name:"play",stroke:t.value.stopwatch.legend.buttons.iconColor},null,8,["stroke"])],12,oe)):e.createCommentVNode("",!0),t.value.stopwatch.legend.buttons.pause?(e.openBlock(),e.createElementBlock("button",{key:1,title:d.value?t.value.stopwatch.legend.buttonTitles.resume:t.value.stopwatch.legend.buttonTitles.pause,onClick:z,class:"vue-ui-timer-button",style:e.normalizeStyle({opacity:s.value?1:.2,cursor:s.value?"pointer":"default"})},[e.createVNode(B.default,{name:"pause",stroke:t.value.stopwatch.legend.buttons.iconColor},null,8,["stroke"])],12,re)):e.createCommentVNode("",!0),t.value.stopwatch.legend.buttons.reset?(e.openBlock(),e.createElementBlock("button",{key:2,title:t.value.stopwatch.legend.buttonTitles.reset,onClick:x,class:"vue-ui-timer-button",style:e.normalizeStyle({opacity:s.value?1:.2,cursor:s.value?"pointer":"default"})},[e.createVNode(B.default,{name:"stop",stroke:t.value.stopwatch.legend.buttons.iconColor},null,8,["stroke"])],12,ne)):e.createCommentVNode("",!0),t.value.stopwatch.legend.buttons.restart?(e.openBlock(),e.createElementBlock("button",{key:3,title:t.value.stopwatch.legend.buttonTitles.restart,onClick:I,class:"vue-ui-timer-button",style:e.normalizeStyle({opacity:s.value?1:.2,cursor:s.value?"pointer":"default"})},[e.createVNode(B.default,{name:"restart",stroke:t.value.stopwatch.legend.buttons.iconColor},null,8,["stroke"])],12,ue)):e.createCommentVNode("",!0),t.value.stopwatch.legend.buttons.lap?(e.openBlock(),e.createElementBlock("button",{key:4,title:t.value.stopwatch.legend.buttonTitles.lap,onClick:E,class:"vue-ui-timer-button",style:e.normalizeStyle({opacity:s.value&&!d.value?1:.2,cursor:s.value&&!d.value?"pointer":"default"})},[e.createVNode(B.default,{name:"lap",stroke:t.value.stopwatch.legend.buttons.iconColor},null,8,["stroke"])],12,ie)):e.createCommentVNode("",!0)])),e.renderSlot(l.$slots,"controls",e.normalizeProps(e.guardReactiveProps({start:V,pause:z,reset:x,restart:I,lap:E,laps:m.value,isRunning:s.value,isPaused:d.value,...i.value})),void 0,!0),e.renderSlot(l.$slots,"laps",e.normalizeProps(e.guardReactiveProps({laps:m.value,lap:E,isRunning:s.value,isPaused:d.value,...i.value})),void 0,!0)],4)],4))}},de=q._export_sfc(ce,[["__scopeId","data-v-b9d21393"]]);exports.default=de;