@l1yp/file-viewer 0.1.0

package/dist/components/DicomViewer.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,362 @@
+import { formatBytes as e } from "../lib/format.js";
+import { DicomError as t, readDicom as n } from "../lib/dicom.js";
+import { UnsupportedTransferSyntaxError as r, decodeDicomFrame as i, transferSyntaxName as a } from "../lib/dicomCodecs.js";
+import { autoWindow as o, buildFramePixels as s, renderToImageData as c } from "../lib/dicomRender.js";
+import { Fragment as l, computed as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, defineComponent as m, nextTick as ee, normalizeClass as h, onBeforeUnmount as te, onMounted as ne, openBlock as g, ref as _, renderList as v, toDisplayString as y, unref as re, vModelSelect as ie, vModelText as ae, watch as b, withDirectives as oe, withModifiers as se } from "vue";
+//#region src/components/DicomViewer.vue?vue&type=script&setup=true&lang.ts
+var ce = { class: "dv" }, le = {
+	key: 0,
+	class: "dv__msg"
+}, ue = {
+	key: 1,
+	class: "dv__msg dv__msg--error"
+}, de = ["href", "download"], fe = { class: "dv__bar" }, pe = { class: "dv__group" }, me = { class: "dv__zoom" }, he = { class: "dv__group" }, ge = ["disabled"], _e = ["disabled"], ve = {
+	key: 0,
+	class: "dv__decoding"
+}, ye = { class: "dv__meta-head" }, be = { class: "dv__meta-title" }, xe = { class: "dv__meta-label" }, Se = { class: "dv__meta-val" }, Ce = {
+	key: 0,
+	class: "dv__meta-empty"
+}, we = {
+	key: 0,
+	class: "dv__frames"
+}, Te = ["title"], Ee = ["disabled"], De = ["max"], Oe = ["disabled"], ke = { class: "dv__frameno" }, Ae = {
+	key: 1,
+	class: "dv__info"
+}, je = {
+	key: 0,
+	class: "dv__tag"
+}, Me = {
+	key: 1,
+	class: "dv__series"
+}, Ne = {
+	key: 2,
+	class: "dv__wl"
+}, Pe = { class: "dv__ts" }, Fe = { key: 3 }, Ie = ["title"], x = /*@__PURE__*/ m({
+	__name: "DicomViewer",
+	props: {
+		url: {},
+		name: {},
+		size: {},
+		slices: {},
+		start: {}
+	},
+	setup(m) {
+		let x = m, S = u(() => (x.slices?.length ?? 0) > 1), C = _("loading"), w = _(""), T = _(null), E = _(null), D = _(0), O = _(!1), k = /* @__PURE__ */ new Map(), A = _(!1), j = _(5), M = 0, N = 0, P = _(0), F = _(1), I = _(!1), L = _(1), R = 0, Le = 1, z = _(null), B = _(null), V = 1, H = u(() => T.value?.meta ?? null), U = _(!1), W = u(() => T.value?.tags ?? []), G = u(() => E.value?.mode === "gray"), K = u(() => S.value ? x.slices.length : H.value?.numberOfFrames ?? 1), Re = u(() => H.value ? a(H.value.transferSyntaxUid) : "");
+		async function q() {
+			C.value = "loading", w.value = "", T.value = null, E.value = null, L.value = 1, I.value = !1, U.value = !1, Q(), k.clear(), N++;
+			let e = S.value && x.start != null ? Math.min(Math.max(0, x.start), x.slices.length - 1) : 0;
+			D.value = e;
+			try {
+				if (!S.value) {
+					let e = await fetch(x.url ?? "");
+					if (!e.ok) throw Error(`HTTP ${e.status}`);
+					T.value = n(await e.arrayBuffer());
+				}
+				await Ve(e, !0) && He();
+			} catch (e) {
+				ze(e);
+			}
+		}
+		function ze(e) {
+			w.value = e instanceof t || e instanceof r || e instanceof Error ? e.message : String(e), C.value = "error";
+		}
+		async function Be(e) {
+			if (S.value) {
+				let t = n(await x.slices[e].load());
+				return T.value ??= t, s(await i(t.meta, t.frameBytes(0)), t.meta);
+			}
+			let t = T.value;
+			return s(await i(t.meta, t.frameBytes(e)), t.meta);
+		}
+		async function Ve(e, t) {
+			if (!S.value && !T.value) return !1;
+			let n = k.get(e);
+			if (!n) {
+				O.value = !0;
+				try {
+					n = await Be(e), k.set(e, n);
+				} catch (e) {
+					return ze(e), !1;
+				} finally {
+					O.value = !1;
+				}
+			}
+			if (e !== D.value) return !1;
+			E.value = n;
+			let r = T.value?.meta;
+			if (t && n.mode === "gray" && r) {
+				let e = r.windowCenter != null && r.windowWidth != null && r.windowWidth > 0 ? {
+					center: r.windowCenter,
+					width: r.windowWidth
+				} : o(n);
+				P.value = e.center, F.value = e.width, R = e.center, Le = e.width;
+			}
+			let i = C.value !== "ready";
+			return C.value = "ready", i && (await ee(), X()), Y(), !0;
+		}
+		async function He() {
+			let e = K.value;
+			if (e <= 1 || !S.value && !T.value) return;
+			let t = ++N;
+			for (let n = 0; n < e; n++) {
+				if (t !== N) return;
+				if (!k.has(n)) try {
+					let e = await Be(n);
+					if (t !== N) return;
+					k.set(n, e);
+				} catch {}
+				await new Promise((e) => setTimeout(e, 0));
+			}
+		}
+		let J = 0;
+		function Ue() {
+			J ||= requestAnimationFrame(() => {
+				J = 0, Y();
+			});
+		}
+		function Y() {
+			let e = E.value, t = z.value;
+			if (!e || !t) return;
+			t.width !== e.width && (t.width = e.width), t.height !== e.height && (t.height = e.height);
+			let n = t.getContext("2d");
+			if (!n) return;
+			let r = c(e, {
+				windowCenter: P.value,
+				windowWidth: F.value,
+				invert: I.value
+			});
+			n.putImageData(r, 0, 0), Z();
+		}
+		function X() {
+			let e = B.value, t = E.value;
+			if (!e || !t) return;
+			let n = Math.max(1, e.clientWidth - 24), r = Math.max(1, e.clientHeight - 24), i = Math.min(n / t.width, r / t.height);
+			V = Number.isFinite(i) && i > 0 ? i : 1;
+		}
+		function Z() {
+			let e = z.value, t = E.value;
+			if (!e || !t) return;
+			let n = V * L.value;
+			e.style.width = `${Math.max(1, Math.round(t.width * n))}px`, e.style.height = `${Math.max(1, Math.round(t.height * n))}px`;
+		}
+		function We(e) {
+			if (e.button !== 0 || !G.value) return;
+			e.preventDefault();
+			let t = e.currentTarget;
+			t.setPointerCapture(e.pointerId);
+			let n = e.clientX, r = e.clientY, i = F.value, a = P.value, o = E.value, s = o && o.maxValue - o.minValue || 255, c = Math.max(1, s / 512), l = (e) => {
+				F.value = Math.max(1, i + (e.clientX - n) * c), P.value = a + (e.clientY - r) * c, Ue();
+			}, u = (e) => {
+				t.releasePointerCapture(e.pointerId), t.removeEventListener("pointermove", l), t.removeEventListener("pointerup", u);
+			};
+			t.addEventListener("pointermove", l), t.addEventListener("pointerup", u);
+		}
+		function Ge(e) {
+			if (e.preventDefault(), K.value > 1 && !e.ctrlKey && !e.shiftKey) {
+				Q(), Ke(e.deltaY > 0 ? 1 : -1);
+				return;
+			}
+			let t = e.deltaY < 0 ? 1.12 : 1 / 1.12;
+			L.value = Math.min(20, Math.max(.1, L.value * t)), Z();
+		}
+		function Ke(e) {
+			let t = K.value;
+			t <= 1 || (D.value = Math.min(t - 1, Math.max(0, D.value + e)));
+		}
+		function qe() {
+			A.value ? Q() : Je();
+		}
+		function Je() {
+			if (K.value <= 1 || A.value) return;
+			A.value = !0;
+			let e = () => {
+				if (!A.value) return;
+				let t = K.value;
+				D.value = (D.value + 1) % t, M = window.setTimeout(e, Math.max(20, Math.round(1e3 / j.value)));
+			};
+			e();
+		}
+		function Q() {
+			A.value = !1, M &&= (clearTimeout(M), 0);
+		}
+		function Ye(e) {
+			L.value = Math.min(20, Math.max(.1, L.value * e)), Z();
+		}
+		function Xe() {
+			L.value = 1, X(), Z();
+		}
+		function Ze() {
+			L.value = 1, I.value = !1, E.value?.mode === "gray" && (P.value = R, F.value = Le), X(), Y();
+		}
+		b(D, (e) => {
+			C.value === "ready" && Ve(e, !1);
+		}), b(I, Ue);
+		let $ = null;
+		ne(() => {
+			q(), typeof ResizeObserver < "u" && B.value && ($ = new ResizeObserver(() => {
+				X(), Z();
+			}), $.observe(B.value));
+		}), b([() => x.url, () => x.slices], q), te(() => {
+			Q(), N++, J && cancelAnimationFrame(J), $?.disconnect();
+		});
+		let Qe = u(() => Math.round(P.value)), $e = u(() => Math.round(F.value)), et = u(() => `${Math.round(V * L.value * 100)}%`);
+		return (t, n) => (g(), f("div", ce, [C.value === "loading" ? (g(), f("p", le, "加载并解码 DICOM…")) : C.value === "error" ? (g(), f("div", ue, [
+			p("p", null, y(w.value), 1),
+			p("a", {
+				class: "dv__dl",
+				href: m.url,
+				download: m.name
+			}, "下载原文件", 8, de),
+			p("button", {
+				type: "button",
+				class: "dv__retry",
+				onClick: q
+			}, "重试")
+		])) : (g(), f(l, { key: 2 }, [
+			p("div", fe, [p("div", pe, [
+				p("button", {
+					type: "button",
+					class: "dv__btn",
+					title: "缩小",
+					onClick: n[0] ||= (e) => Ye(1 / 1.2)
+				}, "−"),
+				p("span", me, y(et.value), 1),
+				p("button", {
+					type: "button",
+					class: "dv__btn",
+					title: "放大",
+					onClick: n[1] ||= (e) => Ye(1.2)
+				}, "+"),
+				p("button", {
+					type: "button",
+					class: "dv__btn",
+					title: "适应窗口",
+					onClick: Xe
+				}, "适应")
+			]), p("div", he, [
+				p("button", {
+					type: "button",
+					class: h(["dv__btn", { "dv__btn--on": I.value }]),
+					disabled: !G.value,
+					title: "反相显示",
+					onClick: n[2] ||= (e) => I.value = !I.value
+				}, " 反相 ", 10, ge),
+				p("button", {
+					type: "button",
+					class: "dv__btn",
+					title: "重置窗位/缩放",
+					onClick: Ze
+				}, " 重置 "),
+				p("button", {
+					type: "button",
+					class: h(["dv__btn", { "dv__btn--on": U.value }]),
+					disabled: !W.value.length,
+					title: "DICOM 元数据",
+					onClick: n[3] ||= (e) => U.value = !U.value
+				}, " 信息 ", 10, _e)
+			])]),
+			p("div", {
+				ref_key: "stageRef",
+				ref: B,
+				class: "dv__stage",
+				onWheel: Ge
+			}, [
+				p("canvas", {
+					ref_key: "canvasRef",
+					ref: z,
+					class: h(["dv__canvas", { "dv__canvas--wl": G.value }]),
+					onPointerdown: We
+				}, null, 34),
+				O.value ? (g(), f("span", ve, "解码中…")) : d("", !0),
+				U.value ? (g(), f("div", {
+					key: 1,
+					class: "dv__meta",
+					onWheel: n[5] ||= se(() => {}, ["stop"])
+				}, [
+					p("div", ye, [n[10] ||= p("span", null, "DICOM 元数据", -1), p("button", {
+						type: "button",
+						class: "dv__meta-close",
+						title: "关闭",
+						onClick: n[4] ||= (e) => U.value = !1
+					}, " ✕ ")]),
+					(g(!0), f(l, null, v(W.value, (e) => (g(), f("div", {
+						key: e.title,
+						class: "dv__meta-group"
+					}, [p("h4", be, y(e.title), 1), (g(!0), f(l, null, v(e.rows, (e) => (g(), f("div", {
+						key: e.label,
+						class: "dv__meta-row"
+					}, [p("span", xe, y(e.label), 1), p("span", Se, y(e.value), 1)]))), 128))]))), 128)),
+					W.value.length ? d("", !0) : (g(), f("p", Ce, "无可显示的元数据"))
+				], 32)) : d("", !0)
+			], 544),
+			K.value > 1 ? (g(), f("div", we, [
+				p("button", {
+					type: "button",
+					class: h(["dv__btn", { "dv__btn--on": A.value }]),
+					title: A.value ? "暂停" : "播放（循环）",
+					onClick: qe
+				}, y(A.value ? "⏸" : "▶"), 11, Te),
+				oe(p("select", {
+					"onUpdate:modelValue": n[6] ||= (e) => j.value = e,
+					class: "dv__fps",
+					title: "播放速度（帧/秒）"
+				}, [...n[11] ||= [
+					p("option", { value: 5 }, "5 fps", -1),
+					p("option", { value: 10 }, "10 fps", -1),
+					p("option", { value: 15 }, "15 fps", -1),
+					p("option", { value: 24 }, "24 fps", -1)
+				]], 512), [[
+					ie,
+					j.value,
+					void 0,
+					{ number: !0 }
+				]]),
+				p("button", {
+					type: "button",
+					class: "dv__btn",
+					disabled: D.value <= 0,
+					onClick: n[7] ||= (e) => (Q(), D.value = Math.max(0, D.value - 1))
+				}, " ‹ ", 8, Ee),
+				oe(p("input", {
+					"onUpdate:modelValue": n[8] ||= (e) => D.value = e,
+					type: "range",
+					class: "dv__range",
+					min: "0",
+					max: K.value - 1,
+					step: "1",
+					onPointerdown: Q
+				}, null, 40, De), [[
+					ae,
+					D.value,
+					void 0,
+					{ number: !0 }
+				]]),
+				p("button", {
+					type: "button",
+					class: "dv__btn",
+					disabled: D.value >= K.value - 1,
+					onClick: n[9] ||= (e) => (Q(), D.value = Math.min(K.value - 1, D.value + 1))
+				}, " › ", 8, Oe),
+				p("span", ke, y(D.value + 1) + " / " + y(K.value), 1),
+				n[12] ||= p("span", { class: "dv__hint" }, "滚轮切换层面", -1)
+			])) : d("", !0),
+			H.value ? (g(), f("div", Ae, [
+				H.value.modality ? (g(), f("span", je, y(H.value.modality), 1)) : d("", !0),
+				S.value ? (g(), f("span", Me, "序列 · " + y(K.value) + " 层", 1)) : d("", !0),
+				p("span", null, y(H.value.columns) + "×" + y(H.value.rows), 1),
+				p("span", null, y(H.value.bitsStored) + "/" + y(H.value.bitsAllocated) + "-bit", 1),
+				p("span", null, y(H.value.photometric), 1),
+				G.value ? (g(), f("span", Ne, "窗位 C " + y(Qe.value) + " · W " + y($e.value), 1)) : d("", !0),
+				p("span", Pe, y(Re.value), 1),
+				x.size ? (g(), f("span", Fe, y(re(e)(x.size)), 1)) : d("", !0),
+				H.value.seriesDescription ? (g(), f("span", {
+					key: 4,
+					class: "dv__desc",
+					title: H.value.seriesDescription
+				}, y(H.value.seriesDescription), 9, Ie)) : d("", !0)
+			])) : d("", !0)
+		], 64))]));
+	}
+});
+//#endregion
+export { x as default };

