@l1yp/file-viewer 0.1.0

package/dist/components/FileViewerPanel.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,207 @@
+import { fileExt as e } from "../lib/fileType.js";
+import { canToggleView as t, skipsTextLoad as n } from "../lib/viewerKind.js";
+import { VIEWER_FORMATTERS as r, findFormatter as i } from "../lib/viewerFormats.js";
+import a from "./icons/Icon.js";
+import { useFileViewer as o } from "../composables/useFileViewer.js";
+import s from "./FileViewerBody.js";
+import { Fragment as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createVNode as m, defineComponent as ee, normalizeClass as h, onBeforeUnmount as g, openBlock as _, ref as v, renderList as te, toDisplayString as y, unref as b, watch as x } from "vue";
+//#region src/components/FileViewerPanel.vue?vue&type=script&setup=true&lang.ts
+var ne = {
+	key: 0,
+	class: "fv"
+}, S = { class: "fv__head" }, re = {
+	key: 0,
+	class: "fv__view",
+	role: "group",
+	"aria-label": "渲染或源码"
+}, C = ["aria-pressed"], w = ["aria-pressed"], T = ["title"], E = { class: "fv__fname" }, D = { class: "fv__ext" }, O = { class: "fv__actions" }, k = ["title", "aria-expanded"], A = {
+	key: 0,
+	class: "fv__menu-pop",
+	role: "menu"
+}, j = ["aria-checked"], ie = ["aria-checked", "onClick"], ae = { class: "fv__menu-label" }, oe = ["href", "download"], M = /*@__PURE__*/ ee({
+	__name: "FileViewerPanel",
+	setup(ee) {
+		let { current: M, width: se, setWidth: ce, close: N } = o(), P = v("render"), F = v(""), I = v(!1), L, R = v(null), z = v(null), B = l(() => z.value ?? M.value), V = l(() => M.value?.content != null), H = l(() => n(B.value)), U = l(() => t(B.value, F.value)), W = r, G = v(!1), K = v(null), q = v(""), J = l(() => i(q.value)), le = l(() => !!M.value?.url), Y = l(() => J.value ? `已强制以「${J.value.label}」打开 —— 点击切换查看方式` : "打开方式 —— 选择查看器（十六进制 / 文本 / 图片 / 音频 …）");
+		function ue(e) {
+			R.value?.pickFormat(e), G.value = !1;
+		}
+		function de() {
+			R.value?.resetFormat(), G.value = !1;
+		}
+		function X(e) {
+			K.value && !K.value.contains(e.target) && (G.value = !1);
+		}
+		function Z(e) {
+			e.key === "Escape" && (G.value = !1);
+		}
+		x(G, (e) => {
+			typeof document > "u" || (e ? (document.addEventListener("click", X), document.addEventListener("keydown", Z)) : (document.removeEventListener("click", X), document.removeEventListener("keydown", Z)));
+		});
+		let Q = l(() => e(M.value?.name ?? "").toUpperCase()), fe = l(() => {
+			let t = M.value?.name ?? "", n = e(t);
+			return n ? t.slice(0, t.length - n.length - 1) : t;
+		});
+		x(M, (e) => {
+			e && (P.value = "render", F.value = "", z.value = null, q.value = "", G.value = !1);
+		});
+		async function pe() {
+			try {
+				await navigator.clipboard?.writeText(F.value);
+			} catch {}
+			I.value = !0, clearTimeout(L), L = setTimeout(() => I.value = !1, 1400);
+		}
+		let $ = v(!1);
+		function me(e) {
+			e.preventDefault();
+			let t = e.currentTarget, n = e.clientX, r = se.value, i = document.body, a = i.style.cursor, o = i.style.userSelect;
+			t.setPointerCapture(e.pointerId), $.value = !0, i.style.cursor = "col-resize", i.style.userSelect = "none";
+			let s = (e) => ce(r + (n - e.clientX)), c = (e) => e.preventDefault(), l = (e) => {
+				t.releasePointerCapture(e.pointerId), t.removeEventListener("pointermove", s), t.removeEventListener("pointerup", l), document.removeEventListener("selectstart", c), i.style.cursor = a, i.style.userSelect = o, $.value = !1;
+			};
+			t.addEventListener("pointermove", s), t.addEventListener("pointerup", l), document.addEventListener("selectstart", c);
+		}
+		return g(() => {
+			clearTimeout(L), typeof document < "u" && (document.removeEventListener("click", X), document.removeEventListener("keydown", Z));
+		}), (e, t) => b(M) ? (_(), f("aside", ne, [
+			p("div", {
+				class: h(["fv__resizer", { "fv__resizer--active": $.value }]),
+				title: "拖动调整宽度",
+				onPointerdown: me
+			}, [...t[8] ||= [p("span", { class: "fv__grip" }, null, -1)]], 34),
+			p("header", S, [
+				U.value ? (_(), f("div", re, [p("button", {
+					type: "button",
+					class: h(["fv__view-btn", { "fv__view-btn--on": P.value === "render" }]),
+					"aria-pressed": P.value === "render",
+					title: "渲染",
+					onClick: t[0] ||= (e) => P.value = "render"
+				}, [m(a, {
+					name: "eye",
+					size: 15
+				})], 10, C), p("button", {
+					type: "button",
+					class: h(["fv__view-btn", { "fv__view-btn--on": P.value === "source" }]),
+					"aria-pressed": P.value === "source",
+					title: "源码",
+					onClick: t[1] ||= (e) => P.value = "source"
+				}, [m(a, {
+					name: "code",
+					size: 15
+				})], 10, w)])) : d("", !0),
+				p("span", {
+					class: "fv__title",
+					title: b(M).name
+				}, [p("span", E, y(fe.value), 1), Q.value ? (_(), f(c, { key: 0 }, [t[9] ||= p("span", { class: "fv__dot" }, "·", -1), p("span", D, y(Q.value), 1)], 64)) : d("", !0)], 8, T),
+				p("div", O, [
+					le.value ? (_(), f("div", {
+						key: 0,
+						ref_key: "menuRef",
+						ref: K,
+						class: "fv__menu"
+					}, [p("button", {
+						type: "button",
+						class: h(["fv__btn fv__btn--text", { "fv__btn--on": q.value }]),
+						title: Y.value,
+						"aria-haspopup": !0,
+						"aria-expanded": G.value,
+						onClick: t[2] ||= (e) => G.value = !G.value
+					}, [m(a, {
+						name: "apps",
+						size: 14
+					}), p("span", null, y(J.value ? J.value.label : "打开方式"), 1)], 10, k), G.value ? (_(), f("div", A, [
+						p("button", {
+							type: "button",
+							class: h(["fv__menu-item", { "fv__menu-item--on": !q.value }]),
+							role: "menuitemradio",
+							"aria-checked": !q.value,
+							onClick: de
+						}, [
+							m(a, {
+								name: "eye",
+								size: 14
+							}),
+							t[10] ||= p("span", { class: "fv__menu-label" }, "自动检测", -1),
+							q.value ? d("", !0) : (_(), u(a, {
+								key: 0,
+								name: "check",
+								size: 15,
+								class: "fv__menu-check"
+							}))
+						], 10, j),
+						t[11] ||= p("div", { class: "fv__menu-sep" }, null, -1),
+						(_(!0), f(c, null, te(b(W), (e) => (_(), f("button", {
+							key: e.key,
+							type: "button",
+							class: h(["fv__menu-item", { "fv__menu-item--on": q.value === e.key }]),
+							role: "menuitemradio",
+							"aria-checked": q.value === e.key,
+							onClick: (t) => ue(e.key)
+						}, [
+							m(a, {
+								name: e.icon,
+								size: 14
+							}, null, 8, ["name"]),
+							p("span", ae, y(e.label), 1),
+							q.value === e.key ? (_(), u(a, {
+								key: 0,
+								name: "check",
+								size: 15,
+								class: "fv__menu-check"
+							})) : d("", !0)
+						], 10, ie))), 128))
+					])) : d("", !0)], 512)) : d("", !0),
+					H.value ? d("", !0) : (_(), f("button", {
+						key: 1,
+						type: "button",
+						class: "fv__btn fv__btn--text",
+						onClick: pe
+					}, [m(a, {
+						name: "copy",
+						size: 14
+					}), p("span", null, y(I.value ? "Copied" : "Copy"), 1)])),
+					V.value ? d("", !0) : (_(), f("a", {
+						key: 2,
+						class: "fv__btn",
+						href: b(M).url,
+						download: b(M).name,
+						title: "下载"
+					}, [m(a, {
+						name: "download",
+						size: 15
+					})], 8, oe)),
+					!V.value && !H.value ? (_(), f("button", {
+						key: 3,
+						type: "button",
+						class: "fv__btn",
+						title: "刷新",
+						onClick: t[3] ||= (e) => R.value?.reload()
+					}, [m(a, {
+						name: "retry",
+						size: 15
+					})])) : d("", !0),
+					p("button", {
+						type: "button",
+						class: "fv__btn",
+						title: "关闭",
+						onClick: t[4] ||= (...e) => b(N) && b(N)(...e)
+					}, [m(a, {
+						name: "close",
+						size: 16
+					})])
+				])
+			]),
+			m(s, {
+				ref_key: "bodyRef",
+				ref: R,
+				file: b(M),
+				mode: P.value,
+				"host-chooser": "",
+				onLoaded: t[5] ||= (e) => F.value = e,
+				onFormatchange: t[6] ||= (e) => z.value = e,
+				onFormatpick: t[7] ||= (e) => q.value = e
+			}, null, 8, ["file", "mode"])
+		])) : d("", !0);
+	}
+});
+//#endregion
+export { M as default };

