@veltra/desktop 1.0.8 → 1.0.9

package/dist/components/file-viewer/file-viewer.js

@@ -0,0 +1,294 @@
+import _sfc_main$1 from "../icon/icon.js";
+import _sfc_main$2 from "../scroll/scroll.js";
+import _sfc_main$3 from "../empty/empty.js";
+import { FILE_VIEWER_KIND_LABEL, downloadFile, formatBytes, inferKind } from "./helper.js";
+import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineAsyncComponent, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, openBlock, renderList, resolveDynamicComponent, shallowRef, toDisplayString, unref, useModel, watch, withCtx, withModifiers } from "vue";
+import { bem, withUnit } from "@veltra/utils";
+import { Close } from "@veltra/icons/normal";
+//#region src/components/file-viewer/file-viewer.vue
+const _hoisted_1 = ["tabindex"];
+const _hoisted_2 = ["onClick"];
+const _hoisted_3 = ["title"];
+const _hoisted_4 = ["disabled"];
+const _hoisted_5 = ["disabled"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "FileViewer",
+	inheritAttrs: false,
+	__name: "file-viewer",
+	props: /* @__PURE__ */ mergeModels({
+		files: {},
+		modelValue: { default: void 0 },
+		sidebarWidth: {
+			type: [
+				String,
+				Number,
+				Boolean
+			],
+			default: "280px"
+		},
+		sheetMaxRows: { default: 5e4 },
+		downloadable: {
+			type: Boolean,
+			default: true
+		},
+		open: {
+			type: Boolean,
+			default: void 0
+		},
+		closeOnClickBackdrop: {
+			type: Boolean,
+			default: true
+		},
+		closeOnEsc: {
+			type: Boolean,
+			default: true
+		}
+	}, {
+		"modelValue": { default: void 0 },
+		"modelModifiers": {},
+		"open": {
+			type: Boolean,
+			default: void 0
+		},
+		"openModifiers": {}
+	}),
+	emits: /* @__PURE__ */ mergeModels([
+		"update:modelValue",
+		"update:open",
+		"change",
+		"error"
+	], ["update:modelValue", "update:open"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const cls = bem("file-viewer");
+		const activeId = useModel(__props, "modelValue");
+		const openModel = useModel(__props, "open");
+		const rootRef = shallowRef();
+		const PreviewerMap = {
+			image: defineAsyncComponent(() => import("./previewers/image-previewer.js")),
+			video: defineAsyncComponent(() => import("./previewers/video-previewer.js")),
+			pdf: defineAsyncComponent(() => import("./previewers/pdf-previewer.js")),
+			sheet: defineAsyncComponent(() => import("./previewers/sheet-previewer.js")),
+			docx: defineAsyncComponent(() => import("./previewers/docx-previewer.js")),
+			text: defineAsyncComponent(() => import("./previewers/text-previewer.js"))
+		};
+		const normalizedFiles = computed(() => props.files.map((f, i) => ({
+			...f,
+			id: f.id ?? `file-${i}`,
+			kind: inferKind(f.name, f.kind)
+		})));
+		const activeFile = computed(() => normalizedFiles.value.find((f) => f.id === activeId.value));
+		const activeIndex = computed(() => normalizedFiles.value.findIndex((f) => f.id === activeId.value));
+		const hasPrev = computed(() => activeIndex.value > 0);
+		const hasNext = computed(() => activeIndex.value >= 0 && activeIndex.value < normalizedFiles.value.length - 1);
+		const showSidebar = computed(() => props.sidebarWidth !== false && props.sidebarWidth !== 0);
+		const sidebarWidthCss = computed(() => {
+			const w = props.sidebarWidth;
+			if (w === false || w === 0) return void 0;
+			return withUnit(w ?? "280px", "px");
+		});
+		/** 是否启用模态模式：只要父组件显式传入 open（含 v-model:open），即进入模态 */
+		const isModal = computed(() => openModel.value !== void 0);
+		function label(kind) {
+			return FILE_VIEWER_KIND_LABEL[kind];
+		}
+		function activate(id) {
+			if (activeId.value === id) return;
+			activeId.value = id;
+			const f = normalizedFiles.value.find((x) => x.id === id);
+			if (f) emit("change", f);
+		}
+		function prev() {
+			const i = activeIndex.value;
+			if (i <= 0) return;
+			const target = normalizedFiles.value[i - 1];
+			if (target) activate(target.id);
+		}
+		function next() {
+			const i = activeIndex.value;
+			if (i < 0 || i >= normalizedFiles.value.length - 1) return;
+			const target = normalizedFiles.value[i + 1];
+			if (target) activate(target.id);
+		}
+		async function download() {
+			if (!activeFile.value) return;
+			try {
+				await downloadFile(activeFile.value);
+			} catch (err) {
+				emit("error", {
+					file: activeFile.value,
+					error: err
+				});
+			}
+		}
+		function handleChildError(err) {
+			if (!activeFile.value) return;
+			emit("error", {
+				file: activeFile.value,
+				error: err
+			});
+		}
+		function handleClose() {
+			if (!isModal.value) return;
+			openModel.value = false;
+		}
+		function handleWindowKeydown(e) {
+			if (e.key !== "Escape") return;
+			if (!isModal.value || !openModel.value) return;
+			if (props.closeOnEsc === false) return;
+			e.stopPropagation();
+			handleClose();
+		}
+		function handleBackdropMousedown() {
+			if (!isModal.value) return;
+			if (props.closeOnClickBackdrop === false) return;
+			handleClose();
+		}
+		watch(normalizedFiles, (files) => {
+			if (!files.length) {
+				activeId.value = void 0;
+				return;
+			}
+			if (!activeId.value || !files.some((f) => f.id === activeId.value)) activeId.value = files[0].id;
+		}, { immediate: true });
+		let previousBodyOverflow = "";
+		let isBodyLocked = false;
+		function lockBody() {
+			if (isBodyLocked || typeof document === "undefined") return;
+			previousBodyOverflow = document.body.style.overflow;
+			document.body.style.overflow = "hidden";
+			isBodyLocked = true;
+		}
+		function unlockBody() {
+			if (!isBodyLocked || typeof document === "undefined") return;
+			document.body.style.overflow = previousBodyOverflow;
+			isBodyLocked = false;
+		}
+		watch([isModal, openModel], ([modal, open]) => {
+			if (modal && open) {
+				lockBody();
+				nextTick(() => {
+					rootRef.value?.focus();
+				});
+				if (typeof window !== "undefined") window.addEventListener("keydown", handleWindowKeydown, true);
+			} else {
+				unlockBody();
+				if (typeof window !== "undefined") window.removeEventListener("keydown", handleWindowKeydown, true);
+			}
+		}, { immediate: true });
+		onBeforeUnmount(() => {
+			unlockBody();
+			if (typeof window !== "undefined") window.removeEventListener("keydown", handleWindowKeydown, true);
+		});
+		__expose({
+			activeId,
+			activate,
+			next,
+			prev
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(Teleport, {
+				to: "body",
+				disabled: !isModal.value
+			}, [createVNode(Transition, { name: isModal.value ? "u-file-viewer-modal" : "" }, {
+				default: withCtx(() => [!isModal.value || openModel.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass([unref(cls).b, unref(bem).is("modal", isModal.value)]),
+					tabindex: isModal.value ? -1 : void 0,
+					ref_key: "rootRef",
+					ref: rootRef,
+					onMousedown: withModifiers(handleBackdropMousedown, ["self"])
+				}, [isModal.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(unref(cls).e("backdrop")),
+					onMousedown: withModifiers(handleBackdropMousedown, ["self"])
+				}, null, 34)) : createCommentVNode("v-if", true), createElementVNode("div", { class: normalizeClass(unref(cls).e("inner")) }, [showSidebar.value ? (openBlock(), createElementBlock("aside", {
+					key: 0,
+					class: normalizeClass(unref(cls).e("sidebar")),
+					style: normalizeStyle({ width: sidebarWidthCss.value })
+				}, [createElementVNode("header", { class: normalizeClass(unref(cls).e("sidebar-head")) }, [createElementVNode("span", { class: normalizeClass(unref(cls).e("sidebar-title")) }, "文件", 2), createElementVNode("span", { class: normalizeClass(unref(cls).e("sidebar-count")) }, toDisplayString(normalizedFiles.value.length), 3)], 2), createVNode(unref(_sfc_main$2), {
+					tag: "ul",
+					class: normalizeClass(unref(cls).e("list"))
+				}, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(normalizedFiles.value, (f) => {
+						return openBlock(), createElementBlock("li", {
+							key: f.id,
+							class: normalizeClass([unref(cls).e("item"), unref(bem).is("active", f.id === activeId.value)]),
+							onClick: ($event) => activate(f.id)
+						}, [createElementVNode("span", { class: normalizeClass([unref(cls).e("badge"), unref(cls).em("badge", f.kind)]) }, toDisplayString(label(f.kind)), 3), createElementVNode("span", { class: normalizeClass(unref(cls).e("item-meta")) }, [createElementVNode("span", {
+							class: normalizeClass(unref(cls).e("item-name")),
+							title: f.name
+						}, toDisplayString(f.name), 11, _hoisted_3), createElementVNode("span", { class: normalizeClass(unref(cls).e("item-size")) }, toDisplayString(unref(formatBytes)(f.size)), 3)], 2)], 10, _hoisted_2);
+					}), 128)), !normalizedFiles.value.length ? (openBlock(), createElementBlock("li", {
+						key: 0,
+						class: normalizeClass(unref(cls).e("list-empty"))
+					}, [createVNode(unref(_sfc_main$3), {
+						text: "暂无文件",
+						size: 32
+					})], 2)) : createCommentVNode("v-if", true)]),
+					_: 1
+				}, 8, ["class"])], 6)) : createCommentVNode("v-if", true), createElementVNode("section", { class: normalizeClass(unref(cls).e("stage")) }, [createElementVNode("header", { class: normalizeClass(unref(cls).e("stage-head")) }, [createElementVNode("div", { class: normalizeClass(unref(cls).e("stage-title")) }, [
+					activeFile.value ? (openBlock(), createElementBlock("span", {
+						key: 0,
+						class: normalizeClass([unref(cls).e("badge"), unref(cls).em("badge", activeFile.value.kind)])
+					}, toDisplayString(label(activeFile.value.kind)), 3)) : createCommentVNode("v-if", true),
+					createElementVNode("span", { class: normalizeClass(unref(cls).e("stage-name")) }, toDisplayString(activeFile.value?.name ?? "—"), 3),
+					activeFile.value?.size ? (openBlock(), createElementBlock("span", {
+						key: 1,
+						class: normalizeClass(unref(cls).e("stage-sub"))
+					}, toDisplayString(unref(formatBytes)(activeFile.value.size)), 3)) : createCommentVNode("v-if", true)
+				], 2), createElementVNode("div", { class: normalizeClass(unref(cls).e("stage-actions")) }, [
+					createElementVNode("button", {
+						class: normalizeClass(unref(cls).e("action")),
+						disabled: !hasPrev.value,
+						type: "button",
+						onClick: prev
+					}, " 上一个 ", 10, _hoisted_4),
+					createElementVNode("button", {
+						class: normalizeClass(unref(cls).e("action")),
+						disabled: !hasNext.value,
+						type: "button",
+						onClick: next
+					}, " 下一个 ", 10, _hoisted_5),
+					__props.downloadable && activeFile.value ? (openBlock(), createElementBlock("button", {
+						key: 0,
+						class: normalizeClass([unref(cls).e("action"), unref(cls).em("action", "primary")]),
+						type: "button",
+						onClick: download
+					}, " 下载 ", 2)) : createCommentVNode("v-if", true),
+					isModal.value ? (openBlock(), createElementBlock("button", {
+						key: 1,
+						class: normalizeClass([unref(cls).e("action"), unref(cls).em("action", "icon")]),
+						type: "button",
+						"aria-label": "关闭预览",
+						title: "关闭",
+						onClick: handleClose
+					}, [createVNode(unref(_sfc_main$1), { size: 16 }, {
+						default: withCtx(() => [createVNode(unref(Close))]),
+						_: 1
+					})], 2)) : createCommentVNode("v-if", true)
+				], 2)], 2), createElementVNode("div", { class: normalizeClass(unref(cls).e("body")) }, [createVNode(Transition, {
+					name: "u-file-viewer-fade",
+					mode: "out-in"
+				}, {
+					default: withCtx(() => [activeFile.value ? (openBlock(), createBlock(resolveDynamicComponent(PreviewerMap[activeFile.value.kind]), {
+						key: activeFile.value.id,
+						file: activeFile.value,
+						"max-rows": __props.sheetMaxRows,
+						onError: handleChildError
+					}, null, 40, ["file", "max-rows"])) : (openBlock(), createElementBlock("div", {
+						key: 1,
+						class: normalizeClass(unref(cls).e("empty"))
+					}, [createVNode(unref(_sfc_main$3), { text: "暂无可预览文件" })], 2))]),
+					_: 1
+				})], 2)], 2)], 2)], 42, _hoisted_1)) : createCommentVNode("v-if", true)]),
+				_: 1
+			}, 8, ["name"])], 8, ["disabled"]);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=file-viewer.js.map