package/dist/components/DocxViewer.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./DocxViewer.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                           */
+//#region src/components/DocxViewer.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-9bff4ace"]]);
+//#endregion
+export { n as default };

package/dist/components/DocxViewer.vue.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Side-viewer Word (`.docx`) renderer. Fetches the document bytes from the download URL and renders the
+ * OOXML to HTML entirely in-browser via docx-preview (https://github.com/VolodymyrBaydalka/docxjs) — a
+ * paginated, paper-like preview (white pages on a neutral canvas, like Word). No CDN / network beyond the
+ * file fetch: docx-preview bundles its own jszip + renderer, and images are inlined as base64.
+ *
+ * Two entry shapes mirror the other browsers (DICOM/zip): a real download URL for a held attachment, or a
+ * blob URL minted by the archive browsers from already-extracted bytes. docx-preview injects its own CSS
+ * into the render container, prefixed with the `className` ('docx') so it can't leak onto the page.
+ */
+type __VLS_Props = {
+    /** Download/blob URL of the .docx bytes. */
+    url?: string;
+    name: string;
+    size?: number;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/DocxViewer.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,59 @@
+import { createCommentVNode as e, createElementBlock as t, createElementVNode as n, defineComponent as r, onBeforeUnmount as i, onMounted as a, openBlock as o, ref as s, toDisplayString as c, vShow as l, watch as u, withDirectives as d } from "vue";
+import { renderAsync as f } from "docx-preview";
+//#region src/components/DocxViewer.vue?vue&type=script&setup=true&lang.ts
+var p = { class: "dx" }, m = {
+	key: 0,
+	class: "dx__msg"
+}, h = {
+	key: 1,
+	class: "dx__msg dx__msg--error"
+}, g = /*@__PURE__*/ r({
+	__name: "DocxViewer",
+	props: {
+		url: {},
+		name: {},
+		size: {}
+	},
+	setup(r) {
+		let g = r, _ = s("loading"), v = s(""), y = s(null);
+		async function b() {
+			let e = y.value;
+			if (!(!g.url || !e)) {
+				_.value = "loading", v.value = "", e.innerHTML = "";
+				try {
+					let t = await fetch(g.url);
+					if (!t.ok) throw Error(`HTTP ${t.status}`);
+					let n = await t.arrayBuffer();
+					if (y.value !== e || (await f(n, e, void 0, {
+						className: "docx",
+						inWrapper: !0,
+						ignoreWidth: !0,
+						ignoreHeight: !0,
+						breakPages: !0,
+						renderHeaders: !0,
+						renderFooters: !0,
+						renderFootnotes: !0,
+						renderEndnotes: !0,
+						useBase64URL: !0
+					}), y.value !== e)) return;
+					_.value = "ready";
+				} catch (e) {
+					v.value = e instanceof Error ? e.message : String(e), _.value = "error";
+				}
+			}
+		}
+		return a(b), u(() => g.url, b), i(() => {
+			y.value && (y.value.innerHTML = "");
+		}), (r, i) => (o(), t("div", p, [_.value === "loading" ? (o(), t("p", m, "正在渲染 Word 文档…")) : _.value === "error" ? (o(), t("div", h, [n("p", null, "渲染失败：" + c(v.value), 1), n("button", {
+			type: "button",
+			class: "dx__retry",
+			onClick: b
+		}, "重试")])) : e("", !0), d(n("div", {
+			ref_key: "docEl",
+			ref: y,
+			class: "dx__doc"
+		}, null, 512), [[l, _.value === "ready"]])]));
+	}
+});
+//#endregion
+export { g as default };

package/dist/components/DrawioViewer.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./DrawioViewer.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                             */
+//#region src/components/DrawioViewer.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-70c38c16"]]);
+//#endregion
+export { n as default };

package/dist/components/DrawioViewer.vue.d.ts

@@ -0,0 +1,16 @@
+import { type DiagramKind } from '@/lib/diagram';
+/**
+ * Renders a .drawio (mxGraph) or .excalidraw scene as an inline SVG (see lib/diagram.ts — hand-rolled,
+ * zero-dependency, best-effort). Consumes the text the side viewer already fetched (no second download),
+ * like the subtitle/geo/csv renderers. Rendering is async (drawio diagrams are usually DEFLATE-compressed).
+ * The produced SVG is OUR markup built from the parsed geometry, so v-html is safe; on a parse failure the
+ * user can fall back to the source toggle (raw XML/JSON) or download the file.
+ */
+type __VLS_Props = {
+    text: string;
+    name: string;
+    kind: DiagramKind;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/DrawioViewer.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,38 @@
+import { renderDiagram as e } from "../lib/diagram.js";
+import { createElementBlock as t, createElementVNode as n, defineComponent as r, openBlock as i, ref as a, toDisplayString as o, watch as s } from "vue";
+//#region src/components/DrawioViewer.vue?vue&type=script&setup=true&lang.ts
+var c = { class: "dgm" }, l = {
+	key: 0,
+	class: "dgm__msg"
+}, u = {
+	key: 1,
+	class: "dgm__msg dgm__msg--error"
+}, d = { class: "dgm__hint" }, f = ["innerHTML"], p = /*@__PURE__*/ r({
+	__name: "DrawioViewer",
+	props: {
+		text: {},
+		name: {},
+		kind: {}
+	},
+	setup(r) {
+		let p = r, m = a("loading"), h = a(""), g = a("");
+		async function _() {
+			m.value = "loading", g.value = "", h.value = "";
+			let t = p.text;
+			try {
+				let n = await e(t, p.kind);
+				if (p.text !== t) return;
+				h.value = n, m.value = "ready";
+			} catch (e) {
+				g.value = e instanceof Error ? e.message : String(e), m.value = "error";
+			}
+		}
+		return s(() => [p.text, p.kind], _, { immediate: !0 }), (e, a) => (i(), t("div", c, [m.value === "loading" ? (i(), t("p", l, "正在渲染图表…")) : m.value === "error" ? (i(), t("div", u, [n("p", null, "无法渲染该图表：" + o(g.value), 1), n("p", d, " 可切换到「源码」查看原始 " + o(r.kind === "excalidraw" ? "JSON" : "XML") + "，或下载后用对应工具打开。 ", 1)])) : (i(), t("div", {
+			key: 2,
+			class: "dgm__scroll",
+			innerHTML: h.value
+		}, null, 8, f))]));
+	}
+});
+//#endregion
+export { p as default };

package/dist/components/DxfViewer.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./DxfViewer.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                          */
+//#region src/components/DxfViewer.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-b18ead98"]]);
+//#endregion
+export { n as default };

package/dist/components/DxfViewer.vue.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Side-viewer for AutoCAD DXF drawings (.dxf). Fetches the text, parses it in-browser (see lib/dxf.ts —
+ * hand-rolled, zero-dependency) into drawable primitives, and draws them as an SVG. DXF Y is up, so the whole
+ * drawing is rendered inside a y-flip group (text is flipped back locally to stay upright). Drag to pan, wheel
+ * to zoom; toggle layers in the list. Binary DXF isn't supported.
+ */
+type __VLS_Props = {
+    url?: string;
+    name: string;
+    size?: number;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;