@eternalheart/vue-file-preview 1.3.6 → 1.3.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/FilePreviewContent.vue.d.ts.map +1 -1
- package/lib/FilePreviewEmbed.vue.d.ts.map +1 -1
- package/lib/FilePreviewModal.vue.d.ts.map +1 -1
- package/lib/chunks/index-5Smm2vx0.mjs +77 -0
- package/lib/chunks/index-5Smm2vx0.mjs.map +1 -0
- package/lib/chunks/index-BCkcZs4y.mjs +84 -0
- package/lib/chunks/index-BCkcZs4y.mjs.map +1 -0
- package/lib/chunks/index-BM9FaQUl.mjs +134 -0
- package/lib/chunks/index-BM9FaQUl.mjs.map +1 -0
- package/lib/chunks/index-BYzQg-jL.mjs +152 -0
- package/lib/chunks/index-BYzQg-jL.mjs.map +1 -0
- package/lib/chunks/index-BoL1b2w-.mjs +129 -0
- package/lib/chunks/index-BoL1b2w-.mjs.map +1 -0
- package/lib/chunks/index-Bri7VeRx.mjs +203 -0
- package/lib/chunks/index-Bri7VeRx.mjs.map +1 -0
- package/lib/chunks/index-C324a7kV.mjs +2017 -0
- package/lib/chunks/index-C324a7kV.mjs.map +1 -0
- package/lib/chunks/index-C7uOM7XL.mjs +139 -0
- package/lib/chunks/index-C7uOM7XL.mjs.map +1 -0
- package/lib/chunks/index-CTsscgqY.mjs +136 -0
- package/lib/chunks/index-CTsscgqY.mjs.map +1 -0
- package/lib/chunks/index-Ch7AEfnk.mjs +116 -0
- package/lib/chunks/index-Ch7AEfnk.mjs.map +1 -0
- package/lib/chunks/index-D9wf6m37.mjs +249 -0
- package/lib/chunks/index-D9wf6m37.mjs.map +1 -0
- package/lib/chunks/index-DAEQe-RI.mjs +111 -0
- package/lib/chunks/index-DAEQe-RI.mjs.map +1 -0
- package/lib/chunks/index-DAo-7spn.mjs +103 -0
- package/lib/chunks/index-DAo-7spn.mjs.map +1 -0
- package/lib/chunks/index-DXlcF1Dk.mjs +113 -0
- package/lib/chunks/index-DXlcF1Dk.mjs.map +1 -0
- package/lib/chunks/index-ELyTQZeF.mjs +281 -0
- package/lib/chunks/index-ELyTQZeF.mjs.map +1 -0
- package/lib/chunks/index-cZn4ih-x.mjs +111 -0
- package/lib/chunks/index-cZn4ih-x.mjs.map +1 -0
- package/lib/chunks/index-dzB4jd9b.mjs +353 -0
- package/lib/chunks/index-dzB4jd9b.mjs.map +1 -0
- package/lib/chunks/index-lHlugUBI.mjs +391 -0
- package/lib/chunks/index-lHlugUBI.mjs.map +1 -0
- package/lib/composables/useResolvedTheme.d.ts +15 -0
- package/lib/composables/useResolvedTheme.d.ts.map +1 -0
- package/lib/index.cjs +24 -499
- package/lib/index.cjs.map +1 -1
- package/lib/index.css +1 -1
- package/lib/index.mjs +12 -44597
- package/lib/index.mjs.map +1 -1
- package/lib/renderers/Audio/index.vue.d.ts.map +1 -1
- package/lib/renderers/Csv/index.vue.d.ts.map +1 -1
- package/lib/renderers/Json/index.vue.d.ts.map +1 -1
- package/lib/renderers/Markdown/index.vue.d.ts.map +1 -1
- package/lib/renderers/Pptx/index.vue.d.ts.map +1 -1
- package/lib/renderers/RendererLoading.vue.d.ts +3 -0
- package/lib/renderers/RendererLoading.vue.d.ts.map +1 -0
- package/lib/renderers/Text/index.vue.d.ts.map +1 -1
- package/lib/renderers/Video/index.vue.d.ts.map +1 -1
- package/lib/renderers/Xlsx/index.vue.d.ts.map +1 -1
- package/lib/renderers/Xml/index.vue.d.ts.map +1 -1
- package/lib/renderers/Zip/index.vue.d.ts.map +1 -1
- package/lib/renderers/lazy.d.ts +19 -0
- package/lib/renderers/lazy.d.ts.map +1 -0
- package/package.json +2 -2
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
import { defineComponent as T, ref as x, onMounted as D, watch as z, onBeforeUnmount as M, openBlock as u, createElementBlock as c, createElementVNode as f, toDisplayString as w, unref as b, createCommentVNode as g, createVNode as N, normalizeStyle as S } from "vue";
|
|
2
|
+
import { FileSpreadsheet as C } from "lucide-vue-next";
|
|
3
|
+
import H from "x-data-spreadsheet";
|
|
4
|
+
/* empty css */
|
|
5
|
+
import { u as R, h as V, g as W, m as j, k as B } from "./index-C324a7kV.mjs";
|
|
6
|
+
const E = { class: "vfp-relative vfp-flex vfp-flex-col vfp-items-center vfp-w-full vfp-h-full" }, F = {
|
|
7
|
+
key: 0,
|
|
8
|
+
class: "vfp-absolute vfp-inset-0 vfp-flex vfp-items-center vfp-justify-center vfp-bg-surface-toolbar vfp-backdrop-blur-sm vfp-z-10"
|
|
9
|
+
}, L = { class: "vfp-text-center" }, O = { class: "vfp-text-xs md:vfp-text-sm vfp-text-fg-secondary vfp-font-medium" }, q = {
|
|
10
|
+
key: 1,
|
|
11
|
+
class: "vfp-absolute vfp-inset-0 vfp-flex vfp-items-center vfp-justify-center vfp-bg-surface-toolbar vfp-backdrop-blur-sm vfp-z-10"
|
|
12
|
+
}, A = { class: "vfp-text-center vfp-max-w-sm md:vfp-max-w-md vfp-px-4" }, G = { class: "vfp-w-24 vfp-h-24 md:vfp-w-32 md:vfp-h-32 vfp-mx-auto vfp-mb-4 md:vfp-mb-6 vfp-rounded-2xl md:vfp-rounded-3xl vfp-bg-gradient-to-br vfp-from-green-500 vfp-via-emerald-500 vfp-to-teal-500 vfp-flex vfp-items-center vfp-justify-center vfp-shadow-2xl" }, I = { class: "vfp-text-lg md:vfp-text-xl vfp-text-fg-primary vfp-mb-2 md:vfp-mb-3 vfp-font-medium" }, U = { class: "vfp-text-xs md:vfp-text-sm vfp-text-fg-tertiary vfp-mb-4 md:vfp-mb-6" }, Y = /* @__PURE__ */ T({
|
|
13
|
+
__name: "index",
|
|
14
|
+
props: {
|
|
15
|
+
url: {},
|
|
16
|
+
fileName: {}
|
|
17
|
+
},
|
|
18
|
+
setup(k) {
|
|
19
|
+
const a = k, { t: m } = R(), n = x(!0), r = x(null), s = x(null);
|
|
20
|
+
let i = null, v = null, o = null, p = { width: 0, height: 0 };
|
|
21
|
+
const h = () => {
|
|
22
|
+
if (!s.value) return { width: 800, height: 600 };
|
|
23
|
+
const t = s.value.clientWidth, e = s.value.clientHeight, l = t > 100 ? t : 800, d = e > 100 ? e : 600;
|
|
24
|
+
return { width: l, height: d };
|
|
25
|
+
}, _ = () => {
|
|
26
|
+
if (!s.value || !i) return;
|
|
27
|
+
s.value.innerHTML = "";
|
|
28
|
+
const { width: t, height: e } = h(), l = t < 640;
|
|
29
|
+
new H(s.value, {
|
|
30
|
+
mode: "read",
|
|
31
|
+
showToolbar: !1,
|
|
32
|
+
showContextmenu: !1,
|
|
33
|
+
showGrid: !0,
|
|
34
|
+
row: {
|
|
35
|
+
len: 100,
|
|
36
|
+
height: 25
|
|
37
|
+
},
|
|
38
|
+
col: {
|
|
39
|
+
len: 26,
|
|
40
|
+
width: l ? 80 : 100,
|
|
41
|
+
indexWidth: l ? 40 : 60,
|
|
42
|
+
minWidth: l ? 40 : 60
|
|
43
|
+
},
|
|
44
|
+
view: {
|
|
45
|
+
height: () => e,
|
|
46
|
+
width: () => t
|
|
47
|
+
}
|
|
48
|
+
}).loadData(i);
|
|
49
|
+
}, y = async () => {
|
|
50
|
+
if (s.value) {
|
|
51
|
+
n.value = !0, r.value = null;
|
|
52
|
+
try {
|
|
53
|
+
const t = await V(a.url), e = W(t, { delimiter: j(a.fileName) });
|
|
54
|
+
i = B(e.header, e.rows, a.fileName), _(), n.value = !1;
|
|
55
|
+
} catch (t) {
|
|
56
|
+
console.error("CSV 解析错误:", t), r.value = m.value("csv.load_failed"), n.value = !1;
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
};
|
|
60
|
+
return D(() => {
|
|
61
|
+
if (!s.value) return;
|
|
62
|
+
let t = !0;
|
|
63
|
+
v = new ResizeObserver(() => {
|
|
64
|
+
if (t) {
|
|
65
|
+
t = !1, p = h();
|
|
66
|
+
return;
|
|
67
|
+
}
|
|
68
|
+
const e = h(), l = Math.abs(p.width - e.width), d = Math.abs(p.height - e.height);
|
|
69
|
+
l < 10 && d < 10 || (p = e, o !== null && clearTimeout(o), o = window.setTimeout(() => {
|
|
70
|
+
i && _();
|
|
71
|
+
}, 500));
|
|
72
|
+
}), v.observe(s.value), setTimeout(() => {
|
|
73
|
+
requestAnimationFrame(() => y());
|
|
74
|
+
}, 100);
|
|
75
|
+
}), z(
|
|
76
|
+
() => a.url,
|
|
77
|
+
() => {
|
|
78
|
+
y();
|
|
79
|
+
}
|
|
80
|
+
), M(() => {
|
|
81
|
+
v && v.disconnect(), o !== null && clearTimeout(o), i = null, s.value && (s.value.innerHTML = "");
|
|
82
|
+
}), (t, e) => (u(), c("div", E, [
|
|
83
|
+
n.value ? (u(), c("div", F, [
|
|
84
|
+
f("div", L, [
|
|
85
|
+
e[0] || (e[0] = f("div", { class: "vfp-w-10 vfp-h-10 md:vfp-w-12 md:vfp-h-12 vfp-mx-auto vfp-mb-3 vfp-border-4 vfp-border-line-strong vfp-border-t-spinner-head vfp-rounded-full vfp-animate-spin" }, null, -1)),
|
|
86
|
+
f("p", O, w(b(m)("csv.loading")), 1)
|
|
87
|
+
])
|
|
88
|
+
])) : g("", !0),
|
|
89
|
+
r.value && !n.value ? (u(), c("div", q, [
|
|
90
|
+
f("div", A, [
|
|
91
|
+
f("div", G, [
|
|
92
|
+
N(b(C), { class: "vfp-w-12 vfp-h-12 md:vfp-w-16 md:vfp-h-16 vfp-text-fg-primary" })
|
|
93
|
+
]),
|
|
94
|
+
f("p", I, w(b(m)("csv.load_failed")), 1),
|
|
95
|
+
f("p", U, w(r.value), 1)
|
|
96
|
+
])
|
|
97
|
+
])) : g("", !0),
|
|
98
|
+
r.value ? g("", !0) : (u(), c("div", {
|
|
99
|
+
key: 2,
|
|
100
|
+
ref_key: "containerRef",
|
|
101
|
+
ref: s,
|
|
102
|
+
class: "xlsx-spreadsheet-container vfp-w-full vfp-h-full",
|
|
103
|
+
style: S({ opacity: n.value ? 0 : 1 })
|
|
104
|
+
}, null, 4))
|
|
105
|
+
]));
|
|
106
|
+
}
|
|
107
|
+
});
|
|
108
|
+
export {
|
|
109
|
+
Y as default
|
|
110
|
+
};
|
|
111
|
+
//# sourceMappingURL=index-DAEQe-RI.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index-DAEQe-RI.mjs","sources":["../../src/renderers/Csv/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, watch, onMounted, onBeforeUnmount } from 'vue';\nimport { FileSpreadsheet } from 'lucide-vue-next';\nimport Spreadsheet from 'x-data-spreadsheet';\nimport 'x-data-spreadsheet/dist/xspreadsheet.css';\nimport {\n parseCsv,\n guessCsvDelimiter,\n fetchTextUtf8,\n convertCsvToSpreadsheetData,\n} from '@eternalheart/file-preview-core';\nimport { useTranslator } from '../../composables/useTranslator';\n\nconst props = defineProps<{\n url: string;\n fileName: string;\n}>();\n\nconst { t } = useTranslator();\n\nconst loading = ref(true);\nconst error = ref<string | null>(null);\nconst containerRef = ref<HTMLDivElement | null>(null);\nlet sheetData: Record<string, unknown>[] | null = null;\nlet resizeObserver: ResizeObserver | null = null;\nlet resizeTimeout: number | null = null;\nlet lastDimensions = { width: 0, height: 0 };\n\nconst calculateDimensions = () => {\n if (!containerRef.value) return { width: 800, height: 600 };\n const rawWidth = containerRef.value.clientWidth;\n const rawHeight = containerRef.value.clientHeight;\n const width = rawWidth > 100 ? rawWidth : 800;\n const height = rawHeight > 100 ? rawHeight : 600;\n return { width, height };\n};\n\nconst mountSpreadsheet = () => {\n if (!containerRef.value || !sheetData) return;\n\n containerRef.value.innerHTML = '';\n\n const { width, height } = calculateDimensions();\n const isMobile = width < 640;\n\n const s = new Spreadsheet(containerRef.value, {\n mode: 'read',\n showToolbar: false,\n showContextmenu: false,\n showGrid: true,\n row: {\n len: 100,\n height: 25,\n },\n col: {\n len: 26,\n width: isMobile ? 80 : 100,\n indexWidth: isMobile ? 40 : 60,\n minWidth: isMobile ? 40 : 60,\n },\n view: {\n height: () => height,\n width: () => width,\n },\n });\n\n s.loadData(sheetData as unknown as Record<string, unknown>);\n};\n\nconst loadCsv = async () => {\n if (!containerRef.value) return;\n\n loading.value = true;\n error.value = null;\n\n try {\n const text = await fetchTextUtf8(props.url);\n const parsed = parseCsv(text, { delimiter: guessCsvDelimiter(props.fileName) });\n const data = convertCsvToSpreadsheetData(parsed.header, parsed.rows, props.fileName);\n\n sheetData = data as unknown as Record<string, unknown>[];\n mountSpreadsheet();\n loading.value = false;\n } catch (err) {\n console.error('CSV 解析错误:', err);\n error.value = t.value('csv.load_failed');\n loading.value = false;\n }\n};\n\nonMounted(() => {\n if (!containerRef.value) return;\n\n let isInitialRender = true;\n\n resizeObserver = new ResizeObserver(() => {\n if (isInitialRender) {\n isInitialRender = false;\n lastDimensions = calculateDimensions();\n return;\n }\n\n const newDimensions = calculateDimensions();\n const widthDiff = Math.abs(lastDimensions.width - newDimensions.width);\n const heightDiff = Math.abs(lastDimensions.height - newDimensions.height);\n\n if (widthDiff < 10 && heightDiff < 10) return;\n\n lastDimensions = newDimensions;\n\n if (resizeTimeout !== null) clearTimeout(resizeTimeout);\n\n resizeTimeout = window.setTimeout(() => {\n if (sheetData) mountSpreadsheet();\n }, 500);\n });\n\n resizeObserver.observe(containerRef.value);\n\n setTimeout(() => {\n requestAnimationFrame(() => loadCsv());\n }, 100);\n});\n\nwatch(\n () => props.url,\n () => {\n loadCsv();\n }\n);\n\nonBeforeUnmount(() => {\n if (resizeObserver) resizeObserver.disconnect();\n if (resizeTimeout !== null) clearTimeout(resizeTimeout);\n sheetData = null;\n if (containerRef.value) containerRef.value.innerHTML = '';\n});\n</script>\n\n<template>\n <div class=\"vfp-relative vfp-flex vfp-flex-col vfp-items-center vfp-w-full vfp-h-full\">\n <div\n v-if=\"loading\"\n class=\"vfp-absolute vfp-inset-0 vfp-flex vfp-items-center vfp-justify-center vfp-bg-surface-toolbar vfp-backdrop-blur-sm vfp-z-10\"\n >\n <div class=\"vfp-text-center\">\n <div\n class=\"vfp-w-10 vfp-h-10 md:vfp-w-12 md:vfp-h-12 vfp-mx-auto vfp-mb-3 vfp-border-4 vfp-border-line-strong vfp-border-t-spinner-head vfp-rounded-full vfp-animate-spin\"\n />\n <p class=\"vfp-text-xs md:vfp-text-sm vfp-text-fg-secondary vfp-font-medium\">{{ t('csv.loading') }}</p>\n </div>\n </div>\n\n <div\n v-if=\"error && !loading\"\n class=\"vfp-absolute vfp-inset-0 vfp-flex vfp-items-center vfp-justify-center vfp-bg-surface-toolbar vfp-backdrop-blur-sm vfp-z-10\"\n >\n <div class=\"vfp-text-center vfp-max-w-sm md:vfp-max-w-md vfp-px-4\">\n <div\n class=\"vfp-w-24 vfp-h-24 md:vfp-w-32 md:vfp-h-32 vfp-mx-auto vfp-mb-4 md:vfp-mb-6 vfp-rounded-2xl md:vfp-rounded-3xl vfp-bg-gradient-to-br vfp-from-green-500 vfp-via-emerald-500 vfp-to-teal-500 vfp-flex vfp-items-center vfp-justify-center vfp-shadow-2xl\"\n >\n <FileSpreadsheet class=\"vfp-w-12 vfp-h-12 md:vfp-w-16 md:vfp-h-16 vfp-text-fg-primary\" />\n </div>\n <p class=\"vfp-text-lg md:vfp-text-xl vfp-text-fg-primary vfp-mb-2 md:vfp-mb-3 vfp-font-medium\">\n {{ t('csv.load_failed') }}\n </p>\n <p class=\"vfp-text-xs md:vfp-text-sm vfp-text-fg-tertiary vfp-mb-4 md:vfp-mb-6\">{{ error }}</p>\n </div>\n </div>\n\n <div\n v-if=\"!error\"\n ref=\"containerRef\"\n class=\"xlsx-spreadsheet-container vfp-w-full vfp-h-full\"\n :style=\"{ opacity: loading ? 0 : 1 }\"\n />\n </div>\n</template>\n"],"names":["props","__props","t","useTranslator","loading","ref","error","containerRef","sheetData","resizeObserver","resizeTimeout","lastDimensions","calculateDimensions","rawWidth","rawHeight","width","height","mountSpreadsheet","isMobile","Spreadsheet","loadCsv","text","fetchTextUtf8","parsed","parseCsv","guessCsvDelimiter","convertCsvToSpreadsheetData","err","onMounted","isInitialRender","newDimensions","widthDiff","heightDiff","watch","onBeforeUnmount","_openBlock","_createElementBlock","_hoisted_1","_hoisted_2","_createElementVNode","_hoisted_3","_hoisted_4","_toDisplayString","_unref","_hoisted_5","_hoisted_6","_hoisted_7","_createVNode","FileSpreadsheet","_hoisted_8","_hoisted_9"],"mappings":"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"}
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
import { defineComponent as G, ref as a, watch as y, nextTick as P, openBlock as i, createElementBlock as f, createElementVNode as s, toDisplayString as D, normalizeStyle as S, Fragment as L, renderList as M } from "vue";
|
|
2
|
+
import N from "mammoth";
|
|
3
|
+
import { u as $ } from "./index-C324a7kV.mjs";
|
|
4
|
+
const B = {
|
|
5
|
+
key: 0,
|
|
6
|
+
class: "vfp-flex vfp-items-center vfp-justify-center vfp-w-full vfp-h-full"
|
|
7
|
+
}, I = {
|
|
8
|
+
key: 1,
|
|
9
|
+
class: "vfp-flex vfp-items-center vfp-justify-center vfp-w-full vfp-h-full"
|
|
10
|
+
}, j = { class: "vfp-text-fg-secondary vfp-text-center" }, F = { class: "vfp-text-lg" }, C = {
|
|
11
|
+
key: 2,
|
|
12
|
+
class: "vfp-w-full vfp-h-full vfp-overflow-auto",
|
|
13
|
+
style: { background: "rgba(0, 0, 0, 0.15)" }
|
|
14
|
+
}, R = ["innerHTML"], q = ["innerHTML"], _ = 1123, x = 60, g = 50, z = 24, W = /* @__PURE__ */ G({
|
|
15
|
+
__name: "index",
|
|
16
|
+
props: {
|
|
17
|
+
url: {}
|
|
18
|
+
},
|
|
19
|
+
setup(w) {
|
|
20
|
+
const H = _ - x * 2, v = w, { t: k } = $(), n = a(""), p = a(!0), c = a(null), o = a([]), d = a(null), E = async () => {
|
|
21
|
+
p.value = !0, c.value = null, n.value = "", o.value = [];
|
|
22
|
+
try {
|
|
23
|
+
const t = await fetch(v.url);
|
|
24
|
+
if (!t.ok) throw new Error("文件加载失败");
|
|
25
|
+
const l = await t.arrayBuffer(), e = await N.convertToHtml({ arrayBuffer: l });
|
|
26
|
+
n.value = e.value;
|
|
27
|
+
} catch (t) {
|
|
28
|
+
console.error("Docx 解析错误:", t), c.value = k.value("docx.parse_failed");
|
|
29
|
+
} finally {
|
|
30
|
+
p.value = !1;
|
|
31
|
+
}
|
|
32
|
+
}, T = () => {
|
|
33
|
+
const t = d.value;
|
|
34
|
+
if (!t || !n.value) return;
|
|
35
|
+
const l = Array.from(t.children);
|
|
36
|
+
if (l.length === 0) {
|
|
37
|
+
o.value = [n.value];
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
const e = [[]];
|
|
41
|
+
let r = 0;
|
|
42
|
+
for (const u of l) {
|
|
43
|
+
const m = u.offsetHeight;
|
|
44
|
+
r > 0 && r + m > H && (e.push([]), r = 0), e[e.length - 1].push(u.outerHTML), r += m;
|
|
45
|
+
}
|
|
46
|
+
e.length === 0 && e.push([]), o.value = e.map((u) => u.join(""));
|
|
47
|
+
};
|
|
48
|
+
y(() => v.url, E, { immediate: !0 }), y(n, async () => {
|
|
49
|
+
n.value && (await P(), requestAnimationFrame(() => T()));
|
|
50
|
+
});
|
|
51
|
+
const h = {
|
|
52
|
+
fontFamily: "system-ui, -apple-system, sans-serif",
|
|
53
|
+
lineHeight: "1.8",
|
|
54
|
+
color: "#333"
|
|
55
|
+
}, b = {
|
|
56
|
+
...h,
|
|
57
|
+
position: "absolute",
|
|
58
|
+
visibility: "hidden",
|
|
59
|
+
width: `${794 - g * 2}px`,
|
|
60
|
+
pointerEvents: "none"
|
|
61
|
+
}, A = {
|
|
62
|
+
width: "100%",
|
|
63
|
+
maxWidth: "794px",
|
|
64
|
+
minHeight: `${_}px`,
|
|
65
|
+
background: "white",
|
|
66
|
+
boxShadow: "0 2px 12px rgba(0, 0, 0, 0.15)",
|
|
67
|
+
flexShrink: 0,
|
|
68
|
+
padding: `${x}px ${g}px`
|
|
69
|
+
};
|
|
70
|
+
return (t, l) => p.value ? (i(), f("div", B, [...l[0] || (l[0] = [
|
|
71
|
+
s("div", { class: "vfp-w-12 vfp-h-12 vfp-border-4 vfp-border-line-strong vfp-border-t-spinner-head vfp-rounded-full vfp-animate-spin" }, null, -1)
|
|
72
|
+
])])) : c.value ? (i(), f("div", I, [
|
|
73
|
+
s("div", j, [
|
|
74
|
+
s("p", F, D(c.value), 1)
|
|
75
|
+
])
|
|
76
|
+
])) : (i(), f("div", C, [
|
|
77
|
+
s("div", {
|
|
78
|
+
ref_key: "measureRef",
|
|
79
|
+
ref: d,
|
|
80
|
+
style: b,
|
|
81
|
+
innerHTML: n.value
|
|
82
|
+
}, null, 8, R),
|
|
83
|
+
s("div", {
|
|
84
|
+
class: "vfp-py-6 md:vfp-py-10 vfp-flex vfp-flex-col vfp-items-center",
|
|
85
|
+
style: S({ gap: `${z}px` })
|
|
86
|
+
}, [
|
|
87
|
+
(i(!0), f(L, null, M(o.value.length > 0 ? o.value : [""], (e, r) => (i(), f("div", {
|
|
88
|
+
key: r,
|
|
89
|
+
style: A
|
|
90
|
+
}, [
|
|
91
|
+
s("div", {
|
|
92
|
+
style: h,
|
|
93
|
+
innerHTML: e
|
|
94
|
+
}, null, 8, q)
|
|
95
|
+
]))), 128))
|
|
96
|
+
], 4)
|
|
97
|
+
]));
|
|
98
|
+
}
|
|
99
|
+
});
|
|
100
|
+
export {
|
|
101
|
+
W as default
|
|
102
|
+
};
|
|
103
|
+
//# sourceMappingURL=index-DAo-7spn.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index-DAo-7spn.mjs","sources":["../../src/renderers/Docx/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, watch, nextTick } from 'vue';\nimport mammoth from 'mammoth';\nimport { useTranslator } from '../../composables/useTranslator';\n\nconst PAGE_HEIGHT = 1123;\nconst PAGE_PADDING_Y = 60;\nconst PAGE_PADDING_X = 50;\nconst PAGE_CONTENT_HEIGHT = PAGE_HEIGHT - PAGE_PADDING_Y * 2;\nconst PAGE_GAP = 24;\n\nconst props = defineProps<{\n url: string;\n}>();\n\nconst { t } = useTranslator();\n\nconst html = ref('');\nconst loading = ref(true);\nconst error = ref<string | null>(null);\nconst pages = ref<string[]>([]);\nconst measureRef = ref<HTMLDivElement | null>(null);\n\nconst loadDocx = async () => {\n loading.value = true;\n error.value = null;\n html.value = '';\n pages.value = [];\n\n try {\n const response = await fetch(props.url);\n if (!response.ok) throw new Error('文件加载失败');\n const arrayBuffer = await response.arrayBuffer();\n const result = await mammoth.convertToHtml({ arrayBuffer });\n html.value = result.value;\n } catch (err) {\n console.error('Docx 解析错误:', err);\n error.value = t.value('docx.parse_failed');\n } finally {\n loading.value = false;\n }\n};\n\nconst paginate = () => {\n const container = measureRef.value;\n if (!container || !html.value) return;\n\n const children = Array.from(container.children) as HTMLElement[];\n if (children.length === 0) {\n pages.value = [html.value];\n return;\n }\n\n const result: string[][] = [[]];\n let currentPageUsed = 0;\n\n for (const child of children) {\n const h = child.offsetHeight;\n\n if (currentPageUsed > 0 && currentPageUsed + h > PAGE_CONTENT_HEIGHT) {\n result.push([]);\n currentPageUsed = 0;\n }\n\n result[result.length - 1].push(child.outerHTML);\n currentPageUsed += h;\n }\n\n if (result.length === 0) result.push([]);\n\n pages.value = result.map((blocks) => blocks.join(''));\n};\n\nwatch(() => props.url, loadDocx, { immediate: true });\n\nwatch(html, async () => {\n if (!html.value) return;\n await nextTick();\n requestAnimationFrame(() => paginate());\n});\n\nconst contentStyle = {\n fontFamily: 'system-ui, -apple-system, sans-serif',\n lineHeight: '1.8',\n color: '#333',\n};\n\nconst measureStyle = {\n ...contentStyle,\n position: 'absolute' as const,\n visibility: 'hidden' as const,\n width: `${794 - PAGE_PADDING_X * 2}px`,\n pointerEvents: 'none' as const,\n};\n\nconst pageStyle = {\n width: '100%',\n maxWidth: '794px',\n minHeight: `${PAGE_HEIGHT}px`,\n background: 'white',\n boxShadow: '0 2px 12px rgba(0, 0, 0, 0.15)',\n flexShrink: 0,\n padding: `${PAGE_PADDING_Y}px ${PAGE_PADDING_X}px`,\n};\n</script>\n\n<template>\n <div v-if=\"loading\" class=\"vfp-flex vfp-items-center vfp-justify-center vfp-w-full vfp-h-full\">\n <div\n class=\"vfp-w-12 vfp-h-12 vfp-border-4 vfp-border-line-strong vfp-border-t-spinner-head vfp-rounded-full vfp-animate-spin\"\n />\n </div>\n\n <div v-else-if=\"error\" class=\"vfp-flex vfp-items-center vfp-justify-center vfp-w-full vfp-h-full\">\n <div class=\"vfp-text-fg-secondary vfp-text-center\">\n <p class=\"vfp-text-lg\">{{ error }}</p>\n </div>\n </div>\n\n <div v-else class=\"vfp-w-full vfp-h-full vfp-overflow-auto\" style=\"background: rgba(0, 0, 0, 0.15)\">\n <!-- 隐藏测量区 -->\n <div ref=\"measureRef\" :style=\"measureStyle\" v-html=\"html\" />\n\n <!-- 实际页面 -->\n <div\n class=\"vfp-py-6 md:vfp-py-10 vfp-flex vfp-flex-col vfp-items-center\"\n :style=\"{ gap: `${PAGE_GAP}px` }\"\n >\n <div v-for=\"(pageHtml, i) in pages.length > 0 ? pages : ['']\" :key=\"i\" :style=\"pageStyle\">\n <div :style=\"contentStyle\" v-html=\"pageHtml\" />\n </div>\n </div>\n </div>\n</template>\n"],"names":["PAGE_HEIGHT","PAGE_PADDING_Y","PAGE_PADDING_X","PAGE_GAP","PAGE_CONTENT_HEIGHT","props","__props","t","useTranslator","html","ref","loading","error","pages","measureRef","loadDocx","response","arrayBuffer","result","mammoth","err","paginate","container","children","currentPageUsed","child","h","blocks","watch","nextTick","contentStyle","measureStyle","pageStyle","_openBlock","_createElementBlock","_hoisted_1","_cache","_createElementVNode","_hoisted_2","_hoisted_3","_hoisted_4","_toDisplayString","_hoisted_5","_Fragment","_renderList","pageHtml","i"],"mappings":"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"}
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import { defineComponent as x, ref as p, onMounted as g, watch as k, onBeforeUnmount as b, openBlock as a, createElementBlock as d, createElementVNode as t, toDisplayString as c, unref as m, createCommentVNode as w } from "vue";
|
|
2
|
+
import j from "video.js";
|
|
3
|
+
import { u as T, a as h } from "./index-C324a7kV.mjs";
|
|
4
|
+
const C = {
|
|
5
|
+
key: 0,
|
|
6
|
+
class: "vfp-flex vfp-items-center vfp-justify-center vfp-w-full vfp-h-full"
|
|
7
|
+
}, D = { class: "vfp-text-center" }, B = { class: "vfp-text-lg vfp-font-medium vfp-text-fg-primary vfp-mb-2" }, E = { class: "vfp-text-sm vfp-text-fg-tertiary" }, L = {
|
|
8
|
+
key: 1,
|
|
9
|
+
class: "vfp-flex vfp-items-center vfp-justify-center vfp-w-full vfp-h-full"
|
|
10
|
+
}, P = { class: "vfp-w-full vfp-h-full vfp-relative" }, V = {
|
|
11
|
+
key: 0,
|
|
12
|
+
class: "vfp-absolute vfp-inset-0 vfp-flex vfp-items-center vfp-justify-center vfp-bg-surface-3 vfp-backdrop-blur-sm vfp-z-10"
|
|
13
|
+
}, q = { class: "vfp-text-center" }, N = { class: "vfp-text-sm vfp-text-fg-secondary vfp-font-medium" }, A = /* @__PURE__ */ x({
|
|
14
|
+
__name: "index",
|
|
15
|
+
props: {
|
|
16
|
+
url: {}
|
|
17
|
+
},
|
|
18
|
+
setup(y) {
|
|
19
|
+
const o = y, { t: s } = T(), n = p(null), f = p(!0), v = p(null);
|
|
20
|
+
let e = null;
|
|
21
|
+
return g(() => {
|
|
22
|
+
if (!v.value || e) return;
|
|
23
|
+
const l = document.createElement("video-js");
|
|
24
|
+
l.classList.add("vjs-big-play-centered", "vjs-theme-apple"), v.value.appendChild(l);
|
|
25
|
+
const r = h(o.url), _ = r === "video/quicktime" ? [
|
|
26
|
+
{ src: o.url, type: "video/quicktime" },
|
|
27
|
+
{ src: o.url, type: "video/mp4" }
|
|
28
|
+
] : [{ src: o.url, type: r }];
|
|
29
|
+
e = j(l, {
|
|
30
|
+
controls: !0,
|
|
31
|
+
fill: !0,
|
|
32
|
+
preload: "auto",
|
|
33
|
+
controlBar: {
|
|
34
|
+
children: [
|
|
35
|
+
"playToggle",
|
|
36
|
+
"volumePanel",
|
|
37
|
+
"currentTimeDisplay",
|
|
38
|
+
"timeDivider",
|
|
39
|
+
"durationDisplay",
|
|
40
|
+
"progressControl",
|
|
41
|
+
"remainingTimeDisplay",
|
|
42
|
+
"fullscreenToggle"
|
|
43
|
+
],
|
|
44
|
+
volumePanel: {
|
|
45
|
+
inline: !1
|
|
46
|
+
}
|
|
47
|
+
},
|
|
48
|
+
html5: {
|
|
49
|
+
vhs: {
|
|
50
|
+
overrideNative: !0
|
|
51
|
+
},
|
|
52
|
+
nativeVideoTracks: !1,
|
|
53
|
+
nativeAudioTracks: !1,
|
|
54
|
+
nativeTextTracks: !1
|
|
55
|
+
},
|
|
56
|
+
sources: _
|
|
57
|
+
});
|
|
58
|
+
const u = e.el().querySelector("video");
|
|
59
|
+
u && (u.style.objectFit = "contain"), e.on("loadeddata", () => {
|
|
60
|
+
f.value = !1;
|
|
61
|
+
}), e.on("error", () => {
|
|
62
|
+
const i = e == null ? void 0 : e.error();
|
|
63
|
+
console.error("Video.js error:", i), n.value = s.value("video.load_failed_with_error", { error: (i == null ? void 0 : i.message) || s.value("common.unknown_error") }), f.value = !1;
|
|
64
|
+
});
|
|
65
|
+
}), k(
|
|
66
|
+
() => o.url,
|
|
67
|
+
() => {
|
|
68
|
+
e && !e.isDisposed() && e.src({ src: o.url, type: h(o.url) });
|
|
69
|
+
}
|
|
70
|
+
), b(() => {
|
|
71
|
+
e && !e.isDisposed() && (e.dispose(), e = null);
|
|
72
|
+
}), (l, r) => n.value ? (a(), d("div", C, [
|
|
73
|
+
t("div", D, [
|
|
74
|
+
r[0] || (r[0] = t("div", { class: "vfp-w-16 vfp-h-16 vfp-mx-auto vfp-mb-4 vfp-rounded-full vfp-bg-red-500/10 vfp-flex vfp-items-center vfp-justify-center" }, [
|
|
75
|
+
t("svg", {
|
|
76
|
+
class: "vfp-w-8 vfp-h-8 vfp-text-red-400",
|
|
77
|
+
fill: "none",
|
|
78
|
+
viewBox: "0 0 24 24",
|
|
79
|
+
stroke: "currentColor"
|
|
80
|
+
}, [
|
|
81
|
+
t("path", {
|
|
82
|
+
"stroke-linecap": "round",
|
|
83
|
+
"stroke-linejoin": "round",
|
|
84
|
+
"stroke-width": "2",
|
|
85
|
+
d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
|
|
86
|
+
})
|
|
87
|
+
])
|
|
88
|
+
], -1)),
|
|
89
|
+
t("p", B, c(m(s)("video.load_failed")), 1),
|
|
90
|
+
t("p", E, c(n.value), 1)
|
|
91
|
+
])
|
|
92
|
+
])) : (a(), d("div", L, [
|
|
93
|
+
t("div", P, [
|
|
94
|
+
f.value ? (a(), d("div", V, [
|
|
95
|
+
t("div", q, [
|
|
96
|
+
r[1] || (r[1] = t("div", { class: "vfp-w-12 vfp-h-12 vfp-mx-auto vfp-mb-3 vfp-border-4 vfp-border-line-strong vfp-border-t-spinner-head vfp-rounded-full vfp-animate-spin" }, null, -1)),
|
|
97
|
+
t("p", N, c(m(s)("video.loading")), 1)
|
|
98
|
+
])
|
|
99
|
+
])) : w("", !0),
|
|
100
|
+
t("div", {
|
|
101
|
+
ref_key: "videoContainerRef",
|
|
102
|
+
ref: v,
|
|
103
|
+
class: "vfp-overflow-hidden vfp-w-full vfp-h-full",
|
|
104
|
+
style: { "box-shadow": "0 20px 60px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.05)" }
|
|
105
|
+
}, null, 512)
|
|
106
|
+
])
|
|
107
|
+
]));
|
|
108
|
+
}
|
|
109
|
+
});
|
|
110
|
+
export {
|
|
111
|
+
A as default
|
|
112
|
+
};
|
|
113
|
+
//# sourceMappingURL=index-DXlcF1Dk.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index-DXlcF1Dk.mjs","sources":["../../src/renderers/Video/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, onMounted, onBeforeUnmount, watch } from 'vue';\nimport videojs from 'video.js';\nimport 'video.js/dist/video-js.css';\nimport { getVideoMimeType } from '@eternalheart/file-preview-core';\nimport { useTranslator } from '../../composables/useTranslator';\n\ntype VideoJsPlayer = ReturnType<typeof videojs>;\n\nconst props = defineProps<{\n url: string;\n}>();\n\nconst { t } = useTranslator();\n\nconst error = ref<string | null>(null);\nconst isLoading = ref(true);\nconst videoContainerRef = ref<HTMLDivElement | null>(null);\nlet player: VideoJsPlayer | null = null;\n\nconst initPlayer = () => {\n if (!videoContainerRef.value || player) return;\n\n const videoElement = document.createElement('video-js');\n videoElement.classList.add('vjs-big-play-centered', 'vjs-theme-apple');\n videoContainerRef.value.appendChild(videoElement);\n\n const videoType = getVideoMimeType(props.url);\n\n const sources =\n videoType === 'video/quicktime'\n ? [\n { src: props.url, type: 'video/quicktime' },\n { src: props.url, type: 'video/mp4' },\n ]\n : [{ src: props.url, type: videoType }];\n\n player = videojs(videoElement, {\n controls: true,\n fill: true,\n preload: 'auto',\n controlBar: {\n children: [\n 'playToggle',\n 'volumePanel',\n 'currentTimeDisplay',\n 'timeDivider',\n 'durationDisplay',\n 'progressControl',\n 'remainingTimeDisplay',\n 'fullscreenToggle',\n ],\n volumePanel: {\n inline: false,\n },\n },\n html5: {\n vhs: {\n overrideNative: true,\n },\n nativeVideoTracks: false,\n nativeAudioTracks: false,\n nativeTextTracks: false,\n },\n sources,\n });\n\n const videoEl = player.el().querySelector('video');\n if (videoEl) {\n (videoEl as HTMLVideoElement).style.objectFit = 'contain';\n }\n\n player.on('loadeddata', () => {\n isLoading.value = false;\n });\n\n player.on('error', () => {\n const err = player?.error();\n console.error('Video.js error:', err);\n error.value = t.value('video.load_failed_with_error', { error: err?.message || t.value('common.unknown_error') });\n isLoading.value = false;\n });\n};\n\nonMounted(initPlayer);\n\nwatch(\n () => props.url,\n () => {\n if (player && !player.isDisposed()) {\n player.src({ src: props.url, type: getVideoMimeType(props.url) });\n }\n }\n);\n\nonBeforeUnmount(() => {\n if (player && !player.isDisposed()) {\n player.dispose();\n player = null;\n }\n});\n</script>\n\n<template>\n <div v-if=\"error\" class=\"vfp-flex vfp-items-center vfp-justify-center vfp-w-full vfp-h-full\">\n <div class=\"vfp-text-center\">\n <div\n class=\"vfp-w-16 vfp-h-16 vfp-mx-auto vfp-mb-4 vfp-rounded-full vfp-bg-red-500/10 vfp-flex vfp-items-center vfp-justify-center\"\n >\n <svg\n class=\"vfp-w-8 vfp-h-8 vfp-text-red-400\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n stroke-width=\"2\"\n d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n />\n </svg>\n </div>\n <p class=\"vfp-text-lg vfp-font-medium vfp-text-fg-primary vfp-mb-2\">{{ t('video.load_failed') }}</p>\n <p class=\"vfp-text-sm vfp-text-fg-tertiary\">{{ error }}</p>\n </div>\n </div>\n\n <div v-else class=\"vfp-flex vfp-items-center vfp-justify-center vfp-w-full vfp-h-full\">\n <div class=\"vfp-w-full vfp-h-full vfp-relative\">\n <div\n v-if=\"isLoading\"\n class=\"vfp-absolute vfp-inset-0 vfp-flex vfp-items-center vfp-justify-center vfp-bg-surface-3 vfp-backdrop-blur-sm vfp-z-10\"\n >\n <div class=\"vfp-text-center\">\n <div\n class=\"vfp-w-12 vfp-h-12 vfp-mx-auto vfp-mb-3 vfp-border-4 vfp-border-line-strong vfp-border-t-spinner-head vfp-rounded-full vfp-animate-spin\"\n />\n <p class=\"vfp-text-sm vfp-text-fg-secondary vfp-font-medium\">{{ t('video.loading') }}</p>\n </div>\n </div>\n\n <div\n ref=\"videoContainerRef\"\n class=\"vfp-overflow-hidden vfp-w-full vfp-h-full\"\n style=\"box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.05)\"\n />\n </div>\n </div>\n</template>\n"],"names":["props","__props","t","useTranslator","error","ref","isLoading","videoContainerRef","player","onMounted","videoElement","videoType","getVideoMimeType","sources","videojs","videoEl","err","watch","onBeforeUnmount","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_hoisted_3","_toDisplayString","_unref","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9"],"mappings":";;;;;;;;;;;;;;;;;;AASA,UAAMA,IAAQC,GAIR,EAAE,GAAAC,EAAA,IAAMC,EAAA,GAERC,IAAQC,EAAmB,IAAI,GAC/BC,IAAYD,EAAI,EAAI,GACpBE,IAAoBF,EAA2B,IAAI;AACzD,QAAIG,IAA+B;AAkEnC,WAAAC,EAhEmB,MAAM;AACvB,UAAI,CAACF,EAAkB,SAASC,EAAQ;AAExC,YAAME,IAAe,SAAS,cAAc,UAAU;AACtD,MAAAA,EAAa,UAAU,IAAI,yBAAyB,iBAAiB,GACrEH,EAAkB,MAAM,YAAYG,CAAY;AAEhD,YAAMC,IAAYC,EAAiBZ,EAAM,GAAG,GAEtCa,IACJF,MAAc,oBACV;AAAA,QACE,EAAE,KAAKX,EAAM,KAAK,MAAM,kBAAA;AAAA,QACxB,EAAE,KAAKA,EAAM,KAAK,MAAM,YAAA;AAAA,MAAY,IAEtC,CAAC,EAAE,KAAKA,EAAM,KAAK,MAAMW,GAAW;AAE1C,MAAAH,IAASM,EAAQJ,GAAc;AAAA,QAC7B,UAAU;AAAA,QACV,MAAM;AAAA,QACN,SAAS;AAAA,QACT,YAAY;AAAA,UACV,UAAU;AAAA,YACR;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,UAEF,aAAa;AAAA,YACX,QAAQ;AAAA,UAAA;AAAA,QACV;AAAA,QAEF,OAAO;AAAA,UACL,KAAK;AAAA,YACH,gBAAgB;AAAA,UAAA;AAAA,UAElB,mBAAmB;AAAA,UACnB,mBAAmB;AAAA,UACnB,kBAAkB;AAAA,QAAA;AAAA,QAEpB,SAAAG;AAAA,MAAA,CACD;AAED,YAAME,IAAUP,EAAO,GAAA,EAAK,cAAc,OAAO;AACjD,MAAIO,MACDA,EAA6B,MAAM,YAAY,YAGlDP,EAAO,GAAG,cAAc,MAAM;AAC5B,QAAAF,EAAU,QAAQ;AAAA,MACpB,CAAC,GAEDE,EAAO,GAAG,SAAS,MAAM;AACvB,cAAMQ,IAAMR,KAAA,gBAAAA,EAAQ;AACpB,gBAAQ,MAAM,mBAAmBQ,CAAG,GACpCZ,EAAM,QAAQF,EAAE,MAAM,gCAAgC,EAAE,QAAOc,KAAA,gBAAAA,EAAK,YAAWd,EAAE,MAAM,sBAAsB,EAAA,CAAG,GAChHI,EAAU,QAAQ;AAAA,MACpB,CAAC;AAAA,IACH,CAEoB,GAEpBW;AAAA,MACE,MAAMjB,EAAM;AAAA,MACZ,MAAM;AACJ,QAAIQ,KAAU,CAACA,EAAO,gBACpBA,EAAO,IAAI,EAAE,KAAKR,EAAM,KAAK,MAAMY,EAAiBZ,EAAM,GAAG,GAAG;AAAA,MAEpE;AAAA,IAAA,GAGFkB,EAAgB,MAAM;AACpB,MAAIV,KAAU,CAACA,EAAO,iBACpBA,EAAO,QAAA,GACPA,IAAS;AAAA,IAEb,CAAC,aAIYJ,EAAA,SAAXe,EAAA,GAAAC,EAsBM,OAtBNC,GAsBM;AAAA,MArBJC,EAoBM,OApBNC,GAoBM;AAAA,wBAnBJD,EAgBM,OAAA,EAfJ,OAAM,4HAAwH;AAAA,UAE9HA,EAYM,OAAA;AAAA,YAXJ,OAAM;AAAA,YACN,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,QAAO;AAAA,UAAA;YAEPA,EAKE,QAAA;AAAA,cAJA,kBAAe;AAAA,cACf,mBAAgB;AAAA,cAChB,gBAAa;AAAA,cACb,GAAE;AAAA,YAAA;;;QAIRA,EAAoG,KAApGE,GAAoGC,EAA7BC,EAAAxB,CAAA,EAAC,mBAAA,CAAA,GAAA,CAAA;AAAA,QACxEoB,EAA2D,KAA3DK,GAA2DF,EAAZrB,EAAA,KAAK,GAAA,CAAA;AAAA,MAAA;WAIxDe,EAAA,GAAAC,EAoBM,OApBNQ,GAoBM;AAAA,MAnBJN,EAkBM,OAlBNO,GAkBM;AAAA,QAhBIvB,EAAA,SADRa,EAAA,GAAAC,EAUM,OAVNU,GAUM;AAAA,UANJR,EAKM,OALNS,GAKM;AAAA,4BAJJT,EAEE,OAAA,EADA,OAAM,yIAAA,GAAwI,MAAA,EAAA;AAAA,YAEhJA,EAAyF,KAAzFU,GAAyFP,EAAzBC,EAAAxB,CAAA,EAAC,eAAA,CAAA,GAAA,CAAA;AAAA,UAAA;;QAIrEoB,EAIE,OAAA;AAAA,mBAHI;AAAA,UAAJ,KAAIf;AAAA,UACJ,OAAM;AAAA,UACN,OAAA,EAAA,cAAA,sEAAA;AAAA,QAAA;;;;;"}
|