package/dist/components/FontViewer.js

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

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

@@ -0,0 +1,17 @@
+/**
+ * Side-viewer font specimen. Fetches the font bytes from the download URL and loads them with the native
+ * FontFace API (which decodes ttf/otf/woff AND woff2 in-browser, no library needed), then renders a living
+ * specimen in that very face: an editable preview line with a size slider, a size waterfall, and the glyph
+ * sets. Mirrors the other byte-fetching viewers (DICOM/DOCX/…): a real download URL in, a self-owned fetch.
+ *
+ * The face is registered under a unique private alias (so multiple opens never collide) and removed from
+ * document.fonts on change/unmount. No styling/security concern: a font is inert data decoded by the browser.
+ */
+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;

package/dist/components/FontViewer.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,120 @@
+import { formatBytes as e } from "../lib/format.js";
+import { Fragment as t, computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, defineComponent as o, normalizeStyle as s, onBeforeUnmount as c, openBlock as l, ref as u, renderList as d, toDisplayString as f, unref as p, vModelText as m, watch as h, withDirectives as g } from "vue";
+//#region src/components/FontViewer.vue?vue&type=script&setup=true&lang.ts
+var _ = { class: "font" }, v = {
+	key: 0,
+	class: "font__msg"
+}, y = {
+	key: 1,
+	class: "font__msg font__gate"
+}, b = {
+	key: 2,
+	class: "font__msg font__msg--error"
+}, x = { class: "font__bar" }, S = { class: "font__size" }, C = { class: "font__size-val" }, w = { class: "font__scroll" }, T = { class: "font__section" }, E = { class: "font__wf-tag" }, D = { class: "font__wf-text" }, O = { class: "font__section" }, k = 24 * 1024 * 1024, A = /*@__PURE__*/ o({
+	__name: "FontViewer",
+	props: {
+		url: {},
+		name: {},
+		size: {}
+	},
+	setup(o) {
+		let A = o, j = u("loading"), M = u(""), N = u(!1), P = 0, F = "", I = null, L = u("The quick brown fox jumps over the lazy dog."), R = u(44), z = [
+			14,
+			18,
+			24,
+			32,
+			48,
+			72
+		], B = [
+			"ABCDEFGHIJKLMNOPQRSTUVWXYZ",
+			"abcdefghijklmnopqrstuvwxyz",
+			"0123456789",
+			"!\"#$%&'()*+,-./:;<=>?@[\\]^_`{|}~",
+			"中文示例：永东国爱龙凤，0123456789。"
+		], V = n(() => N.value && F ? `"${F}"` : "inherit");
+		function H() {
+			if (I) {
+				try {
+					document.fonts.delete(I);
+				} catch {}
+				I = null;
+			}
+			N.value = !1;
+		}
+		async function U() {
+			if (A.url) {
+				j.value = "loading", M.value = "", H();
+				try {
+					let e = await fetch(A.url);
+					if (!e.ok) throw Error(`HTTP ${e.status}`);
+					let t = await e.arrayBuffer();
+					F = `fv-font-${++P}`;
+					let n = new FontFace(F, t);
+					await n.load(), document.fonts.add(n), I = n, N.value = !0, j.value = "ready";
+				} catch (e) {
+					M.value = e instanceof Error ? e.message : String(e), j.value = "error";
+				}
+			}
+		}
+		function W() {
+			if (A.size && A.size > k) {
+				j.value = "gate";
+				return;
+			}
+			U();
+		}
+		return h(() => A.url, W, { immediate: !0 }), c(H), (n, o) => (l(), i("div", _, [j.value === "loading" ? (l(), i("p", v, "正在加载字体…")) : j.value === "gate" ? (l(), i("div", y, [a("p", null, "该字体文件较大（" + f(p(e)(A.size)) + "），将在浏览器内解码。是否继续？", 1), a("button", {
+			type: "button",
+			class: "font__btn",
+			onClick: U
+		}, "加载并预览")])) : j.value === "error" ? (l(), i("div", b, [
+			a("p", null, "加载失败：" + f(M.value), 1),
+			o[2] ||= a("p", { class: "font__hint" }, "浏览器可能不支持该字体格式，可尝试下载后用本地工具打开。", -1),
+			a("button", {
+				type: "button",
+				class: "font__btn",
+				onClick: U
+			}, "重试")
+		])) : j.value === "ready" ? (l(), i(t, { key: 3 }, [a("div", x, [g(a("input", {
+			"onUpdate:modelValue": o[0] ||= (e) => L.value = e,
+			class: "font__input",
+			type: "text",
+			placeholder: "输入预览文字…",
+			"aria-label": "预览文字"
+		}, null, 512), [[m, L.value]]), a("label", S, [g(a("input", {
+			"onUpdate:modelValue": o[1] ||= (e) => R.value = e,
+			type: "range",
+			min: "8",
+			max: "120",
+			step: "1"
+		}, null, 512), [[
+			m,
+			R.value,
+			void 0,
+			{ number: !0 }
+		]]), a("span", C, f(R.value) + "px", 1)])]), a("div", w, [
+			a("div", {
+				class: "font__hero",
+				style: s({
+					fontFamily: V.value,
+					fontSize: R.value + "px"
+				})
+			}, f(L.value || " "), 5),
+			a("section", T, [o[3] ||= a("h3", { class: "font__h" }, "字号瀑布", -1), (l(), i(t, null, d(z, (e) => a("div", {
+				key: e,
+				class: "font__wf",
+				style: s({
+					fontFamily: V.value,
+					fontSize: e + "px"
+				})
+			}, [a("span", E, f(e), 1), a("span", D, f(L.value || "Aa"), 1)], 4)), 64))]),
+			a("section", O, [o[4] ||= a("h3", { class: "font__h" }, "字符集", -1), (l(), i(t, null, d(B, (e, t) => a("p", {
+				key: t,
+				class: "font__glyphs",
+				style: s({ fontFamily: V.value })
+			}, f(e), 5)), 64))])
+		])], 64)) : r("", !0)]));
+	}
+});
+//#endregion
+export { A as default };

