@file-viewer/react-legacy 2.0.10 → 2.0.11

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/README.en.md CHANGED
@@ -120,7 +120,7 @@ The table below lists the real props, event channel, and customization entry for
120
120
  | Vue 2.6 `@file-viewer/vue2.6` | Same as Vue 2.7 | `viewer-event` / `viewerEvent` | Separate Vue 2.6 build for long-lived applications that cannot move to Vue 2.7. |
121
121
  | React `@file-viewer/react` | `ViewerMountOptions` plus native `div` props such as `className`, `style`, `data-*`, and `aria-*` | `onEvent`, `onStateChange` | `ref` exposes `FileViewerHandle`; `useFileViewer()` returns `ref`, `props`, `state`, and `handle` for custom toolbars. |
122
122
  | React Legacy `@file-viewer/react-legacy` | Same as the React package | `onEvent`, `onStateChange` | Targets React 16.8 / 17 with a legacy-friendly component export. |
123
- | Pure Web `@file-viewer/web` | `mountViewer(container, ViewerMountOptions, ViewerCoreOptions?)` | `onEvent`, `onStateChange`, `controller.subscribe()` | Returns `ViewerController`; also ships ESM, script-tag IIFE, and the `file-viewer-copy-assets` CLI. |
123
+ | Pure Web `@file-viewer/web` | `<flyfish-file-viewer>` attributes: `src/url`, `filename/name`, `type`, `size`, `theme`, `toolbar`, `toolbar-position`, `watermark`, `search`, `options`; also supports `mountViewer(...)` | `viewer-ready`, `viewer-event`, `viewer-state-change`, `viewer-error`, `onEvent`, `onStateChange`, `controller.subscribe()` | The Custom Element instance exposes the full controller handle; the IIFE script auto-registers it while keeping imperative `mountViewer` and the asset copy CLI. |
124
124
  | jQuery `@file-viewer/jquery` | `$(el).fileViewer(ViewerMountOptions & { replace?: boolean })` | `onEvent`, `onStateChange`, or `getFileViewerController(el).subscribe()` | Plugin methods include `zoomIn`, `printRenderedHtml`, and `searchDocument`; `replace:false` updates the same node in place. |
125
125
  | Svelte `@file-viewer/svelte` | `ViewerMountOptions` plus `className` and `containerStyle` | `on:viewerEvent`, `onEvent`, `onStateChange` | `bind:this` exposes the controller handle; the `use:fileViewer` action is also available and adds `replace`. |
126
126
 
@@ -155,7 +155,7 @@ For fully custom toolbars, hide the built-in toolbar and call the standard ref /
155
155
  | Vue 3 | Pass `:options="{ toolbar: false }"`, call `downloadOriginalFile()`, `printRenderedHtml()`, `exportRenderedHtml()`, `zoomIn()`, `zoomOut()`, and `resetZoom()` through the template ref, and sync buttons with `@operation-availability-change` plus `@zoom-change`. |
156
156
  | Vue 2.7 / 2.6 | Use `toolbar:false`, call instance methods through `$refs.viewer`, and listen to `@viewer-event` for `operation-availability-change` or `zoom-change`. |
157
157
  | React / React Legacy | Prefer `useFileViewer({ options:{ toolbar:false } })`; pass `viewer.props` to the component, bind custom buttons to `viewer.handle`, and read `viewer.state.availability` / `viewer.state.zoom`. |
158
- | Pure Web | Use `mountViewer(container, { options:{ toolbar:false }, onStateChange })`; custom DOM buttons call controller methods, and `controller.subscribe()` covers more advanced state sync. |
158
+ | Pure Web | Use `<flyfish-file-viewer toolbar="false">` or `mountViewer(container, { options:{ toolbar:false }, onStateChange })`; custom DOM buttons can call `zoomIn()`, `printRenderedHtml()`, `searchDocument()`, and other element / controller methods directly. Use `viewer-state-change` or `controller.subscribe()` for advanced state sync. |
159
159
  | jQuery | Use `$("#viewer").fileViewer({ options:{ toolbar:false } })`; buttons can call `$("#viewer").fileViewer("zoomIn")` or read capability state through `getFileViewerController($("#viewer")).subscribe()`. |
160
160
  | Svelte | Use `<FileViewer bind:this={viewer} options={{ toolbar:false }} />`; buttons call `viewer.zoomIn()` / `viewer.printRenderedHtml()`, with `on:viewerEvent` or `onStateChange` for state sync. |
161
161
 
package/README.md CHANGED
@@ -120,7 +120,7 @@ English README: [README.en.md](./README.en.md)。
120
120
  | Vue 2.6 `@file-viewer/vue2.6` | 同 Vue 2.7 | `viewer-event` / `viewerEvent` | 独立 Vue 2.6 构建,不要求业务升级到 Vue 2.7。 |