package/dist/components/file-viewer/file-viewer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-viewer.js","names":[],"sources":["../../../src/components/file-viewer/file-viewer.vue"],"sourcesContent":["<template>\n  <Teleport to=\"body\" :disabled=\"!isModal\">\n    <transition :name=\"isModal ? 'u-file-viewer-modal' : ''\">\n      <div\n        v-if=\"!isModal || openModel\"\n        :class=\"[cls.b, bem.is('modal', isModal)]\"\n        :tabindex=\"isModal ? -1 : undefined\"\n        ref=\"rootRef\"\n        @mousedown.self=\"handleBackdropMousedown\"\n      >\n        <div v-if=\"isModal\" :class=\"cls.e('backdrop')\" @mousedown.self=\"handleBackdropMousedown\" />\n        <div :class=\"cls.e('inner')\">\n          <aside v-if=\"showSidebar\" :class=\"cls.e('sidebar')\" :style=\"{ width: sidebarWidthCss }\">\n            <header :class=\"cls.e('sidebar-head')\">\n              <span :class=\"cls.e('sidebar-title')\">文件</span>\n              <span :class=\"cls.e('sidebar-count')\">{{ normalizedFiles.length }}</span>\n            </header>\n            <u-scroll tag=\"ul\" :class=\"cls.e('list')\">\n              <li\n                v-for=\"f in normalizedFiles\"\n                :key=\"f.id\"\n                :class=\"[cls.e('item'), bem.is('active', f.id === activeId)]\"\n                @click=\"activate(f.id)\"\n              >\n                <span :class=\"[cls.e('badge'), cls.em('badge', f.kind)]\">\n                  {{ label(f.kind) }}\n                </span>\n                <span :class=\"cls.e('item-meta')\">\n                  <span :class=\"cls.e('item-name')\" :title=\"f.name\">{{ f.name }}</span>\n                  <span :class=\"cls.e('item-size')\">{{ formatBytes(f.size) }}</span>\n                </span>\n              </li>\n              <li v-if=\"!normalizedFiles.length\" :class=\"cls.e('list-empty')\">\n                <u-empty text=\"暂无文件\" :size=\"32\" />\n              </li>\n            </u-scroll>\n          </aside>\n\n          <section :class=\"cls.e('stage')\">\n            <header :class=\"cls.e('stage-head')\">\n              <div :class=\"cls.e('stage-title')\">\n                <span v-if=\"activeFile\" :class=\"[cls.e('badge'), cls.em('badge', activeFile.kind)]\">\n                  {{ label(activeFile.kind) }}\n                </span>\n                <span :class=\"cls.e('stage-name')\">\n                  {{ activeFile?.name ?? '—' }}\n                </span>\n                <span v-if=\"activeFile?.size\" :class=\"cls.e('stage-sub')\">\n                  {{ formatBytes(activeFile.size) }}\n                </span>\n              </div>\n              <div :class=\"cls.e('stage-actions')\">\n                <button :class=\"cls.e('action')\" :disabled=\"!hasPrev\" type=\"button\" @click=\"prev\">\n                  上一个\n                </button>\n                <button :class=\"cls.e('action')\" :disabled=\"!hasNext\" type=\"button\" @click=\"next\">\n                  下一个\n                </button>\n                <button\n                  v-if=\"downloadable && activeFile\"\n                  :class=\"[cls.e('action'), cls.em('action', 'primary')]\"\n                  type=\"button\"\n                  @click=\"download\"\n                >\n                  下载\n                </button>\n                <button\n                  v-if=\"isModal\"\n                  :class=\"[cls.e('action'), cls.em('action', 'icon')]\"\n                  type=\"button\"\n                  aria-label=\"关闭预览\"\n                  title=\"关闭\"\n                  @click=\"handleClose\"\n                >\n                  <u-icon :size=\"16\">\n                    <Close />\n                  </u-icon>\n                </button>\n              </div>\n            </header>\n            <div :class=\"cls.e('body')\">\n              <transition name=\"u-file-viewer-fade\" mode=\"out-in\">\n                <component\n                  :is=\"PreviewerMap[activeFile.kind]\"\n                  v-if=\"activeFile\"\n                  :key=\"activeFile.id\"\n                  :file=\"activeFile\"\n                  :max-rows=\"sheetMaxRows\"\n                  @error=\"handleChildError\"\n                />\n                <div v-else :class=\"cls.e('empty')\">\n                  <u-empty text=\"暂无可预览文件\" />\n                </div>\n              </transition>\n            </div>\n          </section>\n        </div>\n      </div>\n    </transition>\n  </Teleport>\n</template>\n\n<script lang=\"ts\" setup>\nimport { Close } from '@veltra/icons/normal'\nimport { bem, withUnit } from '@veltra/utils'\nimport { computed, defineAsyncComponent, nextTick, onBeforeUnmount, shallowRef, watch } from 'vue'\n\nimport type {\n  _FileViewerExposed,\n  FileViewerEmits,\n  FileViewerItem,\n  FileViewerKind,\n  FileViewerProps\n} from '../../types/file-viewer'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UScroll } from '../scroll'\nimport { FILE_VIEWER_KIND_LABEL, downloadFile, formatBytes, inferKind } from './helper'\n\ndefineOptions({\n  name: 'FileViewer',\n  inheritAttrs: false\n})\n\nconst props = withDefaults(defineProps<FileViewerProps>(), {\n  modelValue: undefined,\n  sidebarWidth: '280px',\n  sheetMaxRows: 50_000,\n  downloadable: true,\n  open: undefined,\n  closeOnClickBackdrop: true,\n  closeOnEsc: true\n})\n\nconst emit = defineEmits<FileViewerEmits>()\n\nconst cls = bem('file-viewer')\n\nconst activeId = defineModel<string | undefined>('modelValue', { default: undefined })\nconst openModel = defineModel<boolean | undefined>('open', { default: undefined })\n\nconst rootRef = shallowRef<HTMLDivElement>()\n\nconst PreviewerMap: Record<FileViewerKind, ReturnType<typeof defineAsyncComponent>> = {\n  image: defineAsyncComponent(() => import('./previewers/image-previewer.vue')),\n  video: defineAsyncComponent(() => import('./previewers/video-previewer.vue')),\n  pdf: defineAsyncComponent(() => import('./previewers/pdf-previewer.vue')),\n  sheet: defineAsyncComponent(() => import('./previewers/sheet-previewer.vue')),\n  docx: defineAsyncComponent(() => import('./previewers/docx-previewer.vue')),\n  text: defineAsyncComponent(() => import('./previewers/text-previewer.vue'))\n}\n\ninterface NormalizedFile extends FileViewerItem {\n  id: string\n  kind: FileViewerKind\n}\n\nconst normalizedFiles = computed<NormalizedFile[]>(() =>\n  props.files.map((f, i) => ({\n    ...f,\n    id: f.id ?? `file-${i}`,\n    kind: inferKind(f.name, f.kind)\n  }))\n)\n\nconst activeFile = computed<NormalizedFile | undefined>(() =>\n  normalizedFiles.value.find((f) => f.id === activeId.value)\n)\n\nconst activeIndex = computed(() => normalizedFiles.value.findIndex((f) => f.id === activeId.value))\n\nconst hasPrev = computed(() => activeIndex.value > 0)\nconst hasNext = computed(\n  () => activeIndex.value >= 0 && activeIndex.value < normalizedFiles.value.length - 1\n)\n\nconst showSidebar = computed(() => props.sidebarWidth !== false && props.sidebarWidth !== 0)\n\nconst sidebarWidthCss = computed(() => {\n  const w = props.sidebarWidth\n  if (w === false || w === 0) return undefined\n  return withUnit(w ?? '280px', 'px')\n})\n\n/** 是否启用模态模式：只要父组件显式传入 open（含 v-model:open），即进入模态 */\nconst isModal = computed(() => openModel.value !== undefined)\n\nfunction label(kind: FileViewerKind): string {\n  return FILE_VIEWER_KIND_LABEL[kind]\n}\n\nfunction activate(id: string) {\n  if (activeId.value === id) return\n  activeId.value = id\n  const f = normalizedFiles.value.find((x) => x.id === id)\n  if (f) emit('change', f)\n}\n\nfunction prev() {\n  const i = activeIndex.value\n  if (i <= 0) return\n  const target = normalizedFiles.value[i - 1]\n  if (target) activate(target.id)\n}\n\nfunction next() {\n  const i = activeIndex.value\n  if (i < 0 || i >= normalizedFiles.value.length - 1) return\n  const target = normalizedFiles.value[i + 1]\n  if (target) activate(target.id)\n}\n\nasync function download() {\n  if (!activeFile.value) return\n  try {\n    await downloadFile(activeFile.value)\n  } catch (err) {\n    emit('error', { file: activeFile.value, error: err })\n  }\n}\n\nfunction handleChildError(err: unknown) {\n  if (!activeFile.value) return\n  emit('error', { file: activeFile.value, error: err })\n}\n\nfunction handleClose() {\n  if (!isModal.value) return\n  openModel.value = false\n}\n\nfunction handleWindowKeydown(e: KeyboardEvent) {\n  if (e.key !== 'Escape') return\n  if (!isModal.value || !openModel.value) return\n  if (props.closeOnEsc === false) return\n  e.stopPropagation()\n  handleClose()\n}\n\nfunction handleBackdropMousedown() {\n  if (!isModal.value) return\n  if (props.closeOnClickBackdrop === false) return\n  handleClose()\n}\n\nwatch(\n  normalizedFiles,\n  (files) => {\n    if (!files.length) {\n      activeId.value = undefined\n      return\n    }\n    if (!activeId.value || !files.some((f) => f.id === activeId.value)) {\n      activeId.value = files[0]!.id\n    }\n  },\n  { immediate: true }\n)\n\n// 模态打开时：锁定 body 滚动 + 让容器获得焦点以便接收 ESC\nlet previousBodyOverflow = ''\nlet isBodyLocked = false\n\nfunction lockBody() {\n  if (isBodyLocked || typeof document === 'undefined') return\n  previousBodyOverflow = document.body.style.overflow\n  document.body.style.overflow = 'hidden'\n  isBodyLocked = true\n}\n\nfunction unlockBody() {\n  if (!isBodyLocked || typeof document === 'undefined') return\n  document.body.style.overflow = previousBodyOverflow\n  isBodyLocked = false\n}\n\nwatch(\n  [isModal, openModel],\n  ([modal, open]) => {\n    if (modal && open) {\n      lockBody()\n      nextTick(() => {\n        rootRef.value?.focus()\n      })\n      if (typeof window !== 'undefined') {\n        window.addEventListener('keydown', handleWindowKeydown, true)\n      }\n    } else {\n      unlockBody()\n      if (typeof window !== 'undefined') {\n        window.removeEventListener('keydown', handleWindowKeydown, true)\n      }\n    }\n  },\n  { immediate: true }\n)\n\nonBeforeUnmount(() => {\n  unlockBody()\n  if (typeof window !== 'undefined') {\n    window.removeEventListener('keydown', handleWindowKeydown, true)\n  }\n})\n\ndefineExpose<_FileViewerExposed>({\n  activeId,\n  activate,\n  next,\n  prev\n})\n</script>\n"],"mappings":"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"}

