npm - vue3-time-playbar - Versions diffs - 0.1.3 → 0.1.4 - Mend

vue3-time-playbar 0.1.3 → 0.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/core/TimeTimeline.vue.d.ts +1 -0
package/core/index.test.d.ts +1 -0
package/core/index.vue.d.ts +2 -0
package/package.json +1 -1
package/style.css +1 -1
package/vue3-time-playbar.mjs +321 -304
package/vue3-time-playbar.umd.cjs +1 -1

package/core/TimeTimeline.vue.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { TickLabelMode, FormatTooltipFn } from './types';
+/***********************Props 与事件*********************/
 type __VLS_Props = {
     modelValue: number | string;
     startTime: number | string;

package/core/index.test.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export {};

package/core/index.vue.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { TimeInput, TickLabelMode, FormatTooltipFn, TimeChangePayload } from './types';
+/***********************Props 与事件*********************/
 interface Props {
     modelValue?: TimeInput;
     startTime: TimeInput;
@@ -14,6 +15,7 @@ interface Props {
     tickLabelMode?: TickLabelMode;
     formatTooltip?: FormatTooltipFn;
 }
+/***********************播放控制*********************/
 declare function togglePlay(): void;
 declare function play(): void;
 declare function pause(): void;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "vue3-time-playbar",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "A Vue 3 time player component with interactive timeline, playback controls and tick marks",
   "license": "MIT",
   "type": "module",

package/style.css CHANGED Viewed

	@@ -1 +1 @@
1	- .player-controls[data-v-55e12a8d]{display:flex;align-items:center}.player-controls .btn-group[data-v-55e12a8d]{display:flex;align-items:center;gap:6px}.player-controls .control-btn[data-v-55e12a8d]{background:#ffffff1a;border:1px solid rgba(255,255,255,.15);border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:#fffc;cursor:pointer;transition:background .2s,border-color .2s,transform .15s}.player-controls .control-btn[data-v-55e12a8d]:hover{background:#fff3;border-color:#fff6;color:#fff;transform:scale(1.08)}.player-controls .control-btn[data-v-55e12a8d]:active{transform:scale(.95)}.player-controls .control-btn svg[data-v-55e12a8d]{width:14px;height:14px}.player-controls .control-btn.play-btn[data-v-55e12a8d]{width:40px;height:40px;background:#409eff;border-color:transparent;color:#fff}.player-controls .control-btn.play-btn[data-v-55e12a8d]:hover{background:#66b1ff}.player-controls .control-btn.play-btn svg[data-v-55e12a8d]{width:16px;height:16px}.time-timeline[data-v-~~d7d9fd3b~~]{position:relative;width:100%;height:52px;cursor:pointer}.time-timeline .handle-group[data-v-~~d7d9fd3b~~]{position:absolute;left:0;top:0;width:0;height:100%;z-index:20;pointer-events:none;transition:transform .2s ease-out;will-change:transform}.time-timeline .handle-group.dragging[data-v-~~d7d9fd3b~~]{transition:none}.time-timeline .handle-group .floating-tooltip[data-v-~~d7d9fd3b~~]{position:absolute;top:-33px;left:0;transform:translate(-50%);background:#409eff;color:#fff;padding:5px 10px;border-radius:50px;font-size:14px;font-weight:500;white-space:nowrap;box-shadow:0 2px 6px #0000004d;pointer-events:auto;cursor:grab}.time-timeline .handle-group .floating-tooltip[data-v-~~d7d9fd3b~~]:active{cursor:grabbing}.time-timeline .handle-group .floating-tooltip[data-v-~~d7d9fd3b~~]:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:4px solid transparent;border-top-color:#409eff}.time-timeline .handle-group .handle-visual[data-v-~~d7d9fd3b~~]{position:absolute;top:10px;left:0;transform:translate(-50%,-50%);width:8px;height:8px;background:#fff;border-radius:50%;border:2px solid #409eff;box-shadow:0 0 0 3px #409eff40}.time-timeline .scroll-container[data-v-~~d7d9fd3b~~]{width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}.time-timeline .scroll-container[data-v-~~d7d9fd3b~~]::-webkit-scrollbar{display:none}.time-timeline .timeline-inner[data-v-~~d7d9fd3b~~]{position:relative;min-width:100%;height:100%}.time-timeline .track-bg[data-v-~~d7d9fd3b~~]{position:absolute;top:8px;height:4px;background:#ffffff2e;border-radius:2px}.time-timeline .track-active[data-v-~~d7d9fd3b~~]{position:absolute;top:8px;height:4px;background:#409eff;border-radius:2px;pointer-events:none;transition:width .15s ease-out;z-index:2}.time-timeline .ticks-container[data-v-~~d7d9fd3b~~]{position:absolute;top:0;bottom:0;pointer-events:none}.time-timeline .tick-item[data-v-~~d7d9fd3b~~]{position:absolute;top:0;transform:translate(-50%);display:flex;flex-direction:column;align-items:center}.time-timeline .tick-item .tick-mark[data-v-~~d7d9fd3b~~]{margin-top:14px;width:1px;height:5px;background:#ffffff59;flex-shrink:0}.time-timeline .tick-item .tick-label[data-v-~~d7d9fd3b~~]{margin-top:2px;font-size:11px;color:#fff9;line-height:1}.time-timeline .tick-item .day-label[data-v-~~d7d9fd3b~~]{margin-top:3px;font-size:11px;font-weight:600;color:#ffffffe6;white-space:nowrap;line-height:1}.time-timeline .tick-item.is-day-boundary .tick-mark[data-v-~~d7d9fd3b~~]{margin-top:14px;width:2px;height:18px;background:#fffc}.speed-selector[data-v-30c5e152]{flex-shrink:0;margin-left:10px;padding-left:10px;border-left:1px solid rgba(255,255,255,.12);position:relative}.speed-selector .speed-trigger[data-v-30c5e152]{display:inline-flex;align-items:center;gap:4px;min-width:36px;height:28px;padding:0 8px;background:#ffffff1a;border:1px solid rgba(255,255,255,.15);border-radius:4px;color:#fffc;font-size:13px;font-weight:500;cursor:pointer;transition:background .2s,border-color .2s,color .2s}.speed-selector .speed-trigger[data-v-30c5e152]:hover{background:#fff3;border-color:#fff6;color:#fff}.speed-selector .speed-trigger .arrow-icon[data-v-30c5e152]{width:10px;height:10px;transition:transform .2s}.speed-selector .speed-trigger .arrow-icon.open[data-v-30c5e152]{transform:rotate(180deg)}.speed-selector .speed-dropdown[data-v-30c5e152]{position:absolute;left:16px;min-width:56px;background:#083082f2;border:1px solid rgba(255,255,255,.2);border-radius:4px;padding:4px 0;box-shadow:0 4px 12px #0006;z-index:30}.speed-selector .speed-dropdown.is-up[data-v-30c5e152]{bottom:calc(100% + 6px)}.speed-selector .speed-dropdown.is-down[data-v-30c5e152]{top:calc(100% + 6px)}.speed-selector .speed-dropdown .speed-option[data-v-30c5e152]{padding:6px 12px;font-size:13px;color:#ffffffb3;cursor:pointer;text-align:center;transition:background .15s,color .15s}.speed-selector .speed-dropdown .speed-option[data-v-30c5e152]:hover{background:#ffffff26;color:#fff}.speed-selector .speed-dropdown .speed-option.active[data-v-30c5e152]{color:#409eff;font-weight:600}.dropdown-up-enter-active[data-v-30c5e152],.dropdown-up-leave-active[data-v-30c5e152]{transition:opacity .15s,transform .15s}.dropdown-up-enter-from[data-v-30c5e152],.dropdown-up-leave-to[data-v-30c5e152]{opacity:0;transform:translateY(4px)}.dropdown-down-enter-active[data-v-30c5e152],.dropdown-down-leave-active[data-v-30c5e152]{transition:opacity .15s,transform .15s}.dropdown-down-enter-from[data-v-30c5e152],.dropdown-down-leave-to[data-v-30c5e152]{opacity:0;transform:translateY(-4px)}.g-time-player[data-v-~~98cef505~~]{display:flex;align-items:center;width:100%;height:72px;filter:drop-shadow(rgba(0,0,0,.8) 0px 0px 2px);background:#083082aa;box-shadow:0 0 16px #0193fa99 inset;border-radius:4px;padding:0 24px;box-sizing:border-box;color:#fff;-webkit-user-select:none;user-select:none;box-shadow:0 4px 20px #00000059}.g-time-player .controls-wrapper[data-v-~~98cef505~~]{flex-shrink:0;margin-right:10px;border-right:1px solid rgba(255,255,255,.12);padding-right:10px}.g-time-player .timeline-wrapper[data-v-~~98cef505~~]{flex:1;min-width:0;height:100%;display:flex;align-items:center;overflow:visible;position:relative}
1	+ .player-controls[data-v-55e12a8d]{display:flex;align-items:center}.player-controls .btn-group[data-v-55e12a8d]{display:flex;align-items:center;gap:6px}.player-controls .control-btn[data-v-55e12a8d]{background:#ffffff1a;border:1px solid rgba(255,255,255,.15);border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:#fffc;cursor:pointer;transition:background .2s,border-color .2s,transform .15s}.player-controls .control-btn[data-v-55e12a8d]:hover{background:#fff3;border-color:#fff6;color:#fff;transform:scale(1.08)}.player-controls .control-btn[data-v-55e12a8d]:active{transform:scale(.95)}.player-controls .control-btn svg[data-v-55e12a8d]{width:14px;height:14px}.player-controls .control-btn.play-btn[data-v-55e12a8d]{width:40px;height:40px;background:#409eff;border-color:transparent;color:#fff}.player-controls .control-btn.play-btn[data-v-55e12a8d]:hover{background:#66b1ff}.player-controls .control-btn.play-btn svg[data-v-55e12a8d]{width:16px;height:16px}.time-timeline[data-v-0f78dcee]{position:relative;width:100%;height:52px;cursor:pointer}.time-timeline .handle-group[data-v-0f78dcee]{position:absolute;left:0;top:0;width:0;height:100%;z-index:20;pointer-events:none;transition:transform .2s ease-out;will-change:transform}.time-timeline .handle-group.dragging[data-v-0f78dcee]{transition:none}.time-timeline .handle-group .floating-tooltip[data-v-0f78dcee]{position:absolute;top:-33px;left:0;transform:translate(-50%);background:#409eff;color:#fff;padding:5px 10px;border-radius:50px;font-size:14px;font-weight:500;white-space:nowrap;box-shadow:0 2px 6px #0000004d;pointer-events:auto;cursor:grab}.time-timeline .handle-group .floating-tooltip[data-v-0f78dcee]:active{cursor:grabbing}.time-timeline .handle-group .floating-tooltip[data-v-0f78dcee]:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:4px solid transparent;border-top-color:#409eff}.time-timeline .handle-group .handle-visual[data-v-0f78dcee]{position:absolute;top:10px;left:0;transform:translate(-50%,-50%);width:8px;height:8px;background:#fff;border-radius:50%;border:2px solid #409eff;box-shadow:0 0 0 3px #409eff40}.time-timeline .scroll-container[data-v-0f78dcee]{width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}.time-timeline .scroll-container[data-v-0f78dcee]::-webkit-scrollbar{display:none}.time-timeline .timeline-inner[data-v-0f78dcee]{position:relative;min-width:100%;height:100%}.time-timeline .track-bg[data-v-0f78dcee]{position:absolute;top:8px;height:4px;background:#ffffff2e;border-radius:2px}.time-timeline .track-active[data-v-0f78dcee]{position:absolute;top:8px;height:4px;background:#409eff;border-radius:2px;pointer-events:none;transition:width .15s ease-out;z-index:2}.time-timeline .ticks-container[data-v-0f78dcee]{position:absolute;top:0;bottom:0;pointer-events:none}.time-timeline .tick-item[data-v-0f78dcee]{position:absolute;top:0;transform:translate(-50%);display:flex;flex-direction:column;align-items:center}.time-timeline .tick-item .tick-mark[data-v-0f78dcee]{margin-top:14px;width:1px;height:5px;background:#ffffff59;flex-shrink:0}.time-timeline .tick-item .tick-label[data-v-0f78dcee]{margin-top:2px;font-size:11px;color:#fff9;line-height:1}.time-timeline .tick-item .day-label[data-v-0f78dcee]{margin-top:3px;font-size:11px;font-weight:600;color:#ffffffe6;white-space:nowrap;line-height:1}.time-timeline .tick-item.is-day-boundary .tick-mark[data-v-0f78dcee]{margin-top:14px;width:2px;height:18px;background:#fffc}.speed-selector[data-v-30c5e152]{flex-shrink:0;margin-left:10px;padding-left:10px;border-left:1px solid rgba(255,255,255,.12);position:relative}.speed-selector .speed-trigger[data-v-30c5e152]{display:inline-flex;align-items:center;gap:4px;min-width:36px;height:28px;padding:0 8px;background:#ffffff1a;border:1px solid rgba(255,255,255,.15);border-radius:4px;color:#fffc;font-size:13px;font-weight:500;cursor:pointer;transition:background .2s,border-color .2s,color .2s}.speed-selector .speed-trigger[data-v-30c5e152]:hover{background:#fff3;border-color:#fff6;color:#fff}.speed-selector .speed-trigger .arrow-icon[data-v-30c5e152]{width:10px;height:10px;transition:transform .2s}.speed-selector .speed-trigger .arrow-icon.open[data-v-30c5e152]{transform:rotate(180deg)}.speed-selector .speed-dropdown[data-v-30c5e152]{position:absolute;left:16px;min-width:56px;background:#083082f2;border:1px solid rgba(255,255,255,.2);border-radius:4px;padding:4px 0;box-shadow:0 4px 12px #0006;z-index:30}.speed-selector .speed-dropdown.is-up[data-v-30c5e152]{bottom:calc(100% + 6px)}.speed-selector .speed-dropdown.is-down[data-v-30c5e152]{top:calc(100% + 6px)}.speed-selector .speed-dropdown .speed-option[data-v-30c5e152]{padding:6px 12px;font-size:13px;color:#ffffffb3;cursor:pointer;text-align:center;transition:background .15s,color .15s}.speed-selector .speed-dropdown .speed-option[data-v-30c5e152]:hover{background:#ffffff26;color:#fff}.speed-selector .speed-dropdown .speed-option.active[data-v-30c5e152]{color:#409eff;font-weight:600}.dropdown-up-enter-active[data-v-30c5e152],.dropdown-up-leave-active[data-v-30c5e152]{transition:opacity .15s,transform .15s}.dropdown-up-enter-from[data-v-30c5e152],.dropdown-up-leave-to[data-v-30c5e152]{opacity:0;transform:translateY(4px)}.dropdown-down-enter-active[data-v-30c5e152],.dropdown-down-leave-active[data-v-30c5e152]{transition:opacity .15s,transform .15s}.dropdown-down-enter-from[data-v-30c5e152],.dropdown-down-leave-to[data-v-30c5e152]{opacity:0;transform:translateY(-4px)}.g-time-player[data-v-55b5dfa2]{display:flex;align-items:center;width:100%;height:72px;filter:drop-shadow(rgba(0,0,0,.8) 0px 0px 2px);background:#083082aa;box-shadow:0 0 16px #0193fa99 inset;border-radius:4px;padding:0 24px;box-sizing:border-box;color:#fff;-webkit-user-select:none;user-select:none;box-shadow:0 4px 20px #00000059}.g-time-player .controls-wrapper[data-v-55b5dfa2]{flex-shrink:0;margin-right:10px;border-right:1px solid rgba(255,255,255,.12);padding-right:10px}.g-time-player .timeline-wrapper[data-v-55b5dfa2]{flex:1;min-width:0;height:100%;display:flex;align-items:center;overflow:visible;position:relative}

package/vue3-time-playbar.mjs CHANGED Viewed

@@ -1,30 +1,30 @@
-import { defineComponent as ne, openBlock as T, createElementBlock as x, createElementVNode as c, renderSlot as F, ref as $, computed as v, watch as _, onMounted as ge, nextTick as ce, onUnmounted as fe, withDirectives as Pe, normalizeStyle as A, normalizeClass as j, withModifiers as de, toDisplayString as z, vShow as Ee, Fragment as ye, renderList as he, createCommentVNode as ve, createVNode as ee, Transition as Ie, withCtx as te, createSlots as Re } from "vue";
-const _e = { class: "player-controls" }, Be = { class: "btn-group" }, He = ["title"], Ne = {
+import { defineComponent as ne, openBlock as b, createElementBlock as $, createElementVNode as u, renderSlot as X, useTemplateRef as fe, ref as V, computed as f, watch as B, onMounted as Te, nextTick as me, onUnmounted as ye, withDirectives as Ie, normalizeStyle as W, normalizeClass as U, withModifiers as pe, toDisplayString as j, vShow as _e, Fragment as xe, renderList as we, createCommentVNode as ge, createVNode as ee, Transition as Be, withCtx as te, createSlots as He } from "vue";
+const Ne = { class: "player-controls" }, Ae = { class: "btn-group" }, We = ["title"], Fe = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "currentColor",
   stroke: "none"
-}, Ae = {
+}, Xe = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "currentColor",
   stroke: "none"
-}, We = /* @__PURE__ */ ne({
+}, ze = /* @__PURE__ */ ne({
   __name: "PlayerControls",
   props: {
     isPlaying: { type: Boolean }
   },
   emits: ["toggle-play", "prev", "next"],
   setup(e) {
-    return (n, a) => (T(), x("div", _e, [
-      c("div", Be, [
-        c("button", {
+    return (n, a) => (b(), $("div", Ne, [
+      u("div", Ae, [
+        u("button", {
           class: "control-btn",
           onClick: a[0] || (a[0] = (t) => n.$emit("prev")),
           title: "上一时刻"
         }, [
-          F(n.$slots, "prev", {}, () => [
-            a[3] || (a[3] = c("svg", {
+          X(n.$slots, "prev", {}, () => [
+            a[3] || (a[3] = u("svg", {
               viewBox: "0 0 24 24",
               fill: "none",
               stroke: "currentColor",
@@ -32,8 +32,8 @@ const _e = { class: "player-controls" }, Be = { class: "btn-group" }, He = ["tit
               "stroke-linecap": "round",
               "stroke-linejoin": "round"
             }, [
-              c("polygon", { points: "19 20 9 12 19 4 19 20" }),
-              c("line", {
+              u("polygon", { points: "19 20 9 12 19 4 19 20" }),
+              u("line", {
                 x1: "5",
                 y1: "19",
                 x2: "5",
@@ -42,39 +42,39 @@ const _e = { class: "player-controls" }, Be = { class: "btn-group" }, He = ["tit
             ], -1))
           ], !0)
         ]),
-        c("button", {
+        u("button", {
           class: "control-btn play-btn",
           onClick: a[1] || (a[1] = (t) => n.$emit("toggle-play")),
           title: e.isPlaying ? "暂停" : "播放"
         }, [
-          F(n.$slots, "play", { isPlaying: e.isPlaying }, () => [
-            e.isPlaying ? (T(), x("svg", Ae, [...a[5] || (a[5] = [
-              c("rect", {
+          X(n.$slots, "play", { isPlaying: e.isPlaying }, () => [
+            e.isPlaying ? (b(), $("svg", Xe, [...a[5] || (a[5] = [
+              u("rect", {
                 x: "6",
                 y: "4",
                 width: "4",
                 height: "16",
                 rx: "1"
               }, null, -1),
-              c("rect", {
+              u("rect", {
                 x: "14",
                 y: "4",
                 width: "4",
                 height: "16",
                 rx: "1"
               }, null, -1)
-            ])])) : (T(), x("svg", Ne, [...a[4] || (a[4] = [
-              c("polygon", { points: "5 3 19 12 5 21 5 3" }, null, -1)
+            ])])) : (b(), $("svg", Fe, [...a[4] || (a[4] = [
+              u("polygon", { points: "5 3 19 12 5 21 5 3" }, null, -1)
             ])]))
           ], !0)
-        ], 8, He),
-        c("button", {
+        ], 8, We),
+        u("button", {
           class: "control-btn",
           onClick: a[2] || (a[2] = (t) => n.$emit("next")),
           title: "下一时刻"
         }, [
-          F(n.$slots, "next", {}, () => [
-            a[6] || (a[6] = c("svg", {
+          X(n.$slots, "next", {}, () => [
+            a[6] || (a[6] = u("svg", {
               viewBox: "0 0 24 24",
               fill: "none",
               stroke: "currentColor",
@@ -82,8 +82,8 @@ const _e = { class: "player-controls" }, Be = { class: "btn-group" }, He = ["tit
               "stroke-linecap": "round",
               "stroke-linejoin": "round"
             }, [
-              c("polygon", { points: "5 4 15 12 5 20 5 4" }),
-              c("line", {
+              u("polygon", { points: "5 4 15 12 5 20 5 4" }),
+              u("line", {
                 x1: "19",
                 y1: "5",
                 x2: "19",
@@ -100,8 +100,8 @@ const _e = { class: "player-controls" }, Be = { class: "btn-group" }, He = ["tit
   for (const [t, d] of n)
     a[t] = d;
   return a;
-}, Fe = /* @__PURE__ */ le(We, [["__scopeId", "data-v-55e12a8d"]]), Xe = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
-function h(e) {
+}, Oe = /* @__PURE__ */ le(ze, [["__scopeId", "data-v-55e12a8d"]]), Ge = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
+function x(e) {
   if (typeof e == "number") return e;
   if (e instanceof Date) return e.getTime();
   const n = Date.parse(e);
@@ -110,75 +110,75 @@ function h(e) {
 function K(e, n = 2) {
   return String(e).padStart(n, "0");
 }
-function Oe(e) {
+function Ue(e) {
   return new Date(e).getHours();
 }
-function Ge(e) {
+function je(e) {
   return new Date(e).getDay();
 }
-function ke(e) {
-  return Xe[Ge(e)] ?? "";
+function be(e) {
+  return Ge[je(e)] ?? "";
 }
-function Ue(e) {
+function Ke(e) {
   return K(new Date(e).getHours());
 }
-function we(e) {
+function $e(e) {
   const n = new Date(e);
   return `${n.getMonth() + 1}月${n.getDate()}日`;
 }
-function je(e) {
+function Ye(e) {
   const n = new Date(e);
   return `${K(n.getHours())}:${K(n.getMinutes())}`;
 }
-function ze(e) {
-  return `${we(e)} ${ke(e)} ${je(e)}`;
+function qe(e) {
+  return `${$e(e)} ${be(e)} ${Ye(e)}`;
 }
-function pe(e) {
+function ke(e) {
   const n = new Date(e);
   return `${n.getFullYear()}${K(n.getMonth() + 1)}${K(n.getDate())}`;
 }
-function Ke(e) {
-  return `${we(e)} ${ke(e)}`;
+function Je(e) {
+  return `${$e(e)} ${be(e)}`;
 }
-function W(e, n) {
+function F(e, n) {
   return e + n * 36e5;
 }
-function ft(e, n) {
-  return (h(n) - h(e)) / 36e5;
+function mt(e, n) {
+  return (x(n) - x(e)) / 36e5;
 }
-function Ye(e) {
+function Qe(e) {
   const n = new Date(e);
   return n.setHours(24, 0, 0, 0), n.getTime();
 }
-function qe(e, n) {
+function Le(e, n) {
   if (e.length === 0) return -1;
   if (e.length === 1) return 0;
   let a = 0, t = e.length - 1;
   if (n <= e[a]) return a;
   if (n >= e[t]) return t;
   for (; a <= t; ) {
-    const d = a + t >>> 1, f = e[d];
-    if (f === n) return d;
-    f < n ? a = d + 1 : t = d - 1;
+    const d = a + t >>> 1, p = e[d];
+    if (p === n) return d;
+    p < n ? a = d + 1 : t = d - 1;
   }
   return a >= e.length ? t : t < 0 || Math.abs(e[a] - n) < Math.abs(e[t] - n) ? a : t;
 }
-function Je(e, n) {
+function pt(e, n) {
   let a = 0, t = e.length - 1;
   for (; a <= t; ) {
-    const d = a + t >>> 1, f = e[d];
-    if (f === n) return d;
-    f < n ? a = d + 1 : t = d - 1;
+    const d = a + t >>> 1, p = e[d];
+    if (p === n) return d;
+    p < n ? a = d + 1 : t = d - 1;
   }
   return -1;
 }
-const Qe = {
+const Ze = {
   key: 0,
   class: "tick-label"
-}, Ze = {
+}, et = {
   key: 1,
   class: "day-label"
-}, et = 35, tt = 35, nt = /* @__PURE__ */ ne({
+}, tt = 35, nt = 35, lt = /* @__PURE__ */ ne({
   __name: "TimeTimeline",
   props: {
     modelValue: {},
@@ -191,187 +191,190 @@ const Qe = {
   },
   emits: ["update:modelValue", "change", "playing-pause"],
   setup(e, { emit: n }) {
-    const a = [2, 8, 14, 20], t = e, d = n, f = $(null), u = $(null), X = $(null), k = $(0), E = $(0), i = $(0);
-    let y = !1, p = 0, w = !1, C = !1, B = null;
-    const O = $(!1), G = v(() => {
-      const o = h(t.startTime), r = h(t.endTime), s = r - o;
-      if (s <= 0) return [];
-      const b = [];
+    const a = [2, 8, 14, 20], t = e, d = n, p = fe("timelineRef"), c = fe("scrollRef"), z = fe("innerRef"), w = V(0), P = V(0), i = V(0);
+    let y = !1, g = 0, T = !1, S = !1, R = null;
+    const L = V(!1), H = f(() => {
+      const o = x(t.startTime), s = x(t.endTime), r = s - o;
+      if (r <= 0) return [];
+      const D = [];
       let m = o;
-      for (; m <= r; ) {
-        const P = (m - o) / s * 100, M = Oe(m), R = b.length === 0, se = pe(m), re = R ? null : pe(b[b.length - 1].time), Z = !R && re !== se || R && M === 0;
-        let H = !1;
-        if (M === 0)
-          H = !0;
-        else if (R) {
-          const N = Ye(m);
-          (W(m, t.interval) > N || r < N) && (H = !0);
+      for (; m <= s; ) {
+        const E = (m - o) / r * 100, C = Ue(m), _ = D.length === 0, ce = ke(m), de = _ ? null : ke(D[D.length - 1].time), Z = !_ && de !== ce || _ && C === 0;
+        let N = !1;
+        if (C === 0)
+          N = !0;
+        else if (_) {
+          const A = Qe(m);
+          (F(m, t.interval) > A || s < A) && (N = !0);
         }
-        const ue = M === 0 && H ? !1 : t.tickLabelMode === "all" || a.includes(M);
-        b.push({
+        const ve = C === 0 && N ? !1 : t.tickLabelMode === "all" || a.includes(C);
+        D.push({
           time: m,
-          percent: P,
-          label: Ue(m),
-          showLabel: ue,
-          dayLabel: Ke(m),
-          showDayLabel: H,
+          percent: E,
+          label: Ke(m),
+          showLabel: ve,
+          dayLabel: Je(m),
+          showDayLabel: N,
           isDayBoundary: Z
-        }), m = W(m, t.interval);
+        }), m = F(m, t.interval);
       }
-      return b;
-    }), Y = v(() => G.value.map((o) => o.time)), q = v(() => t.minTickSpacing !== void 0 ? t.minTickSpacing : t.tickLabelMode === "major" ? 5 : 15), L = v(() => {
-      const o = G.value.length;
-      return o < 2 ? k.value || 0 : (o - 1) * q.value;
-    }), I = v(() => L.value > k.value && k.value > 0), D = v(() => I.value ? et : tt), S = v(() => I.value ? L.value : Math.max(0, k.value - D.value * 2)), J = v(() => S.value + D.value * 2), l = v(() => k.value && I.value ? J.value + "px" : "100%"), g = v(() => ({
-      left: D.value + "px",
-      width: S.value + "px"
-    })), V = v(() => ({
-      left: D.value + "px",
-      width: S.value + "px"
-    })), Q = v(() => {
-      const o = h(t.startTime), r = h(t.endTime), s = h(t.modelValue);
-      return s <= o ? 0 : s >= r ? 100 : (s - o) / (r - o) * 100;
-    }), Te = v(() => ({
-      left: D.value + "px",
-      width: Q.value / 100 * S.value + "px"
-    })), xe = v(() => {
-      const o = h(t.modelValue);
-      return t.formatTooltip ? t.formatTooltip(o) : ze(o);
-    }), oe = v(() => D.value + Q.value / 100 * S.value - i.value), be = v(() => oe.value > -50 && oe.value < k.value + 50), $e = v(() => ({
-      transform: `translateX(${oe.value}px)`
+      return D;
+    }), oe = f(() => H.value.map((o) => o.time)), ae = f(() => t.minTickSpacing !== void 0 ? t.minTickSpacing : t.tickLabelMode === "major" ? 5 : 15), Y = f(() => {
+      const o = H.value.length;
+      return o < 2 ? w.value || 0 : (o - 1) * ae.value;
+    }), I = f(() => Y.value > w.value && w.value > 0), M = f(() => I.value ? tt : nt), h = f(() => I.value ? Y.value : Math.max(0, w.value - M.value * 2)), O = f(() => h.value + M.value * 2), q = f(() => w.value && I.value ? O.value + "px" : "100%"), J = f(() => ({
+      left: M.value + "px",
+      width: h.value + "px"
+    })), ie = f(() => ({
+      left: M.value + "px",
+      width: h.value + "px"
+    })), l = f(() => {
+      const o = x(t.startTime), s = x(t.endTime), r = x(t.modelValue);
+      return r <= o ? 0 : r >= s ? 100 : (r - o) / (s - o) * 100;
+    }), v = f(() => ({
+      left: M.value + "px",
+      width: l.value / 100 * h.value + "px"
+    })), k = f(() => {
+      const o = x(t.modelValue);
+      return t.formatTooltip ? t.formatTooltip(o) : qe(o);
+    }), re = f(() => M.value + l.value / 100 * h.value - i.value), De = f(() => re.value > -50 && re.value < w.value + 50), Me = f(() => ({
+      transform: `translateX(${re.value}px)`
     }));
-    function Le() {
-      u.value && (E.value = u.value.scrollLeft, w || (i.value = u.value.scrollLeft));
+    function Q() {
+      g && (cancelAnimationFrame(g), g = 0), T = !1;
+    }
+    function Se() {
+      c.value && (P.value = c.value.scrollLeft, T || (i.value = c.value.scrollLeft));
     }
-    function De(o) {
-      !u.value || !I.value || (u.value.scrollLeft += o.deltaY || o.deltaX);
+    function Ce(o) {
+      !c.value || !I.value || (c.value.scrollLeft += o.deltaY || o.deltaX);
     }
-    function U(o = !1) {
-      if (!I.value || !u.value || y) return;
-      const r = D.value + Q.value / 100 * S.value, s = k.value, b = J.value - s, m = Math.max(0, Math.min(r - s / 2, b));
+    function G(o = !1) {
+      if (!I.value || !c.value || y) return;
+      const s = M.value + l.value / 100 * h.value, r = w.value, D = O.value - r, m = Math.max(0, Math.min(s - r / 2, D));
       i.value = m;
-      const P = u.value;
-      if (o || Math.abs(P.scrollLeft - m) < 1) {
-        P.scrollLeft = m, E.value = m;
+      const E = c.value;
+      if (o || Math.abs(E.scrollLeft - m) < 1) {
+        E.scrollLeft = m, P.value = m;
         return;
       }
-      p && cancelAnimationFrame(p);
-      const M = P.scrollLeft, R = m - M;
-      w = !0;
-      const se = 200, re = performance.now();
-      function Z(H) {
-        const ue = H - re, N = Math.min(ue / se, 1), me = 1 - (1 - N) * (1 - N);
-        P.scrollLeft = M + R * me, E.value = P.scrollLeft, N < 1 ? p = requestAnimationFrame(Z) : (p = 0, w = !1);
+      Q();
+      const C = E.scrollLeft, _ = m - C;
+      T = !0;
+      const ce = 200, de = performance.now();
+      function Z(N) {
+        const ve = N - de, A = Math.min(ve / ce, 1), he = 1 - (1 - A) * (1 - A);
+        E.scrollLeft = C + _ * he, P.value = E.scrollLeft, A < 1 ? g = requestAnimationFrame(Z) : (g = 0, T = !1);
       }
-      p = requestAnimationFrame(Z);
+      g = requestAnimationFrame(Z);
     }
-    _(Q, () => U()), _(k, () => U());
-    function ae(o) {
-      if (!u.value) return h(t.startTime);
-      const r = u.value.getBoundingClientRect(), s = u.value.scrollLeft, m = o.clientX - r.left + s - D.value, P = Math.max(0, Math.min(m, S.value)), M = h(t.startTime), R = h(t.endTime);
-      return M + (R - M) * (P / (S.value || 1));
+    B(l, () => G()), B(w, () => G());
+    function se(o) {
+      if (!c.value) return x(t.startTime);
+      const s = c.value.getBoundingClientRect(), r = c.value.scrollLeft, m = o.clientX - s.left + r - M.value, E = Math.max(0, Math.min(m, h.value)), C = x(t.startTime), _ = x(t.endTime);
+      return C + (_ - C) * (E / (h.value || 1));
     }
-    function Se(o) {
-      const r = Y.value;
-      if (r.length === 0) return { time: o, index: -1 };
-      const s = qe(r, o);
-      return { time: r[s] ?? o, index: s };
+    function Ve(o) {
+      const s = oe.value;
+      if (s.length === 0) return { time: o, index: -1 };
+      const r = Le(s, o);
+      return { time: s[r] ?? o, index: r };
     }
-    function ie(o) {
-      const { time: r, index: s } = Se(o);
-      r !== h(t.modelValue) && (d("update:modelValue", r), d("change", r, s));
+    function ue(o) {
+      const { time: s, index: r } = Ve(o);
+      s !== x(t.modelValue) && (d("update:modelValue", s), d("change", s, r));
     }
-    function Me(o) {
-      if (C) {
-        C = !1;
+    function Pe(o) {
+      if (S) {
+        S = !1;
         return;
       }
-      ie(ae(o));
+      ue(se(o));
     }
-    function Ce(o) {
-      const r = o.clientX;
-      C = !1, y = !0, d("playing-pause");
-      const s = (m) => {
-        Math.abs(m.clientX - r) > 3 && (C = !0), ie(ae(m));
-      }, b = () => {
-        y = !1, document.removeEventListener("mousemove", s), document.removeEventListener("mouseup", b), ce(() => U());
+    function Ee(o) {
+      const s = o.clientX;
+      S = !1, y = !0, Q(), d("playing-pause");
+      const r = (m) => {
+        Math.abs(m.clientX - s) > 3 && (S = !0), ue(se(m));
+      }, D = () => {
+        y = !1, document.removeEventListener("mousemove", r), document.removeEventListener("mouseup", D), me(() => G());
       };
-      document.addEventListener("mousemove", s), document.addEventListener("mouseup", b);
+      document.addEventListener("mousemove", r), document.addEventListener("mouseup", D);
     }
-    function Ve(o) {
-      y = !0, C = !1, O.value = !0, document.body.style.cursor = "grabbing", d("playing-pause");
-      const r = (b) => {
-        C = !0, ie(ae(b));
-      }, s = () => {
-        y = !1, O.value = !1, document.body.style.cursor = "", document.removeEventListener("mousemove", r), document.removeEventListener("mouseup", s), ce(() => U());
+    function Re(o) {
+      y = !0, Q(), S = !1, L.value = !0, document.body.style.cursor = "grabbing", d("playing-pause");
+      const s = (D) => {
+        S = !0, ue(se(D));
+      }, r = () => {
+        y = !1, L.value = !1, document.body.style.cursor = "", document.removeEventListener("mousemove", s), document.removeEventListener("mouseup", r), me(() => G());
       };
-      document.addEventListener("mousemove", r), document.addEventListener("mouseup", s);
+      document.addEventListener("mousemove", s), document.addEventListener("mouseup", r);
     }
-    return ge(() => {
-      u.value && (k.value = u.value.clientWidth, B = new ResizeObserver((o) => {
-        o[0] && (k.value = o[0].contentRect.width);
-      }), B.observe(u.value)), ce(() => U());
-    }), fe(() => {
-      p && cancelAnimationFrame(p), B == null || B.disconnect();
-    }), (o, r) => (T(), x("div", {
+    return Te(() => {
+      c.value && (w.value = c.value.clientWidth, R = new ResizeObserver((o) => {
+        o[0] && (w.value = o[0].contentRect.width);
+      }), R.observe(c.value)), me(() => G());
+    }), ye(() => {
+      Q(), R == null || R.disconnect();
+    }), (o, s) => (b(), $("div", {
       class: "time-timeline",
       ref_key: "timelineRef",
-      ref: f
+      ref: p
     }, [
-      Pe(c("div", {
-        class: j(["handle-group", { dragging: O.value }]),
-        style: A($e.value)
+      Ie(u("div", {
+        class: U(["handle-group", { dragging: L.value }]),
+        style: W(Me.value)
       }, [
-        c("div", {
+        u("div", {
           class: "floating-tooltip",
-          onMousedown: de(Ve, ["prevent", "stop"])
-        }, z(xe.value), 33),
-        r[0] || (r[0] = c("div", { class: "handle-visual" }, null, -1))
+          onMousedown: pe(Re, ["prevent", "stop"])
+        }, j(k.value), 33),
+        s[0] || (s[0] = u("div", { class: "handle-visual" }, null, -1))
       ], 6), [
-        [Ee, be.value]
+        [_e, De.value]
       ]),
-      c("div", {
+      u("div", {
         class: "scroll-container",
         ref_key: "scrollRef",
-        ref: u,
-        onScroll: Le,
-        onWheel: de(De, ["prevent"])
+        ref: c,
+        onScroll: Se,
+        onWheel: pe(Ce, ["prevent"])
       }, [
-        c("div", {
+        u("div", {
           class: "timeline-inner",
           ref_key: "innerRef",
-          ref: X,
-          style: A({ width: l.value }),
-          onMousedown: de(Ce, ["prevent"]),
-          onClick: Me
+          ref: z,
+          style: W({ width: q.value }),
+          onMousedown: pe(Ee, ["prevent"]),
+          onClick: Pe
         }, [
-          c("div", {
+          u("div", {
             class: "track-bg",
-            style: A(g.value)
+            style: W(J.value)
           }, null, 4),
-          c("div", {
+          u("div", {
             class: "track-active",
-            style: A(Te.value)
+            style: W(v.value)
           }, null, 4),
-          c("div", {
+          u("div", {
             class: "ticks-container",
-            style: A(V.value)
+            style: W(ie.value)
           }, [
-            (T(!0), x(ye, null, he(G.value, (s) => (T(), x("div", {
-              key: s.time,
-              class: j(["tick-item", { "is-day-boundary": s.isDayBoundary }]),
-              style: A({ left: s.percent + "%" })
+            (b(!0), $(xe, null, we(H.value, (r) => (b(), $("div", {
+              key: r.time,
+              class: U(["tick-item", { "is-day-boundary": r.isDayBoundary }]),
+              style: W({ left: r.percent + "%" })
             }, [
-              r[1] || (r[1] = c("div", { class: "tick-mark" }, null, -1)),
-              s.showLabel ? (T(), x("div", Qe, z(s.label), 1)) : ve("", !0),
-              s.showDayLabel ? (T(), x("div", Ze, z(s.dayLabel), 1)) : ve("", !0)
+              s[1] || (s[1] = u("div", { class: "tick-mark" }, null, -1)),
+              r.showLabel ? (b(), $("div", Ze, j(r.label), 1)) : ge("", !0),
+              r.showDayLabel ? (b(), $("div", et, j(r.dayLabel), 1)) : ge("", !0)
             ], 6))), 128))
           ], 4)
         ], 36)
       ], 544)
     ], 512));
   }
-}), lt = /* @__PURE__ */ le(nt, [["__scopeId", "data-v-d7d9fd3b"]]), ot = { class: "speed-value" }, at = ["onClick"], it = /* @__PURE__ */ ne({
+}), ot = /* @__PURE__ */ le(lt, [["__scopeId", "data-v-0f78dcee"]]), at = { class: "speed-value" }, it = ["onClick"], rt = /* @__PURE__ */ ne({
   __name: "SpeedSelector",
   props: {
     modelValue: {},
@@ -379,37 +382,37 @@ const Qe = {
   },
   emits: ["update:modelValue"],
   setup(e, { emit: n }) {
-    const a = n, t = $(!1), d = $(!0), f = $(null);
-    function u() {
-      if (!f.value) return;
-      const i = f.value.getBoundingClientRect(), y = i.top, p = window.innerHeight - i.bottom;
-      d.value = y >= p;
+    const a = n, t = V(!1), d = V(!0), p = V(null);
+    function c() {
+      if (!p.value) return;
+      const i = p.value.getBoundingClientRect(), y = i.top, g = window.innerHeight - i.bottom;
+      d.value = y >= g;
     }
-    function X() {
-      t.value || u(), t.value = !t.value;
+    function z() {
+      t.value || c(), t.value = !t.value;
     }
-    function k(i) {
+    function w(i) {
       a("update:modelValue", i), t.value = !1;
     }
-    function E(i) {
-      f.value && !f.value.contains(i.target) && (t.value = !1);
+    function P(i) {
+      p.value && !p.value.contains(i.target) && (t.value = !1);
     }
-    return ge(() => document.addEventListener("mousedown", E)), fe(() => document.removeEventListener("mousedown", E)), (i, y) => (T(), x("div", {
+    return Te(() => document.addEventListener("mousedown", P)), ye(() => document.removeEventListener("mousedown", P)), (i, y) => (b(), $("div", {
       class: "speed-selector",
       ref_key: "selectorRef",
-      ref: f
+      ref: p
     }, [
-      c("div", {
+      u("div", {
         class: "speed-trigger",
-        onClick: X
+        onClick: z
       }, [
-        c("span", ot, z(e.modelValue) + "x", 1),
-        (T(), x("svg", {
-          class: j(["arrow-icon", { open: t.value }]),
+        u("span", at, j(e.modelValue) + "x", 1),
+        (b(), $("svg", {
+          class: U(["arrow-icon", { open: t.value }]),
           viewBox: "0 0 12 12",
           fill: "currentColor"
         }, [...y[0] || (y[0] = [
-          c("path", {
+          u("path", {
             d: "M2.5 4.5L6 8L9.5 4.5",
             stroke: "currentColor",
             "stroke-width": "1.5",
@@ -419,26 +422,26 @@ const Qe = {
           }, null, -1)
         ])], 2))
       ]),
-      ee(Ie, {
+      ee(Be, {
         name: d.value ? "dropdown-up" : "dropdown-down"
       }, {
         default: te(() => [
-          t.value ? (T(), x("div", {
+          t.value ? (b(), $("div", {
             key: 0,
-            class: j(["speed-dropdown", d.value ? "is-up" : "is-down"])
+            class: U(["speed-dropdown", d.value ? "is-up" : "is-down"])
           }, [
-            (T(!0), x(ye, null, he(e.options, (p) => (T(), x("div", {
-              key: p,
-              class: j(["speed-option", { active: p === e.modelValue }]),
-              onClick: (w) => k(p)
-            }, z(p) + "x ", 11, at))), 128))
-          ], 2)) : ve("", !0)
+            (b(!0), $(xe, null, we(e.options, (g) => (b(), $("div", {
+              key: g,
+              class: U(["speed-option", { active: g === e.modelValue }]),
+              onClick: (T) => w(g)
+            }, j(g) + "x ", 11, it))), 128))
+          ], 2)) : ge("", !0)
         ]),
         _: 1
       }, 8, ["name"])
     ], 512));
   }
-}), st = /* @__PURE__ */ le(it, [["__scopeId", "data-v-30c5e152"]]), rt = { class: "g-time-player" }, ut = { class: "controls-wrapper" }, ct = { class: "timeline-wrapper" }, dt = /* @__PURE__ */ ne({
+}), st = /* @__PURE__ */ le(rt, [["__scopeId", "data-v-30c5e152"]]), ut = { class: "g-time-player" }, ct = { class: "controls-wrapper" }, dt = { class: "timeline-wrapper" }, vt = /* @__PURE__ */ ne({
   __name: "index",
   props: {
     modelValue: {},
@@ -454,151 +457,165 @@ const Qe = {
   },
   emits: ["update:modelValue", "change"],
   setup(e, { expose: n, emit: a }) {
-    const t = e, d = a, f = v(() => h(t.startTime)), u = v(() => h(t.endTime)), X = v(() => f.value), k = v(() => u.value), E = v(() => {
+    const t = e, d = a, p = f(() => x(t.startTime)), c = f(() => x(t.endTime)), z = f(() => p.value), w = f(() => c.value), P = f(() => {
       const l = [];
-      let g = f.value;
-      for (; g <= u.value; )
-        l.push(g), g = W(g, t.interval);
+      let v = p.value;
+      for (; v <= c.value; )
+        l.push(v), v = F(v, t.interval);
       return l;
-    }), i = $(h(t.modelValue ?? t.startTime)), y = $(!1), p = $(t.speed);
-    let w = null;
-    const C = v(() => t.playInterval / p.value);
-    _(() => t.speed, (l) => {
-      p.value = l;
+    }), i = V(H(t.modelValue ?? t.startTime)), y = V(!1), g = V(t.speed);
+    let T = null, S = i.value;
+    const R = f(() => t.playInterval / g.value);
+    B(() => t.speed, (l) => {
+      g.value = l;
     });
-    function B(l) {
-      const g = Je(E.value, l);
-      return g >= 0 ? g : 0;
+    function L(l) {
+      return Math.max(p.value, Math.min(l, c.value));
     }
-    function O(l, g) {
-      d("update:modelValue", l), d("change", { time: l, index: B(l) });
+    function H(l) {
+      return L(x(l));
     }
-    function G(l, g) {
-      d("change", { time: l, index: g });
+    function oe(l) {
+      const v = P.value;
+      if (!v.length) return -1;
+      const k = Le(v, L(l));
+      return Math.max(0, Math.min(k, v.length - 1));
     }
-    _(
+    function ae(l, v) {
+      const k = L(l);
+      k !== S && (S = k, d("update:modelValue", k), d("change", { time: k, index: oe(k) }));
+    }
+    function Y(l, v) {
+      const k = L(l);
+      d("change", { time: k, index: Math.max(0, Math.min(v, P.value.length - 1)) });
+    }
+    B(
       () => t.modelValue,
       (l) => {
-        l !== void 0 && !y.value && (i.value = h(l));
+        l !== void 0 && !y.value && (i.value = H(l));
       }
-    ), _(f, () => {
-      L(), i.value = f.value;
-    }), _(u, (l) => {
-      i.value > l && (i.value = l, L());
-    }), _(i, (l) => {
-      O(l), l >= u.value && L();
+    ), B(p, () => {
+      h(), i.value = p.value, S = i.value;
+    }), B(c, (l) => {
+      i.value > l && (i.value = l, h());
+    }), B(i, (l) => {
+      const v = L(l);
+      if (v !== l) {
+        i.value = v;
+        return;
+      }
+      ae(v), v >= c.value && h();
     });
-    function Y() {
-      y.value ? L() : q();
+    function I() {
+      y.value ? h() : M();
     }
-    function q() {
-      i.value >= u.value && (i.value = f.value), y.value = !0, w && clearInterval(w), w = setInterval(I, C.value);
+    function M() {
+      i.value >= c.value && (i.value = p.value), y.value = !0, T && clearInterval(T), T = setInterval(O, R.value);
     }
-    function L() {
-      y.value = !1, w && (clearInterval(w), w = null);
+    function h() {
+      y.value = !1, T && (clearInterval(T), T = null);
     }
-    _(C, (l) => {
-      y.value && (w && clearInterval(w), w = setInterval(I, l));
+    B(R, (l) => {
+      y.value && (T && clearInterval(T), T = setInterval(O, l));
     });
-    function I() {
-      const l = W(i.value, t.interval);
-      if (l > u.value) {
-        i.value = u.value, L();
+    function O() {
+      const l = F(i.value, t.interval);
+      if (l > c.value) {
+        i.value = L(c.value), h();
         return;
       }
-      i.value = l;
+      i.value = L(l);
     }
-    function D() {
-      const l = W(i.value, -t.interval);
-      i.value = l < f.value ? f.value : l;
+    function q() {
+      const l = F(i.value, -t.interval);
+      i.value = L(l);
     }
-    function S() {
-      const l = W(i.value, t.interval);
-      i.value = l > u.value ? u.value : l;
+    function J() {
+      const l = F(i.value, t.interval);
+      i.value = L(l);
     }
-    function J(l) {
-      const g = h(l), V = Math.max(f.value, Math.min(g, u.value));
-      i.value = V;
+    function ie(l) {
+      i.value = H(l);
     }
     return n({
-      play: q,
-      pause: L,
-      togglePlay: Y,
-      prev: D,
-      next: S,
-      seekTo: J,
+      play: M,
+      pause: h,
+      togglePlay: I,
+      prev: q,
+      next: J,
+      seekTo: ie,
       isPlaying: y,
       currentTime: i,
-      speedMultiplier: p
-    }), fe(() => L()), (l, g) => (T(), x("div", rt, [
-      c("div", ut, [
-        ee(Fe, {
+      speedMultiplier: g
+    }), ye(() => h()), (l, v) => (b(), $("div", ut, [
+      u("div", ct, [
+        ee(Oe, {
           "is-playing": y.value,
-          onTogglePlay: Y,
-          onPrev: D,
-          onNext: S
-        }, Re({ _: 2 }, [
+          onTogglePlay: I,
+          onPrev: q,
+          onNext: J
+        }, He({ _: 2 }, [
           l.$slots.prev ? {
             name: "prev",
             fn: te(() => [
-              F(l.$slots, "prev", {}, void 0, !0)
+              X(l.$slots, "prev", {}, void 0, !0)
             ]),
             key: "0"
           } : void 0,
           l.$slots.play ? {
             name: "play",
-            fn: te(({ isPlaying: V }) => [
-              F(l.$slots, "play", { isPlaying: V }, void 0, !0)
+            fn: te(({ isPlaying: k }) => [
+              X(l.$slots, "play", { isPlaying: k }, void 0, !0)
             ]),
             key: "1"
           } : void 0,
           l.$slots.next ? {
             name: "next",
             fn: te(() => [
-              F(l.$slots, "next", {}, void 0, !0)
+              X(l.$slots, "next", {}, void 0, !0)
             ]),
             key: "2"
           } : void 0
         ]), 1032, ["is-playing"])
       ]),
-      c("div", ct, [
-        ee(lt, {
+      u("div", dt, [
+        ee(ot, {
           modelValue: i.value,
-          "onUpdate:modelValue": g[0] || (g[0] = (V) => i.value = V),
-          "start-time": X.value,
-          "end-time": k.value,
+          "onUpdate:modelValue": v[0] || (v[0] = (k) => i.value = k),
+          "start-time": z.value,
+          "end-time": w.value,
           interval: e.interval,
           "min-tick-spacing": e.minTickSpacing,
           "tick-label-mode": e.tickLabelMode,
           "format-tooltip": e.formatTooltip,
-          onPlayingPause: L,
-          onChange: G
+          onPlayingPause: h,
+          onChange: Y
         }, null, 8, ["modelValue", "start-time", "end-time", "interval", "min-tick-spacing", "tick-label-mode", "format-tooltip"])
       ]),
       ee(st, {
-        modelValue: p.value,
-        "onUpdate:modelValue": g[1] || (g[1] = (V) => p.value = V),
+        modelValue: g.value,
+        "onUpdate:modelValue": v[1] || (v[1] = (k) => g.value = k),
         options: e.speedOptions
       }, null, 8, ["modelValue", "options"])
     ]));
   }
-}), mt = /* @__PURE__ */ le(dt, [["__scopeId", "data-v-98cef505"]]);
+}), gt = /* @__PURE__ */ le(vt, [["__scopeId", "data-v-55b5dfa2"]]);
 export {
-  W as addHours,
-  mt as default,
-  ze as defaultTooltipFormat,
-  ft as diffHours,
-  qe as findNearestTickIndex,
-  Je as findTickIndex,
-  Ke as formatDayLabel,
-  Ue as formatHH,
-  je as formatHHmm,
-  we as formatMD,
-  pe as getDateKey,
-  Ge as getDayOfWeek,
-  Oe as getHour,
-  Ye as getNextMidnight,
-  ke as getWeekdayShort,
-  h as toTimestamp,
-  mt as vue3TimePlaybar
+  F as addHours,
+  gt as default,
+  qe as defaultTooltipFormat,
+  mt as diffHours,
+  Le as findNearestTickIndex,
+  pt as findTickIndex,
+  Je as formatDayLabel,
+  Ke as formatHH,
+  Ye as formatHHmm,
+  $e as formatMD,
+  ke as getDateKey,
+  je as getDayOfWeek,
+  Ue as getHour,
+  Qe as getNextMidnight,
+  be as getWeekdayShort,
+  x as toTimestamp,
+  gt as vue3TimePlaybar
 };

package/vue3-time-playbar.umd.cjs CHANGED Viewed

	@@ -1 +1 @@
1	- (function(m,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(m=typeof globalThis<"u"?globalThis:m\|\|self,e(m.Vue3TimePlaybar={},m.Vue))})(this,(function(m,e){"use strict";const fe={class:"player-controls"},pe={class:"btn-group"},ge=["title"],ye={key:0,viewBox:"0 0 24 24",fill:"currentColor",stroke:"none"},ve={key:1,viewBox:"0 0 24 24",fill:"currentColor",stroke:"none"},he=e.defineComponent({__name:"PlayerControls",props:{isPlaying:{type:Boolean}},emits:["toggle-play","prev","next"],setup(t){return(o,r)=>(e.openBlock(),e.createElementBlock("div",fe,[e.createElementVNode("div",pe,[e.createElementVNode("button",{class:"control-btn",onClick:r[0]\|\|(r[0]=n=>o.$emit("prev")),title:"上一时刻"},[e.renderSlot(o.$slots,"prev",{},()=>[r[3]\|\|(r[3]=e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("polygon",{points:"19 20 9 12 19 4 19 20"}),e.createElementVNode("line",{x1:"5",y1:"19",x2:"5",y2:"5"})],-1))],!0)]),e.createElementVNode("button",{class:"control-btn play-btn",onClick:r[1]\|\|(r[1]=n=>o.$emit("toggle-play")),title:t.isPlaying?"暂停":"播放"},[e.renderSlot(o.$slots,"play",{isPlaying:t.isPlaying},()=>[t.isPlaying?(e.openBlock(),e.createElementBlock("svg",ve,[...r[5]\|\|(r[5]=[e.createElementVNode("rect",{x:"6",y:"4",width:"4",height:"16",rx:"1"},null,-1),e.createElementVNode("rect",{x:"14",y:"4",width:"4",height:"16",rx:"1"},null,-1)])])):(e.openBlock(),e.createElementBlock("svg",ye,[...r[4]\|\|(r[4]=[e.createElementVNode("polygon",{points:"5 3 19 12 5 21 5 3"},null,-1)])]))],!0)],8,ge),e.createElementVNode("button",{class:"control-btn",onClick:r[2]\|\|(r[2]=n=>o.$emit("next")),title:"下一时刻"},[e.renderSlot(o.$slots,"next",{},()=>[r[6]\|\|(r[6]=e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("polygon",{points:"5 4 15 12 5 20 5 4"}),e.createElementVNode("line",{x1:"19",y1:"5",x2:"19",y2:"19"})],-1))],!0)])])]))}}),A=(t,o)=>{const r=t.__vccOpts\|\|t;for(const[n,u]of o)r[n]=u;return r},ke=A(he,[["__scopeId","data-v-55e12a8d"]]),we=["周日","周一","周二","周三","周四","周五","周六"];function v(t){if(typeof t=="number")return t;if(t instanceof Date)return t.getTime();const o=Date.parse(t);return Number.isNaN(o)?(console.warn(`[GTimePlayer] 无法解析时间: "${t}"`),0):o}function H(t,o=2){return String(t).padStart(o,"0")}function ne(t){return new Date(t).getHours()}function oe(t){return new Date(t).getDay()}function j(t){return we[oe(t)]??""}function le(t){return H(new Date(t).getHours())}function K(t){const o=new Date(t);return`${o.getMonth()+1}月${o.getDate()}日`}function ae(t){const o=new Date(t);return`${H(o.getHours())}:${H(o.getMinutes())}`}function re(t){return`${K(t)} ${j(t)} ${ae(t)}`}function q(t){const o=new Date(t);return`${o.getFullYear()}${H(o.getMonth()+1)}${H(o.getDate())}`}function ie(t){return`${K(t)} ${j(t)}`}function L(t,o){return t+o36e5}function Te(t,o){return(v(o)-v(t))/36e5}function se(t){const o=new Date(t);return o.setHours(24,0,0,0),o.getTime()}function ce(t,o){if(t.length===0)return-1;if(t.length===1)return 0;let r=0,n=t.length-1;if(o<=t[r])return r;if(o>=t[n])return n;for(;r<=n;){const u=r+n>>>1,f=t[u];if(f===o)return u;f<o?r=u+1:n=u-1}return r>=t.length?n:n<0\|\|Math.abs(t[r]-o)<Math.abs(t[n]-o)?r:n}function de(t,o){let r=0,n=t.length-1;for(;r<=n;){const u=r+n>>>1,f=t[u];if(f===o)return u;f<o?r=u+1:n=u-1}return-1}const Ve={key:0,class:"tick-label"},Ee={key:1,class:"day-label"},be=35,Se=35,xe=A(e.defineComponent({__name:"TimeTimeline",props:{modelValue:{},startTime:{},endTime:{},interval:{},minTickSpacing:{},tickLabelMode:{default:"all"},formatTooltip:{}},emits:["update:modelValue","change","playing-pause"],setup(t,{emit:o}){const r=[2,8,14,20],n=t,u=o,f=e.ref(null),d=e.ref(null),I=e.ref(null),k=e.ref(0),$=e.ref(0),i=e.ref(0);let h=!1,g=0,w=!1,x=!1,M=null;const R=e.ref(!1),z=e.computed(()=>{const a=v(n.startTime),c=v(n.endTime),s=c-a;if(s<=0)return[];const T=[];let p=a;for(;p<=c;){const D=(p-a)/s100,S=ne(p),C=T.length===0,Z=q(p),ee=C?null:q(T[T.length-1].time),G=!C&&ee!==Z\|\|C&&S===0;let P=!1;if(S===0)P=!0;else if(C){const _=se(p);(L(p,n.interval)>_\|\|c<_)&&(P=!0)}const te=S===0&&P?!1:n.tickLabelMode==="all"\|\|r.includes(S);T.push({time:p,percent:D,label:le(p),showLabel:te,dayLabel:ie(p),showDayLabel:P,isDayBoundary:G}),p=L(p,n.interval)}return T}),F=e.computed(()=>z.value.map(a=>a.time)),O=e.computed(()=>n.minTickSpacing!==void 0?n.minTickSpacing:n.tickLabelMode==="major"?5:15),V=e.computed(()=>{const a=z.value.length;return a<2?k.value\|\|0:(a-1)O.value}),B=e.computed(()=>V.value>k.value&&k.value>0),E=e.computed(()=>B.value?be:Se),b=e.computed(()=>B.value?V.value:Math.max(0,k.value-E.value2)),U=e.computed(()=>b.value+E.value2),l=e.computed(()=>k.value&&B.value?U.value+"px":"100%"),y=e.computed(()=>({left:E.value+"px",width:b.value+"px"})),N=e.computed(()=>({left:E.value+"px",width:b.value+"px"})),X=e.computed(()=>{const a=v(n.startTime),c=v(n.endTime),s=v(n.modelValue);return s<=a?0:s>=c?100:(s-a)/(c-a)100}),Me=e.computed(()=>({left:E.value+"px",width:X.value/100b.value+"px"})),Pe=e.computed(()=>{const a=v(n.modelValue);return n.formatTooltip?n.formatTooltip(a):re(a)}),Y=e.computed(()=>E.value+X.value/100b.value-i.value),_e=e.computed(()=>Y.value>-50&&Y.value<k.value+50),He=e.computed(()=>({transform:`translateX(${Y.value}px)`}));function Ie(){d.value&&($.value=d.value.scrollLeft,w\|\|(i.value=d.value.scrollLeft))}function Re(a){!d.value\|\|!B.value\|\|(d.value.scrollLeft+=a.deltaY\|\|a.deltaX)}function W(a=!1){if(!B.value\|\|!d.value\|\|h)return;const c=E.value+X.value/100b.value,s=k.value,T=U.value-s,p=Math.max(0,Math.min(c-s/2,T));i.value=p;const D=d.value;if(a\|\|Math.abs(D.scrollLeft-p)<1){D.scrollLeft=p,$.value=p;return}g&&cancelAnimationFrame(g);const S=D.scrollLeft,C=p-S;w=!0;const Z=200,ee=performance.now();function G(P){const te=P-ee,_=Math.min(te/Z,1),me=1-(1-_)(1-_);D.scrollLeft=S+Cme,$.value=D.scrollLeft,_<1?g=requestAnimationFrame(G):(g=0,w=!1)}g=requestAnimationFrame(G)}e.watch(X,()=>W()),e.watch(k,()=>W());function J(a){if(!d.value)return v(n.startTime);const c=d.value.getBoundingClientRect(),s=d.value.scrollLeft,p=a.clientX-c.left+s-E.value,D=Math.max(0,Math.min(p,b.value)),S=v(n.startTime),C=v(n.endTime);return S+(C-S)(D/(b.value\|\|1))}function ze(a){const c=F.value;if(c.length===0)return{time:a,index:-1};const s=ce(c,a);return{time:c[s]??a,index:s}}function Q(a){const{time:c,index:s}=ze(a);c!==v(n.modelValue)&&(u("update:modelValue",c),u("change",c,s))}function We(a){if(x){x=!1;return}Q(J(a))}function Ae(a){const c=a.clientX;x=!1,h=!0,u("playing-pause");const s=p=>{Math.abs(p.clientX-c)>3&&(x=!0),Q(J(p))},T=()=>{h=!1,document.removeEventListener("mousemove",s),document.removeEventListener("mouseup",T),e.nextTick(()=>W())};document.addEventListener("mousemove",s),document.addEventListener("mouseup",T)}function Fe(a){h=!0,x=!1,R.value=!0,document.body.style.cursor="grabbing",u("playing-pause");const c=T=>{x=!0,Q(J(T))},s=()=>{h=!1,R.value=!1,document.body.style.cursor="",document.removeEventListener("mousemove",c),document.removeEventListener("mouseup",s),e.nextTick(()=>W())};document.addEventListener("mousemove",c),document.addEventListener("mouseup",s)}return e.onMounted(()=>{d.value&&(k.value=d.value.clientWidth,M=new ResizeObserver(a=>{a[0]&&(k.value=a[0].contentRect.width)}),M.observe(d.value)),e.nextTick(()=>W())}),e.onUnmounted(()=>{g&&cancelAnimationFrame(g),M==null\|\|M.disconnect()}),(a,c)=>(e.openBlock(),e.createElementBlock("div",{class:"time-timeline",ref_key:"timelineRef",ref:f},[e.withDirectives(e.createElementVNode("div",{class:e.normalizeClass(["handle-group",{dragging:R.value}]),style:e.normalizeStyle(He.value)},[e.createElementVNode("div",{class:"floating-tooltip",onMousedown:e.withModifiers(Fe,["prevent","stop"])},e.toDisplayString(Pe.value),33),c[0]\|\|(c[0]=e.createElementVNode("div",{class:"handle-visual"},null,-1))],6),[[e.vShow,_e.value]]),e.createElementVNode("div",{class:"scroll-container",ref_key:"scrollRef",ref:d,onScroll:Ie,onWheel:e.withModifiers(Re,["prevent"])},[e.createElementVNode("div",{class:"timeline-inner",ref_key:"innerRef",ref:I,style:e.normalizeStyle({width:l.value}),onMousedown:e.withModifiers(Ae,["prevent"]),onClick:We},[e.createElementVNode("div",{class:"track-bg",style:e.normalizeStyle(y.value)},null,4),e.createElementVNode("div",{class:"track-active",style:e.normalizeStyle(Me.value)},null,4),e.createElementVNode("div",{class:"ticks-container",style:e.normalizeStyle(N.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(z.value,s=>(e.openBlock(),e.createElementBlock("div",{key:s.time,class:e.normalizeClass(["tick-item",{"is-day-boundary":s.isDayBoundary}]),style:e.normalizeStyle({left:s.percent+"%"})},[c[1]\|\|(c[1]=e.createElementVNode("div",{class:"tick-mark"},null,-1)),s.showLabel?(e.openBlock(),e.createElementBlock("div",Ve,e.toDisplayString(s.label),1)):e.createCommentVNode("",!0),s.showDayLabel?(e.openBlock(),e.createElementBlock("div",Ee,e.toDisplayString(s.dayLabel),1)):e.createCommentVNode("",!0)],6))),128))],4)],36)],544)],512))}}),[["__scopeId","data-v-d7d9fd3b"]]),Ne={class:"speed-value"},De=["onClick"],$e=A(e.defineComponent({__name:"SpeedSelector",props:{modelValue:{},options:{}},emits:["update:modelValue"],setup(t,{emit:o}){const r=o,n=e.ref(!1),u=e.ref(!0),f=e.ref(null);function d(){if(!f.value)return;const i=f.value.getBoundingClientRect(),h=i.top,g=window.innerHeight-i.bottom;u.value=h>=g}function I(){n.value\|\|d(),n.value=!n.value}function k(i){r("update:modelValue",i),n.value=!1}function $(i){f.value&&!f.value.contains(i.target)&&(n.value=!1)}return e.onMounted(()=>document.addEventListener("mousedown",$)),e.onUnmounted(()=>document.removeEventListener("mousedown",$)),(i,h)=>(e.openBlock(),e.createElementBlock("div",{class:"speed-selector",ref_key:"selectorRef",ref:f},[e.createElementVNode("div",{class:"speed-trigger",onClick:I},[e.createElementVNode("span",Ne,e.toDisplayString(t.modelValue)+"x",1),(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(["arrow-icon",{open:n.value}]),viewBox:"0 0 12 12",fill:"currentColor"},[...h[0]\|\|(h[0]=[e.createElementVNode("path",{d:"M2.5 4.5L6 8L9.5 4.5",stroke:"currentColor","stroke-width":"1.5",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"},null,-1)])],2))]),e.createVNode(e.Transition,{name:u.value?"dropdown-up":"dropdown-down"},{default:e.withCtx(()=>[n.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["speed-dropdown",u.value?"is-up":"is-down"])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,g=>(e.openBlock(),e.createElementBlock("div",{key:g,class:e.normalizeClass(["speed-option",{active:g===t.modelValue}]),onClick:w=>k(g)},e.toDisplayString(g)+"x ",11,De))),128))],2)):e.createCommentVNode("",!0)]),_:1},8,["name"])],512))}}),[["__scopeId","data-v-30c5e152"]]),Be={class:"g-time-player"},Ce={class:"controls-wrapper"},Le={class:"timeline-wrapper"},ue=A(e.defineComponent({__name:"index",props:{modelValue:{},startTime:{},endTime:{},interval:{default:1},playInterval:{default:1e3},speed:{default:1},speedOptions:{default:()=>[.5,1,2,3]},minTickSpacing:{},tickLabelMode:{default:"all"},formatTooltip:{}},emits:["update:modelValue","change"],setup(t,{expose:o,emit:r}){const n=t,u=r,f=e.computed(()=>v(n.startTime)),d=e.computed(()=>v(n.endTime)),I=e.computed(()=>f.value),k=e.computed(()=>d.value),$=e.computed(()=>{const l=[];let y=f.value;for(;y<=d.value;)l.push(y),y=L(y,n.interval);return l}),i=e.ref(v(n.modelValue??n.startTime)),h=e.ref(!1),g=e.ref(n.speed);let w=null;const x=e.computed(()=>n.playInterval/g.value);e.watch(()=>n.speed,l=>{g.value=l});function M(l){const y=de($.value,l);return y>=0?y:0}function R(l,y){u("update:modelValue",l),u("change",{time:l,index:M(l)})}function z(l,y){u("change",{time:l,index:y})}e.watch(()=>n.modelValue,l=>{l!==void 0&&!h.value&&(i.value=v(l))}),e.watch(f,()=>{V(),i.value=f.value}),e.watch(d,l=>{i.value>l&&(i.value=l,V())}),e.watch(i,l=>{R(l),l>=d.value&&V()});function F(){h.value?V():O()}function O(){i.value>=d.value&&(i.value=f.value),h.value=!0,w&&clearInterval(w),w=setInterval(B,x.value)}function V(){h.value=!1,w&&(clearInterval(w),w=null)}e.watch(x,l=>{h.value&&(w&&clearInterval(w),w=setInterval(B,l))});function B(){const l=L(i.value,n.interval);if(l>d.value){i.value=d.value,V();return}i.value=l}function E(){const l=L(i.value,-n.interval);i.value=l<f.value?f.value:l}function b(){const l=L(i.value,n.interval);i.value=l>d.value?d.value:l}function U(l){const y=v(l),N=Math.max(f.value,Math.min(y,d.value));i.value=N}return o({play:O,pause:V,togglePlay:F,prev:E,next:b,seekTo:U,isPlaying:h,currentTime:i,speedMultiplier:g}),e.onUnmounted(()=>V()),(l,y)=>(e.openBlock(),e.createElementBlock("div",Be,[e.createElementVNode("div",Ce,[e.createVNode(ke,{"is-playing":h.value,onTogglePlay:F,onPrev:E,onNext:b},e.createSlots({_:2},[l.$slots.prev?{name:"prev",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"prev",{},void 0,!0)]),key:"0"}:void 0,l.$slots.play?{name:"play",fn:e.withCtx(({isPlaying:N})=>[e.renderSlot(l.$slots,"play",{isPlaying:N},void 0,!0)]),key:"1"}:void 0,l.$slots.next?{name:"next",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"next",{},void 0,!0)]),key:"2"}:void 0]),1032,["is-playing"])]),e.createElementVNode("div",Le,[e.createVNode(xe,{modelValue:i.value,"onUpdate:modelValue":y[0]\|\|(y[0]=N=>i.value=N),"start-time":I.value,"end-time":k.value,interval:t.interval,"min-tick-spacing":t.minTickSpacing,"tick-label-mode":t.tickLabelMode,"format-tooltip":t.formatTooltip,onPlayingPause:V,onChange:z},null,8,["modelValue","start-time","end-time","interval","min-tick-spacing","tick-label-mode","format-tooltip"])]),e.createVNode($e,{modelValue:g.value,"onUpdate:modelValue":y[1]\|\|(y[1]=N=>g.value=N),options:t.speedOptions},null,8,["modelValue","options"])]))}}),[["__scopeId","data-v-98cef505"]]);m.addHours=L,m.default=ue,m.defaultTooltipFormat=re,m.diffHours=Te,m.findNearestTickIndex=ce,m.findTickIndex=de,m.formatDayLabel=ie,m.formatHH=le,m.formatHHmm=ae,m.formatMD=K,m.getDateKey=q,m.getDayOfWeek=oe,m.getHour=ne,m.getNextMidnight=se,m.getWeekdayShort=j,m.toTimestamp=v,m.vue3TimePlaybar=ue,Object.defineProperties(m,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
1	+ (function(m,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(m=typeof globalThis<"u"?globalThis:m\|\|self,e(m.Vue3TimePlaybar={},m.Vue))})(this,(function(m,e){"use strict";const ge={class:"player-controls"},ye={class:"btn-group"},he=["title"],ve={key:0,viewBox:"0 0 24 24",fill:"currentColor",stroke:"none"},ke={key:1,viewBox:"0 0 24 24",fill:"currentColor",stroke:"none"},Te=e.defineComponent({__name:"PlayerControls",props:{isPlaying:{type:Boolean}},emits:["toggle-play","prev","next"],setup(t){return(o,i)=>(e.openBlock(),e.createElementBlock("div",ge,[e.createElementVNode("div",ye,[e.createElementVNode("button",{class:"control-btn",onClick:i[0]\|\|(i[0]=n=>o.$emit("prev")),title:"上一时刻"},[e.renderSlot(o.$slots,"prev",{},()=>[i[3]\|\|(i[3]=e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("polygon",{points:"19 20 9 12 19 4 19 20"}),e.createElementVNode("line",{x1:"5",y1:"19",x2:"5",y2:"5"})],-1))],!0)]),e.createElementVNode("button",{class:"control-btn play-btn",onClick:i[1]\|\|(i[1]=n=>o.$emit("toggle-play")),title:t.isPlaying?"暂停":"播放"},[e.renderSlot(o.$slots,"play",{isPlaying:t.isPlaying},()=>[t.isPlaying?(e.openBlock(),e.createElementBlock("svg",ke,[...i[5]\|\|(i[5]=[e.createElementVNode("rect",{x:"6",y:"4",width:"4",height:"16",rx:"1"},null,-1),e.createElementVNode("rect",{x:"14",y:"4",width:"4",height:"16",rx:"1"},null,-1)])])):(e.openBlock(),e.createElementBlock("svg",ve,[...i[4]\|\|(i[4]=[e.createElementVNode("polygon",{points:"5 3 19 12 5 21 5 3"},null,-1)])]))],!0)],8,he),e.createElementVNode("button",{class:"control-btn",onClick:i[2]\|\|(i[2]=n=>o.$emit("next")),title:"下一时刻"},[e.renderSlot(o.$slots,"next",{},()=>[i[6]\|\|(i[6]=e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("polygon",{points:"5 4 15 12 5 20 5 4"}),e.createElementVNode("line",{x1:"19",y1:"5",x2:"19",y2:"19"})],-1))],!0)])])]))}}),A=(t,o)=>{const i=t.__vccOpts\|\|t;for(const[n,u]of o)i[n]=u;return i},we=A(Te,[["__scopeId","data-v-55e12a8d"]]),Ve=["周日","周一","周二","周三","周四","周五","周六"];function T(t){if(typeof t=="number")return t;if(t instanceof Date)return t.getTime();const o=Date.parse(t);return Number.isNaN(o)?(console.warn(`[GTimePlayer] 无法解析时间: "${t}"`),0):o}function R(t,o=2){return String(t).padStart(o,"0")}function ie(t){return new Date(t).getHours()}function re(t){return new Date(t).getDay()}function j(t){return Ve[re(t)]??""}function se(t){return R(new Date(t).getHours())}function K(t){const o=new Date(t);return`${o.getMonth()+1}月${o.getDate()}日`}function ce(t){const o=new Date(t);return`${R(o.getHours())}:${R(o.getMinutes())}`}function de(t){return`${K(t)} ${j(t)} ${ce(t)}`}function q(t){const o=new Date(t);return`${o.getFullYear()}${R(o.getMonth()+1)}${R(o.getDate())}`}function ue(t){return`${K(t)} ${j(t)}`}function L(t,o){return t+o36e5}function Ee(t,o){return(T(o)-T(t))/36e5}function me(t){const o=new Date(t);return o.setHours(24,0,0,0),o.getTime()}function Y(t,o){if(t.length===0)return-1;if(t.length===1)return 0;let i=0,n=t.length-1;if(o<=t[i])return i;if(o>=t[n])return n;for(;i<=n;){const u=i+n>>>1,g=t[u];if(g===o)return u;g<o?i=u+1:n=u-1}return i>=t.length?n:n<0\|\|Math.abs(t[i]-o)<Math.abs(t[n]-o)?i:n}function Se(t,o){let i=0,n=t.length-1;for(;i<=n;){const u=i+n>>>1,g=t[u];if(g===o)return u;g<o?i=u+1:n=u-1}return-1}const be={key:0,class:"tick-label"},xe={key:1,class:"day-label"},Ne=35,De=35,Me=A(e.defineComponent({__name:"TimeTimeline",props:{modelValue:{},startTime:{},endTime:{},interval:{},minTickSpacing:{},tickLabelMode:{default:"all"},formatTooltip:{}},emits:["update:modelValue","change","playing-pause"],setup(t,{emit:o}){const i=[2,8,14,20],n=t,u=o,g=e.useTemplateRef("timelineRef"),d=e.useTemplateRef("scrollRef"),I=e.useTemplateRef("innerRef"),V=e.ref(0),D=e.ref(0),r=e.ref(0);let h=!1,y=0,w=!1,x=!1,$=null;const E=e.ref(!1),P=e.computed(()=>{const a=T(n.startTime),c=T(n.endTime),s=c-a;if(s<=0)return[];const S=[];let p=a;for(;p<=c;){const M=(p-a)/s100,N=ie(p),C=S.length===0,oe=q(p),le=C?null:q(S[S.length-1].time),G=!C&&le!==oe\|\|C&&N===0;let _=!1;if(N===0)_=!0;else if(C){const H=me(p);(L(p,n.interval)>H\|\|c<H)&&(_=!0)}const ae=N===0&&_?!1:n.tickLabelMode==="all"\|\|i.includes(N);S.push({time:p,percent:M,label:se(p),showLabel:ae,dayLabel:ue(p),showDayLabel:_,isDayBoundary:G}),p=L(p,n.interval)}return S}),J=e.computed(()=>P.value.map(a=>a.time)),Q=e.computed(()=>n.minTickSpacing!==void 0?n.minTickSpacing:n.tickLabelMode==="major"?5:15),F=e.computed(()=>{const a=P.value.length;return a<2?V.value\|\|0:(a-1)Q.value}),B=e.computed(()=>F.value>V.value&&V.value>0),b=e.computed(()=>B.value?Ne:De),v=e.computed(()=>B.value?F.value:Math.max(0,V.value-b.value2)),z=e.computed(()=>v.value+b.value2),O=e.computed(()=>V.value&&B.value?z.value+"px":"100%"),U=e.computed(()=>({left:b.value+"px",width:v.value+"px"})),Z=e.computed(()=>({left:b.value+"px",width:v.value+"px"})),l=e.computed(()=>{const a=T(n.startTime),c=T(n.endTime),s=T(n.modelValue);return s<=a?0:s>=c?100:(s-a)/(c-a)100}),f=e.computed(()=>({left:b.value+"px",width:l.value/100v.value+"px"})),k=e.computed(()=>{const a=T(n.modelValue);return n.formatTooltip?n.formatTooltip(a):de(a)}),ee=e.computed(()=>b.value+l.value/100v.value-r.value),He=e.computed(()=>ee.value>-50&&ee.value<V.value+50),Re=e.computed(()=>({transform:`translateX(${ee.value}px)`}));function X(){y&&(cancelAnimationFrame(y),y=0),w=!1}function Ie(){d.value&&(D.value=d.value.scrollLeft,w\|\|(r.value=d.value.scrollLeft))}function ze(a){!d.value\|\|!B.value\|\|(d.value.scrollLeft+=a.deltaY\|\|a.deltaX)}function W(a=!1){if(!B.value\|\|!d.value\|\|h)return;const c=b.value+l.value/100v.value,s=V.value,S=z.value-s,p=Math.max(0,Math.min(c-s/2,S));r.value=p;const M=d.value;if(a\|\|Math.abs(M.scrollLeft-p)<1){M.scrollLeft=p,D.value=p;return}X();const N=M.scrollLeft,C=p-N;w=!0;const oe=200,le=performance.now();function G(_){const ae=_-le,H=Math.min(ae/oe,1),pe=1-(1-H)(1-H);M.scrollLeft=N+Cpe,D.value=M.scrollLeft,H<1?y=requestAnimationFrame(G):(y=0,w=!1)}y=requestAnimationFrame(G)}e.watch(l,()=>W()),e.watch(V,()=>W());function te(a){if(!d.value)return T(n.startTime);const c=d.value.getBoundingClientRect(),s=d.value.scrollLeft,p=a.clientX-c.left+s-b.value,M=Math.max(0,Math.min(p,v.value)),N=T(n.startTime),C=T(n.endTime);return N+(C-N)(M/(v.value\|\|1))}function We(a){const c=J.value;if(c.length===0)return{time:a,index:-1};const s=Y(c,a);return{time:c[s]??a,index:s}}function ne(a){const{time:c,index:s}=We(a);c!==T(n.modelValue)&&(u("update:modelValue",c),u("change",c,s))}function Ae(a){if(x){x=!1;return}ne(te(a))}function Fe(a){const c=a.clientX;x=!1,h=!0,X(),u("playing-pause");const s=p=>{Math.abs(p.clientX-c)>3&&(x=!0),ne(te(p))},S=()=>{h=!1,document.removeEventListener("mousemove",s),document.removeEventListener("mouseup",S),e.nextTick(()=>W())};document.addEventListener("mousemove",s),document.addEventListener("mouseup",S)}function Oe(a){h=!0,X(),x=!1,E.value=!0,document.body.style.cursor="grabbing",u("playing-pause");const c=S=>{x=!0,ne(te(S))},s=()=>{h=!1,E.value=!1,document.body.style.cursor="",document.removeEventListener("mousemove",c),document.removeEventListener("mouseup",s),e.nextTick(()=>W())};document.addEventListener("mousemove",c),document.addEventListener("mouseup",s)}return e.onMounted(()=>{d.value&&(V.value=d.value.clientWidth,$=new ResizeObserver(a=>{a[0]&&(V.value=a[0].contentRect.width)}),$.observe(d.value)),e.nextTick(()=>W())}),e.onUnmounted(()=>{X(),$==null\|\|$.disconnect()}),(a,c)=>(e.openBlock(),e.createElementBlock("div",{class:"time-timeline",ref_key:"timelineRef",ref:g},[e.withDirectives(e.createElementVNode("div",{class:e.normalizeClass(["handle-group",{dragging:E.value}]),style:e.normalizeStyle(Re.value)},[e.createElementVNode("div",{class:"floating-tooltip",onMousedown:e.withModifiers(Oe,["prevent","stop"])},e.toDisplayString(k.value),33),c[0]\|\|(c[0]=e.createElementVNode("div",{class:"handle-visual"},null,-1))],6),[[e.vShow,He.value]]),e.createElementVNode("div",{class:"scroll-container",ref_key:"scrollRef",ref:d,onScroll:Ie,onWheel:e.withModifiers(ze,["prevent"])},[e.createElementVNode("div",{class:"timeline-inner",ref_key:"innerRef",ref:I,style:e.normalizeStyle({width:O.value}),onMousedown:e.withModifiers(Fe,["prevent"]),onClick:Ae},[e.createElementVNode("div",{class:"track-bg",style:e.normalizeStyle(U.value)},null,4),e.createElementVNode("div",{class:"track-active",style:e.normalizeStyle(f.value)},null,4),e.createElementVNode("div",{class:"ticks-container",style:e.normalizeStyle(Z.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(P.value,s=>(e.openBlock(),e.createElementBlock("div",{key:s.time,class:e.normalizeClass(["tick-item",{"is-day-boundary":s.isDayBoundary}]),style:e.normalizeStyle({left:s.percent+"%"})},[c[1]\|\|(c[1]=e.createElementVNode("div",{class:"tick-mark"},null,-1)),s.showLabel?(e.openBlock(),e.createElementBlock("div",be,e.toDisplayString(s.label),1)):e.createCommentVNode("",!0),s.showDayLabel?(e.openBlock(),e.createElementBlock("div",xe,e.toDisplayString(s.dayLabel),1)):e.createCommentVNode("",!0)],6))),128))],4)],36)],544)],512))}}),[["__scopeId","data-v-0f78dcee"]]),$e={class:"speed-value"},Be=["onClick"],Ce=A(e.defineComponent({__name:"SpeedSelector",props:{modelValue:{},options:{}},emits:["update:modelValue"],setup(t,{emit:o}){const i=o,n=e.ref(!1),u=e.ref(!0),g=e.ref(null);function d(){if(!g.value)return;const r=g.value.getBoundingClientRect(),h=r.top,y=window.innerHeight-r.bottom;u.value=h>=y}function I(){n.value\|\|d(),n.value=!n.value}function V(r){i("update:modelValue",r),n.value=!1}function D(r){g.value&&!g.value.contains(r.target)&&(n.value=!1)}return e.onMounted(()=>document.addEventListener("mousedown",D)),e.onUnmounted(()=>document.removeEventListener("mousedown",D)),(r,h)=>(e.openBlock(),e.createElementBlock("div",{class:"speed-selector",ref_key:"selectorRef",ref:g},[e.createElementVNode("div",{class:"speed-trigger",onClick:I},[e.createElementVNode("span",$e,e.toDisplayString(t.modelValue)+"x",1),(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(["arrow-icon",{open:n.value}]),viewBox:"0 0 12 12",fill:"currentColor"},[...h[0]\|\|(h[0]=[e.createElementVNode("path",{d:"M2.5 4.5L6 8L9.5 4.5",stroke:"currentColor","stroke-width":"1.5",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"},null,-1)])],2))]),e.createVNode(e.Transition,{name:u.value?"dropdown-up":"dropdown-down"},{default:e.withCtx(()=>[n.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["speed-dropdown",u.value?"is-up":"is-down"])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,y=>(e.openBlock(),e.createElementBlock("div",{key:y,class:e.normalizeClass(["speed-option",{active:y===t.modelValue}]),onClick:w=>V(y)},e.toDisplayString(y)+"x ",11,Be))),128))],2)):e.createCommentVNode("",!0)]),_:1},8,["name"])],512))}}),[["__scopeId","data-v-30c5e152"]]),Le={class:"g-time-player"},Pe={class:"controls-wrapper"},_e={class:"timeline-wrapper"},fe=A(e.defineComponent({__name:"index",props:{modelValue:{},startTime:{},endTime:{},interval:{default:1},playInterval:{default:1e3},speed:{default:1},speedOptions:{default:()=>[.5,1,2,3]},minTickSpacing:{},tickLabelMode:{default:"all"},formatTooltip:{}},emits:["update:modelValue","change"],setup(t,{expose:o,emit:i}){const n=t,u=i,g=e.computed(()=>T(n.startTime)),d=e.computed(()=>T(n.endTime)),I=e.computed(()=>g.value),V=e.computed(()=>d.value),D=e.computed(()=>{const l=[];let f=g.value;for(;f<=d.value;)l.push(f),f=L(f,n.interval);return l}),r=e.ref(P(n.modelValue??n.startTime)),h=e.ref(!1),y=e.ref(n.speed);let w=null,x=r.value;const $=e.computed(()=>n.playInterval/y.value);e.watch(()=>n.speed,l=>{y.value=l});function E(l){return Math.max(g.value,Math.min(l,d.value))}function P(l){return E(T(l))}function J(l){const f=D.value;if(!f.length)return-1;const k=Y(f,E(l));return Math.max(0,Math.min(k,f.length-1))}function Q(l,f){const k=E(l);k!==x&&(x=k,u("update:modelValue",k),u("change",{time:k,index:J(k)}))}function F(l,f){const k=E(l);u("change",{time:k,index:Math.max(0,Math.min(f,D.value.length-1))})}e.watch(()=>n.modelValue,l=>{l!==void 0&&!h.value&&(r.value=P(l))}),e.watch(g,()=>{v(),r.value=g.value,x=r.value}),e.watch(d,l=>{r.value>l&&(r.value=l,v())}),e.watch(r,l=>{const f=E(l);if(f!==l){r.value=f;return}Q(f),f>=d.value&&v()});function B(){h.value?v():b()}function b(){r.value>=d.value&&(r.value=g.value),h.value=!0,w&&clearInterval(w),w=setInterval(z,$.value)}function v(){h.value=!1,w&&(clearInterval(w),w=null)}e.watch($,l=>{h.value&&(w&&clearInterval(w),w=setInterval(z,l))});function z(){const l=L(r.value,n.interval);if(l>d.value){r.value=E(d.value),v();return}r.value=E(l)}function O(){const l=L(r.value,-n.interval);r.value=E(l)}function U(){const l=L(r.value,n.interval);r.value=E(l)}function Z(l){r.value=P(l)}return o({play:b,pause:v,togglePlay:B,prev:O,next:U,seekTo:Z,isPlaying:h,currentTime:r,speedMultiplier:y}),e.onUnmounted(()=>v()),(l,f)=>(e.openBlock(),e.createElementBlock("div",Le,[e.createElementVNode("div",Pe,[e.createVNode(we,{"is-playing":h.value,onTogglePlay:B,onPrev:O,onNext:U},e.createSlots({_:2},[l.$slots.prev?{name:"prev",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"prev",{},void 0,!0)]),key:"0"}:void 0,l.$slots.play?{name:"play",fn:e.withCtx(({isPlaying:k})=>[e.renderSlot(l.$slots,"play",{isPlaying:k},void 0,!0)]),key:"1"}:void 0,l.$slots.next?{name:"next",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"next",{},void 0,!0)]),key:"2"}:void 0]),1032,["is-playing"])]),e.createElementVNode("div",_e,[e.createVNode(Me,{modelValue:r.value,"onUpdate:modelValue":f[0]\|\|(f[0]=k=>r.value=k),"start-time":I.value,"end-time":V.value,interval:t.interval,"min-tick-spacing":t.minTickSpacing,"tick-label-mode":t.tickLabelMode,"format-tooltip":t.formatTooltip,onPlayingPause:v,onChange:F},null,8,["modelValue","start-time","end-time","interval","min-tick-spacing","tick-label-mode","format-tooltip"])]),e.createVNode(Ce,{modelValue:y.value,"onUpdate:modelValue":f[1]\|\|(f[1]=k=>y.value=k),options:t.speedOptions},null,8,["modelValue","options"])]))}}),[["__scopeId","data-v-55b5dfa2"]]);m.addHours=L,m.default=fe,m.defaultTooltipFormat=de,m.diffHours=Ee,m.findNearestTickIndex=Y,m.findTickIndex=Se,m.formatDayLabel=ue,m.formatHH=se,m.formatHHmm=ce,m.formatMD=K,m.getDateKey=q,m.getDayOfWeek=re,m.getHour=ie,m.getNextMidnight=me,m.getWeekdayShort=j,m.toTimestamp=T,m.vue3TimePlaybar=fe,Object.defineProperties(m,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));