@file-viewer/core 2.0.0

package/dist/renderers/epub.js

@@ -0,0 +1,330 @@
+const epubStyle = `
+.epub-viewer{width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#eef1f4;color:#172033;box-sizing:border-box}
+.epub-viewer *{box-sizing:border-box}
+.epub-toolbar{flex-shrink:0;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid rgba(15,23,42,.08);background:rgba(255,255,255,.92)}
+.epub-title{min-width:0;display:flex;flex-direction:column;gap:3px}
+.epub-title strong,.epub-title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.epub-title strong{font-size:14px}
+.epub-title span{color:#64748b;font-size:12px}
+.epub-icon-button,.epub-button{height:36px;border:1px solid rgba(15,23,42,.08);background:#fff;color:#172033;font:inherit;cursor:pointer}
+.epub-icon-button{width:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px}
+.epub-icon-button span,.epub-icon-button span::before,.epub-icon-button span::after{width:16px;height:2px;display:block;border-radius:999px;background:currentColor}
+.epub-icon-button span{position:relative}
+.epub-icon-button span::before,.epub-icon-button span::after{content:'';position:absolute;left:0}
+.epub-icon-button span::before{top:-5px}
+.epub-icon-button span::after{top:5px}
+.epub-icon-button.active{border-color:rgba(37,99,235,.24);background:rgba(37,99,235,.08);color:#1d4ed8}
+.epub-actions{display:flex;align-items:center;gap:8px}
+.epub-button{min-width:68px;padding:0 12px;border-radius:8px;font-size:13px;font-weight:700}
+.epub-button:disabled{color:#94a3b8;cursor:not-allowed}
+.epub-progress{min-width:58px;color:#64748b;font-size:12px;text-align:center}
+.epub-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(180px,240px) minmax(0,1fr)}
+.epub-viewer--toc-hidden .epub-body{grid-template-columns:minmax(0,1fr)}
+.epub-toc{min-width:0;min-height:0;display:flex;flex-direction:column;border-right:1px solid rgba(15,23,42,.08);background:rgba(255,255,255,.8)}
+.epub-toc[hidden]{display:none}
+.epub-toc-head{flex-shrink:0;display:flex;justify-content:space-between;gap:8px;padding:12px;color:#172033;font-size:13px}
+.epub-toc-head span{color:#64748b}
+.epub-toc-list{flex:1;min-height:0;overflow:auto;padding:0 8px 10px}
+.epub-toc-item{width:100%;min-height:34px;border:0;border-radius:8px;background:transparent;color:#475569;font:inherit;font-size:12px;text-align:left;cursor:pointer}
+.epub-toc-item:hover,.epub-toc-item.active{background:rgba(37,99,235,.08);color:#1d4ed8}
+.epub-stage-wrap{position:relative;min-width:0;min-height:0;padding:18px;overflow:hidden}
+.epub-stage{width:100%;height:100%;overflow-x:hidden;overflow-y:auto;border-radius:8px;background:#fff;box-shadow:0 18px 45px rgba(15,23,42,.12),inset 0 0 0 1px rgba(15,23,42,.06)}
+.epub-stage .epub-container{width:100%!important;max-width:100%;overflow-x:hidden!important;overflow-y:auto!important}
+.epub-stage iframe{max-width:100%}
+.epub-state{position:absolute;inset:18px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:rgba(255,255,255,.92);color:#64748b;font-size:14px}
+.epub-state.error{color:#b42318}
+.file-viewer[data-viewer-theme='dark'] .epub-viewer{background:#172033;color:#e5eef8}
+.file-viewer[data-viewer-theme='dark'] .epub-toolbar,.file-viewer[data-viewer-theme='dark'] .epub-toc,.file-viewer[data-viewer-theme='dark'] .epub-stage{background:#fff;color:#172033}
+@media (prefers-color-scheme:dark){.file-viewer[data-viewer-theme='system'] .epub-viewer{background:#172033;color:#e5eef8}.file-viewer[data-viewer-theme='system'] .epub-toolbar,.file-viewer[data-viewer-theme='system'] .epub-toc,.file-viewer[data-viewer-theme='system'] .epub-stage{background:#fff;color:#172033}}
+@media (max-width:720px){.epub-toolbar{grid-template-columns:40px minmax(0,1fr)}.epub-actions{grid-column:1/-1;justify-content:space-between}.epub-body{position:relative;grid-template-columns:minmax(0,1fr)}.epub-toc{position:absolute;z-index:5;top:0;bottom:0;left:0;width:min(82vw,280px);box-shadow:18px 0 40px rgba(15,23,42,.16)}.epub-stage-wrap{padding:12px}}
+`;
+const createStyle = () => {
+    const style = document.createElement('style');
+    style.textContent = epubStyle;
+    return style;
+};
+const createElement = (tagName, className, text) => {
+    const element = document.createElement(tagName);
+    if (className) {
+        element.className = className;
+    }
+    if (text !== undefined) {
+        element.textContent = text;
+    }
+    return element;
+};
+const normalizeLabel = (value, fallback) => {
+    if (typeof value === 'string' && value.trim()) {
+        return value.trim();
+    }
+    return fallback;
+};
+const flattenToc = (items, depth = 0) => {
+    if (!Array.isArray(items)) {
+        return [];
+    }
+    return items.flatMap((item, index) => {
+        const node = item;
+        const href = typeof node.href === 'string' ? node.href : '';
+        const label = normalizeLabel(node.label || node.title, `章节 ${index + 1}`);
+        const subitems = flattenToc(node.subitems || node.children, depth + 1);
+        if (!href) {
+            return subitems;
+        }
+        return [{
+                depth,
+                href,
+                id: `${depth}-${index}-${href}`,
+                label,
+            }, ...subitems];
+    });
+};
+const pickInitialHref = (items) => {
+    var _a;
+    const chapterLike = items.find(item => {
+        const label = item.label.toLowerCase();
+        return /(^|\s)(chapter|part|book|prologue|preface|introduction)\b/.test(label)
+            || /第[一二三四五六七八九十百千0-9]+[章节回部卷篇]/.test(item.label);
+    });
+    if (chapterLike) {
+        return chapterLike.href;
+    }
+    const readable = items.find(item => {
+        const text = `${item.label} ${item.href}`.toLowerCase();
+        return !/(cover|titlepage|title-page|copyright|license|toc|contents|nav|table-of-contents|wrap0000)/.test(text);
+    });
+    return (readable === null || readable === void 0 ? void 0 : readable.href) || ((_a = items[0]) === null || _a === void 0 ? void 0 : _a.href);
+};
+export default async function renderEpub(buffer, target) {
+    let book;
+    let rendition;
+    let disposed = false;
+    let tocOpen = true;
+    let status = 'loading';
+    let title = 'EPUB 电子书';
+    let author = '';
+    let tocItems = [];
+    let currentHref = '';
+    let progress = null;
+    let atStart = true;
+    let atEnd = false;
+    const timers = new Set();
+    const cleanups = [];
+    const root = createElement('div', 'epub-viewer');
+    const toolbar = createElement('div', 'epub-toolbar');
+    const tocButton = createElement('button', 'epub-icon-button');
+    tocButton.type = 'button';
+    tocButton.title = '目录';
+    tocButton.append(createElement('span'));
+    const titleRoot = createElement('div', 'epub-title');
+    const titleText = createElement('strong', undefined, title);
+    const subtitleText = createElement('span', undefined, '阅读中');
+    titleRoot.append(titleText, subtitleText);
+    const actions = createElement('div', 'epub-actions');
+    const prevButton = createElement('button', 'epub-button', '上一页');
+    const progressText = createElement('span', 'epub-progress', '阅读中');
+    const nextButton = createElement('button', 'epub-button', '下一页');
+    prevButton.type = 'button';
+    nextButton.type = 'button';
+    actions.append(prevButton, progressText, nextButton);
+    toolbar.append(tocButton, titleRoot, actions);
+    const body = createElement('div', 'epub-body');
+    const toc = createElement('aside', 'epub-toc');
+    const tocHead = createElement('div', 'epub-toc-head');
+    const tocCount = createElement('span', undefined, '0 项');
+    tocHead.append(createElement('strong', undefined, '目录'), tocCount);
+    const tocList = createElement('div', 'epub-toc-list');
+    toc.append(tocHead, tocList);
+    const stageWrap = createElement('main', 'epub-stage-wrap');
+    const stage = createElement('div', 'epub-stage');
+    const state = createElement('div', 'epub-state', '正在解析 EPUB...');
+    stageWrap.append(stage, state);
+    body.append(toc, stageWrap);
+    root.append(toolbar, body);
+    target.replaceChildren(createStyle(), root);
+    const listen = (element, event, listener) => {
+        element.addEventListener(event, listener);
+        cleanups.push(() => element.removeEventListener(event, listener));
+    };
+    const currentChapter = () => {
+        var _a;
+        if (!currentHref) {
+            return '';
+        }
+        const exact = tocItems.find(item => item.href === currentHref);
+        if (exact) {
+            return exact.label;
+        }
+        return ((_a = tocItems.find(item => currentHref.includes(item.href.split('#')[0]))) === null || _a === void 0 ? void 0 : _a.label) || '';
+    };
+    const progressLabel = () => {
+        if (typeof progress === 'number') {
+            return `${progress}%`;
+        }
+        return currentChapter() || '阅读中';
+    };
+    const syncUi = () => {
+        root.classList.toggle('epub-viewer--toc-hidden', !tocOpen);
+        toc.hidden = !tocOpen;
+        tocButton.classList.toggle('active', tocOpen);
+        titleText.textContent = title;
+        subtitleText.textContent = author || progressLabel();
+        progressText.textContent = progressLabel();
+        prevButton.disabled = status !== 'ready' || atStart;
+        nextButton.disabled = status !== 'ready' || atEnd;
+        state.hidden = status === 'ready';
+        state.classList.toggle('error', status === 'error');
+        tocCount.textContent = `${tocItems.length} 项`;
+        Array.from(tocList.querySelectorAll('.epub-toc-item')).forEach(button => {
+            button.classList.toggle('active', button.dataset.href === currentHref);
+        });
+    };
+    const renderToc = () => {
+        tocList.replaceChildren();
+        tocItems.forEach(item => {
+            const button = createElement('button', 'epub-toc-item', item.label);
+            button.type = 'button';
+            button.dataset.href = item.href;
+            button.style.paddingLeft = `${12 + item.depth * 14}px`;
+            listen(button, 'click', () => {
+                void (rendition === null || rendition === void 0 ? void 0 : rendition.display(item.href));
+                tocOpen = false;
+                syncUi();
+            });
+            tocList.append(button);
+        });
+        syncUi();
+    };
+    const updateLocation = (epubLocation) => {
+        var _a, _b;
+        atStart = Boolean(epubLocation === null || epubLocation === void 0 ? void 0 : epubLocation.atStart);
+        atEnd = Boolean(epubLocation === null || epubLocation === void 0 ? void 0 : epubLocation.atEnd);
+        currentHref = ((_a = epubLocation === null || epubLocation === void 0 ? void 0 : epubLocation.start) === null || _a === void 0 ? void 0 : _a.href) || '';
+        if (typeof ((_b = epubLocation === null || epubLocation === void 0 ? void 0 : epubLocation.start) === null || _b === void 0 ? void 0 : _b.percentage) === 'number') {
+            progress = Math.round(epubLocation.start.percentage * 100);
+        }
+        syncUi();
+    };
+    const wait = (ms) => new Promise(resolve => {
+        const timer = window.setTimeout(() => {
+            timers.delete(timer);
+            resolve(undefined);
+        }, ms);
+        timers.add(timer);
+    });
+    const hasReadableFrame = () => {
+        var _a;
+        try {
+            const iframe = stage.querySelector('iframe');
+            const frameBody = (_a = iframe === null || iframe === void 0 ? void 0 : iframe.contentDocument) === null || _a === void 0 ? void 0 : _a.body;
+            if (!frameBody) {
+                return false;
+            }
+            return Boolean(frameBody.innerText.trim() || frameBody.querySelector('img, svg, canvas'));
+        }
+        catch {
+            return false;
+        }
+    };
+    const waitForReadableFrame = async () => {
+        for (let index = 0; index < 20; index += 1) {
+            if (disposed || hasReadableFrame()) {
+                return hasReadableFrame();
+            }
+            await wait(100);
+        }
+        return hasReadableFrame();
+    };
+    const openBook = async () => {
+        status = 'loading';
+        state.textContent = '正在解析 EPUB...';
+        syncUi();
+        try {
+            const { default: ePub } = await import('epubjs');
+            if (disposed) {
+                return;
+            }
+            book = ePub(buffer.slice(0), {
+                openAs: 'binary',
+                replacements: 'blobUrl',
+            });
+            rendition = book.renderTo(stage, {
+                allowScriptedContent: false,
+                flow: 'scrolled',
+                height: '100%',
+                manager: 'continuous',
+                resizeOnOrientationChange: true,
+                spread: 'none',
+                width: '100%',
+            });
+            rendition.themes.default({
+                body: {
+                    color: '#172033',
+                    fontFamily: 'Georgia, "Times New Roman", serif',
+                    lineHeight: '1.72',
+                    padding: '0 8px',
+                },
+                img: {
+                    maxWidth: '100%',
+                },
+                html: {
+                    height: 'auto',
+                    overflow: 'auto',
+                },
+            });
+            rendition.on('relocated', updateLocation);
+            await book.ready;
+            const metadata = await book.loaded.metadata.catch(() => undefined);
+            title = normalizeLabel(metadata === null || metadata === void 0 ? void 0 : metadata.title, title);
+            author = normalizeLabel(metadata === null || metadata === void 0 ? void 0 : metadata.creator, '');
+            const navigation = await book.loaded.navigation.catch(() => undefined);
+            tocItems = flattenToc(navigation === null || navigation === void 0 ? void 0 : navigation.toc);
+            renderToc();
+            await rendition.display(pickInitialHref(tocItems));
+            if (!await waitForReadableFrame()) {
+                throw new Error('EPUB 正文渲染未完成，请刷新后重试');
+            }
+            if (disposed) {
+                return;
+            }
+            status = 'ready';
+            syncUi();
+            void book.locations.generate(1200).catch(() => undefined);
+        }
+        catch (error) {
+            console.error(error);
+            status = 'error';
+            state.textContent = error instanceof Error ? error.message : String(error);
+            syncUi();
+        }
+    };
+    listen(tocButton, 'click', () => {
+        tocOpen = !tocOpen;
+        syncUi();
+    });
+    listen(prevButton, 'click', () => {
+        void (rendition === null || rendition === void 0 ? void 0 : rendition.prev());
+    });
+    listen(nextButton, 'click', () => {
+        void (rendition === null || rendition === void 0 ? void 0 : rendition.next());
+    });
+    syncUi();
+    void openBook();
+    return {
+        $el: root,
+        unmount() {
+            disposed = true;
+            timers.forEach(timer => window.clearTimeout(timer));
+            timers.clear();
+            if (rendition) {
+                rendition.off('relocated', updateLocation);
+                rendition.destroy();
+                rendition = undefined;
+            }
+            book === null || book === void 0 ? void 0 : book.destroy();
+            book = undefined;
+            cleanups.splice(0).forEach(cleanup => cleanup());
+            target.replaceChildren();
+        },
+    };
+}