package/dist/components/file-viewer/file-viewer.vue.d.ts

@@ -0,0 +1,42 @@
+import { FileViewerItem, FileViewerProps, _FileViewerExposed } from "../../types/file-viewer.js";
+import * as _$vue from "vue";
+
+//#region src/components/file-viewer/file-viewer.vue.d.ts
+type __VLS_Props = FileViewerProps;
+type __VLS_ModelProps = {
+  'modelValue'?: string | undefined;
+  'open'?: boolean | undefined;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: _$vue.DefineComponent<__VLS_PublicProps, _FileViewerExposed, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  "update:modelValue": (value: string | undefined) => any;
+  "update:open": (value: boolean | undefined) => any;
+} & {
+  "update:modelValue": (id: string) => any;
+  change: (file: FileViewerItem) => any;
+  error: (err: {
+    file: FileViewerItem;
+    error: unknown;
+  }) => any;
+  "update:open": (value: boolean) => any;
+}, string, _$vue.PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+  "onUpdate:modelValue"?: ((id: string) => any) | undefined;
+  onChange?: ((file: FileViewerItem) => any) | undefined;
+  onError?: ((err: {
+    file: FileViewerItem;
+    error: unknown;
+  }) => any) | undefined;
+  "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {
+  modelValue: string;
+  open: boolean;
+  sidebarWidth: string | number | false;
+  sheetMaxRows: number;
+  downloadable: boolean;
+  closeOnClickBackdrop: boolean;
+  closeOnEsc: boolean;
+}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+//#endregion
+export { _default };
+//# sourceMappingURL=file-viewer.vue.d.ts.map

