jit-viewer 1.2.1 → 1.2.2

package/dist/{index-CvlcqXIv.js → index-BDdnUZzd.js}

@@ -13576,6 +13576,14 @@ const zhCNMessages = {
   "toolbar.print": "打印",
   "toolbar.download": "下载",
   "toolbar.more": "更多",
+  "toolbar.videoPlay": "播放",
+  "toolbar.videoPause": "暂停",
+  "toolbar.videoRestart": "重播",
+  "toolbar.videoMuted": "取消静音",
+  "toolbar.videoUnmuted": "静音",
+  "toolbar.videoSpeed": "倍速",
+  "toolbar.videoProgress": "播放进度",
+  "toolbar.videoVolume": "音量",
   "loading": "加载中...",
   "error.loadFailed": "文件加载失败",
   "error.unsupportedType": "不支持的文件类型",
@@ -13596,6 +13604,14 @@ const enMessages = {
   "toolbar.print": "Print",
   "toolbar.download": "Download",
   "toolbar.more": "More",
+  "toolbar.videoPlay": "Play",
+  "toolbar.videoPause": "Pause",
+  "toolbar.videoRestart": "Restart",
+  "toolbar.videoMuted": "Unmute",
+  "toolbar.videoUnmuted": "Mute",
+  "toolbar.videoSpeed": "Speed",
+  "toolbar.videoProgress": "Progress",
+  "toolbar.videoVolume": "Volume",
   "loading": "Loading...",
   "error.loadFailed": "Failed to load file",
   "error.unsupportedType": "Unsupported file type",
@@ -13780,6 +13796,8 @@ function createViewerState(options = {}) {
   const totalPages = /* @__PURE__ */ ref(1);
   const fullscreen2 = /* @__PURE__ */ ref(false);
   const pageController = /* @__PURE__ */ ref(null);
+  const videoState = /* @__PURE__ */ ref(null);
+  const videoController = /* @__PURE__ */ ref(null);
   const state = computed(() => ({
     mounted: mounted.value,
     loading: loading.value,
@@ -13792,7 +13810,8 @@ function createViewerState(options = {}) {
       current: currentPage.value,
       total: totalPages.value
     },
-    fullscreen: fullscreen2.value
+    fullscreen: fullscreen2.value,
+    video: videoState.value
   }));
   const setMounted = (value) => {
     mounted.value = value;
@@ -13811,6 +13830,8 @@ function createViewerState(options = {}) {
     rotate.value = initialRotate;
     currentPage.value = 1;
     totalPages.value = 1;
+    videoState.value = null;
+    videoController.value = null;
     error.value = null;
   };
   const clearFile = () => {
@@ -13901,6 +13922,44 @@ function createViewerState(options = {}) {
   const setFullscreen = (value) => {
     fullscreen2.value = value;
   };
+  const setVideoState = (value) => {
+    videoState.value = value;
+  };
+  const setVideoController = (controller) => {
+    videoController.value = controller;
+  };
+  const playVideo = async () => {
+    var _a, _b;
+    await ((_b = (_a = videoController.value) == null ? void 0 : _a.play) == null ? void 0 : _b.call(_a));
+  };
+  const pauseVideo = () => {
+    var _a, _b;
+    (_b = (_a = videoController.value) == null ? void 0 : _a.pause) == null ? void 0 : _b.call(_a);
+  };
+  const toggleVideoPlayback = async () => {
+    var _a, _b;
+    await ((_b = (_a = videoController.value) == null ? void 0 : _a.togglePlayback) == null ? void 0 : _b.call(_a));
+  };
+  const seekVideo = (time) => {
+    var _a, _b;
+    (_b = (_a = videoController.value) == null ? void 0 : _a.seek) == null ? void 0 : _b.call(_a, time);
+  };
+  const restartVideo = async () => {
+    var _a, _b;
+    await ((_b = (_a = videoController.value) == null ? void 0 : _a.restart) == null ? void 0 : _b.call(_a));
+  };
+  const setVideoMuted = (muted) => {
+    var _a, _b;
+    (_b = (_a = videoController.value) == null ? void 0 : _a.setMuted) == null ? void 0 : _b.call(_a, muted);
+  };
+  const setVideoVolume = (volume) => {
+    var _a, _b;
+    (_b = (_a = videoController.value) == null ? void 0 : _a.setVolume) == null ? void 0 : _b.call(_a, volume);
+  };
+  const setVideoPlaybackRate = (rate) => {
+    var _a, _b;
+    (_b = (_a = videoController.value) == null ? void 0 : _a.setPlaybackRate) == null ? void 0 : _b.call(_a, rate);
+  };
   const printFn = /* @__PURE__ */ ref(null);
   const setPrintFn = (fn) => {
     printFn.value = fn;
@@ -13925,6 +13984,8 @@ function createViewerState(options = {}) {
     currentPage,
     totalPages,
     fullscreen: fullscreen2,
+    videoState,
+    videoController,
     // Computed
     state,
     // Methods
@@ -13942,6 +14003,16 @@ function createViewerState(options = {}) {
     nextPage,
     setPageController,
     setFullscreen,
+    setVideoState,
+    setVideoController,
+    playVideo,
+    pauseVideo,
+    toggleVideoPlayback,
+    seekVideo,
+    restartVideo,
+    setVideoMuted,
+    setVideoVolume,
+    setVideoPlaybackRate,
     // Print
     print,
     setPrintFn
@@ -13956,13 +14027,13 @@ function useViewerState() {
   }
   return context;
 }
-const _hoisted_1$g = ["disabled", "title"];
-const _hoisted_2$b = { class: "jv-toolbar-btn__icon" };
-const _hoisted_3$6 = {
+const _hoisted_1$h = ["disabled", "title"];
+const _hoisted_2$c = { class: "jv-toolbar-btn__icon" };
+const _hoisted_3$7 = {
   key: 0,
   class: "jv-toolbar-btn__label"
 };
-const _sfc_main$j = /* @__PURE__ */ defineComponent({
+const _sfc_main$k = /* @__PURE__ */ defineComponent({
   __name: "ActionButton",
   props: {
     type: {},
@@ -13986,11 +14057,11 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
         title: __props.title,
         onClick: handleClick
       }, [
-        createBaseVNode("span", _hoisted_2$b, [
+        createBaseVNode("span", _hoisted_2$c, [
           renderSlot(_ctx.$slots, "default", {}, void 0, true)
         ]),
-        __props.label ? (openBlock(), createElementBlock("span", _hoisted_3$6, toDisplayString(__props.label), 1)) : createCommentVNode("", true)
-      ], 10, _hoisted_1$g);
+        __props.label ? (openBlock(), createElementBlock("span", _hoisted_3$7, toDisplayString(__props.label), 1)) : createCommentVNode("", true)
+      ], 10, _hoisted_1$h);
     };
   }
 });
@@ -14001,11 +14072,11 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const ActionButton = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-9abd52f0"]]);
-const _hoisted_1$f = { class: "jv-zoom-control" };
-const _hoisted_2$a = { class: "jv-zoom-control__value" };
+const ActionButton = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-9abd52f0"]]);
+const _hoisted_1$g = { class: "jv-zoom-control" };
+const _hoisted_2$b = { class: "jv-zoom-control__value" };
 const ZOOM_STEP = 0.1;
-const _sfc_main$i = /* @__PURE__ */ defineComponent({
+const _sfc_main$j = /* @__PURE__ */ defineComponent({
   __name: "ZoomControl",
   setup(__props) {
     const { t } = useLocale();
@@ -14020,7 +14091,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
       resetTransform();
     }
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$f, [
+      return openBlock(), createElementBlock("div", _hoisted_1$g, [
         createVNode(ActionButton, {
           type: "zoom-out",
           title: unref(t)("toolbar.zoomOut"),
@@ -14054,7 +14125,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
           ])]),
           _: 1
         }, 8, ["title"]),
-        createBaseVNode("span", _hoisted_2$a, toDisplayString(Math.round(unref(zoom) * 100)) + "%", 1),
+        createBaseVNode("span", _hoisted_2$b, toDisplayString(Math.round(unref(zoom) * 100)) + "%", 1),
         createVNode(ActionButton, {
           type: "zoom-in",
           title: unref(t)("toolbar.zoomIn"),
@@ -14128,10 +14199,10 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const ZoomControl = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-874ddbac"]]);
-const _hoisted_1$e = { class: "jv-rotate-control" };
+const ZoomControl = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-874ddbac"]]);
+const _hoisted_1$f = { class: "jv-rotate-control" };
 const ROTATE_STEP = 90;
-const _sfc_main$h = /* @__PURE__ */ defineComponent({
+const _sfc_main$i = /* @__PURE__ */ defineComponent({
   __name: "RotateControl",
   setup(__props) {
     const { t } = useLocale();
@@ -14143,7 +14214,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
       setRotate(ROTATE_STEP);
     }
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$e, [
+      return openBlock(), createElementBlock("div", _hoisted_1$f, [
         createVNode(ActionButton, {
           type: "rotate-left",
           title: unref(t)("toolbar.rotateLeft"),
@@ -14182,22 +14253,22 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const RotateControl = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-ad291658"]]);
-const _hoisted_1$d = {
+const RotateControl = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-ad291658"]]);
+const _hoisted_1$e = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
 };
-const _hoisted_2$9 = {
+const _hoisted_2$a = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
 };
-const _sfc_main$g = /* @__PURE__ */ defineComponent({
+const _sfc_main$h = /* @__PURE__ */ defineComponent({
   __name: "FullscreenButton",
   setup(__props) {
     const { t } = useLocale();
@@ -14226,9 +14297,9 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
         onClick: toggleFullscreen
       }, {
         default: withCtx(() => [
-          !isFullscreen.value ? (openBlock(), createElementBlock("svg", _hoisted_1$d, [..._cache[0] || (_cache[0] = [
+          !isFullscreen.value ? (openBlock(), createElementBlock("svg", _hoisted_1$e, [..._cache[0] || (_cache[0] = [
             createBaseVNode("path", { d: "M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3" }, null, -1)
-          ])])) : (openBlock(), createElementBlock("svg", _hoisted_2$9, [..._cache[1] || (_cache[1] = [
+          ])])) : (openBlock(), createElementBlock("svg", _hoisted_2$a, [..._cache[1] || (_cache[1] = [
             createBaseVNode("path", { d: "M8 3v3a2 2 0 0 1-2 2H3m18 0h-3a2 2 0 0 1-2-2V3m0 18v-3a2 2 0 0 1 2-2h3M3 16h3a2 2 0 0 1 2 2v3" }, null, -1)
           ])]))
         ]),
@@ -14237,18 +14308,18 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$c = {
+const _hoisted_1$d = {
   key: 0,
   class: "jv-pagination"
 };
-const _hoisted_2$8 = { class: "jv-pagination__info" };
-const _sfc_main$f = /* @__PURE__ */ defineComponent({
+const _hoisted_2$9 = { class: "jv-pagination__info" };
+const _sfc_main$g = /* @__PURE__ */ defineComponent({
   __name: "Pagination",
   setup(__props) {
     const { t } = useLocale();
     const { currentPage, totalPages, prevPage, nextPage } = useViewerState();
     return (_ctx, _cache) => {
-      return unref(totalPages) > 1 ? (openBlock(), createElementBlock("div", _hoisted_1$c, [
+      return unref(totalPages) > 1 ? (openBlock(), createElementBlock("div", _hoisted_1$d, [
         createVNode(ActionButton, {
           type: "prev",
           title: unref(t)("toolbar.prevPage"),
@@ -14267,7 +14338,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
           ])]),
           _: 1
         }, 8, ["title", "disabled", "onClick"]),
-        createBaseVNode("span", _hoisted_2$8, toDisplayString(unref(t)("toolbar.pageInfo", { current: unref(currentPage).toString(), total: unref(totalPages).toString() })), 1),
+        createBaseVNode("span", _hoisted_2$9, toDisplayString(unref(t)("toolbar.pageInfo", { current: unref(currentPage).toString(), total: unref(totalPages).toString() })), 1),
         createVNode(ActionButton, {
           type: "next",
           title: unref(t)("toolbar.nextPage"),
@@ -14290,7 +14361,462 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Pagination = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-97c0759f"]]);
+const Pagination = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-97c0759f"]]);
+const _hoisted_1$c = {
+  key: 0,
+  viewBox: "0 0 24 24",
+  fill: "currentColor"
+};
+const _hoisted_2$8 = {
+  key: 1,
+  viewBox: "0 0 24 24",
+  fill: "currentColor"
+};
+const _hoisted_3$6 = {
+  key: 2,
+  class: "jv-video-toolbar__time"
+};
+const _hoisted_4$6 = ["title"];
+const _hoisted_5$4 = ["max", "value", "title"];
+const _hoisted_6$4 = {
+  key: 0,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2"
+};
+const _hoisted_7$4 = {
+  key: 1,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2"
+};
+const _hoisted_8$3 = ["value"];
+const _hoisted_9$2 = {
+  key: 6,
+  class: "jv-video-toolbar__rate"
+};
+const _hoisted_10$1 = ["value"];
+const _hoisted_11$1 = ["value"];
+const _hoisted_12$1 = {
+  key: 7,
+  class: "jv-video-toolbar__more"
+};
+const _hoisted_13$1 = {
+  key: 0,
+  class: "jv-video-toolbar__more-menu"
+};
+const _hoisted_14 = {
+  key: 2,
+  class: "jv-video-toolbar__menu-row"
+};
+const _hoisted_15 = {
+  key: 3,
+  class: "jv-video-toolbar__menu-row"
+};
+const _hoisted_16 = { class: "jv-video-toolbar__menu-label" };
+const _hoisted_17 = {
+  key: 0,
+  class: "jv-video-toolbar__progress-track jv-video-toolbar__progress-track--menu"
+};
+const _hoisted_18 = ["max", "value", "title"];
+const _hoisted_19 = {
+  key: 5,
+  class: "jv-video-toolbar__menu-row"
+};
+const _hoisted_20 = { class: "jv-video-toolbar__menu-label" };
+const _hoisted_21 = ["value"];
+const _hoisted_22 = {
+  key: 6,
+  class: "jv-video-toolbar__menu-row"
+};
+const _hoisted_23 = { class: "jv-video-toolbar__menu-label" };
+const _hoisted_24 = ["value"];
+const _hoisted_25 = ["value"];
+const _sfc_main$f = /* @__PURE__ */ defineComponent({
+  __name: "VideoToolbarControls",
+  props: {
+    videoOptions: {},
+    itemConfig: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const playbackRates = [0.75, 1, 1.25, 1.5, 2];
+    const defaultToolbarItems = ["playback", "restart", "time", "progress"];
+    const defaultToolbarMoreItems = ["mute", "volume", "speed"];
+    const availableControlItems = ["playback", "restart", "time", "progress", "mute", "volume", "speed"];
+    const { t } = useLocale();
+    const {
+      videoState,
+      toggleVideoPlayback,
+      seekVideo,
+      restartVideo,
+      setVideoMuted,
+      setVideoVolume,
+      setVideoPlaybackRate
+    } = useViewerState();
+    const rootRef = /* @__PURE__ */ ref(null);
+    const isMoreOpen = /* @__PURE__ */ ref(false);
+    const rangeMax = computed(() => {
+      var _a;
+      return Math.max(((_a = videoState.value) == null ? void 0 : _a.duration) || 0, 0);
+    });
+    const progressPercent = computed(() => {
+      const state = videoState.value;
+      if (!(state == null ? void 0 : state.duration) || state.duration <= 0) {
+        return 0;
+      }
+      return Math.min(state.currentTime / state.duration * 100, 100);
+    });
+    const toolbarConfig = computed(() => {
+      var _a, _b, _c, _d, _e;
+      const itemOptions = (_a = props.itemConfig) == null ? void 0 : _a.options;
+      const hasItemOverride = Array.isArray(itemOptions == null ? void 0 : itemOptions.items) || Array.isArray((_b = props.videoOptions) == null ? void 0 : _b.toolbarItems);
+      const hasMoreItemOverride = Array.isArray(itemOptions == null ? void 0 : itemOptions.moreItems) || Array.isArray((_c = props.videoOptions) == null ? void 0 : _c.toolbarMoreItems);
+      const primaryItems = hasItemOverride ? normalizeControlItems((itemOptions == null ? void 0 : itemOptions.items) ?? ((_d = props.videoOptions) == null ? void 0 : _d.toolbarItems)) : defaultToolbarItems;
+      const secondaryItems = hasMoreItemOverride ? normalizeControlItems((itemOptions == null ? void 0 : itemOptions.moreItems) ?? ((_e = props.videoOptions) == null ? void 0 : _e.toolbarMoreItems)) : hasItemOverride ? [] : defaultToolbarMoreItems;
+      return {
+        primary: primaryItems,
+        more: secondaryItems.filter((item) => !primaryItems.includes(item))
+      };
+    });
+    const toolbarItems = computed(() => toolbarConfig.value.primary);
+    const moreItems = computed(() => toolbarConfig.value.more);
+    function normalizeControlItems(items) {
+      if (!Array.isArray(items)) {
+        return [];
+      }
+      const uniqueItems = /* @__PURE__ */ new Set();
+      items.forEach((item) => {
+        if (availableControlItems.includes(item)) {
+          uniqueItems.add(item);
+        }
+      });
+      return [...uniqueItems];
+    }
+    function hasInlineItem(type) {
+      return toolbarItems.value.includes(type);
+    }
+    function hasMoreItem(type) {
+      return moreItems.value.includes(type);
+    }
+    function toggleMoreMenu() {
+      isMoreOpen.value = !isMoreOpen.value;
+    }
+    function closeMoreMenu() {
+      isMoreOpen.value = false;
+    }
+    function handleDocumentClick(event) {
+      if (!isMoreOpen.value || !rootRef.value) {
+        return;
+      }
+      const target = event.target;
+      if (target && !rootRef.value.contains(target)) {
+        closeMoreMenu();
+      }
+    }
+    function handleDocumentKeydown(event) {
+      if (event.key === "Escape") {
+        closeMoreMenu();
+      }
+    }
+    function handleTogglePlayback(shouldCloseMenu = false) {
+      void toggleVideoPlayback();
+      if (shouldCloseMenu) {
+        closeMoreMenu();
+      }
+    }
+    function handleInlineTogglePlayback() {
+      handleTogglePlayback();
+    }
+    function handleRestart(shouldCloseMenu = false) {
+      void restartVideo();
+      if (shouldCloseMenu) {
+        closeMoreMenu();
+      }
+    }
+    function handleInlineRestart() {
+      handleRestart();
+    }
+    function handleSeek(event) {
+      const target = event.target;
+      if (!target) {
+        return;
+      }
+      seekVideo(Number.parseFloat(target.value));
+    }
+    function handleToggleMuted(shouldCloseMenu = false) {
+      if (!videoState.value) {
+        return;
+      }
+      setVideoMuted(!(videoState.value.muted || videoState.value.volume === 0));
+      if (shouldCloseMenu) {
+        closeMoreMenu();
+      }
+    }
+    function handleInlineToggleMuted() {
+      handleToggleMuted();
+    }
+    function handleVolume(event) {
+      const target = event.target;
+      if (!target) {
+        return;
+      }
+      setVideoVolume(Number.parseFloat(target.value));
+    }
+    function handlePlaybackRate(event) {
+      const target = event.target;
+      if (!target) {
+        return;
+      }
+      setVideoPlaybackRate(Number.parseFloat(target.value));
+    }
+    function formatDuration(duration) {
+      if (!Number.isFinite(duration) || duration <= 0) {
+        return "00:00";
+      }
+      const totalSeconds = Math.floor(duration);
+      const hours = Math.floor(totalSeconds / 3600);
+      const minutes = Math.floor(totalSeconds % 3600 / 60);
+      const seconds = totalSeconds % 60;
+      if (hours > 0) {
+        return [hours, minutes, seconds].map((value) => value.toString().padStart(2, "0")).join(":");
+      }
+      return [minutes, seconds].map((value) => value.toString().padStart(2, "0")).join(":");
+    }
+    onMounted(() => {
+      document.addEventListener("click", handleDocumentClick);
+      document.addEventListener("keydown", handleDocumentKeydown);
+    });
+    onUnmounted(() => {
+      document.removeEventListener("click", handleDocumentClick);
+      document.removeEventListener("keydown", handleDocumentKeydown);
+    });
+    return (_ctx, _cache) => {
+      return unref(videoState) ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        ref_key: "rootRef",
+        ref: rootRef,
+        class: "jv-video-toolbar"
+      }, [
+        hasInlineItem("playback") ? (openBlock(), createBlock(ActionButton, {
+          key: 0,
+          type: "video-playback",
+          title: unref(videoState).paused ? unref(t)("toolbar.videoPlay") : unref(t)("toolbar.videoPause"),
+          label: unref(videoState).paused ? unref(t)("toolbar.videoPlay") : unref(t)("toolbar.videoPause"),
+          onClick: handleInlineTogglePlayback
+        }, {
+          default: withCtx(() => [
+            unref(videoState).paused ? (openBlock(), createElementBlock("svg", _hoisted_1$c, [..._cache[3] || (_cache[3] = [
+              createBaseVNode("path", { d: "M8 5v14l11-7z" }, null, -1)
+            ])])) : (openBlock(), createElementBlock("svg", _hoisted_2$8, [..._cache[4] || (_cache[4] = [
+              createBaseVNode("path", { d: "M8 5h3v14H8zm5 0h3v14h-3z" }, null, -1)
+            ])]))
+          ]),
+          _: 1
+        }, 8, ["title", "label"])) : createCommentVNode("", true),
+        hasInlineItem("restart") ? (openBlock(), createBlock(ActionButton, {
+          key: 1,
+          type: "video-restart",
+          title: unref(t)("toolbar.videoRestart"),
+          onClick: handleInlineRestart
+        }, {
+          default: withCtx(() => [..._cache[5] || (_cache[5] = [
+            createBaseVNode("svg", {
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              "stroke-width": "2"
+            }, [
+              createBaseVNode("polyline", { points: "1 4 1 10 7 10" }),
+              createBaseVNode("path", { d: "M3.51 15a9 9 0 1 0 .49-9.36L1 10" })
+            ], -1)
+          ])]),
+          _: 1
+        }, 8, ["title"])) : createCommentVNode("", true),
+        hasInlineItem("time") ? (openBlock(), createElementBlock("div", _hoisted_3$6, toDisplayString(formatDuration(unref(videoState).currentTime)) + " / " + toDisplayString(formatDuration(unref(videoState).duration)), 1)) : createCommentVNode("", true),
+        hasInlineItem("progress") ? (openBlock(), createElementBlock(Fragment, { key: 3 }, [
+          unref(videoState).disableSeek ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: "jv-video-toolbar__progress-track",
+            title: unref(t)("toolbar.videoProgress")
+          }, [
+            createBaseVNode("div", {
+              class: "jv-video-toolbar__progress-fill",
+              style: normalizeStyle({ width: `${progressPercent.value}%` })
+            }, null, 4)
+          ], 8, _hoisted_4$6)) : (openBlock(), createElementBlock("input", {
+            key: 1,
+            class: "jv-video-toolbar__progress",
+            type: "range",
+            min: "0",
+            max: rangeMax.value,
+            value: unref(videoState).currentTime,
+            step: "0.1",
+            title: unref(t)("toolbar.videoProgress"),
+            onInput: handleSeek
+          }, null, 40, _hoisted_5$4))
+        ], 64)) : createCommentVNode("", true),
+        hasInlineItem("mute") ? (openBlock(), createBlock(ActionButton, {
+          key: 4,
+          type: "video-mute",
+          title: unref(videoState).muted || unref(videoState).volume === 0 ? unref(t)("toolbar.videoMuted") : unref(t)("toolbar.videoUnmuted"),
+          onClick: handleInlineToggleMuted
+        }, {
+          default: withCtx(() => [
+            unref(videoState).muted || unref(videoState).volume === 0 ? (openBlock(), createElementBlock("svg", _hoisted_6$4, [..._cache[6] || (_cache[6] = [
+              createBaseVNode("polygon", { points: "11 5 6 9 2 9 2 15 6 15 11 19 11 5" }, null, -1),
+              createBaseVNode("line", {
+                x1: "23",
+                y1: "9",
+                x2: "17",
+                y2: "15"
+              }, null, -1),
+              createBaseVNode("line", {
+                x1: "17",
+                y1: "9",
+                x2: "23",
+                y2: "15"
+              }, null, -1)
+            ])])) : (openBlock(), createElementBlock("svg", _hoisted_7$4, [..._cache[7] || (_cache[7] = [
+              createBaseVNode("polygon", { points: "11 5 6 9 2 9 2 15 6 15 11 19 11 5" }, null, -1),
+              createBaseVNode("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07" }, null, -1),
+              createBaseVNode("path", { d: "M19.07 4.93a10 10 0 0 1 0 14.14" }, null, -1)
+            ])]))
+          ]),
+          _: 1
+        }, 8, ["title"])) : createCommentVNode("", true),
+        hasInlineItem("volume") ? (openBlock(), createElementBlock("input", {
+          key: 5,
+          class: "jv-video-toolbar__volume",
+          type: "range",
+          min: "0",
+          max: "1",
+          step: "0.05",
+          value: unref(videoState).muted ? 0 : unref(videoState).volume,
+          onInput: handleVolume
+        }, null, 40, _hoisted_8$3)) : createCommentVNode("", true),
+        hasInlineItem("speed") ? (openBlock(), createElementBlock("label", _hoisted_9$2, [
+          createBaseVNode("span", null, toDisplayString(unref(t)("toolbar.videoSpeed")), 1),
+          createBaseVNode("select", {
+            value: unref(videoState).playbackRate,
+            onChange: handlePlaybackRate
+          }, [
+            (openBlock(), createElementBlock(Fragment, null, renderList(playbackRates, (rate) => {
+              return createBaseVNode("option", {
+                key: rate,
+                value: rate
+              }, toDisplayString(rate) + "x ", 9, _hoisted_11$1);
+            }), 64))
+          ], 40, _hoisted_10$1)
+        ])) : createCommentVNode("", true),
+        moreItems.value.length ? (openBlock(), createElementBlock("div", _hoisted_12$1, [
+          createVNode(ActionButton, {
+            type: "video-more",
+            title: unref(t)("toolbar.more"),
+            label: unref(t)("toolbar.more"),
+            onClick: toggleMoreMenu
+          }, {
+            default: withCtx(() => [..._cache[8] || (_cache[8] = [
+              createBaseVNode("svg", {
+                viewBox: "0 0 24 24",
+                fill: "currentColor"
+              }, [
+                createBaseVNode("circle", {
+                  cx: "5",
+                  cy: "12",
+                  r: "2"
+                }),
+                createBaseVNode("circle", {
+                  cx: "12",
+                  cy: "12",
+                  r: "2"
+                }),
+                createBaseVNode("circle", {
+                  cx: "19",
+                  cy: "12",
+                  r: "2"
+                })
+              ], -1)
+            ])]),
+            _: 1
+          }, 8, ["title", "label"]),
+          isMoreOpen.value ? (openBlock(), createElementBlock("div", _hoisted_13$1, [
+            hasMoreItem("playback") ? (openBlock(), createElementBlock("button", {
+              key: 0,
+              type: "button",
+              class: "jv-video-toolbar__menu-action",
+              onClick: _cache[0] || (_cache[0] = ($event) => handleTogglePlayback(true))
+            }, toDisplayString(unref(videoState).paused ? unref(t)("toolbar.videoPlay") : unref(t)("toolbar.videoPause")), 1)) : createCommentVNode("", true),
+            hasMoreItem("restart") ? (openBlock(), createElementBlock("button", {
+              key: 1,
+              type: "button",
+              class: "jv-video-toolbar__menu-action",
+              onClick: _cache[1] || (_cache[1] = ($event) => handleRestart(true))
+            }, toDisplayString(unref(t)("toolbar.videoRestart")), 1)) : createCommentVNode("", true),
+            hasMoreItem("time") ? (openBlock(), createElementBlock("div", _hoisted_14, [
+              createBaseVNode("span", null, toDisplayString(formatDuration(unref(videoState).currentTime)) + " / " + toDisplayString(formatDuration(unref(videoState).duration)), 1)
+            ])) : createCommentVNode("", true),
+            hasMoreItem("progress") ? (openBlock(), createElementBlock("div", _hoisted_15, [
+              createBaseVNode("span", _hoisted_16, toDisplayString(unref(t)("toolbar.videoProgress")), 1),
+              unref(videoState).disableSeek ? (openBlock(), createElementBlock("div", _hoisted_17, [
+                createBaseVNode("div", {
+                  class: "jv-video-toolbar__progress-fill",
+                  style: normalizeStyle({ width: `${progressPercent.value}%` })
+                }, null, 4)
+              ])) : (openBlock(), createElementBlock("input", {
+                key: 1,
+                class: "jv-video-toolbar__progress jv-video-toolbar__progress--menu",
+                type: "range",
+                min: "0",
+                max: rangeMax.value,
+                value: unref(videoState).currentTime,
+                step: "0.1",
+                title: unref(t)("toolbar.videoProgress"),
+                onInput: handleSeek
+              }, null, 40, _hoisted_18))
+            ])) : createCommentVNode("", true),
+            hasMoreItem("mute") ? (openBlock(), createElementBlock("button", {
+              key: 4,
+              type: "button",
+              class: "jv-video-toolbar__menu-action",
+              onClick: _cache[2] || (_cache[2] = ($event) => handleToggleMuted(true))
+            }, toDisplayString(unref(videoState).muted || unref(videoState).volume === 0 ? unref(t)("toolbar.videoMuted") : unref(t)("toolbar.videoUnmuted")), 1)) : createCommentVNode("", true),
+            hasMoreItem("volume") ? (openBlock(), createElementBlock("label", _hoisted_19, [
+              createBaseVNode("span", _hoisted_20, toDisplayString(unref(t)("toolbar.videoVolume")), 1),
+              createBaseVNode("input", {
+                class: "jv-video-toolbar__volume jv-video-toolbar__volume--menu",
+                type: "range",
+                min: "0",
+                max: "1",
+                step: "0.05",
+                value: unref(videoState).muted ? 0 : unref(videoState).volume,
+                onInput: handleVolume
+              }, null, 40, _hoisted_21)
+            ])) : createCommentVNode("", true),
+            hasMoreItem("speed") ? (openBlock(), createElementBlock("label", _hoisted_22, [
+              createBaseVNode("span", _hoisted_23, toDisplayString(unref(t)("toolbar.videoSpeed")), 1),
+              createBaseVNode("select", {
+                class: "jv-video-toolbar__select--menu",
+                value: unref(videoState).playbackRate,
+                onChange: handlePlaybackRate
+              }, [
+                (openBlock(), createElementBlock(Fragment, null, renderList(playbackRates, (rate) => {
+                  return createBaseVNode("option", {
+                    key: rate,
+                    value: rate
+                  }, toDisplayString(rate) + "x ", 9, _hoisted_25);
+                }), 64))
+              ], 40, _hoisted_24)
+            ])) : createCommentVNode("", true)
+          ])) : createCommentVNode("", true)
+        ])) : createCommentVNode("", true)
+      ], 512)) : createCommentVNode("", true);
+    };
+  }
+});
+const VideoToolbarControls = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-80052329"]]);
 const _hoisted_1$b = {
   key: 0,
   class: "jv-toolbar__top"
@@ -14302,43 +14828,43 @@ const _hoisted_3$5 = {
 };
 const _hoisted_4$5 = { class: "jv-toolbar__center" };
 const _hoisted_5$3 = { class: "jv-toolbar__right" };
-const _hoisted_6$2 = {
+const _hoisted_6$3 = {
   key: 1,
   class: "jv-toolbar__bottom"
 };
-const _hoisted_7$2 = { class: "jv-toolbar__left" };
-const _hoisted_8$1 = { class: "jv-toolbar__center" };
-const _hoisted_9 = { class: "jv-toolbar__right" };
+const _hoisted_7$3 = { class: "jv-toolbar__left" };
+const _hoisted_8$2 = { class: "jv-toolbar__center" };
+const _hoisted_9$1 = { class: "jv-toolbar__right" };
 const _sfc_main$e = /* @__PURE__ */ defineComponent({
   __name: "Toolbar",
   props: {
     config: {},
-    visible: { type: Boolean, default: true }
+    visible: { type: Boolean, default: true },
+    videoOptions: {}
   },
   setup(__props) {
     const props = __props;
     const { t } = useLocale();
-    const { filename, fileSource } = useViewerState();
-    const defaultItems = [
-      "zoom",
-      "rotate",
-      "fullscreen",
-      "pagination",
-      "download"
-    ];
+    const { filename, fileSource, fileType } = useViewerState();
+    const defaultItems = computed(() => {
+      if (fileType.value === "video") {
+        return ["zoom", "fullscreen", "video", "download"];
+      }
+      return ["zoom", "rotate", "fullscreen", "pagination", "download"];
+    });
     const toolbarConfig = computed(() => {
       const config = props.config;
       if (typeof config === "boolean") {
         if (config === false) {
           return { items: [], position: "both" };
         }
-        return { items: defaultItems.map((type) => ({ type })), position: "both" };
+        return { items: defaultItems.value.map((type) => ({ type })), position: "both" };
       }
       if (!config) {
-        return { items: defaultItems.map((type) => ({ type })), position: "both" };
+        return { items: defaultItems.value.map((type) => ({ type })), position: "both" };
       }
       return {
-        items: config.items || defaultItems.map((type) => ({ type })),
+        items: config.items || defaultItems.value.map((type) => ({ type })),
         position: config.position || "both"
       };
     });
@@ -14358,6 +14884,10 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
       var _a;
       return ((_a = toolbarConfig.value.items) == null ? void 0 : _a.some((item) => item.type === type)) ?? false;
     }
+    function getItem(type) {
+      var _a;
+      return (_a = toolbarConfig.value.items) == null ? void 0 : _a.find((item) => item.type === type);
+    }
     async function handleDownload() {
       if (fileSource.value) {
         await downloadFile(fileSource.value, filename.value);
@@ -14380,20 +14910,26 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
             renderSlot(_ctx.$slots, "top-right", {}, () => [
               hasItem("zoom") ? (openBlock(), createBlock(ZoomControl, { key: 0 })) : createCommentVNode("", true),
               hasItem("rotate") ? (openBlock(), createBlock(RotateControl, { key: 1 })) : createCommentVNode("", true),
-              hasItem("fullscreen") ? (openBlock(), createBlock(_sfc_main$g, { key: 2 })) : createCommentVNode("", true)
+              hasItem("fullscreen") ? (openBlock(), createBlock(_sfc_main$h, { key: 2 })) : createCommentVNode("", true)
             ], true)
           ])
         ])) : createCommentVNode("", true),
-        showBottom.value ? (openBlock(), createElementBlock("div", _hoisted_6$2, [
-          createBaseVNode("div", _hoisted_7$2, [
+        showBottom.value ? (openBlock(), createElementBlock("div", _hoisted_6$3, [
+          createBaseVNode("div", _hoisted_7$3, [
             renderSlot(_ctx.$slots, "bottom-left", {}, () => [
               hasItem("pagination") ? (openBlock(), createBlock(Pagination, { key: 0 })) : createCommentVNode("", true)
             ], true)
           ]),
-          createBaseVNode("div", _hoisted_8$1, [
-            renderSlot(_ctx.$slots, "bottom-center", {}, void 0, true)
+          createBaseVNode("div", _hoisted_8$2, [
+            renderSlot(_ctx.$slots, "bottom-center", {}, () => [
+              unref(fileType) === "video" && hasItem("video") ? (openBlock(), createBlock(VideoToolbarControls, {
+                key: 0,
+                "video-options": __props.videoOptions,
+                "item-config": getItem("video")
+              }, null, 8, ["video-options", "item-config"])) : createCommentVNode("", true)
+            ], true)
           ]),
-          createBaseVNode("div", _hoisted_9, [
+          createBaseVNode("div", _hoisted_9$1, [
             renderSlot(_ctx.$slots, "bottom-right", {}, () => [
               hasItem("download") ? (openBlock(), createBlock(ActionButton, {
                 key: 0,
@@ -14427,7 +14963,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Toolbar = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-74d3b30f"]]);
+const Toolbar = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-c43b7d04"]]);
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 function getDefaultExportFromCjs(x) {
   return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
@@ -62456,11 +62992,11 @@ const _hoisted_2$6 = { class: "jv-csv-meta" };
 const _hoisted_3$4 = { class: "jv-csv-meta" };
 const _hoisted_4$4 = { class: "jv-csv-scroll" };
 const _hoisted_5$2 = { class: "jv-csv-stage" };
-const _hoisted_6$1 = {
+const _hoisted_6$2 = {
   key: 0,
   class: "jv-csv-empty"
 };
-const _hoisted_7$1 = { class: "jv-csv-index" };
+const _hoisted_7$2 = { class: "jv-csv-index" };
 const _sfc_main$b = /* @__PURE__ */ defineComponent({
   __name: "CsvRender",
   props: {
@@ -62676,7 +63212,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         ]),
         createBaseVNode("div", _hoisted_4$4, [
           createBaseVNode("div", _hoisted_5$2, [
-            !dataRows.value.length ? (openBlock(), createElementBlock("div", _hoisted_6$1, "CSV 内容为空")) : (openBlock(), createElementBlock("div", {
+            !dataRows.value.length ? (openBlock(), createElementBlock("div", _hoisted_6$2, "CSV 内容为空")) : (openBlock(), createElementBlock("div", {
               key: 1,
               ref_key: "scrollRef",
               ref: scrollRef,
@@ -62710,7 +63246,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
                         return openBlock(), createElementBlock("tr", {
                           key: `row-${rowIndex}`
                         }, [
-                          createBaseVNode("td", _hoisted_7$1, toDisplayString(rowIndex + 2), 1),
+                          createBaseVNode("td", _hoisted_7$2, toDisplayString(rowIndex + 2), 1),
                           (openBlock(true), createElementBlock(Fragment, null, renderList(row, (cell, cellIndex) => {
                             return openBlock(), createElementBlock("td", {
                               key: `cell-${rowIndex}-${cellIndex}`
@@ -129728,23 +130264,53 @@ const _hoisted_2$2 = {
   class: "jv-video-stage"
 };
 const _hoisted_3$2 = { class: "jv-video-loading" };
-const _hoisted_4$2 = ["src", "title"];
+const _hoisted_4$2 = ["src", "title", "controls", "autoplay", "muted", "loop"];
 const _hoisted_5$1 = {
+  key: 2,
+  class: "jv-video-controls__timeline"
+};
+const _hoisted_6$1 = {
+  key: 0,
+  class: "jv-video-controls__progress-track"
+};
+const _hoisted_7$1 = ["max", "value"];
+const _hoisted_8$1 = {
+  key: 3,
+  class: "jv-video-controls__time"
+};
+const _hoisted_9 = ["value"];
+const _hoisted_10 = {
+  key: 6,
+  class: "jv-video-controls__rate"
+};
+const _hoisted_11 = ["value"];
+const _hoisted_12 = ["value"];
+const _hoisted_13 = {
   key: 0,
   class: "jv-video-info"
 };
+const VIDEO_PROGRESS_MEMORY_KEY = "__JIT_VIEWER_VIDEO_PROGRESS_MEMORY__";
 const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "VideoRender",
   props: {
     source: {},
     zoom: { default: 1 },
     proxyUrl: {},
-    requestAdapter: {}
+    requestAdapter: {},
+    videoOptions: {},
+    preferExternalControls: { type: Boolean }
   },
-  emits: ["load", "error"],
-  setup(__props, { emit: __emit }) {
+  emits: ["load", "error", "stateChange", "play", "pause", "ended", "timeUpdate", "seekingBlocked"],
+  setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const emit2 = __emit;
+    function getVideoProgressMemoryStore() {
+      const scope = globalThis;
+      if (!scope[VIDEO_PROGRESS_MEMORY_KEY]) {
+        scope[VIDEO_PROGRESS_MEMORY_KEY] = /* @__PURE__ */ new Map();
+      }
+      return scope[VIDEO_PROGRESS_MEMORY_KEY];
+    }
     const containerRef = /* @__PURE__ */ ref();
     const videoRef = /* @__PURE__ */ ref();
     const loading = /* @__PURE__ */ ref(true);
@@ -129752,6 +130318,66 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     const videoSrc = /* @__PURE__ */ ref("");
     const videoName = /* @__PURE__ */ ref("");
     const videoInfo = /* @__PURE__ */ ref(null);
+    const playbackState = /* @__PURE__ */ ref({
+      currentTime: 0,
+      duration: 0,
+      paused: true,
+      ended: false,
+      muted: false,
+      volume: 1,
+      playbackRate: 1,
+      disableSeek: false
+    });
+    let objectUrl = null;
+    let lastKnownTime = 0;
+    let lastPersistedTime = -1;
+    let allowProgrammaticSeek = false;
+    const videoOptions = computed(() => props.videoOptions || {});
+    const controlsEnabled = computed(() => videoOptions.value.controls !== false);
+    const disableSeek = computed(() => Boolean(videoOptions.value.disableSeek));
+    const useCustomControls = computed(() => {
+      if (typeof videoOptions.value.customControls === "boolean") {
+        return videoOptions.value.customControls;
+      }
+      if (disableSeek.value) {
+        return true;
+      }
+      if (videoOptions.value.nativeControls === false) {
+        return true;
+      }
+      return false;
+    });
+    const showNativeControls = computed(() => {
+      if (!controlsEnabled.value) {
+        return false;
+      }
+      if (typeof videoOptions.value.nativeControls === "boolean") {
+        return videoOptions.value.nativeControls;
+      }
+      return !useCustomControls.value;
+    });
+    const showCustomControls = computed(() => {
+      return controlsEnabled.value && useCustomControls.value && !props.preferExternalControls;
+    });
+    const autoplay = computed(() => Boolean(videoOptions.value.autoplay));
+    const muted = computed(() => Boolean(videoOptions.value.muted));
+    const loop = computed(() => Boolean(videoOptions.value.loop));
+    const rangeMax = computed(() => Math.max(playbackState.value.duration || 0, 0));
+    const defaultCustomControlItems = ["playback", "restart", "progress", "time", "mute", "volume", "speed"];
+    const customControlItems = computed(() => {
+      const configuredItems = videoOptions.value.customControlItems;
+      return configuredItems && configuredItems.length > 0 ? configuredItems : defaultCustomControlItems;
+    });
+    const progressPercent = computed(() => {
+      if (!playbackState.value.duration || playbackState.value.duration <= 0) {
+        return 0;
+      }
+      return Math.min(playbackState.value.currentTime / playbackState.value.duration * 100, 100);
+    });
+    const playbackRates = [0.75, 1, 1.25, 1.5, 2];
+    function hasCustomControl(type) {
+      return customControlItems.value.includes(type);
+    }
     const stageStyle = computed(() => {
       if (props.zoom === 1) {
         return {};
@@ -129761,22 +130387,153 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
         transformOrigin: "top center"
       };
     });
+    function normalizeResumeStorage() {
+      const value = videoOptions.value.resumePlayback;
+      if (!value) {
+        return null;
+      }
+      if (value === true) {
+        return "local";
+      }
+      return value;
+    }
+    function getStorageAdapter(mode) {
+      try {
+        if (mode === "local" && typeof window !== "undefined" && window.localStorage) {
+          return window.localStorage;
+        }
+        if (mode === "session" && typeof window !== "undefined" && window.sessionStorage) {
+          return window.sessionStorage;
+        }
+      } catch {
+        return null;
+      }
+      return null;
+    }
+    function getResumeKey() {
+      if (videoOptions.value.resumeKey) {
+        return `jv:video-progress:${videoOptions.value.resumeKey}`;
+      }
+      const source = props.source;
+      if (typeof source === "string") {
+        return `jv:video-progress:url:${source}`;
+      }
+      if (source instanceof File) {
+        return `jv:video-progress:file:${source.name}:${source.size}:${source.lastModified}`;
+      }
+      if (source instanceof Blob) {
+        return `jv:video-progress:blob:${source.size}:${source.type || "unknown"}`;
+      }
+      if (source instanceof ArrayBuffer) {
+        return `jv:video-progress:buffer:${source.byteLength}`;
+      }
+      if (source && typeof source === "object" && "url" in source) {
+        return `jv:video-progress:request:${source.url}`;
+      }
+      return `jv:video-progress:name:${getFilename(source)}`;
+    }
+    function readProgress() {
+      const mode = normalizeResumeStorage();
+      if (!mode) {
+        return 0;
+      }
+      const key = getResumeKey();
+      if (mode === "memory") {
+        return getVideoProgressMemoryStore().get(key) || 0;
+      }
+      const storage = getStorageAdapter(mode);
+      if (!storage) {
+        return getVideoProgressMemoryStore().get(key) || 0;
+      }
+      const raw = storage.getItem(key);
+      const parsed = raw ? Number.parseFloat(raw) : 0;
+      return Number.isFinite(parsed) && parsed > 0 ? parsed : 0;
+    }
+    function writeProgress(time) {
+      const mode = normalizeResumeStorage();
+      if (!mode) {
+        return;
+      }
+      const key = getResumeKey();
+      const normalizedTime = Number.isFinite(time) && time > 0 ? time : 0;
+      if (mode === "memory") {
+        if (normalizedTime > 0) {
+          getVideoProgressMemoryStore().set(key, normalizedTime);
+        } else {
+          getVideoProgressMemoryStore().delete(key);
+        }
+        return;
+      }
+      const storage = getStorageAdapter(mode);
+      if (!storage) {
+        if (normalizedTime > 0) {
+          getVideoProgressMemoryStore().set(key, normalizedTime);
+        } else {
+          getVideoProgressMemoryStore().delete(key);
+        }
+        return;
+      }
+      if (normalizedTime > 0) {
+        storage.setItem(key, normalizedTime.toString());
+      } else {
+        storage.removeItem(key);
+      }
+    }
+    function persistProgress(time, force = false) {
+      if (!force && lastPersistedTime >= 0 && Math.abs(time - lastPersistedTime) < 1) {
+        return;
+      }
+      writeProgress(time);
+      lastPersistedTime = time;
+    }
+    function getPlaybackState() {
+      const video = videoRef.value;
+      if (!video) {
+        return {
+          ...playbackState.value,
+          disableSeek: disableSeek.value
+        };
+      }
+      return {
+        currentTime: Number.isFinite(video.currentTime) ? video.currentTime : 0,
+        duration: Number.isFinite(video.duration) ? video.duration : playbackState.value.duration,
+        paused: video.paused,
+        ended: video.ended,
+        muted: video.muted,
+        volume: video.volume,
+        playbackRate: video.playbackRate,
+        disableSeek: disableSeek.value
+      };
+    }
+    function syncPlaybackState() {
+      playbackState.value = getPlaybackState();
+      return playbackState.value;
+    }
+    function syncAndEmitStateChange() {
+      const state = syncPlaybackState();
+      emit2("stateChange", state);
+      return state;
+    }
     function cleanupObjectUrl() {
-      if (videoSrc.value.startsWith("blob:")) {
-        URL.revokeObjectURL(videoSrc.value);
+      if (objectUrl == null ? void 0 : objectUrl.startsWith("blob:")) {
+        URL.revokeObjectURL(objectUrl);
       }
+      objectUrl = null;
       videoSrc.value = "";
     }
     async function loadVideo() {
       try {
         loading.value = true;
         error.value = null;
+        lastKnownTime = 0;
+        lastPersistedTime = -1;
         cleanupObjectUrl();
         const blob = await fileToBlob(props.source, {
           proxyUrl: props.proxyUrl,
           requestAdapter: props.requestAdapter
         });
-        videoSrc.value = URL.createObjectURL(blob);
+        objectUrl = URL.createObjectURL(blob);
+        videoSrc.value = objectUrl;
         videoName.value = getFilename(props.source);
         videoInfo.value = {
           width: 0,
@@ -129784,30 +130541,216 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
           duration: 0,
           size: blob.size
         };
+        playbackState.value = {
+          currentTime: 0,
+          duration: 0,
+          paused: true,
+          ended: false,
+          muted: muted.value,
+          volume: 1,
+          playbackRate: videoOptions.value.playbackRate || 1,
+          disableSeek: disableSeek.value
+        };
       } catch (err) {
         loading.value = false;
         error.value = err;
         emit2("error", err);
       }
     }
+    function applyResumeProgress() {
+      const video = videoRef.value;
+      if (!video) {
+        return;
+      }
+      const resumeTime = readProgress();
+      if (resumeTime <= 0 || !Number.isFinite(video.duration) || video.duration <= 0) {
+        return;
+      }
+      const safeTime = Math.min(Math.max(resumeTime, 0), Math.max(video.duration - 1, 0));
+      if (safeTime <= 0) {
+        return;
+      }
+      allowProgrammaticSeek = true;
+      video.currentTime = safeTime;
+      lastKnownTime = safeTime;
+      syncPlaybackState();
+    }
     function handleLoadedMetadata() {
-      if (!videoRef.value || !videoInfo.value) {
+      const video = videoRef.value;
+      if (!video || !videoInfo.value) {
         return;
       }
+      if (typeof videoOptions.value.playbackRate === "number" && Number.isFinite(videoOptions.value.playbackRate)) {
+        video.playbackRate = videoOptions.value.playbackRate;
+      }
       videoInfo.value = {
         ...videoInfo.value,
-        width: videoRef.value.videoWidth,
-        height: videoRef.value.videoHeight,
-        duration: videoRef.value.duration
+        width: video.videoWidth,
+        height: video.videoHeight,
+        duration: video.duration
       };
+      syncPlaybackState();
+      applyResumeProgress();
+      syncAndEmitStateChange();
       loading.value = false;
       emit2("load");
     }
+    function handlePlay() {
+      var _a, _b;
+      const state = syncAndEmitStateChange();
+      emit2("play", state);
+      (_b = (_a = videoOptions.value).onPlay) == null ? void 0 : _b.call(_a, state);
+    }
+    function handlePause() {
+      var _a, _b;
+      const state = syncAndEmitStateChange();
+      persistProgress(state.currentTime, true);
+      emit2("pause", state);
+      (_b = (_a = videoOptions.value).onPause) == null ? void 0 : _b.call(_a, state);
+    }
+    function handleEnded() {
+      var _a, _b;
+      persistProgress(0, true);
+      const state = syncAndEmitStateChange();
+      emit2("ended", state);
+      (_b = (_a = videoOptions.value).onEnded) == null ? void 0 : _b.call(_a, state);
+    }
+    function handleTimeUpdate() {
+      var _a, _b;
+      const state = syncAndEmitStateChange();
+      lastKnownTime = state.currentTime;
+      persistProgress(state.currentTime);
+      emit2("timeUpdate", state);
+      (_b = (_a = videoOptions.value).onTimeUpdate) == null ? void 0 : _b.call(_a, state);
+    }
+    function handleSeeking() {
+      const video = videoRef.value;
+      if (!video) {
+        return;
+      }
+      if (allowProgrammaticSeek) {
+        allowProgrammaticSeek = false;
+        lastKnownTime = video.currentTime;
+        return;
+      }
+      if (!disableSeek.value) {
+        lastKnownTime = video.currentTime;
+        return;
+      }
+      allowProgrammaticSeek = true;
+      video.currentTime = lastKnownTime;
+      const state = syncAndEmitStateChange();
+      emit2("seekingBlocked", state);
+    }
+    function handleVideoClick() {
+      if (!showCustomControls.value) {
+        return;
+      }
+      void togglePlayback();
+    }
+    function handleProgressInput(event) {
+      const target = event.target;
+      if (!target) {
+        return;
+      }
+      seek(Number.parseFloat(target.value));
+    }
+    function handleVolumeInput(event) {
+      const target = event.target;
+      const video = videoRef.value;
+      if (!target || !video) {
+        return;
+      }
+      const nextVolume = Number.parseFloat(target.value);
+      video.volume = Number.isFinite(nextVolume) ? Math.min(Math.max(nextVolume, 0), 1) : video.volume;
+      video.muted = video.volume === 0;
+      syncAndEmitStateChange();
+    }
+    function toggleMuted() {
+      const video = videoRef.value;
+      if (!video) {
+        return;
+      }
+      video.muted = !video.muted;
+      syncAndEmitStateChange();
+    }
+    function handlePlaybackRateChange(event) {
+      const target = event.target;
+      const video = videoRef.value;
+      if (!target || !video) {
+        return;
+      }
+      const nextRate = Number.parseFloat(target.value);
+      if (!Number.isFinite(nextRate)) {
+        return;
+      }
+      video.playbackRate = nextRate;
+      syncAndEmitStateChange();
+    }
+    function restartVideo() {
+      seek(0);
+      void play();
+    }
+    function setMuted(nextMuted) {
+      if (!videoRef.value) {
+        return;
+      }
+      videoRef.value.muted = nextMuted;
+      syncAndEmitStateChange();
+    }
+    function setVolume(nextVolume) {
+      if (!videoRef.value || !Number.isFinite(nextVolume)) {
+        return;
+      }
+      const safeVolume = Math.min(Math.max(nextVolume, 0), 1);
+      videoRef.value.volume = safeVolume;
+      videoRef.value.muted = safeVolume === 0;
+      syncAndEmitStateChange();
+    }
+    function setPlaybackRate(nextRate) {
+      if (!videoRef.value || !Number.isFinite(nextRate)) {
+        return;
+      }
+      videoRef.value.playbackRate = nextRate;
+      syncAndEmitStateChange();
+    }
     function handleVideoError() {
       loading.value = false;
       error.value = new Error("视频加载失败");
       emit2("error", error.value);
     }
+    async function play() {
+      if (!videoRef.value) {
+        return;
+      }
+      await videoRef.value.play();
+    }
+    function pause() {
+      var _a;
+      (_a = videoRef.value) == null ? void 0 : _a.pause();
+    }
+    async function togglePlayback() {
+      if (!videoRef.value) {
+        return;
+      }
+      if (videoRef.value.paused) {
+        await videoRef.value.play();
+        return;
+      }
+      videoRef.value.pause();
+    }
+    function seek(time) {
+      const video = videoRef.value;
+      if (!video || !Number.isFinite(time)) {
+        return;
+      }
+      const safeTime = Math.min(Math.max(time, 0), Number.isFinite(video.duration) ? video.duration : time);
+      allowProgrammaticSeek = true;
+      video.currentTime = safeTime;
+      lastKnownTime = safeTime;
+      persistProgress(safeTime, true);
+      syncAndEmitStateChange();
+    }
     function formatFileSize(bytes) {
       if (bytes === 0) {
         return "0 B";
@@ -129831,7 +130774,25 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       return [minutes, seconds].map((value) => value.toString().padStart(2, "0")).join(":");
     }
     watch(() => props.source, loadVideo, { immediate: true });
+    watch(() => videoOptions.value.playbackRate, (playbackRate) => {
+      if (videoRef.value && typeof playbackRate === "number" && Number.isFinite(playbackRate)) {
+        videoRef.value.playbackRate = playbackRate;
+        syncPlaybackState();
+      }
+    });
+    __expose({
+      play,
+      pause,
+      togglePlayback,
+      seek,
+      restart: restartVideo,
+      setMuted,
+      setVolume,
+      setPlaybackRate,
+      getState: () => syncPlaybackState()
+    });
     onUnmounted(() => {
+      persistProgress(syncPlaybackState().currentTime, true);
       cleanupObjectUrl();
     });
     return (_ctx, _cache) => {
@@ -129884,24 +130845,99 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
               class: "jv-video-player",
               src: videoSrc.value,
               title: videoName.value,
-              controls: "",
+              controls: showNativeControls.value,
+              autoplay: autoplay.value,
+              muted: muted.value,
+              loop: loop.value,
               preload: "metadata",
               playsinline: "",
+              onClick: handleVideoClick,
               onLoadedmetadata: handleLoadedMetadata,
+              onPlay: handlePlay,
+              onPause: handlePause,
+              onEnded: handleEnded,
+              onTimeupdate: handleTimeUpdate,
+              onSeeking: handleSeeking,
               onError: handleVideoError
-            }, null, 40, _hoisted_4$2)) : createCommentVNode("", true)
+            }, null, 40, _hoisted_4$2)) : createCommentVNode("", true),
+            videoRef.value && showCustomControls.value ? (openBlock(), createElementBlock("div", {
+              key: 1,
+              class: normalizeClass(["jv-video-controls", { "jv-video-controls--compact": disableSeek.value }])
+            }, [
+              hasCustomControl("playback") ? (openBlock(), createElementBlock("button", {
+                key: 0,
+                type: "button",
+                class: "jv-video-controls__btn",
+                onClick: togglePlayback
+              }, toDisplayString(playbackState.value.paused ? "播放" : "暂停"), 1)) : createCommentVNode("", true),
+              hasCustomControl("restart") ? (openBlock(), createElementBlock("button", {
+                key: 1,
+                type: "button",
+                class: "jv-video-controls__btn jv-video-controls__btn--ghost",
+                onClick: restartVideo
+              }, " 重播 ")) : createCommentVNode("", true),
+              hasCustomControl("progress") ? (openBlock(), createElementBlock("div", _hoisted_5$1, [
+                disableSeek.value ? (openBlock(), createElementBlock("div", _hoisted_6$1, [
+                  createBaseVNode("div", {
+                    class: "jv-video-controls__progress-fill",
+                    style: normalizeStyle({ width: `${progressPercent.value}%` })
+                  }, null, 4)
+                ])) : (openBlock(), createElementBlock("input", {
+                  key: 1,
+                  class: "jv-video-controls__range",
+                  type: "range",
+                  min: "0",
+                  max: rangeMax.value,
+                  value: playbackState.value.currentTime,
+                  step: "0.1",
+                  onInput: handleProgressInput
+                }, null, 40, _hoisted_7$1))
+              ])) : createCommentVNode("", true),
+              hasCustomControl("time") ? (openBlock(), createElementBlock("span", _hoisted_8$1, toDisplayString(formatDuration(playbackState.value.currentTime)) + " / " + toDisplayString(formatDuration(playbackState.value.duration)), 1)) : createCommentVNode("", true),
+              hasCustomControl("mute") ? (openBlock(), createElementBlock("button", {
+                key: 4,
+                type: "button",
+                class: "jv-video-controls__btn jv-video-controls__btn--ghost",
+                onClick: toggleMuted
+              }, toDisplayString(playbackState.value.muted || playbackState.value.volume === 0 ? "静音中" : "声音"), 1)) : createCommentVNode("", true),
+              hasCustomControl("volume") ? (openBlock(), createElementBlock("input", {
+                key: 5,
+                class: "jv-video-controls__volume",
+                type: "range",
+                min: "0",
+                max: "1",
+                step: "0.05",
+                value: playbackState.value.muted ? 0 : playbackState.value.volume,
+                onInput: handleVolumeInput
+              }, null, 40, _hoisted_9)) : createCommentVNode("", true),
+              hasCustomControl("speed") ? (openBlock(), createElementBlock("label", _hoisted_10, [
+                _cache[2] || (_cache[2] = createBaseVNode("span", null, "倍速", -1)),
+                createBaseVNode("select", {
+                  value: playbackState.value.playbackRate,
+                  onChange: handlePlaybackRateChange
+                }, [
+                  (openBlock(), createElementBlock(Fragment, null, renderList(playbackRates, (rate) => {
+                    return createBaseVNode("option", {
+                      key: rate,
+                      value: rate
+                    }, toDisplayString(rate) + "x ", 9, _hoisted_12);
+                  }), 64))
+                ], 40, _hoisted_11)
+              ])) : createCommentVNode("", true)
+            ], 2)) : createCommentVNode("", true)
           ], 4),
-          videoInfo.value ? (openBlock(), createElementBlock("div", _hoisted_5$1, [
+          videoInfo.value ? (openBlock(), createElementBlock("div", _hoisted_13, [
             createBaseVNode("span", null, toDisplayString(videoInfo.value.width) + " × " + toDisplayString(videoInfo.value.height), 1),
             createBaseVNode("span", null, toDisplayString(formatDuration(videoInfo.value.duration)), 1),
-            createBaseVNode("span", null, toDisplayString(formatFileSize(videoInfo.value.size)), 1)
+            createBaseVNode("span", null, toDisplayString(formatFileSize(videoInfo.value.size)), 1),
+            createBaseVNode("span", null, toDisplayString(formatDuration(playbackState.value.currentTime)), 1)
           ])) : createCommentVNode("", true)
         ]))
       ], 512);
     };
   }
 });
-const VideoRender = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-39a588be"]]);
+const VideoRender = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-3724591d"]]);
 const _hoisted_1$2 = {
   key: 0,
   class: "jv-cad-error"
@@ -130044,7 +131080,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       if (!dxfHostRef.value) {
         throw new Error("DXF container is not ready");
       }
-      const { DxfViewer } = await import("./index-DKpKxg1L.js");
+      const { DxfViewer } = await import("./index-BXB1uz9p.js");
       destroyDxfViewer();
       dxfViewer.value = new DxfViewer(dxfHostRef.value, {
         autoResize: true,
@@ -130452,6 +131488,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     proxyUrl: {},
     requestAdapter: {},
     cad: {},
+    video: {},
     onReady: {},
     onError: {},
     onLoad: {},
@@ -130466,6 +131503,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const viewerRef = /* @__PURE__ */ ref();
     const contentRef = /* @__PURE__ */ ref();
     const ofdRenderRef = /* @__PURE__ */ ref(null);
+    const videoRenderRef = /* @__PURE__ */ ref(null);
     const brandingRef = /* @__PURE__ */ ref();
     let viewerRoot = null;
     let copyrightObserver = null;
@@ -130507,6 +131545,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const showToolbar = computed(() => props.toolbar !== false);
     const pdfRenderMode = computed(() => props.pdfRender ?? "inset");
     const cadOptions = computed(() => props.cad);
+    const videoOptions = computed(() => props.video);
+    const showToolbarVideoControls = computed(() => {
+      var _a2;
+      if (fileType.value !== "video" || props.toolbar === false) {
+        return false;
+      }
+      if (props.toolbar === true || props.toolbar === void 0) {
+        return true;
+      }
+      return ((_a2 = props.toolbar.items) == null ? void 0 : _a2.some((item) => item.type === "video")) ?? false;
+    });
     const toolbarConfig = computed(() => {
       if (props.toolbar === true || props.toolbar === void 0) {
         return void 0;
@@ -130525,6 +131574,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function handleLoad() {
       var _a2;
       setLoading(false);
+      if (fileType.value === "video") {
+        updateVideoState(getVideoState());
+      }
       emit2("load");
       events.emit("load");
       (_a2 = props.onLoad) == null ? void 0 : _a2.call(props);
@@ -130539,6 +131591,32 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function handleOfdPageChange(pageInfo) {
       state.setPage(pageInfo.current, pageInfo.total);
     }
+    function updateVideoState(nextState) {
+      state.setVideoState(nextState);
+    }
+    function handleVideoPlay(nextState) {
+      updateVideoState(nextState);
+      events.emit("video:play", nextState);
+    }
+    function handleVideoStateChange(nextState) {
+      updateVideoState(nextState);
+    }
+    function handleVideoPause(nextState) {
+      updateVideoState(nextState);
+      events.emit("video:pause", nextState);
+    }
+    function handleVideoEnded(nextState) {
+      updateVideoState(nextState);
+      events.emit("video:ended", nextState);
+    }
+    function handleVideoTimeUpdate(nextState) {
+      updateVideoState(nextState);
+      events.emit("video:timeupdate", nextState);
+    }
+    function handleVideoSeekingBlocked(nextState) {
+      updateVideoState(nextState);
+      events.emit("video:seeking-blocked", nextState);
+    }
     function syncPageController() {
       if (fileType.value !== "ofd") {
         state.setPageController(null);
@@ -130563,6 +131641,52 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }
       });
     }
+    function syncVideoController() {
+      if (fileType.value !== "video") {
+        state.setVideoController(null);
+        return;
+      }
+      state.setVideoController({
+        play: () => {
+          var _a2, _b2;
+          return (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.play) == null ? void 0 : _b2.call(_a2);
+        },
+        pause: () => {
+          var _a2, _b2;
+          return (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.pause) == null ? void 0 : _b2.call(_a2);
+        },
+        togglePlayback: () => {
+          var _a2, _b2;
+          return (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.togglePlayback) == null ? void 0 : _b2.call(_a2);
+        },
+        seek: (time) => {
+          var _a2, _b2;
+          return (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.seek) == null ? void 0 : _b2.call(_a2, time);
+        },
+        restart: () => {
+          var _a2, _b2;
+          return (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.restart) == null ? void 0 : _b2.call(_a2);
+        },
+        setMuted: (muted) => {
+          var _a2, _b2;
+          return (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.setMuted) == null ? void 0 : _b2.call(_a2, muted);
+        },
+        setVolume: (volume) => {
+          var _a2, _b2;
+          return (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.setVolume) == null ? void 0 : _b2.call(_a2, volume);
+        },
+        setPlaybackRate: (rate) => {
+          var _a2, _b2;
+          return (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.setPlaybackRate) == null ? void 0 : _b2.call(_a2, rate);
+        }
+      });
+    }
+    function getVideoState() {
+      var _a2, _b2;
+      const nextState = ((_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.getState) == null ? void 0 : _b2.call(_a2)) || state.videoState.value || null;
+      updateVideoState(nextState);
+      return nextState;
+    }
     function resolveViewerRoot() {
       var _a2;
       if (viewerRoot && document.body.contains(viewerRoot)) {
@@ -130840,6 +131964,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       try {
         setLoading(true);
         setError(null);
+        updateVideoState(null);
         setFile(file, filename2, type);
       } catch (err) {
         handleError2(err);
@@ -130860,6 +131985,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
     });
     watch(fileType, syncPageController, { immediate: true });
+    watch(fileType, syncVideoController, { immediate: true });
     onMounted(() => {
       var _a2;
       state.setPrintFn(() => {
@@ -130880,6 +132006,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     onUnmounted(() => {
       stopCopyrightProtection();
       state.setPageController(null);
+      state.setVideoController(null);
+      updateVideoState(null);
       destroy();
     });
     __expose({
@@ -130914,6 +132042,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           await downloadFile2(fileSource.value, state.filename.value);
         }
       },
+      playVideo: async () => {
+        var _a2, _b2;
+        await ((_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.play) == null ? void 0 : _b2.call(_a2));
+      },
+      pauseVideo: () => {
+        var _a2, _b2;
+        (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.pause) == null ? void 0 : _b2.call(_a2);
+      },
+      toggleVideoPlayback: async () => {
+        var _a2, _b2;
+        await ((_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.togglePlayback) == null ? void 0 : _b2.call(_a2));
+      },
+      seekVideo: (time) => {
+        var _a2, _b2;
+        (_b2 = (_a2 = videoRenderRef.value) == null ? void 0 : _a2.seek) == null ? void 0 : _b2.call(_a2, time);
+      },
+      getVideoState,
       setTheme,
       setLocale,
       setToolbar: (config) => {
@@ -130935,8 +132080,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         showToolbar.value ? (openBlock(), createBlock(Toolbar, {
           key: 0,
           config: toolbarConfig.value,
-          visible: toolbarVisible.value
-        }, null, 8, ["config", "visible"])) : createCommentVNode("", true),
+          visible: toolbarVisible.value,
+          "video-options": videoOptions.value
+        }, null, 8, ["config", "visible", "video-options"])) : createCommentVNode("", true),
         createBaseVNode("div", {
           ref_key: "contentRef",
           ref: contentRef,
@@ -131065,13 +132211,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   onError: handleError2
                 }, null, 8, ["source", "zoom"])) : unref(fileType) === "video" ? (openBlock(), createBlock(unref(VideoRender), {
                   key: 10,
+                  ref_key: "videoRenderRef",
+                  ref: videoRenderRef,
                   source: unref(fileSource),
                   zoom: unref(zoom),
                   "proxy-url": proxyUrl.value,
                   "request-adapter": requestAdapter.value,
+                  "video-options": videoOptions.value,
+                  "prefer-external-controls": showToolbarVideoControls.value,
                   onLoad: handleLoad,
-                  onError: handleError2
-                }, null, 8, ["source", "zoom", "proxy-url", "request-adapter"])) : unref(fileType) === "cad" ? (openBlock(), createBlock(unref(CadRender), {
+                  onError: handleError2,
+                  onStateChange: handleVideoStateChange,
+                  onPlay: handleVideoPlay,
+                  onPause: handleVideoPause,
+                  onEnded: handleVideoEnded,
+                  onTimeUpdate: handleVideoTimeUpdate,
+                  onSeekingBlocked: handleVideoSeekingBlocked
+                }, null, 8, ["source", "zoom", "proxy-url", "request-adapter", "video-options", "prefer-external-controls"])) : unref(fileType) === "cad" ? (openBlock(), createBlock(unref(CadRender), {
                   key: 11,
                   source: unref(fileSource),
                   filename: unref(filename),
@@ -131109,17 +132265,32 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Viewer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e261aa6d"]]);
+const Viewer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-77e0f7de"]]);
 function createViewer(options) {
   const events = createEventBus();
   let app = null;
   let container = null;
   let viewerComponent = null;
   const runtimeOptions = /* @__PURE__ */ reactive({ ...options });
+  const listenerRegistry = /* @__PURE__ */ new Map();
+  const lifecycleEvents = /* @__PURE__ */ new Set(["ready", "load", "error", "destroy"]);
   const updateOptions = async (nextOptions) => {
     Object.assign(runtimeOptions, nextOptions);
     await nextTick();
   };
+  const bindCustomEventListeners = () => {
+    if (!(viewerComponent == null ? void 0 : viewerComponent.on)) {
+      return;
+    }
+    listenerRegistry.forEach((handlers, event) => {
+      if (lifecycleEvents.has(event)) {
+        return;
+      }
+      handlers.forEach((handler) => {
+        viewerComponent.on(event, handler);
+      });
+    });
+  };
   const mergedOptions = {
     ...runtimeOptions,
     onReady: () => {
@@ -131165,6 +132336,8 @@ function createViewer(options) {
         }
       });
       app.mount(container);
+      await nextTick();
+      bindCustomEventListeners();
       return Promise.resolve();
     },
     destroy() {
@@ -131228,6 +132401,26 @@ function createViewer(options) {
         await downloadFile(file.source, file.filename);
       }
     },
+    async playVideo() {
+      var _a;
+      await ((_a = viewerComponent == null ? void 0 : viewerComponent.playVideo) == null ? void 0 : _a.call(viewerComponent));
+    },
+    pauseVideo() {
+      var _a;
+      (_a = viewerComponent == null ? void 0 : viewerComponent.pauseVideo) == null ? void 0 : _a.call(viewerComponent);
+    },
+    async toggleVideoPlayback() {
+      var _a;
+      await ((_a = viewerComponent == null ? void 0 : viewerComponent.toggleVideoPlayback) == null ? void 0 : _a.call(viewerComponent));
+    },
+    seekVideo(time) {
+      var _a;
+      (_a = viewerComponent == null ? void 0 : viewerComponent.seekVideo) == null ? void 0 : _a.call(viewerComponent, time);
+    },
+    getVideoState() {
+      var _a;
+      return ((_a = viewerComponent == null ? void 0 : viewerComponent.getVideoState) == null ? void 0 : _a.call(viewerComponent)) || null;
+    },
     setTheme(theme) {
       updateOptions({ theme });
     },
@@ -131238,10 +132431,26 @@ function createViewer(options) {
       updateOptions({ toolbar: config });
     },
     on(event, handler) {
+      var _a;
       events.on(event, handler);
+      if (!listenerRegistry.has(event)) {
+        listenerRegistry.set(event, /* @__PURE__ */ new Set());
+      }
+      listenerRegistry.get(event).add(handler);
+      if (!lifecycleEvents.has(event)) {
+        (_a = viewerComponent == null ? void 0 : viewerComponent.on) == null ? void 0 : _a.call(viewerComponent, event, handler);
+      }
     },
     off(event, handler) {
+      var _a, _b, _c;
       events.off(event, handler);
+      (_a = listenerRegistry.get(event)) == null ? void 0 : _a.delete(handler);
+      if (((_b = listenerRegistry.get(event)) == null ? void 0 : _b.size) === 0) {
+        listenerRegistry.delete(event);
+      }
+      if (!lifecycleEvents.has(event)) {
+        (_c = viewerComponent == null ? void 0 : viewerComponent.off) == null ? void 0 : _c.call(viewerComponent, event, handler);
+      }
     },
     getState() {
       var _a;
@@ -131254,7 +132463,8 @@ function createViewer(options) {
         zoom: 1,
         rotate: 0,
         page: { current: 1, total: 1 },
-        fullscreen: false
+        fullscreen: false,
+        video: null
       };
     }
   };