vue-data-ui 3.20.0 → 3.20.1

package/dist/vue-ui-timer-CcLK1wbi.js

@@ -1,439 +0,0 @@
-import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
-import { H as t, t as n, zt as r } from "./lib-DUeYQsS0.js";
-import { t as i } from "./useConfig-DAyQk86L.js";
-import { t as a } from "./useNestedProp-CNcoy38D.js";
-import { n as o } from "./Title-NWp4qB4K.js";
-import { t as s } from "./_plugin-vue_export-helper-B3ysoDQm.js";
-import { c } from "./canvas-lib-BOP_HS11.js";
-import { t as ee } from "./useResponsive-BfnK0KxU.js";
-import { t as l } from "./BaseIcon-DfLoHNUj.js";
-import { t as te } from "./useChartAccessibility-DYqac8yF.js";
-import { computed as u, createBlock as ne, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createVNode as m, defineAsyncComponent as re, guardReactiveProps as h, mergeProps as g, normalizeProps as _, normalizeStyle as v, onBeforeUnmount as ie, onMounted as ae, openBlock as y, ref as b, renderSlot as x, shallowRef as S, toDisplayString as C, unref as w, watch as oe } from "vue";
-//#region src/timer.js
-var se = class {
-	constructor(e, t, n, r = !0, i = !0) {
-		this.interval = t, this.elapsed = 0, this.isPaused = !1;
-		let a = new Blob(["\n            let interval;\n            let elapsed = 0;\n            let paused = false;\n            let startTime;\n            let tickInterval;\n\n            onmessage = function(e) {\n                const { action, data } = e.data;\n\n                switch(action) {\n                    case 'start':\n                        startTime = Date.now();\n                        tickInterval = data.interval;\n                        elapsed = 0;\n                        paused = false;\n                        interval = setInterval(() => {\n                            elapsed += tickInterval;\n                            postMessage({ elapsed, timestamp: Date.now() });\n                        }, tickInterval);\n                        break;\n                    \n                    case 'pause':\n                        paused = true;\n                        clearInterval(interval);\n                        elapsed = Date.now() - startTime;\n                        break;\n\n                    case 'resume':\n                        if (paused) {\n                            startTime = Date.now() - elapsed;\n                            interval = setInterval(() => {\n                                elapsed += tickInterval;\n                                postMessage({ elapsed, timestamp: Date.now() });\n                            }, tickInterval);\n                        }\n                        paused = false;\n                        break;\n\n                    case 'stop':\n                        clearInterval(interval);\n                        elapsed = 0;\n                        postMessage({ elapsed });\n                        break;\n\n                    case 'reset':\n                        elapsed = 0;\n                        clearInterval(interval);\n                        postMessage({ elapsed });\n                        break;\n\n                    case 'lap':\n                        postMessage({\n                            elapsed,\n                            timestamp: Date.now(),\n                            action: 'lap'\n                        });\n                        break;\n\n                    default:\n                        break;\n                }\n            };\n        "], { type: "application/javascript" }), o = URL.createObjectURL(a), s = new Worker(o);
-		function c(e) {
-			let t = Math.floor(e / 1e3), n = Math.floor(e % 1e3 / 10), a = Math.floor(t / 3600), o = Math.floor(t % 3600 / 60), s = t % 60, c = "";
-			return i && (c += String(a).padStart(2, "0") + ":"), c += String(o).padStart(2, "0") + ":", c += String(s).padStart(2, "0"), r && (c += "." + String(n).padStart(2, "0")), c;
-		}
-		this.start = () => {
-			this.isPaused = !1, s.postMessage({
-				action: "start",
-				data: { interval: this.interval }
-			});
-		}, this.pause = () => {
-			this.isPaused ? this.resume() : (this.isPaused = !0, s.postMessage({ action: "pause" }));
-		}, this.resume = () => {
-			this.isPaused &&= (s.postMessage({ action: "resume" }), !1);
-		}, this.stop = () => {
-			s.postMessage({ action: "stop" }), this.isPaused = !1;
-		}, this.reset = () => {
-			s.postMessage({ action: "reset" }), this.elapsed = 0, this.isPaused = !1;
-		}, this.restart = () => {
-			this.stop(), this.start();
-		}, this.lap = () => new Promise((e) => {
-			s.postMessage({ action: "lap" }), s.addEventListener("message", (t) => {
-				let { elapsed: n, timestamp: r, action: i } = t.data;
-				if (i === "lap") {
-					let t = c(n);
-					e({
-						timestamp: r || 0,
-						elapsed: n,
-						formatted: t
-					});
-				}
-			}, { once: !0 });
-		}), s.onmessage = (t) => {
-			let { elapsed: n, timestamp: r } = t.data;
-			this.elapsed = n, e({
-				timestamp: r || 0,
-				elapsed: this.elapsed,
-				formatted: c(this.elapsed)
-			});
-		}, s.onerror = (e) => {
-			n && n(e);
-		};
-	}
-}, T = /* @__PURE__ */ e({ default: () => E }), ce = ["xmlns", "viewBox"], le = ["width", "height"], ue = { key: 1 }, de = ["id"], fe = ["stop-color"], pe = ["stop-color"], me = [
-	"cx",
-	"cy",
-	"r",
-	"fill",
-	"stroke",
-	"stroke-width"
-], he = [
-	"d",
-	"stroke",
-	"stroke-width"
-], ge = [
-	"r",
-	"fill",
-	"stroke",
-	"stroke-width"
-], _e = [
-	"r",
-	"fill",
-	"stroke",
-	"stroke-width"
-], ve = ["x", "y"], ye = { key: 5 }, be = [
-	"x",
-	"y",
-	"font-size",
-	"fill",
-	"font-weight"
-], xe = {
-	key: 0,
-	class: "vue-ui-timer-controls"
-}, Se = ["title"], Ce = ["title"], we = ["title"], Te = ["title"], Ee = ["title"], E = /* @__PURE__ */ s({
-	__name: "vue-ui-timer",
-	props: { config: {
-		type: Object,
-		default() {
-			return {};
-		}
-	} },
-	emits: [
-		"start",
-		"pause",
-		"reset",
-		"restart",
-		"lap"
-	],
-	setup(e, { expose: s, emit: T }) {
-		let E = re(() => import("./PackageVersion-xcyrdRmY.js").then((e) => e.t)), { vue_ui_timer: De } = i(), D = e, O = T, k = b(null), A = b(null), j = b(null), M = S(null), N = S(null), P = b(t()), F = b(0);
-		ae(() => {
-			I();
-		});
-		function I() {
-			if (L.value.responsive) {
-				let e = c(() => {
-					let { width: e, height: t } = ee({
-						chart: k.value,
-						title: L.value.style.title.text ? A.value : null,
-						legend: j.value
-					});
-					requestAnimationFrame(() => {
-						B.value.width = e, B.value.height = t, L.value.responsiveProportionalSizing ? (B.value.tracker.core = r({
-							relator: Math.min(e, t),
-							adjuster: L.value.style.width,
-							source: 6 * L.value.stopwatch.tracker.radiusRatio,
-							threshold: 1,
-							fallback: 1
-						}), B.value.tracker.aura = r({
-							relator: Math.min(e, t),
-							adjuster: L.value.style.width,
-							source: 12 * L.value.stopwatch.tracker.aura.radiusRatio,
-							threshold: 1,
-							fallback: 1
-						}), B.value.label = r({
-							relator: Math.min(e, t),
-							adjuster: L.value.style.width,
-							source: L.value.stopwatch.label.fontSize,
-							threshold: 10,
-							fallback: 10
-						})) : B.value.label = L.value.stopwatch.label.fontSize;
-					});
-				});
-				M.value && (N.value && M.value.unobserve(N.value), M.value.disconnect()), M.value = new ResizeObserver(e), N.value = k.value.parentNode, M.value.observe(N.value);
-			}
-		}
-		ie(() => {
-			M.value && (N.value && M.value.unobserve(N.value), M.value.disconnect());
-		});
-		let L = u({
-			get: () => z(),
-			set: (e) => e
-		}), R = u(() => L.value.useCursorPointer), { svgRef: Oe } = te({ config: L.value.style.title });
-		function z() {
-			return a({
-				userConfig: D.config,
-				defaultConfig: De
-			});
-		}
-		oe(() => D.config, (e) => {
-			L.value = z(), I(), F.value += 1;
-		}, { deep: !0 });
-		let ke = u(() => {
-			if (L.value.stopwatch.showHours && L.value.stopwatch.showHundredth) return "00:00:00.00";
-			if (L.value.stopwatch.showHours && !L.value.stopwatch.showHundredth) return "00:00:00";
-			if (!L.value.stopwatch.showHours && L.value.stopwatch.showHundredth) return "00:00.00";
-			if (!L.value.stopwatch.showHours && !L.value.stopwatch.showHundredth) return "00:00";
-		}), B = b({
-			height: L.value.style.height,
-			width: L.value.style.width,
-			tracker: {
-				core: 6 * L.value.stopwatch.tracker.radiusRatio,
-				aura: 12 * L.value.stopwatch.tracker.aura.radiusRatio
-			},
-			label: L.value.stopwatch.label.fontSize
-		}), V = b(0), H = new se((e) => Ae(e), 10, "", L.value.stopwatch.showHundredth, L.value.stopwatch.showHours), U = b(!0), W = b(!1), G = b(!1);
-		function K() {
-			O("start"), U.value && H.start(), U.value = !1, W.value = !0;
-		}
-		function q() {
-			W.value &&= (O("reset"), H.stop(), X.value = [], U.value = !0, !1);
-		}
-		function J() {
-			G.value = !G.value, O("pause", V.value), H.pause();
-		}
-		function Y() {
-			W.value && (G.value = !1, O("restart"), X.value = [], H.restart());
-		}
-		let X = b([]);
-		async function Z() {
-			if (!W.value || G.value) return;
-			let e = await H.lap();
-			e && (X.value.push(e), O("lap", X.value));
-		}
-		function Ae({ timestamp: e, elapsed: t, formatted: n }) {
-			V.value = {
-				timestamp: e,
-				elapsed: t,
-				formatted: n
-			};
-		}
-		let Q = u(() => Math.min(B.value.width, B.value.height) / 2.5 * L.value.stopwatch.track.radiusRatio);
-		function je(e, t) {
-			return e * (360 / (t * 1e3)) % 360;
-		}
-		function Me(e) {
-			let t = Math.PI / 180 * e;
-			return {
-				cx: B.value.width / 2 + Q.value * Math.cos(t),
-				cy: B.value.height / 2 + Q.value * Math.sin(t)
-			};
-		}
-		let $ = u(() => {
-			let e = je(V.value.elapsed, L.value.stopwatch.cycleSeconds), { cx: t, cy: n } = Me(e - 90), r = +(e > 180);
-			return {
-				cx: t || B.value.width / 2,
-				cy: n || B.value.height / 2 - Q.value,
-				largeArcFlag: r,
-				sweepFlag: 1
-			};
-		});
-		return s({
-			start: K,
-			pause: J,
-			reset: q,
-			restart: Y,
-			lap: Z
-		}), (e, t) => (y(), f("div", {
-			ref_key: "timerChart",
-			ref: k,
-			class: "vue-data-ui-component vue-ui-timer",
-			style: v({
-				fontFamily: L.value.style.fontFamily,
-				width: "100%",
-				height: L.value.responsive ? "100%" : "auto",
-				textAlign: "center"
-			})
-		}, [
-			L.value.style.title.text ? (y(), f("div", {
-				key: 0,
-				ref_key: "chartTitle",
-				ref: A,
-				style: v({
-					width: "100%",
-					background: L.value.style.backgroundColor
-				})
-			}, [(y(), ne(o, {
-				key: `title_${F.value}`,
-				config: {
-					title: {
-						cy: "title",
-						...L.value.style.title
-					},
-					subtitle: {
-						cy: "subtitle",
-						...L.value.style.title.subtitle
-					}
-				}
-			}, null, 8, ["config"]))], 4)) : d("", !0),
-			(y(), f("svg", {
-				ref_key: "svgRef",
-				ref: Oe,
-				xmlns: w(n),
-				viewBox: `0 0 ${B.value.width <= 0 ? 10 : B.value.width} ${B.value.height <= 0 ? 10 : B.value.height}`,
-				style: v({
-					maxWidth: "100%",
-					overflow: "visible",
-					background: L.value.style.backgroundColor
-				})
-			}, [
-				m(w(E)),
-				e.$slots["chart-background"] ? (y(), f("foreignObject", {
-					key: 0,
-					x: 0,
-					y: 0,
-					width: B.value.width <= 0 ? 10 : B.value.width,
-					height: B.value.height <= 0 ? 10 : B.value.height,
-					style: { pointerEvents: "none" }
-				}, [x(e.$slots, "chart-background", {}, void 0, !0)], 8, le)) : d("", !0),
-				L.value.stopwatch.tracker.gradient.show ? (y(), f("defs", ue, [p("radialGradient", {
-					id: `tracker_gradient_${P.value}`,
-					cx: "50%",
-					cy: "50%",
-					r: "50%",
-					fx: "50%",
-					fy: "50%"
-				}, [p("stop", {
-					offset: "0%",
-					"stop-color": L.value.stopwatch.tracker.gradient.color
-				}, null, 8, fe), p("stop", {
-					offset: "100%",
-					"stop-color": L.value.stopwatch.tracker.fill
-				}, null, 8, pe)], 8, de)])) : d("", !0),
-				p("circle", {
-					cx: B.value.width / 2,
-					cy: B.value.height / 2,
-					r: Q.value,
-					fill: L.value.stopwatch.track.fill,
-					stroke: L.value.stopwatch.track.stroke,
-					"stroke-width": L.value.stopwatch.track.strokeWidth
-				}, null, 8, me),
-				L.value.stopwatch.cycleTrack.show ? (y(), f("path", {
-					key: 2,
-					d: `M ${B.value.width / 2},${B.value.height / 2 - Q.value} A ${Q.value},${Q.value} 0 ${$.value.largeArcFlag},${$.value.sweepFlag} ${$.value.cx},${$.value.cy}`,
-					stroke: L.value.stopwatch.cycleTrack.stroke,
-					"stroke-width": L.value.stopwatch.cycleTrack.strokeWidth,
-					"stroke-linecap": "round",
-					fill: "none"
-				}, null, 8, he)) : d("", !0),
-				p("circle", g($.value, {
-					r: B.value.tracker.core,
-					fill: L.value.stopwatch.tracker.gradient.show ? `url(#tracker_gradient_${P.value})` : L.value.stopwatch.tracker.fill,
-					stroke: L.value.stopwatch.tracker.stroke,
-					"stroke-width": L.value.stopwatch.tracker.strokeWidth
-				}), null, 16, ge),
-				L.value.stopwatch.tracker.aura.show ? (y(), f("circle", g({ key: 3 }, $.value, {
-					r: B.value.tracker.aura,
-					fill: `${L.value.stopwatch.tracker.aura.fill}20`,
-					stroke: L.value.stopwatch.tracker.aura.stroke,
-					"stroke-width": L.value.stopwatch.tracker.aura.strokeWidth
-				}), null, 16, _e)) : d("", !0),
-				e.$slots.time ? (y(), f("foreignObject", {
-					key: 4,
-					x: B.value.width / 2,
-					y: B.value.height / 2,
-					height: "0.1",
-					width: "0.1",
-					style: { overflow: "visible" }
-				}, [x(e.$slots, "time", _(h({
-					...V.value,
-					...B.value
-				})), void 0, !0)], 8, ve)) : e.$slots.timeSvg ? (y(), f("g", ye, [x(e.$slots, "timeSvg", _(h({
-					...V.value,
-					...B.value
-				})), void 0, !0)])) : (y(), f("text", {
-					key: 6,
-					x: B.value.width / 2,
-					y: B.value.height / 2 + B.value.label / 4,
-					"font-size": B.value.label,
-					"text-anchor": "middle",
-					fill: L.value.stopwatch.label.color,
-					"font-weight": L.value.stopwatch.label.bold ? "bold" : "normal",
-					style: { "font-variant-numeric": "tabular-nums !important" }
-				}, C(V.value.formatted || ke.value), 9, be))
-			], 12, ce)),
-			p("div", {
-				ref_key: "chartLegend",
-				ref: j,
-				style: v({
-					width: "100%",
-					backgroundColor: L.value.stopwatch.legend.backgroundColor
-				})
-			}, [
-				e.$slots.controls ? d("", !0) : (y(), f("div", xe, [
-					L.value.stopwatch.legend.buttons.start ? (y(), f("button", {
-						key: 0,
-						title: L.value.stopwatch.legend.buttonTitles.start,
-						onClick: K,
-						class: "vue-ui-timer-button",
-						style: v({
-							opacity: W.value ? .2 : 1,
-							cursor: W.value ? "default" : R.value ? "pointer" : "default"
-						})
-					}, [m(l, {
-						name: "play",
-						stroke: L.value.stopwatch.legend.buttons.iconColor
-					}, null, 8, ["stroke"])], 12, Se)) : d("", !0),
-					L.value.stopwatch.legend.buttons.pause ? (y(), f("button", {
-						key: 1,
-						title: G.value ? L.value.stopwatch.legend.buttonTitles.resume : L.value.stopwatch.legend.buttonTitles.pause,
-						onClick: J,
-						class: "vue-ui-timer-button",
-						style: v({
-							opacity: W.value ? 1 : .2,
-							cursor: W.value && R.value ? "pointer" : "default"
-						})
-					}, [m(l, {
-						name: "pause",
-						stroke: L.value.stopwatch.legend.buttons.iconColor
-					}, null, 8, ["stroke"])], 12, Ce)) : d("", !0),
-					L.value.stopwatch.legend.buttons.reset ? (y(), f("button", {
-						key: 2,
-						title: L.value.stopwatch.legend.buttonTitles.reset,
-						onClick: q,
-						class: "vue-ui-timer-button",
-						style: v({
-							opacity: W.value ? 1 : .2,
-							cursor: W.value && R.value ? "pointer" : "default"
-						})
-					}, [m(l, {
-						name: "stop",
-						stroke: L.value.stopwatch.legend.buttons.iconColor
-					}, null, 8, ["stroke"])], 12, we)) : d("", !0),
-					L.value.stopwatch.legend.buttons.restart ? (y(), f("button", {
-						key: 3,
-						title: L.value.stopwatch.legend.buttonTitles.restart,
-						onClick: Y,
-						class: "vue-ui-timer-button",
-						style: v({
-							opacity: W.value ? 1 : .2,
-							cursor: W.value && R.value ? "pointer" : "default"
-						})
-					}, [m(l, {
-						name: "restart",
-						stroke: L.value.stopwatch.legend.buttons.iconColor
-					}, null, 8, ["stroke"])], 12, Te)) : d("", !0),
-					L.value.stopwatch.legend.buttons.lap ? (y(), f("button", {
-						key: 4,
-						title: L.value.stopwatch.legend.buttonTitles.lap,
-						onClick: Z,
-						class: "vue-ui-timer-button",
-						style: v({
-							opacity: W.value && !G.value ? 1 : .2,
-							cursor: W.value && !G.value && R.value ? "pointer" : "default"
-						})
-					}, [m(l, {
-						name: "lap",
-						stroke: L.value.stopwatch.legend.buttons.iconColor
-					}, null, 8, ["stroke"])], 12, Ee)) : d("", !0)
-				])),
-				x(e.$slots, "controls", _(h({
-					start: K,
-					pause: J,
-					reset: q,
-					restart: Y,
-					lap: Z,
-					laps: X.value,
-					isRunning: W.value,
-					isPaused: G.value,
-					...V.value
-				})), void 0, !0),
-				x(e.$slots, "laps", _(h({
-					laps: X.value,
-					lap: Z,
-					isRunning: W.value,
-					isPaused: G.value,
-					...V.value
-				})), void 0, !0)
-			], 4)
-		], 4));
-	}
-}, [["__scopeId", "data-v-7cc009e4"]]);
-//#endregion
-export { T as n, E as t };