package/dist/components/file-viewer/helper.js

@@ -0,0 +1,185 @@
+//#region src/components/file-viewer/helper.ts
+const IMAGE_EXTS = new Set([
+	"png",
+	"jpg",
+	"jpeg",
+	"gif",
+	"webp",
+	"bmp",
+	"svg",
+	"avif",
+	"ico"
+]);
+const VIDEO_EXTS = new Set([
+	"mp4",
+	"webm",
+	"mov",
+	"m4v",
+	"ogv",
+	"mkv"
+]);
+const SHEET_EXTS = new Set([
+	"xlsx",
+	"xlsm",
+	"xlsb",
+	"csv"
+]);
+const TEXT_EXTS = new Set([
+	"txt",
+	"log",
+	"md",
+	"markdown",
+	"json",
+	"yml",
+	"yaml",
+	"xml",
+	"js",
+	"ts",
+	"tsx",
+	"jsx",
+	"css",
+	"scss",
+	"sass",
+	"less",
+	"html",
+	"htm",
+	"ini",
+	"toml",
+	"sh",
+	"bash",
+	"zsh",
+	"env",
+	"sql"
+]);
+function getExtension(name) {
+	const idx = name.lastIndexOf(".");
+	return idx === -1 ? "" : name.slice(idx + 1).toLowerCase();
+}
+function inferKind(name, explicit) {
+	if (explicit) return explicit;
+	const ext = getExtension(name);
+	if (IMAGE_EXTS.has(ext)) return "image";
+	if (VIDEO_EXTS.has(ext)) return "video";
+	if (ext === "pdf") return "pdf";
+	if (SHEET_EXTS.has(ext)) return "sheet";
+	if (ext === "docx") return "docx";
+	if (TEXT_EXTS.has(ext)) return "text";
+	return "text";
+}
+const FILE_VIEWER_KIND_LABEL = {
+	image: "IMG",
+	video: "MP4",
+	pdf: "PDF",
+	sheet: "XLS",
+	docx: "DOC",
+	text: "TXT"
+};
+/** 规范化数据源为 ArrayBuffer，可被 AbortController 中断（仅 URL fetch 场景生效） */
+async function toArrayBuffer(src, signal) {
+	if (typeof src === "string") {
+		const res = await fetch(src, { signal });
+		if (!res.ok) throw new Error(`Fetch failed: ${res.status} ${res.statusText}`);
+		return await res.arrayBuffer();
+	}
+	if (src instanceof ArrayBuffer) return src;
+	if (src instanceof Uint8Array) return src.slice().buffer;
+	return await src.arrayBuffer();
+}
+/** 返回用于 <img> / <video> 等标签 src 的 URL；二进制会创建 ObjectURL 并返回 revoke 钩子 */
+function toBlobUrl(src, mime) {
+	if (typeof src === "string") return {
+		url: src,
+		revoke: () => {}
+	};
+	let blob;
+	if (src instanceof Blob) blob = src;
+	else if (src instanceof ArrayBuffer) blob = new Blob([src], { type: mime ?? "application/octet-stream" });
+	else {
+		const copy = new Uint8Array(src.byteLength);
+		copy.set(src);
+		blob = new Blob([copy.buffer], { type: mime ?? "application/octet-stream" });
+	}
+	const url = URL.createObjectURL(blob);
+	return {
+		url,
+		revoke: () => URL.revokeObjectURL(url)
+	};
+}
+/**
+* RFC-4180 子集 CSV 解析：支持 "" 转义、\r\n 与 \n 换行、, 分隔。
+* 为性能起见采用状态机而非 split。
+*/
+function parseCsv(text) {
+	const rows = [];
+	let row = [];
+	let field = "";
+	let inQuotes = false;
+	const len = text.length;
+	for (let i = 0; i < len; i++) {
+		const ch = text[i];
+		if (inQuotes) {
+			if (ch === "\"") if (text[i + 1] === "\"") {
+				field += "\"";
+				i++;
+			} else inQuotes = false;
+			else field += ch;
+			continue;
+		}
+		if (ch === "\"") inQuotes = true;
+		else if (ch === ",") {
+			row.push(field);
+			field = "";
+		} else if (ch === "\n") {
+			row.push(field);
+			rows.push(row);
+			row = [];
+			field = "";
+		} else if (ch === "\r") {} else field += ch;
+	}
+	if (field.length > 0 || row.length > 0) {
+		row.push(field);
+		rows.push(row);
+	}
+	return rows;
+}
+function formatBytes(bytes) {
+	if (bytes === void 0 || bytes === null || Number.isNaN(bytes)) return "-";
+	if (bytes < 1024) return `${bytes} B`;
+	const units = [
+		"KB",
+		"MB",
+		"GB",
+		"TB"
+	];
+	let v = bytes / 1024;
+	let i = 0;
+	while (v >= 1024 && i < units.length - 1) {
+		v /= 1024;
+		i++;
+	}
+	return `${v.toFixed(v >= 10 ? 0 : 1)} ${units[i]}`;
+}
+/** 触发浏览器下载 */
+async function downloadFile(file) {
+	let href;
+	let revoke;
+	if (typeof file.src === "string") href = file.src;
+	else {
+		const url = toBlobUrl(file.src, file.mime);
+		href = url.url;
+		revoke = url.revoke;
+	}
+	const a = document.createElement("a");
+	a.href = href;
+	a.download = file.name;
+	a.rel = "noopener";
+	a.style.display = "none";
+	document.body.appendChild(a);
+	a.click();
+	document.body.removeChild(a);
+	if (revoke) setTimeout(revoke, 4e3);
+}
+//#endregion
+export { FILE_VIEWER_KIND_LABEL, downloadFile, formatBytes, getExtension, inferKind, parseCsv, toArrayBuffer, toBlobUrl };
+
+//# sourceMappingURL=helper.js.map

