@file-viewer/vue2.7 2.0.0
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/LICENSE +160 -0
- package/README.en.md +180 -0
- package/README.md +180 -0
- package/dist/controller.d.ts +121 -0
- package/dist/controller.js +417 -0
- package/dist/index.d.ts +46 -0
- package/dist/index.js +187 -0
- package/package.json +63 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
Apache License
|
|
2
|
+
Version 2.0, January 2004
|
|
3
|
+
http://www.apache.org/licenses/
|
|
4
|
+
|
|
5
|
+
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
|
6
|
+
|
|
7
|
+
1. Definitions.
|
|
8
|
+
|
|
9
|
+
"License" shall mean the terms and conditions for use, reproduction, and
|
|
10
|
+
distribution as defined by Sections 1 through 9 of this document.
|
|
11
|
+
|
|
12
|
+
"Licensor" shall mean the copyright owner or entity authorized by the copyright
|
|
13
|
+
owner that is granting the License.
|
|
14
|
+
|
|
15
|
+
"Legal Entity" shall mean the union of the acting entity and all other entities
|
|
16
|
+
that control, are controlled by, or are under common control with that entity.
|
|
17
|
+
For the purposes of this definition, "control" means (i) the power, direct or
|
|
18
|
+
indirect, to cause the direction or management of such entity, whether by
|
|
19
|
+
contract or otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
|
20
|
+
outstanding shares, or (iii) beneficial ownership of such entity.
|
|
21
|
+
|
|
22
|
+
"You" (or "Your") shall mean an individual or Legal Entity exercising
|
|
23
|
+
permissions granted by this License.
|
|
24
|
+
|
|
25
|
+
"Source" form shall mean the preferred form for making modifications, including
|
|
26
|
+
but not limited to software source code, documentation source, and configuration
|
|
27
|
+
files.
|
|
28
|
+
|
|
29
|
+
"Object" form shall mean any form resulting from mechanical transformation or
|
|
30
|
+
translation of a Source form, including but not limited to compiled object code,
|
|
31
|
+
generated documentation, and conversions to other media types.
|
|
32
|
+
|
|
33
|
+
"Work" shall mean the work of authorship, whether in Source or Object form,
|
|
34
|
+
made available under the License, as indicated by a copyright notice that is
|
|
35
|
+
included in or attached to the work.
|
|
36
|
+
|
|
37
|
+
"Derivative Works" shall mean any work, whether in Source or Object form, that
|
|
38
|
+
is based on (or derived from) the Work and for which the editorial revisions,
|
|
39
|
+
annotations, elaborations, or other modifications represent, as a whole, an
|
|
40
|
+
original work of authorship. For the purposes of this License, Derivative Works
|
|
41
|
+
shall not include works that remain separable from, or merely link (or bind by
|
|
42
|
+
name) to the interfaces of, the Work and Derivative Works thereof.
|
|
43
|
+
|
|
44
|
+
"Contribution" shall mean any work of authorship, including the original version
|
|
45
|
+
of the Work and any modifications or additions to that Work or Derivative Works
|
|
46
|
+
thereof, that is intentionally submitted to Licensor for inclusion in the Work by
|
|
47
|
+
the copyright owner or by an individual or Legal Entity authorized to submit on
|
|
48
|
+
behalf of the copyright owner. For the purposes of this definition, "submitted"
|
|
49
|
+
means any form of electronic, verbal, or written communication sent to the
|
|
50
|
+
Licensor or its representatives, including but not limited to communication on
|
|
51
|
+
electronic mailing lists, source code control systems, and issue tracking systems
|
|
52
|
+
that are managed by, or on behalf of, the Licensor for the purpose of discussing
|
|
53
|
+
and improving the Work, but excluding communication that is conspicuously marked
|
|
54
|
+
or otherwise designated in writing by the copyright owner as "Not a
|
|
55
|
+
Contribution."
|
|
56
|
+
|
|
57
|
+
"Contributor" shall mean Licensor and any individual or Legal Entity on behalf
|
|
58
|
+
of whom a Contribution has been received by Licensor and subsequently
|
|
59
|
+
incorporated within the Work.
|
|
60
|
+
|
|
61
|
+
2. Grant of Copyright License. Subject to the terms and conditions of this
|
|
62
|
+
License, each Contributor hereby grants to You a perpetual, worldwide,
|
|
63
|
+
non-exclusive, no-charge, royalty-free, irrevocable copyright license to
|
|
64
|
+
reproduce, prepare Derivative Works of, publicly display, publicly perform,
|
|
65
|
+
sublicense, and distribute the Work and such Derivative Works in Source or
|
|
66
|
+
Object form.
|
|
67
|
+
|
|
68
|
+
3. Grant of Patent License. Subject to the terms and conditions of this License,
|
|
69
|
+
each Contributor hereby grants to You a perpetual, worldwide, non-exclusive,
|
|
70
|
+
no-charge, royalty-free, irrevocable (except as stated in this section) patent
|
|
71
|
+
license to make, have made, use, offer to sell, sell, import, and otherwise
|
|
72
|
+
transfer the Work, where such license applies only to those patent claims
|
|
73
|
+
licensable by such Contributor that are necessarily infringed by their
|
|
74
|
+
Contribution(s) alone or by combination of their Contribution(s) with the Work to
|
|
75
|
+
which such Contribution(s) was submitted. If You institute patent litigation
|
|
76
|
+
against any entity (including a cross-claim or counterclaim in a lawsuit)
|
|
77
|
+
alleging that the Work or a Contribution incorporated within the Work
|
|
78
|
+
constitutes direct or contributory patent infringement, then any patent licenses
|
|
79
|
+
granted to You under this License for that Work shall terminate as of the date
|
|
80
|
+
such litigation is filed.
|
|
81
|
+
|
|
82
|
+
4. Redistribution. You may reproduce and distribute copies of the Work or
|
|
83
|
+
Derivative Works thereof in any medium, with or without modifications, and in
|
|
84
|
+
Source or Object form, provided that You meet the following conditions:
|
|
85
|
+
|
|
86
|
+
(a) You must give any other recipients of the Work or Derivative Works a copy of
|
|
87
|
+
this License; and
|
|
88
|
+
|
|
89
|
+
(b) You must cause any modified files to carry prominent notices stating that
|
|
90
|
+
You changed the files; and
|
|
91
|
+
|
|
92
|
+
(c) You must retain, in the Source form of any Derivative Works that You
|
|
93
|
+
distribute, all copyright, patent, trademark, and attribution notices from the
|
|
94
|
+
Source form of the Work, excluding those notices that do not pertain to any part
|
|
95
|
+
of the Derivative Works; and
|
|
96
|
+
|
|
97
|
+
(d) If the Work includes a "NOTICE" text file as part of its distribution, then
|
|
98
|
+
any Derivative Works that You distribute must include a readable copy of the
|
|
99
|
+
attribution notices contained within such NOTICE file, excluding those notices
|
|
100
|
+
that do not pertain to any part of the Derivative Works, in at least one of the
|
|
101
|
+
following places: within a NOTICE text file distributed as part of the Derivative
|
|
102
|
+
Works; within the Source form or documentation, if provided along with the
|
|
103
|
+
Derivative Works; or, within a display generated by the Derivative Works, if and
|
|
104
|
+
wherever such third-party notices normally appear. The contents of the NOTICE
|
|
105
|
+
file are for informational purposes only and do not modify the License. You may
|
|
106
|
+
add Your own attribution notices within Derivative Works that You distribute,
|
|
107
|
+
alongside or as an addendum to the NOTICE text from the Work, provided that such
|
|
108
|
+
additional attribution notices cannot be construed as modifying the License.
|
|
109
|
+
|
|
110
|
+
You may add Your own copyright statement to Your modifications and may provide
|
|
111
|
+
additional or different license terms and conditions for use, reproduction, or
|
|
112
|
+
distribution of Your modifications, or for any such Derivative Works as a whole,
|
|
113
|
+
provided Your use, reproduction, and distribution of the Work otherwise complies
|
|
114
|
+
with the conditions stated in this License.
|
|
115
|
+
|
|
116
|
+
5. Submission of Contributions. Unless You explicitly state otherwise, any
|
|
117
|
+
Contribution intentionally submitted for inclusion in the Work by You to the
|
|
118
|
+
Licensor shall be under the terms and conditions of this License, without any
|
|
119
|
+
additional terms or conditions. Notwithstanding the above, nothing herein shall
|
|
120
|
+
supersede or modify the terms of any separate license agreement you may have
|
|
121
|
+
executed with Licensor regarding such Contributions.
|
|
122
|
+
|
|
123
|
+
6. Trademarks. This License does not grant permission to use the trade names,
|
|
124
|
+
trademarks, service marks, or product names of the Licensor, except as required
|
|
125
|
+
for reasonable and customary use in describing the origin of the Work and
|
|
126
|
+
reproducing the content of the NOTICE file.
|
|
127
|
+
|
|
128
|
+
7. Disclaimer of Warranty. Unless required by applicable law or agreed to in
|
|
129
|
+
writing, Licensor provides the Work (and each Contributor provides its
|
|
130
|
+
Contributions) on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
131
|
+
KIND, either express or implied, including, without limitation, any warranties or
|
|
132
|
+
conditions of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
|
133
|
+
PARTICULAR PURPOSE. You are solely responsible for determining the
|
|
134
|
+
appropriateness of using or redistributing the Work and assume any risks
|
|
135
|
+
associated with Your exercise of permissions under this License.
|
|
136
|
+
|
|
137
|
+
8. Limitation of Liability. In no event and under no legal theory, whether in
|
|
138
|
+
tort (including negligence), contract, or otherwise, unless required by
|
|
139
|
+
applicable law (such as deliberate and grossly negligent acts) or agreed to in
|
|
140
|
+
writing, shall any Contributor be liable to You for damages, including any
|
|
141
|
+
direct, indirect, special, incidental, or consequential damages of any character
|
|
142
|
+
arising as a result of this License or out of the use or inability to use the
|
|
143
|
+
Work (including but not limited to damages for loss of goodwill, work stoppage,
|
|
144
|
+
computer failure or malfunction, or any and all other commercial damages or
|
|
145
|
+
losses), even if such Contributor has been advised of the possibility of such
|
|
146
|
+
damages.
|
|
147
|
+
|
|
148
|
+
9. Accepting Warranty or Additional Liability. While redistributing the Work or
|
|
149
|
+
Derivative Works thereof, You may choose to offer, and charge a fee for,
|
|
150
|
+
acceptance of support, warranty, indemnity, or other liability obligations and/or
|
|
151
|
+
rights consistent with this License. However, in accepting such obligations, You
|
|
152
|
+
may act only on Your own behalf and on Your sole responsibility, not on behalf of
|
|
153
|
+
any other Contributor, and only if You agree to indemnify, defend, and hold each
|
|
154
|
+
Contributor harmless for any liability incurred by, or claims asserted against,
|
|
155
|
+
such Contributor by reason of your accepting any such warranty or additional
|
|
156
|
+
liability.
|
|
157
|
+
|
|
158
|
+
END OF TERMS AND CONDITIONS
|
|
159
|
+
|
|
160
|
+
Copyright 2026 Flyfish Viewer
|
package/README.en.md
ADDED
|
@@ -0,0 +1,180 @@
|
|
|
1
|
+
# @file-viewer/vue2.7
|
|
2
|
+
|
|
3
|
+
The standard Vue 2.7 native component package for Flyfish File Viewer. It supports both `Vue.use()` plugin installation and local component registration. Internally it mounts the complete viewer through its local controller on top of `@file-viewer/core` and the core browser engine, without depending on another framework implementation.
|
|
4
|
+
|
|
5
|
+
```bash
|
|
6
|
+
npm install vue@2.7 @file-viewer/vue2.7
|
|
7
|
+
```
|
|
8
|
+
|
|
9
|
+
## Global Installation
|
|
10
|
+
|
|
11
|
+
```ts
|
|
12
|
+
import Vue from 'vue'
|
|
13
|
+
import FileViewerPlugin from '@file-viewer/vue2.7'
|
|
14
|
+
|
|
15
|
+
Vue.use(FileViewerPlugin)
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
```vue
|
|
19
|
+
<template>
|
|
20
|
+
<section style="height: 100vh">
|
|
21
|
+
<FileViewer
|
|
22
|
+
ref="viewer"
|
|
23
|
+
url="/example/demo.pdf"
|
|
24
|
+
:options="{
|
|
25
|
+
theme: 'light',
|
|
26
|
+
toolbar: { position: 'bottom-right' }
|
|
27
|
+
}"
|
|
28
|
+
@viewer-event="handleViewerEvent"
|
|
29
|
+
/>
|
|
30
|
+
</section>
|
|
31
|
+
</template>
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
## Local Component
|
|
35
|
+
|
|
36
|
+
```ts
|
|
37
|
+
import { FileViewer } from '@file-viewer/vue2.7'
|
|
38
|
+
|
|
39
|
+
export default {
|
|
40
|
+
components: { FileViewer }
|
|
41
|
+
}
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## Instance Methods
|
|
45
|
+
|
|
46
|
+
```ts
|
|
47
|
+
const viewer = this.$refs.viewer
|
|
48
|
+
viewer.reload()
|
|
49
|
+
viewer.update({ url: '/example/report.docx' })
|
|
50
|
+
viewer.destroy()
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
## Capabilities
|
|
54
|
+
|
|
55
|
+
`@file-viewer/vue2.7` shares the same `@file-viewer/core` capabilities, core browser engine, and format matrix as the other standard component packages, including PDF, Word, Excel, PowerPoint, OFD, CAD/DWG/DXF/DWF, EPUB/UMD, archives, email, Markdown, highlighted code, images, audio, video, 3D models, geospatial files, and structured data assets.
|
|
56
|
+
|
|
57
|
+
See the official documentation for the full format matrix, options, lifecycle hooks, beforeOperation, theme, watermark, search, zoom, print, and export APIs: https://doc.flyfish-viewer.app/
|
|
58
|
+
|
|
59
|
+
Chinese README: [README.md](./README.md).
|
|
60
|
+
|
|
61
|
+
<!-- FILE_VIEWER_GENERATED:START -->
|
|
62
|
+
## Ecosystem Matrix
|
|
63
|
+
|
|
64
|
+
Every standard component package shares `@file-viewer/core` as the only common foundation, and no framework component package depends on another framework implementation. Core owns format metadata, source loading, browser/renderers, events, operation APIs, search, zoom, print, and export; each framework package owns its local controller, component lifecycle, type exports, and ecosystem-specific interaction layer.
|
|
65
|
+
|
|
66
|
+
| Framework | Standard npm package | Entrypoints | GitHub | Gitee | Historical aliases |
|
|
67
|
+
| --- | --- | --- | --- | --- | --- |
|
|
68
|
+
| Vue 3 | `@file-viewer/vue3` | ESM, type declarations | [file-viewer-vue3](https://github.com/flyfish-dev/file-viewer-vue3) | [file-viewer-vue3](https://gitee.com/flyfish-dev/file-viewer-vue3) | `@flyfish-group/file-viewer3`, `file-viewer3` |
|
|
69
|
+
| Vue 2.7 | `@file-viewer/vue2.7` | ESM, type declarations | [file-viewer-vue2.7](https://github.com/flyfish-dev/file-viewer-vue2.7) | [file-viewer-vue2.7](https://gitee.com/flyfish-dev/file-viewer-vue2.7) | `@flyfish-group/file-viewer` |
|
|
70
|
+
| Vue 2.6 | `@file-viewer/vue2.6` | ESM, type declarations | [file-viewer-vue2.6](https://github.com/flyfish-dev/file-viewer-vue2.6) | [file-viewer-vue2.6](https://gitee.com/flyfish-dev/file-viewer-vue2.6) | none |
|
|
71
|
+
| React 18/19 | `@file-viewer/react` | ESM, type declarations | [file-viewer-react](https://github.com/flyfish-dev/file-viewer-react) | [file-viewer-react](https://gitee.com/flyfish-dev/file-viewer-react) | `@flyfish-group/file-viewer-react` |
|
|
72
|
+
| React 16.8/17 | `@file-viewer/react-legacy` | ESM, type declarations | [file-viewer-react-legacy](https://github.com/flyfish-dev/file-viewer-react-legacy) | [file-viewer-react-legacy](https://gitee.com/flyfish-dev/file-viewer-react-legacy) | none |
|
|
73
|
+
| Pure Web | `@file-viewer/web` | ESM, type declarations, script tag IIFE, worker/WASM viewer assets, asset copy CLI | [file-viewer-web](https://github.com/flyfish-dev/file-viewer-web) | [file-viewer-web](https://gitee.com/flyfish-dev/file-viewer-web) | `@flyfish-group/file-viewer-web` |
|
|
74
|
+
| jQuery | `@file-viewer/jquery` | ESM, type declarations | [file-viewer-jquery](https://github.com/flyfish-dev/file-viewer-jquery) | [file-viewer-jquery](https://gitee.com/flyfish-dev/file-viewer-jquery) | none |
|
|
75
|
+
| Svelte | `@file-viewer/svelte` | Svelte component, ESM, type declarations | [file-viewer-svelte](https://github.com/flyfish-dev/file-viewer-svelte) | [file-viewer-svelte](https://gitee.com/flyfish-dev/file-viewer-svelte) | none |
|
|
76
|
+
|
|
77
|
+
## Format Support Matrix
|
|
78
|
+
|
|
79
|
+
The shared core currently covers 23 preview pipelines and 194 file extensions. Renderers stay lazy-loaded, and component packages only adapt their own ecosystem without nesting through another framework implementation.
|
|
80
|
+
|
|
81
|
+
| Preview pipeline | Category | Extensions | Capabilities | Loading |
|
|
82
|
+
| --- | --- | --- | --- | --- |
|
|
83
|
+
| Word OpenXML | office | `.docx`, `.docm`, `.dotx`, `.dotm` | download, print(adapter), HTML export(adapter), zoom(provider), search | lazy async |
|
|
84
|
+
| Word Binary | office | `.doc`, `.dot` | download, print(adapter), HTML export(adapter), zoom(provider), search | lazy async |
|
|
85
|
+
| PowerPoint | office | `.pptx`, `.pptm`, `.potx`, `.potm`, `.ppsx`, `.ppsm` | download, print, HTML export, zoom(provider), search | lazy async |
|
|
86
|
+
| Open Document | office | `.rtf`, `.odt`, `.odp` | download, print, HTML export, zoom(provider), search | lazy async |
|
|
87
|
+
| Spreadsheet | office | `.xlsx`, `.xltx`, `.xlsm`, `.xlsb`, `.xls`, `.xlt`, `.xltm`, `.csv`, `.ods`, `.fods`, `.numbers` | download, zoom(provider), search | lazy async |
|
|
88
|
+
| PDF | document | `.pdf` | download, print(adapter), HTML export(adapter), zoom(provider), search(provider) | lazy async |
|
|
89
|
+
| OFD | document | `.ofd` | download, print, HTML export, zoom(provider), search | lazy async |
|
|
90
|
+
| Typst | document | `.typ`, `.typst` | download, print(adapter), HTML export(adapter), zoom(provider), search | lazy async |
|
|
91
|
+
| Archive | archive | `.zip`, `.zipx`, `.7z`, `.rar`, `.tar`, `.gz`, `.gzip`, `.tgz`, `.bz2`, `.bzip2`, `.tbz`, `.tbz2`, `.xz`, `.txz`, `.lzma`, `.zst`, `.tzst`, `.cab`, `.ar`, `.cpio`, `.iso`, `.xar`, `.lha`, `.lzh`, `.jar`, `.war`, `.ear`, `.apk`, `.cbz`, `.cbr` | download, search | lazy async |
|
|
92
|
+
| Email | email | `.eml`, `.msg`, `.mbox` | download, HTML export, search | lazy async |
|
|
93
|
+
| EDA | eda | `.olb`, `.dra` | download, print, HTML export, search | lazy async |
|
|
94
|
+
| CAD | cad | `.dxf`, `.dwg`, `.dwf`, `.dwfx`, `.xps` | download, print, HTML export, zoom(provider) | lazy async |
|
|
95
|
+
| 3D Model | model | `.glb`, `.gltf`, `.obj`, `.stl`, `.ply`, `.fbx`, `.dae`, `.3ds`, `.3mf`, `.amf`, `.usd`, `.usda`, `.usdc`, `.usdz`, `.kmz`, `.step`, `.stp`, `.iges`, `.igs`, `.ifc`, `.3dm`, `.pcd`, `.wrl`, `.vrml`, `.xyz`, `.vtk`, `.vtp` | download, zoom(provider) | lazy async |
|
|
96
|
+
| Geospatial | geo | `.geojson`, `.kml`, `.gpx`, `.shp` | download, print, HTML export, zoom(provider), search | lazy async |
|
|
97
|
+
| Drawing | drawing | `.excalidraw`, `.drawio`, `.dio` | download, print, HTML export, zoom(provider), search | lazy async |
|
|
98
|
+
| EPUB | ebook | `.epub` | download, HTML export, search(provider) | lazy async |
|
|
99
|
+
| UMD | ebook | `.umd` | download, print, HTML export, zoom(provider), search | lazy async |
|
|
100
|
+
| Image | image | `.gif`, `.jpg`, `.jpeg`, `.bmp`, `.tiff`, `.tif`, `.png`, `.svg`, `.webp`, `.avif`, `.ico`, `.heic`, `.heif`, `.jxl` | download, print, HTML export, zoom(provider) | lazy async |
|
|
101
|
+
| Markdown | markdown | `.md`, `.markdown` | download, print, HTML export, search | lazy async |
|
|
102
|
+
| Code and Text | code | `.txt`, `.json`, `.js`, `.mjs`, `.cjs`, `.css`, `.java`, `.py`, `.html`, `.htm`, `.jsx`, `.ts`, `.tsx`, `.xml`, `.log`, `.vue`, `.yaml`, `.yml`, `.ini`, `.sh`, `.bash`, `.sql`, `.go`, `.rs`, `.php`, `.c`, `.cpp`, `.cc`, `.h`, `.hpp`, `.cs`, `.diff`, `.jsonc`, `.json5`, `.ipynb`, `.toml`, `.proto`, `.hcl`, `.tex`, `.gv`, `.http`, `.react`, `.rb`, `.swift`, `.kt` | download, print, HTML export, search | lazy async |
|
|
103
|
+
| Video | media | `.mp4`, `.webm`, `.m3u8` | download | lazy async |
|
|
104
|
+
| Audio | media | `.mp3`, `.mpeg`, `.wav`, `.ogg`, `.oga`, `.opus`, `.m4a`, `.aac`, `.flac`, `.weba`, `.midi`, `.mid` | download | lazy async |
|
|
105
|
+
| Data Asset | asset | `.ttf`, `.otf`, `.woff`, `.woff2`, `.psd`, `.ai`, `.eps`, `.sqlite`, `.wasm`, `.parquet`, `.avro`, `.webarchive` | download, HTML export, search | lazy async |
|
|
106
|
+
|
|
107
|
+
## Shared Options And Events
|
|
108
|
+
|
|
109
|
+
Every ecosystem package uses the same `ViewerMountOptions` and `FileViewerOptions` semantics, mapped to framework-native props, events, refs, actions, or plugin APIs.
|
|
110
|
+
|
|
111
|
+
| Option | Description |
|
|
112
|
+
| --- | --- |
|
|
113
|
+
| `url` | Remote file URL for CDN, object storage, or business API file links. |
|
|
114
|
+
| `file` | `File`, `Blob`, or `ArrayBuffer` for uploads, local selection, or already-fetched binary data. |
|
|
115
|
+
| `buffer` | Direct `ArrayBuffer` input after custom download, authorization, or decryption. |
|
|
116
|
+
| `name` / `filename` | Display name and extension hint. Pass it explicitly when the URL has no useful extension. |
|
|
117
|
+
| `type` | Explicit extension or MIME hint that overrides automatic detection. |
|
|
118
|
+
| `size` | File size hint used in lifecycle context, loading states, and safety limits. |
|
|
119
|
+
| `options` | The shared `FileViewerOptions` surface. Every component package keeps the same semantics. |
|
|
120
|
+
| `onEvent` / `onStateChange` | Unified event and state subscriptions for imperative wrappers such as Pure Web, React, and Svelte. Vue maps the same events to native emits. |
|
|
121
|
+
|
|
122
|
+
| Options Field | Description |
|
|
123
|
+
| --- | --- |
|
|
124
|
+
| `theme` | `light`, `dark`, or `system`. This takes precedence over browser `prefers-color-scheme`. |
|
|
125
|
+
| `watermark` | Text or image watermark with opacity, rotation, gap, size, font, and color controls. |
|
|
126
|
+
| `toolbar` | Controls download, print, HTML export, zoom, toolbar position, and operation-level preflight checks. |
|
|
127
|
+
| `search` | Document search, highlight class names, case sensitivity, whole-word matching, max matches, and debounce. |
|
|
128
|
+
| `ai` | Text collection, chunk size, and max text length for provenance, location, vectorization, and external AI workflows. |
|
|
129
|
+
| `archive` | Archive Worker/WASM URLs, timeout, cache, archive limits, and nested entry preview limits. |
|
|
130
|
+
| `pdf` | PDF.js worker, navigation pane, outline, rotation, streaming, range chunk size, and credentials. |
|
|
131
|
+
| `docx` / `spreadsheet` | DOCX and Spreadsheet default to fidelity-first main-thread rendering; Worker/progressive paths are explicit opt-in. |
|
|
132
|
+
| `typst` / `data` / `cad` | Typst, SQLite, CAD/DWG/DXF/DWF WASM, worker, encoding, and rendering strategy options. |
|
|
133
|
+
| `hooks` / `beforeOperation` | Shared lifecycle hooks and operation preflight checks for audit, permission, telemetry, and safety controls. |
|
|
134
|
+
|
|
135
|
+
## Lifecycle And Operation Events
|
|
136
|
+
|
|
137
|
+
| Event / hook | Description |
|
|
138
|
+
| --- | --- |
|
|
139
|
+
| `load-start` / `hooks.onLoadStart` | Fires when parsing or downloading starts. Context includes filename, type, source, version, URL, File, and size. |
|
|
140
|
+
| `load-complete` / `hooks.onLoadComplete` | Fires when the current document has rendered. Context includes duration, source data, and version. |
|
|
141
|
+
| `unload-start` / `hooks.onUnloadStart` | Fires before replace, reset, or component unmount so external state or resources can be saved. |
|
|
142
|
+
| `unload-complete` / `hooks.onUnloadComplete` | Fires after the previous document is released. The reason is `replace`, `reset`, or `component-unmount`. |
|
|
143
|
+
| `operation-before` / `operation-cancel` | Fires around download, print, HTML export, and zoom actions. Returning `false` from `beforeOperation` cancels the action. |
|
|
144
|
+
| `operation-availability-change` | Fires when download, print, HTML export, or zoom support changes for the active format. |
|
|
145
|
+
| `search-change` / `location-change` / `zoom-change` | Fires when search matches, document anchors, or zoom state changes so host UIs can stay in sync. |
|
|
146
|
+
|
|
147
|
+
## Public Operation API
|
|
148
|
+
|
|
149
|
+
| API | Description |
|
|
150
|
+
| --- | --- |
|
|
151
|
+
| `load` / `update` / `reload` / `destroy` | Imperatively load, update, reload, and destroy the viewer. |
|
|
152
|
+
| `downloadOriginalFile()` | Downloads the original file while respecting toolbar and `beforeOperation` checks. |
|
|
153
|
+
| `printRenderedHtml()` | Prints the complete rendered document using the best available per-format print adapter. |
|
|
154
|
+
| `exportRenderedHtml()` | Exports rendered HTML for archiving, audit, or offline review. |
|
|
155
|
+
| `zoomIn()` / `zoomOut()` / `resetZoom()` | Uses the active renderer zoom provider instead of outer CSS transforms that can break coordinates. |
|
|
156
|
+
| `searchDocument()` / `nextSearchResult()` / `previousSearchResult()` | Runs document-level search and navigates highlighted matches. |
|
|
157
|
+
| `collectDocumentAnchors()` / `scrollToAnchor()` / `scrollToLine()` | Collects pages, outline items, headings, or code-line anchors and scrolls to them. |
|
|
158
|
+
| `getDocumentTextChunks()` | Returns structured text chunks for search, AI provenance, vectorization, and external indexes. |
|
|
159
|
+
| `getOperationAvailability()` / `getZoomState()` / `getSearchState()` | Reads current capability, zoom, and search state for custom toolbars. |
|
|
160
|
+
|
|
161
|
+
## Workers, WASM, And Private Deployment
|
|
162
|
+
|
|
163
|
+
| Asset | Description |
|
|
164
|
+
| --- | --- |
|
|
165
|
+
| Shared viewer assets | The Pure Web package ships `file-viewer-copy-assets` to copy workers, WASM, vendor files, and examples into your static directory. |
|
|
166
|
+
| CAD / DWG / DXF / DWF | Configure `options.cad.wasmPath`, `workerUrl`, `dwfWasmUrl`, and `dxfEncoding` for self-hosted or intranet deployment. |
|
|
167
|
+
| PDF / DOCX / Excel | Configure `options.pdf.workerUrl`, `options.docx.workerUrl`, and `options.spreadsheet.workerUrl`; DOCX and Excel Workers are explicit opt-in to avoid local-server, mobile WebView, MIME/CSP, or complex-style issues. |
|
|
168
|
+
| Typst / SQLite / Archive | Configure Typst compiler/renderer WASM, `data.sqlWasmUrl`, and `archive.workerUrl` / `archive.wasmUrl` as needed. |
|
|
169
|
+
| Deployment principle | Heavy workers, WASM files, and parser libraries stay lazy-loaded and are only requested when the active file type needs them. |
|
|
170
|
+
|
|
171
|
+
## Quality Gates
|
|
172
|
+
|
|
173
|
+
- Component packages only depend on `@file-viewer/core` and their own ecosystem dependencies. They do not nest through another framework component package.
|
|
174
|
+
- Format parsing, search, zoom, print, export, watermark, lifecycle, and beforeOperation semantics all come from the same core.
|
|
175
|
+
- Releases should pass type checks, component API verification, README generation checks, format-matrix verification, standalone repository export, and browser smoke tests.
|
|
176
|
+
|
|
177
|
+
See the official documentation for options, lifecycle hooks, beforeOperation, theme, watermark, search, zoom, print, and export APIs: https://doc.flyfish-viewer.app/
|
|
178
|
+
|
|
179
|
+
Online demo: https://viewer.flyfish.dev/. License: Apache-2.0. For second development or commercial use, keep clear Flyfish Viewer attribution; shared compatibility fixes are welcome in the matching component repository.
|
|
180
|
+
<!-- FILE_VIEWER_GENERATED:END -->
|
package/README.md
ADDED
|
@@ -0,0 +1,180 @@
|
|
|
1
|
+
# @file-viewer/vue2.7
|
|
2
|
+
|
|
3
|
+
标准 Vue 2.7 native 组件包,提供 `Vue.use()` 插件安装和局部组件两种方式。组件内部通过本包本地 controller 调用 `@file-viewer/core` 与 core browser engine 挂载完整预览器,不依赖其他组件包。
|
|
4
|
+
|
|
5
|
+
```bash
|
|
6
|
+
npm install vue@2.7 @file-viewer/vue2.7
|
|
7
|
+
```
|
|
8
|
+
|
|
9
|
+
## 全局安装
|
|
10
|
+
|
|
11
|
+
```ts
|
|
12
|
+
import Vue from 'vue'
|
|
13
|
+
import FileViewerPlugin from '@file-viewer/vue2.7'
|
|
14
|
+
|
|
15
|
+
Vue.use(FileViewerPlugin)
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
```vue
|
|
19
|
+
<template>
|
|
20
|
+
<section style="height: 100vh">
|
|
21
|
+
<FileViewer
|
|
22
|
+
ref="viewer"
|
|
23
|
+
url="/example/demo.pdf"
|
|
24
|
+
:options="{
|
|
25
|
+
theme: 'light',
|
|
26
|
+
toolbar: { position: 'bottom-right' }
|
|
27
|
+
}"
|
|
28
|
+
@viewer-event="handleViewerEvent"
|
|
29
|
+
/>
|
|
30
|
+
</section>
|
|
31
|
+
</template>
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
## 局部组件
|
|
35
|
+
|
|
36
|
+
```ts
|
|
37
|
+
import { FileViewer } from '@file-viewer/vue2.7'
|
|
38
|
+
|
|
39
|
+
export default {
|
|
40
|
+
components: { FileViewer }
|
|
41
|
+
}
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## 实例方法
|
|
45
|
+
|
|
46
|
+
```ts
|
|
47
|
+
const viewer = this.$refs.viewer
|
|
48
|
+
viewer.reload()
|
|
49
|
+
viewer.update({ url: '/example/report.docx' })
|
|
50
|
+
viewer.destroy()
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
## 能力范围
|
|
54
|
+
|
|
55
|
+
`@file-viewer/vue2.7` 与纯 Web、Vue3 基线 viewer 共享同一套 `@file-viewer/core` 能力,覆盖 PDF、Word、Excel、PPT、OFD、CAD/DWG/DXF/DWF、EPUB/UMD、压缩包、邮件、Markdown、代码高亮、图片、音频、视频、3D 模型、地理数据和结构化数据资产等预览链路。
|
|
56
|
+
|
|
57
|
+
完整格式矩阵、参数、生命周期 hooks、beforeOperation、主题、水印、搜索、缩放、打印和导出能力请查看官方文档: https://doc.flyfish-viewer.app/
|
|
58
|
+
|
|
59
|
+
English README: [README.en.md](./README.en.md)。
|
|
60
|
+
|
|
61
|
+
<!-- FILE_VIEWER_GENERATED:START -->
|
|
62
|
+
## 生态包矩阵
|
|
63
|
+
|
|
64
|
+
所有标准组件包都只共享 `@file-viewer/core` 这个总底座,不依赖其他框架组件实现。core 内部负责格式矩阵、资源解析、browser/renderers、事件、操作 API、搜索、缩放、打印和导出;各框架组件包自己维护本地 controller、组件生命周期、类型出口和生态交互。
|
|
65
|
+
|
|
66
|
+
| 框架 | 标准 npm 包 | 入口格式 | GitHub | Gitee | 兼容历史包 |
|
|
67
|
+
| --- | --- | --- | --- | --- | --- |
|
|
68
|
+
| Vue 3 | `@file-viewer/vue3` | ESM, 类型声明 | [file-viewer-vue3](https://github.com/flyfish-dev/file-viewer-vue3) | [file-viewer-vue3](https://gitee.com/flyfish-dev/file-viewer-vue3) | `@flyfish-group/file-viewer3`, `file-viewer3` |
|
|
69
|
+
| Vue 2.7 | `@file-viewer/vue2.7` | ESM, 类型声明 | [file-viewer-vue2.7](https://github.com/flyfish-dev/file-viewer-vue2.7) | [file-viewer-vue2.7](https://gitee.com/flyfish-dev/file-viewer-vue2.7) | `@flyfish-group/file-viewer` |
|
|
70
|
+
| Vue 2.6 | `@file-viewer/vue2.6` | ESM, 类型声明 | [file-viewer-vue2.6](https://github.com/flyfish-dev/file-viewer-vue2.6) | [file-viewer-vue2.6](https://gitee.com/flyfish-dev/file-viewer-vue2.6) | 无 |
|
|
71
|
+
| React 18/19 | `@file-viewer/react` | ESM, 类型声明 | [file-viewer-react](https://github.com/flyfish-dev/file-viewer-react) | [file-viewer-react](https://gitee.com/flyfish-dev/file-viewer-react) | `@flyfish-group/file-viewer-react` |
|
|
72
|
+
| React 16.8/17 | `@file-viewer/react-legacy` | ESM, 类型声明 | [file-viewer-react-legacy](https://github.com/flyfish-dev/file-viewer-react-legacy) | [file-viewer-react-legacy](https://gitee.com/flyfish-dev/file-viewer-react-legacy) | 无 |
|
|
73
|
+
| Pure Web | `@file-viewer/web` | ESM, 类型声明, script 标签 IIFE, Worker/WASM viewer 资源, 复制静态资源 CLI | [file-viewer-web](https://github.com/flyfish-dev/file-viewer-web) | [file-viewer-web](https://gitee.com/flyfish-dev/file-viewer-web) | `@flyfish-group/file-viewer-web` |
|
|
74
|
+
| jQuery | `@file-viewer/jquery` | ESM, 类型声明 | [file-viewer-jquery](https://github.com/flyfish-dev/file-viewer-jquery) | [file-viewer-jquery](https://gitee.com/flyfish-dev/file-viewer-jquery) | 无 |
|
|
75
|
+
| Svelte | `@file-viewer/svelte` | Svelte 组件, ESM, 类型声明 | [file-viewer-svelte](https://github.com/flyfish-dev/file-viewer-svelte) | [file-viewer-svelte](https://gitee.com/flyfish-dev/file-viewer-svelte) | 无 |
|
|
76
|
+
|
|
77
|
+
## 格式支持矩阵
|
|
78
|
+
|
|
79
|
+
共享 core 当前覆盖 23 条预览链路、194 个扩展名。所有格式都按需异步加载,组件层只做生态适配,不互相嵌套。
|
|
80
|
+
|
|
81
|
+
| 预览链路 | 分类 | 扩展名 | 能力 | 加载 |
|
|
82
|
+
| --- | --- | --- | --- | --- |
|
|
83
|
+
| Word OpenXML | office | `.docx`, `.docm`, `.dotx`, `.dotm` | 下载, 打印(适配器), HTML(适配器), 缩放(Provider), 搜索 | 按需异步 |
|
|
84
|
+
| Word Binary | office | `.doc`, `.dot` | 下载, 打印(适配器), HTML(适配器), 缩放(Provider), 搜索 | 按需异步 |
|
|
85
|
+
| PowerPoint | office | `.pptx`, `.pptm`, `.potx`, `.potm`, `.ppsx`, `.ppsm` | 下载, 打印, HTML, 缩放(Provider), 搜索 | 按需异步 |
|
|
86
|
+
| Open Document | office | `.rtf`, `.odt`, `.odp` | 下载, 打印, HTML, 缩放(Provider), 搜索 | 按需异步 |
|
|
87
|
+
| Spreadsheet | office | `.xlsx`, `.xltx`, `.xlsm`, `.xlsb`, `.xls`, `.xlt`, `.xltm`, `.csv`, `.ods`, `.fods`, `.numbers` | 下载, 缩放(Provider), 搜索 | 按需异步 |
|
|
88
|
+
| PDF | document | `.pdf` | 下载, 打印(适配器), HTML(适配器), 缩放(Provider), 搜索(Provider) | 按需异步 |
|
|
89
|
+
| OFD | document | `.ofd` | 下载, 打印, HTML, 缩放(Provider), 搜索 | 按需异步 |
|
|
90
|
+
| Typst | document | `.typ`, `.typst` | 下载, 打印(适配器), HTML(适配器), 缩放(Provider), 搜索 | 按需异步 |
|
|
91
|
+
| Archive | archive | `.zip`, `.zipx`, `.7z`, `.rar`, `.tar`, `.gz`, `.gzip`, `.tgz`, `.bz2`, `.bzip2`, `.tbz`, `.tbz2`, `.xz`, `.txz`, `.lzma`, `.zst`, `.tzst`, `.cab`, `.ar`, `.cpio`, `.iso`, `.xar`, `.lha`, `.lzh`, `.jar`, `.war`, `.ear`, `.apk`, `.cbz`, `.cbr` | 下载, 搜索 | 按需异步 |
|
|
92
|
+
| Email | email | `.eml`, `.msg`, `.mbox` | 下载, HTML, 搜索 | 按需异步 |
|
|
93
|
+
| EDA | eda | `.olb`, `.dra` | 下载, 打印, HTML, 搜索 | 按需异步 |
|
|
94
|
+
| CAD | cad | `.dxf`, `.dwg`, `.dwf`, `.dwfx`, `.xps` | 下载, 打印, HTML, 缩放(Provider) | 按需异步 |
|
|
95
|
+
| 3D Model | model | `.glb`, `.gltf`, `.obj`, `.stl`, `.ply`, `.fbx`, `.dae`, `.3ds`, `.3mf`, `.amf`, `.usd`, `.usda`, `.usdc`, `.usdz`, `.kmz`, `.step`, `.stp`, `.iges`, `.igs`, `.ifc`, `.3dm`, `.pcd`, `.wrl`, `.vrml`, `.xyz`, `.vtk`, `.vtp` | 下载, 缩放(Provider) | 按需异步 |
|
|
96
|
+
| Geospatial | geo | `.geojson`, `.kml`, `.gpx`, `.shp` | 下载, 打印, HTML, 缩放(Provider), 搜索 | 按需异步 |
|
|
97
|
+
| Drawing | drawing | `.excalidraw`, `.drawio`, `.dio` | 下载, 打印, HTML, 缩放(Provider), 搜索 | 按需异步 |
|
|
98
|
+
| EPUB | ebook | `.epub` | 下载, HTML, 搜索(Provider) | 按需异步 |
|
|
99
|
+
| UMD | ebook | `.umd` | 下载, 打印, HTML, 缩放(Provider), 搜索 | 按需异步 |
|
|
100
|
+
| Image | image | `.gif`, `.jpg`, `.jpeg`, `.bmp`, `.tiff`, `.tif`, `.png`, `.svg`, `.webp`, `.avif`, `.ico`, `.heic`, `.heif`, `.jxl` | 下载, 打印, HTML, 缩放(Provider) | 按需异步 |
|
|
101
|
+
| Markdown | markdown | `.md`, `.markdown` | 下载, 打印, HTML, 搜索 | 按需异步 |
|
|
102
|
+
| Code and Text | code | `.txt`, `.json`, `.js`, `.mjs`, `.cjs`, `.css`, `.java`, `.py`, `.html`, `.htm`, `.jsx`, `.ts`, `.tsx`, `.xml`, `.log`, `.vue`, `.yaml`, `.yml`, `.ini`, `.sh`, `.bash`, `.sql`, `.go`, `.rs`, `.php`, `.c`, `.cpp`, `.cc`, `.h`, `.hpp`, `.cs`, `.diff`, `.jsonc`, `.json5`, `.ipynb`, `.toml`, `.proto`, `.hcl`, `.tex`, `.gv`, `.http`, `.react`, `.rb`, `.swift`, `.kt` | 下载, 打印, HTML, 搜索 | 按需异步 |
|
|
103
|
+
| Video | media | `.mp4`, `.webm`, `.m3u8` | 下载 | 按需异步 |
|
|
104
|
+
| Audio | media | `.mp3`, `.mpeg`, `.wav`, `.ogg`, `.oga`, `.opus`, `.m4a`, `.aac`, `.flac`, `.weba`, `.midi`, `.mid` | 下载 | 按需异步 |
|
|
105
|
+
| Data Asset | asset | `.ttf`, `.otf`, `.woff`, `.woff2`, `.psd`, `.ai`, `.eps`, `.sqlite`, `.wasm`, `.parquet`, `.avro`, `.webarchive` | 下载, HTML, 搜索 | 按需异步 |
|
|
106
|
+
|
|
107
|
+
## 统一参数与事件
|
|
108
|
+
|
|
109
|
+
所有生态组件都围绕同一套 `ViewerMountOptions` 与 `FileViewerOptions` 工作,只是映射到各自框架的 props、事件、ref、action 或插件 API。
|
|
110
|
+
|
|
111
|
+
| 参数 | 说明 |
|
|
112
|
+
| --- | --- |
|
|
113
|
+
| `url` | 远程文件地址,适合 CDN、对象存储和业务接口返回的文件链接。 |
|
|
114
|
+
| `file` | `File`、`Blob` 或 `ArrayBuffer`,适合上传、本地选择和业务接口已取回的二进制。 |
|
|
115
|
+
| `buffer` | 直接传入 `ArrayBuffer`,适合解密、鉴权或自定义下载后再预览。 |
|
|
116
|
+
| `name` / `filename` | 显示文件名并辅助推断扩展名;当 URL 不含扩展名时建议显式传入。 |
|
|
117
|
+
| `type` | 显式指定扩展名或 MIME 线索,覆盖自动识别结果。 |
|
|
118
|
+
| `size` | 文件大小提示,用于生命周期上下文、加载状态和安全限制展示。 |
|
|
119
|
+
| `options` | 完整 `FileViewerOptions`,所有框架包保持同一套参数语义。 |
|
|
120
|
+
| `onEvent` / `onStateChange` | Pure Web、React、Svelte 等命令式包装层的统一事件和状态订阅;Vue 组件会映射为原生 emit。 |
|
|
121
|
+
|
|
122
|
+
| Options 字段 | 说明 |
|
|
123
|
+
| --- | --- |
|
|
124
|
+
| `theme` | `light`、`dark` 或 `system`,优先级高于浏览器 `prefers-color-scheme`。 |
|
|
125
|
+
| `watermark` | 开启文字或图片水印,可设置透明度、旋转、间距、尺寸、字体和颜色。 |
|
|
126
|
+
| `toolbar` | 控制下载、打印、HTML 导出、缩放和工具栏位置,并支持操作级前置校验。 |
|
|
127
|
+
| `search` | 配置文档搜索、高亮 class、大小写、整词匹配、最大命中数和 debounce。 |
|
|
128
|
+
| `ai` | 控制文本结构采集、分块大小和最大文本长度,为溯源、定位、向量化和外部 AI 流程提供基础。 |
|
|
129
|
+
| `archive` | 配置压缩包 Worker/WASM、超时、缓存、包体限制和压缩包内单文件预览大小。 |
|
|
130
|
+
| `pdf` | 配置 PDF.js Worker、导航栏、目录、旋转、流式读取、Range chunk 和凭据。 |
|
|
131
|
+
| `docx` / `spreadsheet` | DOCX 与表格默认保真主线程渲染,Worker / 渐进挂载可按需显式开启。 |
|
|
132
|
+
| `typst` / `data` / `cad` | 配置 Typst、SQLite、CAD/DWG/DXF/DWF 等 WASM、Worker、编码和渲染策略。 |
|
|
133
|
+
| `hooks` / `beforeOperation` | 统一生命周期 hooks 和操作前置校验,可用于审计、权限、埋点和安全控制。 |
|
|
134
|
+
|
|
135
|
+
## 生命周期与操作事件
|
|
136
|
+
|
|
137
|
+
| 事件 / hook | 说明 |
|
|
138
|
+
| --- | --- |
|
|
139
|
+
| `load-start` / `hooks.onLoadStart` | 开始解析或下载文档时触发,包含文件名、类型、来源、版本、URL、File 和 size。 |
|
|
140
|
+
| `load-complete` / `hooks.onLoadComplete` | 当前文档完成渲染时触发,包含耗时、来源上下文和版本号。 |
|
|
141
|
+
| `unload-start` / `hooks.onUnloadStart` | 替换、重置或组件卸载前触发,可用于保存状态或释放外部资源。 |
|
|
142
|
+
| `unload-complete` / `hooks.onUnloadComplete` | 旧文档释放完成后触发,reason 会标识 `replace`、`reset` 或 `component-unmount`。 |
|
|
143
|
+
| `operation-before` / `operation-cancel` | 下载、打印、HTML 导出和缩放前后触发;`beforeOperation` 返回 `false` 可取消操作。 |
|
|
144
|
+
| `operation-availability-change` | 当前格式是否可下载、可打印、可导出 HTML、可缩放发生变化时触发。 |
|
|
145
|
+
| `search-change` / `location-change` / `zoom-change` | 搜索命中、定位锚点和缩放状态变化时触发,用于外层同步 UI。 |
|
|
146
|
+
|
|
147
|
+
## 公共操作 API
|
|
148
|
+
|
|
149
|
+
| API | 说明 |
|
|
150
|
+
| --- | --- |
|
|
151
|
+
| `load` / `update` / `reload` / `destroy` | 命令式控制文档加载、参数更新、重新加载和销毁。 |
|
|
152
|
+
| `downloadOriginalFile()` | 下载原始文件,遵循 toolbar 与 `beforeOperation` 权限校验。 |
|
|
153
|
+
| `printRenderedHtml()` | 打印当前完整渲染内容,优先使用各格式的高保真打印适配器。 |
|
|
154
|
+
| `exportRenderedHtml()` | 导出当前渲染后的 HTML,用于归档、审计和离线查看。 |
|
|
155
|
+
| `zoomIn()` / `zoomOut()` / `resetZoom()` | 调用当前格式自己的缩放 provider,避免外层 CSS 缩放导致坐标偏移。 |
|
|
156
|
+
| `searchDocument()` / `nextSearchResult()` / `previousSearchResult()` | 打开文档级搜索并在命中之间导航,保持高亮状态。 |
|
|
157
|
+
| `collectDocumentAnchors()` / `scrollToAnchor()` / `scrollToLine()` | 采集页面、目录、标题或代码行锚点,并执行定位跳转。 |
|
|
158
|
+
| `getDocumentTextChunks()` | 获取结构化文本块,便于搜索、AI 溯源、向量化和外部索引。 |
|
|
159
|
+
| `getOperationAvailability()` / `getZoomState()` / `getSearchState()` | 读取当前能力、缩放和搜索状态,便于自定义工具栏。 |
|
|
160
|
+
|
|
161
|
+
## Worker、WASM 与私有化部署
|
|
162
|
+
|
|
163
|
+
| 资源 | 说明 |
|
|
164
|
+
| --- | --- |
|
|
165
|
+
| 通用 viewer assets | Pure Web 包提供 `file-viewer-copy-assets`,可把 Worker、WASM、vendor 和示例资源复制到业务静态目录。 |
|
|
166
|
+
| CAD / DWG / DXF / DWF | 按需配置 `options.cad.wasmPath`、`workerUrl`、`dwfWasmUrl`、`dxfEncoding`,支持自托管和内网部署。 |
|
|
167
|
+
| PDF / DOCX / Excel | 按需配置 `options.pdf.workerUrl`、`options.docx.workerUrl`、`options.spreadsheet.workerUrl`;DOCX 和 Excel Worker 均需显式开启,避免本地服务、手机 WebView、MIME/CSP 或复杂样式问题。 |
|
|
168
|
+
| Typst / SQLite / Archive | 按需配置 Typst compiler/renderer WASM、`data.sqlWasmUrl`、`archive.workerUrl` / `archive.wasmUrl`。 |
|
|
169
|
+
| 部署原则 | 默认只在命中特定格式时异步加载对应依赖;没有命中的格式不会拉取重型 Worker、WASM 或解析库。 |
|
|
170
|
+
|
|
171
|
+
## 质量门禁
|
|
172
|
+
|
|
173
|
+
- 组件包只依赖 `@file-viewer/core` 和自身生态依赖,不嵌套引用其他框架组件包。
|
|
174
|
+
- 格式解析、搜索、缩放、打印、导出、水印、生命周期和 beforeOperation 语义全部来自同一个 core。
|
|
175
|
+
- 发布前需通过类型检查、组件 API 校验、README 生成校验、格式矩阵校验、独立仓库导出和浏览器 smoke。
|
|
176
|
+
|
|
177
|
+
完整参数、生命周期 hooks、beforeOperation、主题、水印、搜索、缩放、打印和导出说明见官方文档: https://doc.flyfish-viewer.app/
|
|
178
|
+
|
|
179
|
+
在线 Demo: https://viewer.flyfish.dev/ 。License: Apache-2.0。二开或商用请保留 Flyfish Viewer 来源说明;如果修复了通用兼容问题,也欢迎贡献回对应组件仓库。
|
|
180
|
+
<!-- FILE_VIEWER_GENERATED:END -->
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
import { type FileViewerAiOptions, type FileViewerArchiveOptions, type FileViewerCadOptions, type FileViewerDocxOptions, type FileViewerDocumentAnchor, type FileViewerDocumentChunk, type FileViewerEvent, type FileViewerEventHandler, type FileViewerEventType, type FileViewerFileRef, type FileViewerInstance, type FileViewerLifecycleContext, type FileViewerOperationAvailability, type FileViewerOperationContext, type FileViewerOptions, type FileViewerPdfOptions, type FileViewerSpreadsheetOptions, type FileViewerPublicApi, type FileViewerSearchOptions, type FileViewerSearchState, type FileViewerThemeMode, type FileViewerToolbarOptions, type FileViewerToolbarPosition, type FileViewerTypstOptions, type FileViewerWatermarkOptions, type FileViewerZoomState, type RendererRegistry } from '@file-viewer/core';
|
|
2
|
+
export type FileRef = FileViewerFileRef;
|
|
3
|
+
export type ViewerWatermarkOptions = FileViewerWatermarkOptions;
|
|
4
|
+
export type ViewerToolbarPosition = FileViewerToolbarPosition;
|
|
5
|
+
export type ViewerToolbarOptions = FileViewerToolbarOptions;
|
|
6
|
+
export type ViewerArchiveOptions = FileViewerArchiveOptions;
|
|
7
|
+
export type ViewerPdfOptions = FileViewerPdfOptions;
|
|
8
|
+
export type ViewerSpreadsheetOptions = FileViewerSpreadsheetOptions;
|
|
9
|
+
export type ViewerDocxOptions = FileViewerDocxOptions;
|
|
10
|
+
export type ViewerTypstOptions = FileViewerTypstOptions;
|
|
11
|
+
export type ViewerCadOptions = FileViewerCadOptions;
|
|
12
|
+
export type ViewerSearchOptions = FileViewerSearchOptions;
|
|
13
|
+
export type ViewerAiOptions = FileViewerAiOptions;
|
|
14
|
+
export type ViewerThemeMode = FileViewerThemeMode;
|
|
15
|
+
export type ViewerOptions = FileViewerOptions;
|
|
16
|
+
export type ViewerEventType = FileViewerEventType;
|
|
17
|
+
export type ViewerEvent = FileViewerEvent;
|
|
18
|
+
export type ViewerEventHandler = FileViewerEventHandler;
|
|
19
|
+
export type ViewerLifecycleContext = FileViewerLifecycleContext;
|
|
20
|
+
export type ViewerOperationContext = FileViewerOperationContext;
|
|
21
|
+
export interface ViewerState {
|
|
22
|
+
loading: boolean;
|
|
23
|
+
ready: boolean;
|
|
24
|
+
error: unknown | null;
|
|
25
|
+
lastEvent: ViewerEvent | null;
|
|
26
|
+
lifecycle: ViewerLifecycleContext | null;
|
|
27
|
+
availability: FileViewerOperationAvailability | null;
|
|
28
|
+
search: FileViewerSearchState | null;
|
|
29
|
+
zoom: FileViewerZoomState | null;
|
|
30
|
+
location: FileViewerDocumentAnchor | null;
|
|
31
|
+
}
|
|
32
|
+
export type ViewerStateListener = (state: ViewerState, event?: ViewerEvent) => void;
|
|
33
|
+
export interface ViewerMountOptions {
|
|
34
|
+
url?: string;
|
|
35
|
+
file?: FileRef;
|
|
36
|
+
buffer?: ArrayBuffer;
|
|
37
|
+
name?: string;
|
|
38
|
+
filename?: string;
|
|
39
|
+
type?: string;
|
|
40
|
+
size?: number;
|
|
41
|
+
options?: ViewerOptions;
|
|
42
|
+
onEvent?: ViewerEventHandler;
|
|
43
|
+
onStateChange?: ViewerStateListener;
|
|
44
|
+
}
|
|
45
|
+
export interface ViewerSourceInput {
|
|
46
|
+
url?: string;
|
|
47
|
+
file?: FileRef;
|
|
48
|
+
buffer?: ArrayBuffer;
|
|
49
|
+
filename?: string;
|
|
50
|
+
name?: string;
|
|
51
|
+
type?: string;
|
|
52
|
+
size?: number;
|
|
53
|
+
}
|
|
54
|
+
export interface ViewerFetchInput {
|
|
55
|
+
url: string;
|
|
56
|
+
signal?: AbortSignal;
|
|
57
|
+
source: ViewerSourceInput;
|
|
58
|
+
}
|
|
59
|
+
export type ViewerFetchFile = (input: ViewerFetchInput) => Promise<FileRef | null | undefined>;
|
|
60
|
+
export interface ViewerCoreOptions {
|
|
61
|
+
registry?: RendererRegistry;
|
|
62
|
+
fetchFile?: ViewerFetchFile;
|
|
63
|
+
onError?: (error: unknown, source: ViewerSourceInput) => void;
|
|
64
|
+
}
|
|
65
|
+
export interface ViewerController {
|
|
66
|
+
readonly container: HTMLElement;
|
|
67
|
+
load(options: ViewerMountOptions): Promise<void>;
|
|
68
|
+
update(options?: ViewerMountOptions): Promise<void>;
|
|
69
|
+
reload(): Promise<void>;
|
|
70
|
+
destroy(): void;
|
|
71
|
+
getApi(): FileViewerPublicApi | FileViewerInstance | null;
|
|
72
|
+
downloadOriginalFile(): Promise<void>;
|
|
73
|
+
printRenderedHtml(): Promise<void>;
|
|
74
|
+
exportRenderedHtml(): Promise<void>;
|
|
75
|
+
zoomIn(): Promise<FileViewerZoomState | null>;
|
|
76
|
+
zoomOut(): Promise<FileViewerZoomState | null>;
|
|
77
|
+
resetZoom(): Promise<FileViewerZoomState | null>;
|
|
78
|
+
searchDocument(query: string): Promise<FileViewerSearchState | null>;
|
|
79
|
+
clearDocumentSearch(): Promise<FileViewerSearchState | null>;
|
|
80
|
+
nextSearchResult(): Promise<FileViewerSearchState | null>;
|
|
81
|
+
previousSearchResult(): Promise<FileViewerSearchState | null>;
|
|
82
|
+
collectDocumentAnchors(): Promise<FileViewerDocumentAnchor[]>;
|
|
83
|
+
scrollToAnchor(anchor: FileViewerDocumentAnchor | string): Promise<boolean>;
|
|
84
|
+
scrollToLine(line: number): Promise<boolean>;
|
|
85
|
+
getDocumentTextChunks(): FileViewerDocumentChunk[];
|
|
86
|
+
getOperationAvailability(): FileViewerOperationAvailability | null;
|
|
87
|
+
getZoomState(): FileViewerZoomState | null;
|
|
88
|
+
getSearchState(): FileViewerSearchState | null;
|
|
89
|
+
getState(): ViewerState;
|
|
90
|
+
subscribe(listener: ViewerStateListener): () => void;
|
|
91
|
+
}
|
|
92
|
+
export type ViewerControllerAccessor = () => ViewerController | null;
|
|
93
|
+
export interface ViewerControllerHandle {
|
|
94
|
+
load(options: ViewerMountOptions): Promise<void>;
|
|
95
|
+
update(options?: ViewerMountOptions): Promise<void>;
|
|
96
|
+
reload(): Promise<void>;
|
|
97
|
+
destroy(): void;
|
|
98
|
+
getController(): ViewerController | null;
|
|
99
|
+
getApi(): FileViewerPublicApi | FileViewerInstance | null;
|
|
100
|
+
downloadOriginalFile(): Promise<void>;
|
|
101
|
+
printRenderedHtml(): Promise<void>;
|
|
102
|
+
exportRenderedHtml(): Promise<void>;
|
|
103
|
+
zoomIn(): Promise<FileViewerZoomState | null>;
|
|
104
|
+
zoomOut(): Promise<FileViewerZoomState | null>;
|
|
105
|
+
resetZoom(): Promise<FileViewerZoomState | null>;
|
|
106
|
+
searchDocument(query: string): Promise<FileViewerSearchState | null>;
|
|
107
|
+
clearDocumentSearch(): Promise<FileViewerSearchState | null>;
|
|
108
|
+
nextSearchResult(): Promise<FileViewerSearchState | null>;
|
|
109
|
+
previousSearchResult(): Promise<FileViewerSearchState | null>;
|
|
110
|
+
collectDocumentAnchors(): Promise<FileViewerDocumentAnchor[]>;
|
|
111
|
+
scrollToAnchor(anchor: FileViewerDocumentAnchor | string): Promise<boolean>;
|
|
112
|
+
scrollToLine(line: number): Promise<boolean>;
|
|
113
|
+
getDocumentTextChunks(): FileViewerDocumentChunk[];
|
|
114
|
+
getOperationAvailability(): FileViewerOperationAvailability | null;
|
|
115
|
+
getZoomState(): FileViewerZoomState | null;
|
|
116
|
+
getSearchState(): FileViewerSearchState | null;
|
|
117
|
+
getState(): ViewerState | null;
|
|
118
|
+
subscribe(listener: ViewerStateListener): () => void;
|
|
119
|
+
}
|
|
120
|
+
export declare const createViewerControllerHandle: (getController: ViewerControllerAccessor, dispose: () => void) => ViewerControllerHandle;
|
|
121
|
+
export declare const mountViewer: (container: HTMLElement, initialOptions?: ViewerMountOptions, coreOptions?: ViewerCoreOptions) => ViewerController;
|