package/dist/renderers/geo.d.ts

@@ -0,0 +1,2 @@
+import type { FileViewerRenderedInstance } from '../types';
+export default function renderGeo(buffer: ArrayBuffer, target: HTMLDivElement, type?: string): Promise<FileViewerRenderedInstance>;

package/dist/renderers/geo.js

@@ -0,0 +1,284 @@
+import { readFileViewerText } from '../source.js';
+const SVG_NS = 'http://www.w3.org/2000/svg';
+const GEO_WIDTH = 960;
+const GEO_HEIGHT = 620;
+const GEO_PADDING = 36;
+const geoStyle = `
+.geo-viewer{min-height:100%;display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);background:#eef1f4;color:#132235}
+.geo-panel{padding:24px;border-right:1px solid rgba(15,23,42,.08);background:#fff;box-sizing:border-box}
+.geo-panel>span{color:#0f766e;font-size:12px;font-weight:800}.geo-panel h2{margin:8px 0 22px;font-size:24px}
+.geo-panel dl{display:grid;gap:12px;margin:0}.geo-panel dt,.geo-counts strong{color:#64748b;font-size:12px;font-weight:700}.geo-panel dd{margin:4px 0 0;word-break:break-all;font-size:14px}
+.geo-counts{margin-top:24px}.geo-counts p{margin:8px 0 0;font-size:14px}
+.geo-map{padding:28px;overflow:auto}.geo-map svg{display:block;width:min(100%,1200px);min-width:640px;height:auto;margin:0 auto;overflow:visible}
+.geo-map rect{fill:#f8fafc;stroke:rgba(15,23,42,.08)}
+.geo-map path{fill:none;stroke:#0f766e;stroke-width:2.2;vector-effect:non-scaling-stroke}.geo-map .geo-polygon{fill:rgba(45,212,191,.18)}
+.geo-map circle{fill:#2563eb;stroke:#fff;stroke-width:1.5;vector-effect:non-scaling-stroke}
+.geo-state{display:flex;align-items:center;justify-content:center;min-height:280px;border-radius:8px;background:rgba(255,255,255,.82);color:#64748b}
+.geo-state.error{color:#b42318}
+.file-viewer[data-viewer-theme='dark'] .geo-viewer{background:#101820;color:#e5edf6}.file-viewer[data-viewer-theme='dark'] .geo-panel{background:#111827;border-color:rgba(148,163,184,.18)}.file-viewer[data-viewer-theme='dark'] .geo-panel dt,.file-viewer[data-viewer-theme='dark'] .geo-counts strong{color:#94a3b8}.file-viewer[data-viewer-theme='dark'] .geo-map rect{fill:#111827;stroke:rgba(148,163,184,.18)}
+@media (prefers-color-scheme:dark){.file-viewer[data-viewer-theme='system'] .geo-viewer{background:#101820;color:#e5edf6}.file-viewer[data-viewer-theme='system'] .geo-panel{background:#111827;border-color:rgba(148,163,184,.18)}.file-viewer[data-viewer-theme='system'] .geo-panel dt,.file-viewer[data-viewer-theme='system'] .geo-counts strong{color:#94a3b8}.file-viewer[data-viewer-theme='system'] .geo-map rect{fill:#111827;stroke:rgba(148,163,184,.18)}}
+@media (max-width:860px){.geo-viewer{grid-template-columns:1fr}.geo-panel{border-right:0;border-bottom:1px solid rgba(15,23,42,.08)}}
+`;
+const createStyle = () => {
+    const style = document.createElement('style');
+    style.textContent = geoStyle;
+    return style;
+};
+const createSvgElement = (tag) => {
+    return document.createElementNS(SVG_NS, tag);
+};
+const normalizeGeoJson = (value) => {
+    const candidate = value;
+    if ((candidate === null || candidate === void 0 ? void 0 : candidate.type) === 'FeatureCollection' && Array.isArray(candidate.features)) {
+        return candidate;
+    }
+    if ((candidate === null || candidate === void 0 ? void 0 : candidate.type) === 'Feature') {
+        return { type: 'FeatureCollection', features: [candidate] };
+    }
+    if ((candidate === null || candidate === void 0 ? void 0 : candidate.type) && candidate.coordinates) {
+        return {
+            type: 'FeatureCollection',
+            features: [{ type: 'Feature', geometry: candidate, properties: {} }],
+        };
+    }
+    throw new Error('无法识别的 GeoJSON 数据');
+};
+const parseXml = (text) => {
+    const doc = new DOMParser().parseFromString(text, 'application/xml');
+    const error = doc.querySelector('parsererror');
+    if (error) {
+        throw new Error(error.textContent || 'XML 解析失败');
+    }
+    return doc;
+};
+const normalizeGeoType = (type) => {
+    const normalized = (type || 'geojson').trim().toLowerCase();
+    if (normalized === 'json') {
+        return 'geojson';
+    }
+    if (normalized === 'shapefile') {
+        return 'shp';
+    }
+    return normalized;
+};
+const parseGeo = async (buffer, type) => {
+    if (type === 'geojson') {
+        return normalizeGeoJson(JSON.parse(await readFileViewerText(buffer)));
+    }
+    if (type === 'kml' || type === 'gpx') {
+        const toGeoJSON = await import('@tmcw/togeojson');
+        const doc = parseXml(await readFileViewerText(buffer));
+        return normalizeGeoJson(type === 'kml' ? toGeoJSON.kml(doc) : toGeoJSON.gpx(doc));
+    }
+    if (type === 'shp') {
+        const { default: shp } = await import('shpjs');
+        return normalizeGeoJson(await shp(buffer));
+    }
+    throw new Error(`不支持 .${type} 地理格式`);
+};
+const walkPositions = (geometry, visit) => {
+    if (!geometry) {
+        return;
+    }
+    switch (geometry.type) {
+        case 'Point':
+            visit(geometry.coordinates);
+            break;
+        case 'MultiPoint':
+        case 'LineString':
+            geometry.coordinates.forEach(visit);
+            break;
+        case 'MultiLineString':
+        case 'Polygon':
+            geometry.coordinates.forEach(line => line.forEach(visit));
+            break;
+        case 'MultiPolygon':
+            geometry.coordinates.forEach(polygon => polygon.forEach(line => line.forEach(visit)));
+            break;
+        case 'GeometryCollection':
+            geometry.geometries.forEach(item => walkPositions(item, visit));
+            break;
+    }
+};
+const collectBounds = (features) => {
+    let minX = Infinity;
+    let minY = Infinity;
+    let maxX = -Infinity;
+    let maxY = -Infinity;
+    features.forEach(feature => {
+        walkPositions(feature.geometry, position => {
+            const [x, y] = position;
+            if (!Number.isFinite(x) || !Number.isFinite(y)) {
+                return;
+            }
+            minX = Math.min(minX, x);
+            minY = Math.min(minY, y);
+            maxX = Math.max(maxX, x);
+            maxY = Math.max(maxY, y);
+        });
+    });
+    if (!Number.isFinite(minX) || !Number.isFinite(minY)) {
+        return null;
+    }
+    return { minX, minY, maxX, maxY };
+};
+const projectPosition = (position, bounds) => {
+    if (!bounds) {
+        return [GEO_WIDTH / 2, GEO_HEIGHT / 2];
+    }
+    const xRange = Math.max(1e-9, bounds.maxX - bounds.minX);
+    const yRange = Math.max(1e-9, bounds.maxY - bounds.minY);
+    const scale = Math.min((GEO_WIDTH - GEO_PADDING * 2) / xRange, (GEO_HEIGHT - GEO_PADDING * 2) / yRange);
+    const xOffset = (GEO_WIDTH - xRange * scale) / 2;
+    const yOffset = (GEO_HEIGHT - yRange * scale) / 2;
+    const x = xOffset + (position[0] - bounds.minX) * scale;
+    const y = GEO_HEIGHT - (yOffset + (position[1] - bounds.minY) * scale);
+    return [Number(x.toFixed(2)), Number(y.toFixed(2))];
+};
+const pathLine = (positions, bounds, close = false) => {
+    const points = positions
+        .filter(position => Number.isFinite(position[0]) && Number.isFinite(position[1]))
+        .map(position => projectPosition(position, bounds));
+    if (!points.length) {
+        return '';
+    }
+    const [first, ...rest] = points;
+    const body = [`M${first[0]} ${first[1]}`, ...rest.map(point => `L${point[0]} ${point[1]}`)];
+    if (close) {
+        body.push('Z');
+    }
+    return body.join(' ');
+};
+const appendGeometry = (parent, geometry, bounds) => {
+    if (!geometry) {
+        return;
+    }
+    switch (geometry.type) {
+        case 'Point': {
+            const [x, y] = projectPosition(geometry.coordinates, bounds);
+            const circle = createSvgElement('circle');
+            circle.setAttribute('cx', String(x));
+            circle.setAttribute('cy', String(y));
+            circle.setAttribute('r', '4');
+            parent.appendChild(circle);
+            break;
+        }
+        case 'MultiPoint':
+            geometry.coordinates.forEach(position => appendGeometry(parent, { type: 'Point', coordinates: position }, bounds));
+            break;
+        case 'LineString': {
+            const path = createSvgElement('path');
+            path.setAttribute('d', pathLine(geometry.coordinates, bounds));
+            parent.appendChild(path);
+            break;
+        }
+        case 'MultiLineString':
+            geometry.coordinates.forEach(line => appendGeometry(parent, { type: 'LineString', coordinates: line }, bounds));
+            break;
+        case 'Polygon':
+            geometry.coordinates.forEach(line => {
+                const path = createSvgElement('path');
+                path.classList.add('geo-polygon');
+                path.setAttribute('d', pathLine(line, bounds, true));
+                parent.appendChild(path);
+            });
+            break;
+        case 'MultiPolygon':
+            geometry.coordinates.forEach(polygon => {
+                appendGeometry(parent, { type: 'Polygon', coordinates: polygon }, bounds);
+            });
+            break;
+        case 'GeometryCollection':
+            geometry.geometries.forEach(item => appendGeometry(parent, item, bounds));
+            break;
+    }
+};
+const buildGeometryCounts = (features) => {
+    const counts = new Map();
+    features.forEach(feature => {
+        var _a;
+        const key = ((_a = feature.geometry) === null || _a === void 0 ? void 0 : _a.type) || 'Null';
+        counts.set(key, (counts.get(key) || 0) + 1);
+    });
+    return [...counts.entries()];
+};
+const formatBounds = (bounds) => {
+    if (!bounds) {
+        return '-';
+    }
+    return `${bounds.minX.toFixed(5)}, ${bounds.minY.toFixed(5)} -> ${bounds.maxX.toFixed(5)}, ${bounds.maxY.toFixed(5)}`;
+};
+const appendDescriptionItem = (list, label, value) => {
+    const row = document.createElement('div');
+    const term = document.createElement('dt');
+    term.textContent = label;
+    const detail = document.createElement('dd');
+    detail.textContent = String(value);
+    row.append(term, detail);
+    list.appendChild(row);
+};
+const renderCollection = (collection, type) => {
+    const root = document.createElement('div');
+    root.className = 'geo-viewer';
+    const features = collection.features || [];
+    const bounds = collectBounds(features);
+    const panel = document.createElement('aside');
+    panel.className = 'geo-panel';
+    const badge = document.createElement('span');
+    badge.textContent = type.toUpperCase();
+    const heading = document.createElement('h2');
+    heading.textContent = '地理数据预览';
+    const description = document.createElement('dl');
+    appendDescriptionItem(description, '要素数', features.length);
+    appendDescriptionItem(description, '范围', formatBounds(bounds));
+    const counts = document.createElement('div');
+    counts.className = 'geo-counts';
+    const countsHeading = document.createElement('strong');
+    countsHeading.textContent = '几何类型';
+    counts.appendChild(countsHeading);
+    buildGeometryCounts(features).forEach(([name, count]) => {
+        const row = document.createElement('p');
+        row.textContent = `${name}: ${count}`;
+        counts.appendChild(row);
+    });
+    panel.append(badge, heading, description, counts);
+    const map = document.createElement('main');
+    map.className = 'geo-map';
+    const svg = createSvgElement('svg');
+    svg.setAttribute('viewBox', `0 0 ${GEO_WIDTH} ${GEO_HEIGHT}`);
+    svg.setAttribute('role', 'img');
+    svg.setAttribute('aria-label', '地理数据 SVG 预览');
+    const rect = createSvgElement('rect');
+    rect.setAttribute('width', String(GEO_WIDTH));
+    rect.setAttribute('height', String(GEO_HEIGHT));
+    rect.setAttribute('rx', '8');
+    const group = createSvgElement('g');
+    features.forEach(feature => appendGeometry(group, feature.geometry, bounds));
+    svg.append(rect, group);
+    map.appendChild(svg);
+    root.append(panel, map);
+    return root;
+};
+export default async function renderGeo(buffer, target, type) {
+    const normalizedType = normalizeGeoType(type);
+    const style = createStyle();
+    const state = document.createElement('div');
+    state.className = 'geo-state';
+    state.textContent = '正在解析地理数据...';
+    target.replaceChildren(style, state);
+    try {
+        const collection = await parseGeo(buffer, normalizedType);
+        target.replaceChildren(style, renderCollection(collection, normalizedType));
+    }
+    catch (error) {
+        console.error(error);
+        state.classList.add('error');
+        state.textContent = error instanceof Error ? error.message : String(error);
+    }
+    return {
+        $el: target,
+        unmount() {
+            target.replaceChildren();
+        },
+    };
+}

package/dist/renderers/image.d.ts

@@ -0,0 +1,2 @@
+import type { FileViewerRenderedInstance } from '../types';
+export default function renderImage(buffer: ArrayBuffer, target: HTMLDivElement, type?: string): Promise<FileViewerRenderedInstance>;