package/dist/components/file-viewer/helper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helper.js","names":[],"sources":["../../../src/components/file-viewer/helper.ts"],"sourcesContent":["import type { FileViewerItem, FileViewerKind } from '../../types/file-viewer'\n\nconst IMAGE_EXTS = new Set(['png', 'jpg', 'jpeg', 'gif', 'webp', 'bmp', 'svg', 'avif', 'ico'])\n\nconst VIDEO_EXTS = new Set(['mp4', 'webm', 'mov', 'm4v', 'ogv', 'mkv'])\n\nconst SHEET_EXTS = new Set(['xlsx', 'xlsm', 'xlsb', 'csv'])\n\nconst TEXT_EXTS = new Set([\n  'txt',\n  'log',\n  'md',\n  'markdown',\n  'json',\n  'yml',\n  'yaml',\n  'xml',\n  'js',\n  'ts',\n  'tsx',\n  'jsx',\n  'css',\n  'scss',\n  'sass',\n  'less',\n  'html',\n  'htm',\n  'ini',\n  'toml',\n  'sh',\n  'bash',\n  'zsh',\n  'env',\n  'sql'\n])\n\nexport function getExtension(name: string): string {\n  const idx = name.lastIndexOf('.')\n  return idx === -1 ? '' : name.slice(idx + 1).toLowerCase()\n}\n\nexport function inferKind(name: string, explicit?: FileViewerKind): FileViewerKind {\n  if (explicit) return explicit\n  const ext = getExtension(name)\n  if (IMAGE_EXTS.has(ext)) return 'image'\n  if (VIDEO_EXTS.has(ext)) return 'video'\n  if (ext === 'pdf') return 'pdf'\n  if (SHEET_EXTS.has(ext)) return 'sheet'\n  if (ext === 'docx') return 'docx'\n  if (TEXT_EXTS.has(ext)) return 'text'\n  return 'text'\n}\n\nexport const FILE_VIEWER_KIND_LABEL: Record<FileViewerKind, string> = {\n  image: 'IMG',\n  video: 'MP4',\n  pdf: 'PDF',\n  sheet: 'XLS',\n  docx: 'DOC',\n  text: 'TXT'\n}\n\n/** 规范化数据源为 ArrayBuffer，可被 AbortController 中断（仅 URL fetch 场景生效） */\nexport async function toArrayBuffer(\n  src: FileViewerItem['src'],\n  signal?: AbortSignal\n): Promise<ArrayBuffer> {\n  if (typeof src === 'string') {\n    const res = await fetch(src, { signal })\n    if (!res.ok) {\n      throw new Error(`Fetch failed: ${res.status} ${res.statusText}`)\n    }\n    return await res.arrayBuffer()\n  }\n  if (src instanceof ArrayBuffer) return src\n  if (src instanceof Uint8Array) {\n    // 复制底层以切断共享引用，防止外部修改影响预览\n    return src.slice().buffer as ArrayBuffer\n  }\n  // File/Blob\n  return await src.arrayBuffer()\n}\n\n/** 返回用于 <img> / <video> 等标签 src 的 URL；二进制会创建 ObjectURL 并返回 revoke 钩子 */\nexport function toBlobUrl(\n  src: FileViewerItem['src'],\n  mime?: string\n): { url: string; revoke: () => void } {\n  if (typeof src === 'string') {\n    return { url: src, revoke: () => {} }\n  }\n  let blob: Blob\n  if (src instanceof Blob) {\n    blob = src\n  } else if (src instanceof ArrayBuffer) {\n    blob = new Blob([src], { type: mime ?? 'application/octet-stream' })\n  } else {\n    // Uint8Array: 复制到新的 ArrayBuffer，避免与外部共享底层\n    const copy = new Uint8Array(src.byteLength)\n    copy.set(src)\n    blob = new Blob([copy.buffer], { type: mime ?? 'application/octet-stream' })\n  }\n  const url = URL.createObjectURL(blob)\n  return { url, revoke: () => URL.revokeObjectURL(url) }\n}\n\n/**\n * RFC-4180 子集 CSV 解析：支持 \"\" 转义、\\r\\n 与 \\n 换行、, 分隔。\n * 为性能起见采用状态机而非 split。\n */\nexport function parseCsv(text: string): string[][] {\n  const rows: string[][] = []\n  let row: string[] = []\n  let field = ''\n  let inQuotes = false\n  const len = text.length\n\n  for (let i = 0; i < len; i++) {\n    const ch = text[i]\n\n    if (inQuotes) {\n      if (ch === '\"') {\n        if (text[i + 1] === '\"') {\n          field += '\"'\n          i++\n        } else {\n          inQuotes = false\n        }\n      } else {\n        field += ch\n      }\n      continue\n    }\n\n    if (ch === '\"') {\n      inQuotes = true\n    } else if (ch === ',') {\n      row.push(field)\n      field = ''\n    } else if (ch === '\\n') {\n      row.push(field)\n      rows.push(row)\n      row = []\n      field = ''\n    } else if (ch === '\\r') {\n      // swallow CR; LF will commit the row\n    } else {\n      field += ch\n    }\n  }\n\n  // 最后一行\n  if (field.length > 0 || row.length > 0) {\n    row.push(field)\n    rows.push(row)\n  }\n  return rows\n}\n\nexport function formatBytes(bytes?: number): string {\n  if (bytes === undefined || bytes === null || Number.isNaN(bytes)) return '-'\n  if (bytes < 1024) return `${bytes} B`\n  const units = ['KB', 'MB', 'GB', 'TB']\n  let v = bytes / 1024\n  let i = 0\n  while (v >= 1024 && i < units.length - 1) {\n    v /= 1024\n    i++\n  }\n  return `${v.toFixed(v >= 10 ? 0 : 1)} ${units[i]}`\n}\n\n/** 触发浏览器下载 */\nexport async function downloadFile(file: FileViewerItem): Promise<void> {\n  let href: string\n  let revoke: (() => void) | undefined\n  if (typeof file.src === 'string') {\n    href = file.src\n  } else {\n    const url = toBlobUrl(file.src, file.mime)\n    href = url.url\n    revoke = url.revoke\n  }\n  const a = document.createElement('a')\n  a.href = href\n  a.download = file.name\n  a.rel = 'noopener'\n  a.style.display = 'none'\n  document.body.appendChild(a)\n  a.click()\n  document.body.removeChild(a)\n  if (revoke) setTimeout(revoke, 4000)\n}\n"],"mappings":"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"}

package/dist/components/file-viewer/index.d.ts

@@ -0,0 +1 @@
+import { _default } from "./file-viewer.vue.js";

package/dist/components/file-viewer/previewers/docx-previewer.js

@@ -0,0 +1,76 @@
+import _sfc_main$1 from "../../scroll/scroll.js";
+import { createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, onBeforeUnmount, openBlock, ref, unref, useTemplateRef, watch, withCtx } from "vue";
+import { bem } from "@veltra/utils";
+//#region src/components/file-viewer/previewers/docx-previewer.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "FileViewerDocxPreviewer",
+	__name: "docx-previewer",
+	props: { file: {} },
+	emits: ["error"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const cls = bem("file-viewer");
+		const container = useTemplateRef("container");
+		const loading = ref(true);
+		let controller;
+		async function load() {
+			controller?.abort();
+			controller = new AbortController();
+			const signal = controller.signal;
+			loading.value = true;
+			try {
+				const [{ toArrayBuffer }, docx] = await Promise.all([import("../helper.js"), import("docx-preview")]);
+				const buf = await toArrayBuffer(props.file.src, signal);
+				if (signal.aborted) return;
+				const el = container.value;
+				if (!el) return;
+				el.innerHTML = "";
+				await docx.renderAsync(buf, el, void 0, {
+					className: "u-file-viewer__docx-doc",
+					inWrapper: true,
+					ignoreWidth: false,
+					ignoreHeight: false,
+					ignoreFonts: false,
+					breakPages: true,
+					experimental: false,
+					useBase64URL: false,
+					renderChanges: false,
+					renderHeaders: true,
+					renderFooters: true,
+					renderFootnotes: true
+				});
+			} catch (err) {
+				if (err?.name === "AbortError") return;
+				emit("error", err);
+			} finally {
+				loading.value = false;
+			}
+		}
+		watch(() => props.file, () => load(), { immediate: true });
+		onBeforeUnmount(() => {
+			controller?.abort();
+			if (container.value) container.value.innerHTML = "";
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(_sfc_main$1), {
+				tag: "div",
+				class: normalizeClass(unref(cls).e("docx"))
+			}, {
+				default: withCtx(() => [createElementVNode("div", {
+					ref_key: "container",
+					ref: container,
+					class: normalizeClass(unref(cls).e("docx-body"))
+				}, null, 2), loading.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(unref(cls).e("loading"))
+				}, "加载中…", 2)) : createCommentVNode("v-if", true)]),
+				_: 1
+			}, 8, ["class"]);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=docx-previewer.js.map

package/dist/components/file-viewer/previewers/docx-previewer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"docx-previewer.js","names":[],"sources":["../../../../src/components/file-viewer/previewers/docx-previewer.vue"],"sourcesContent":["<template>\n  <u-scroll tag=\"div\" :class=\"cls.e('docx')\">\n    <div ref=\"container\" :class=\"cls.e('docx-body')\" />\n    <div v-if=\"loading\" :class=\"cls.e('loading')\">加载中…</div>\n  </u-scroll>\n</template>\n\n<script lang=\"ts\" setup>\nimport { bem } from '@veltra/utils'\nimport { onBeforeUnmount, ref, useTemplateRef, watch } from 'vue'\n\nimport type { FileViewerItem } from '../../../types/file-viewer'\nimport { UScroll } from '../../scroll'\n\ndefineOptions({ name: 'FileViewerDocxPreviewer' })\n\nconst props = defineProps<{ file: FileViewerItem }>()\n\nconst emit = defineEmits<{ (e: 'error', err: unknown): void }>()\n\nconst cls = bem('file-viewer')\n\nconst container = useTemplateRef<HTMLDivElement>('container')\nconst loading = ref(true)\n\nlet controller: AbortController | undefined\n\nasync function load() {\n  controller?.abort()\n  controller = new AbortController()\n  const signal = controller.signal\n  loading.value = true\n\n  try {\n    const [{ toArrayBuffer }, docx] = await Promise.all([\n      import('../helper'),\n      import('docx-preview')\n    ])\n\n    const buf = await toArrayBuffer(props.file.src, signal)\n    if (signal.aborted) return\n    const el = container.value\n    if (!el) return\n    el.innerHTML = ''\n\n    await docx.renderAsync(buf, el, undefined, {\n      className: 'u-file-viewer__docx-doc',\n      inWrapper: true,\n      ignoreWidth: false,\n      ignoreHeight: false,\n      ignoreFonts: false,\n      breakPages: true,\n      experimental: false,\n      useBase64URL: false,\n      renderChanges: false,\n      renderHeaders: true,\n      renderFooters: true,\n      renderFootnotes: true\n    })\n  } catch (err) {\n    if ((err as { name?: string })?.name === 'AbortError') return\n    emit('error', err)\n  } finally {\n    loading.value = false\n  }\n}\n\nwatch(\n  () => props.file,\n  () => load(),\n  { immediate: true }\n)\n\nonBeforeUnmount(() => {\n  controller?.abort()\n  if (container.value) container.value.innerHTML = ''\n})\n</script>\n"],"mappings":";;;;;;;;;;EAgBA,MAAM,QAAQ;EAEd,MAAM,OAAO;EAEb,MAAM,MAAM,IAAI,cAAa;EAE7B,MAAM,YAAY,eAA+B,YAAW;EAC5D,MAAM,UAAU,IAAI,KAAI;EAExB,IAAI;EAEJ,eAAe,OAAO;AACpB,eAAY,OAAM;AAClB,gBAAa,IAAI,iBAAgB;GACjC,MAAM,SAAS,WAAW;AAC1B,WAAQ,QAAQ;AAEhB,OAAI;IACF,MAAM,CAAC,EAAE,iBAAiB,QAAQ,MAAM,QAAQ,IAAI,CAClD,OAAO,iBACP,OAAO,gBACR,CAAA;IAED,MAAM,MAAM,MAAM,cAAc,MAAM,KAAK,KAAK,OAAM;AACtD,QAAI,OAAO,QAAS;IACpB,MAAM,KAAK,UAAU;AACrB,QAAI,CAAC,GAAI;AACT,OAAG,YAAY;AAEf,UAAM,KAAK,YAAY,KAAK,IAAI,KAAA,GAAW;KACzC,WAAW;KACX,WAAW;KACX,aAAa;KACb,cAAc;KACd,aAAa;KACb,YAAY;KACZ,cAAc;KACd,cAAc;KACd,eAAe;KACf,eAAe;KACf,eAAe;KACf,iBAAiB;KAClB,CAAA;YACM,KAAK;AACZ,QAAK,KAA2B,SAAS,aAAc;AACvD,SAAK,SAAS,IAAG;aACT;AACR,YAAQ,QAAQ;;;AAIpB,cACQ,MAAM,YACN,MAAM,EACZ,EAAE,WAAW,MAAK,CACpB;AAEA,wBAAsB;AACpB,eAAY,OAAM;AAClB,OAAI,UAAU,MAAO,WAAU,MAAM,YAAY;IAClD;;uBA3EC,YAGW,MAAA,YAAA,EAAA;IAHD,KAAI;IAAO,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA;;2BACoB,CAAnD,mBAAmD,OAAA;cAA1C;KAAJ,KAAI;KAAa,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,YAAA,CAAA;iBACvB,QAAA,SAAA,WAAA,EAAX,mBAAwD,OAAA;;KAAnC,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,UAAA,CAAA;OAAa,QAAI,EAAA,IAAA,mBAAA,QAAA,KAAA,CAAA,CAAA"}