121
121
  | React `@file-viewer/react` | `ViewerMountOptions` + `div` 原生属性,如 `className`、`style`、`data-*`、`aria-*` | `onEvent`、`onStateChange` | `ref` 暴露 `FileViewerHandle`;`useFileViewer()` 会返回 `ref`、`props`、`state`、`handle`,便于自定义工具栏。 |
122
122
  | React Legacy `@file-viewer/react-legacy` | 同 React 标准包 | `onEvent`、`onStateChange` | 面向 React 16.8 / 17;组件名和默认导出保持 legacy 生态友好。 |
123
- | Pure Web `@file-viewer/web` | `mountViewer(container, ViewerMountOptions, ViewerCoreOptions?)` | `onEvent`、`onStateChange`、`controller.subscribe()` | 返回 `ViewerController`;同时提供 ESM、IIFE script 标签包和 `file-viewer-copy-assets`。 |
123
+ | Pure Web `@file-viewer/web` | `<flyfish-file-viewer>` 属性 `src/url`、`filename/name`、`type`、`size`、`theme`、`toolbar`、`toolbar-position`、`watermark`、`search`、`options`;也支持 `mountViewer(...)` | `viewer-ready`、`viewer-event`、`viewer-state-change`、`viewer-error`、`onEvent`、`onStateChange`、`controller.subscribe()` | Custom Element 实例暴露完整 controller handle;IIFE script 标签会自动注册元素,同时保留 `mountViewer` 命令式挂载和资源复制 CLI。 |
124
124
  | jQuery `@file-viewer/jquery` | `$(el).fileViewer(ViewerMountOptions & { replace?: boolean })` | `onEvent`、`onStateChange` 或 `getFileViewerController(el).subscribe()` | 插件方法支持 `zoomIn`、`printRenderedHtml`、`searchDocument` 等;`replace:false` 可在同一节点上原地更新。 |
125
125
  | Svelte `@file-viewer/svelte` | `ViewerMountOptions` + `className`、`containerStyle` | `on:viewerEvent`、`onEvent`、`onStateChange` | `bind:this` 暴露 controller handle;也提供 `use:fileViewer` action,action 额外支持 `replace`。 |
126
126
 
@@ -155,7 +155,7 @@ English README: [README.en.md](./README.en.md)。
155
155
  | Vue 3 | 传 `:options="{ toolbar: false }"` 隐藏内置工具栏,通过模板 `ref` 调用 `downloadOriginalFile()`、`printRenderedHtml()`、`exportRenderedHtml()`、`zoomIn()`、`zoomOut()`、`resetZoom()`;用 `@operation-availability-change` 和 `@zoom-change` 同步按钮显隐与比例。 |
156
156
  | Vue 2.7 / 2.6 | 同样设置 `toolbar:false`,通过 `$refs.viewer` 调用实例方法;监听 `@viewer-event`,在 `event.type === "operation-availability-change"` 或 `event.type === "zoom-change"` 时更新外部工具栏。 |
157
157
  | React / React Legacy | 推荐 `useFileViewer({ options:{ toolbar:false } })`,把 `viewer.props` 传给组件,把按钮绑定到 `viewer.handle`,并读取 `viewer.state.availability` / `viewer.state.zoom` 控制禁用状态。 |
158
- | Pure Web | `const controller = mountViewer(container, { options:{ toolbar:false }, onStateChange })`;外部 DOM 按钮调用 controller 方法,复杂场景可用 `controller.subscribe()` 做状态同步。 |
158
+ | Pure Web | `<flyfish-file-viewer toolbar="false">` 或 `mountViewer(container, { options:{ toolbar:false }, onStateChange })`;外部 DOM 按钮可直接调用元素实例 / controller `zoomIn()`、`printRenderedHtml()`、`searchDocument()` 等方法,复杂场景用 `viewer-state-change` 或 `controller.subscribe()` 同步状态。 |
159
159
  | jQuery | `$("#viewer").fileViewer({ options:{ toolbar:false } })`;按钮调用 `$("#viewer").fileViewer("zoomIn")` 或通过 `getFileViewerController($("#viewer")).subscribe()` 获取能力状态。 |
160
160
  | Svelte | `<FileViewer bind:this={viewer} options={{ toolbar:false }} />`;按钮直接调用 `viewer.zoomIn()`、`viewer.printRenderedHtml()`,并用 `on:viewerEvent` / `onStateChange` 同步状态。 |
161
161
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@file-viewer/react-legacy",
3
- "version": "2.0.10",
3
+ "version": "2.0.11",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "description": "Standard React 16/17 legacy component package for Flyfish File Viewer",
@@ -49,7 +49,7 @@
49
49
  "react": ">=16.8 <18"
50
50
  },
51
51
  "dependencies": {
52
- "@file-viewer/core": "^2.0.10"
52
+ "@file-viewer/core": "^2.0.11"
53
53
  },
54
54
  "devDependencies": {
55
55
  "@types/react": "^17.0.0",