package/dist/components/FrontmatterCard.js

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

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

@@ -0,0 +1,11 @@
+/**
+ * Renders a markdown document's YAML frontmatter (SKILL.md & friends) as a labeled
+ * card — one "Label / value" row per key, claude.ai's skill-header look. `name` is
+ * dropped (it's already the panel title); empty values are skipped.
+ */
+type __VLS_Props = {
+    data: Record<string, unknown>;
+};
+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/FrontmatterCard.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,30 @@
+import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, openBlock as o, renderList as s, toDisplayString as c } from "vue";
+//#region src/components/FrontmatterCard.vue?vue&type=script&setup=true&lang.ts
+var l = {
+	key: 0,
+	class: "fm"
+}, u = { class: "fm__label" }, d = { class: "fm__value" }, f = /*@__PURE__*/ a({
+	__name: "FrontmatterCard",
+	props: { data: {} },
+	setup(a) {
+		let f = a;
+		function p(e) {
+			let t = e.replace(/[-_]+/g, " ").trim();
+			return t ? t.charAt(0).toUpperCase() + t.slice(1) : e;
+		}
+		function m(e) {
+			return e == null ? "" : Array.isArray(e) ? e.map(m).filter(Boolean).join(", ") : typeof e == "object" ? Object.entries(e).map(([e, t]) => `${e}: ${m(t)}`).join("\n") : String(e);
+		}
+		let h = t(() => Object.entries(f.data).filter(([e]) => e !== "name").map(([e, t]) => ({
+			key: e,
+			label: p(e),
+			value: m(t)
+		})).filter((e) => e.value.trim() !== ""));
+		return (t, a) => h.value.length ? (o(), r("dl", l, [(o(!0), r(e, null, s(h.value, (e) => (o(), r("div", {
+			key: e.key,
+			class: "fm__row"
+		}, [i("dt", u, c(e.label), 1), i("dd", d, c(e.value), 1)]))), 128))])) : n("", !0);
+	}
+});
+//#endregion
+export { f as default };

package/dist/components/GeoViewer.js

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

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

@@ -0,0 +1,17 @@
+/**
+ * Side-viewer geodata renderer. Parses the already-fetched text (see lib/geo.ts) into point / line / polygon
+ * features, then draws them over a REAL slippy basemap from OpenFreeMap (MapLibre GL, https://openfreemap.org
+ * — free, no API key). GeoJSON / KML / GPX.
+ *
+ * MapLibre is lazy-loaded inside onMounted (dynamic import — it touches window/WebGL, so it must never enter
+ * the SSR module graph, and it keeps ~200 KB out of the initial bundle). If the remote basemap can't be
+ * reached (e.g. an air-gapped intranet), we fall back to a blank background so the user's DATA still renders,
+ * with a small "offline" hint. Drag/scroll to pan-zoom; click a feature in the list to fly to it.
+ */
+type __VLS_Props = {
+    text: string;
+    name: string;
+};
+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;