@yuwenovo/ocr-result-view 1.0.0

package/dist/style.d.ts

@@ -0,0 +1,2 @@
+// Type-only entry for the public side-effect CSS import.
+export {}

package/dist/types/components/DiffCards.vue.d.ts

@@ -0,0 +1,36 @@
+import { type ReviewFilter } from '../utils/diff-items';
+import type { DiffDetail } from '../types';
+type __VLS_Props = {
+    diffDetail: DiffDetail;
+    activeIndex?: number;
+    reviewFilter: ReviewFilter;
+    busy: boolean;
+    readonly: boolean;
+    /** 当前激活的 tab */
+    activeTab?: 'all' | 'modify' | 'delete' | 'insert';
+};
+declare var __VLS_1: {
+    item: import("..").DeleteItem | import("..").InsertItem | import("..").ModifyItem;
+    index: number;
+    active: boolean;
+    select: () => void;
+    ignore: (ignored: boolean) => void;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    select: (index: number) => any;
+    ignore: (diffId: string, ignored: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((index: number) => any) | undefined;
+    onIgnore?: ((diffId: string, ignored: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/OcrDiffViewer.vue.d.ts

@@ -0,0 +1,71 @@
+import { type ReviewFilter } from '../utils/diff-items';
+import type { DiffItem, DiffTab, DocumentSide, OcrResultViewProps } from '../types';
+declare function requestLayout(): void;
+declare function selectDiff(indexOrId: number | string): Promise<boolean>;
+declare function goToPage(side: DocumentSide, index: number): boolean;
+declare function setFilter(tab: DiffTab, review?: ReviewFilter): void;
+declare function retryImages(): void;
+declare var __VLS_1: {
+    activeIndex: number;
+    selectDiff: typeof selectDiff;
+    setFilter: typeof setFilter;
+}, __VLS_3: {
+    filename: string | undefined;
+}, __VLS_25: {
+    filename: string | undefined;
+}, __VLS_47: {}, __VLS_74: {
+    item: import("../types").DeleteItem | import("../types").InsertItem | import("../types").ModifyItem;
+    index: number;
+    active: boolean;
+    select: () => void;
+    ignore: (ignored: boolean) => void;
+}, __VLS_86: {
+    activeIndex: number;
+    review: import("../types").ComparisonReview | undefined;
+};
+type __VLS_Slots = {} & {
+    toolbar?: (props: typeof __VLS_1) => any;
+} & {
+    'source-title'?: (props: typeof __VLS_3) => any;
+} & {
+    'target-title'?: (props: typeof __VLS_25) => any;
+} & {
+    empty?: (props: typeof __VLS_47) => any;
+} & {
+    'diff-card'?: (props: typeof __VLS_74) => any;
+} & {
+    footer?: (props: typeof __VLS_86) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<OcrResultViewProps, {
+    selectDiff: typeof selectDiff;
+    nextDiff: () => boolean;
+    previousDiff: () => boolean;
+    goToPage: typeof goToPage;
+    setFilter: typeof setFilter;
+    resize: typeof requestLayout;
+    retryImages: typeof retryImages;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    select: (item: DiffItem | null, index: number) => any;
+    ignore: (diffId: string | null, ignored: boolean) => any;
+    "page-change": (side: DocumentSide, index: number) => any;
+    "filter-change": (tab: DiffTab, review: ReviewFilter) => any;
+    "image-error": (url: string) => any;
+}, string, import("vue").PublicProps, Readonly<OcrResultViewProps> & Readonly<{
+    onSelect?: ((item: DiffItem | null, index: number) => any) | undefined;
+    onIgnore?: ((diffId: string | null, ignored: boolean) => any) | undefined;
+    "onPage-change"?: ((side: DocumentSide, index: number) => any) | undefined;
+    "onFilter-change"?: ((tab: DiffTab, review: ReviewFilter) => any) | undefined;
+    "onImage-error"?: ((url: string) => any) | undefined;
+}>, {
+    readonly: boolean;
+    reviewBusy: boolean;
+    imageCrossOrigin: "anonymous" | "use-credentials" | null;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+export { default as OcrResultView } from './components/OcrDiffViewer.vue';
+export type * from './types';

package/dist/types/types.d.ts

@@ -0,0 +1,100 @@
+export interface Gap {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+export type TableChange = 'table_insert' | 'table_delete' | 'row_insert' | 'row_delete' | 'column_insert' | 'column_delete' | 'cell_insert' | 'cell_delete' | 'cell_content_modify' | 'cell_merge' | 'cell_split' | 'cell_span_modify';
+interface DiffMetadata {
+    diffId: string;
+    ignored: boolean;
+    domain?: 'table';
+    tableChange?: TableChange;
+}
+export interface DeleteItem extends DiffMetadata {
+    type: 'delete';
+    chars: string;
+    sourceLine: number;
+    targetLine: number;
+    sourceText: string;
+    targetText: string;
+    sourceBox: number[] | null;
+    tgtGap: Gap | null;
+    /** 0-based 索引 → source.pages / target.pages */
+    srcPage: number;
+    tgtPage: number;
+}
+export interface InsertItem extends DiffMetadata {
+    type: 'insert';
+    chars: string;
+    sourceLine: number;
+    targetLine: number;
+    sourceText: string;
+    targetText: string;
+    targetBox: number[] | null;
+    srcGap: Gap | null;
+    srcPage: number;
+    tgtPage: number;
+}
+export interface ModifyItem extends DiffMetadata {
+    type: 'modify';
+    delChars: string;
+    insChars: string;
+    sourceChangeRanges?: TextRange[];
+    targetChangeRanges?: TextRange[];
+    sourceLine: number;
+    targetLine: number;
+    sourceText: string;
+    targetText: string;
+    sourceBox: number[] | null;
+    targetBox: number[] | null;
+    srcPage: number;
+    tgtPage: number;
+}
+export interface TextRange {
+    start: number;
+    end: number;
+}
+export type DiffItem = DeleteItem | InsertItem | ModifyItem;
+/** 后端已排序的扁平差异列表。 */
+export type DiffDetail = DiffItem[];
+/** 页面元数据（按数组顺序对应页码） */
+export interface PageMeta {
+    imageUrl: string;
+    /** 可选原图尺寸；用于在图片按需加载前建立精确的虚拟滚动布局。 */
+    width?: number;
+    height?: number;
+}
+/** 服务端审阅汇总，组件不会自行修改此对象。 */
+export interface ComparisonReview {
+    review_version: number;
+    total_difference_count: number;
+    ignored_difference_count: number;
+    remaining_difference_count: number;
+    comparison_passed: boolean;
+}
+export type DiffTab = 'all' | 'modify' | 'delete' | 'insert';
+export type ReviewFilter = 'pending' | 'ignored' | 'all';
+export type DocumentSide = 'source' | 'target';
+export interface OcrResultViewProps {
+    diffDetail: DiffDetail;
+    sourcePages: PageMeta[];
+    targetPages: PageMeta[];
+    sourceFilename?: string;
+    targetFilename?: string;
+    review?: ComparisonReview;
+    reviewBusy?: boolean;
+    /** 默认只读；忽略操作仅发出事件，由宿主保存并回传新数据。 */
+    readonly?: boolean;
+    imageCrossOrigin?: 'anonymous' | 'use-credentials' | null;
+}
+export interface OcrResultViewExpose {
+    selectDiff: (indexOrId: number | string) => Promise<boolean>;
+    nextDiff: () => boolean;
+    previousDiff: () => boolean;
+    goToPage: (side: DocumentSide, index: number) => boolean;
+    setFilter: (tab: DiffTab, review?: ReviewFilter) => void;
+    resize: () => void;
+    retryImages: () => void;
+}
+export {};

package/dist/types/utils/diff-items.d.ts

@@ -0,0 +1,18 @@
+import type { DeleteItem, DiffDetail, InsertItem, ModifyItem } from '../types';
+export type ReviewFilter = 'pending' | 'ignored' | 'all';
+export type DiffTab = 'all' | 'modify' | 'delete' | 'insert';
+export type VisibleDiffItem = {
+    type: 'modify';
+    data: ModifyItem;
+    idx: number;
+} | {
+    type: 'delete';
+    data: DeleteItem;
+    idx: number;
+} | {
+    type: 'insert';
+    data: InsertItem;
+    idx: number;
+};
+/** 保持后端数组顺序，仅按当前 Tab 过滤。 */
+export declare function filteredDiffItems(detail: DiffDetail, tab?: DiffTab, review?: ReviewFilter): VisibleDiffItem[];

package/examples/Basic.vue

@@ -0,0 +1,26 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+import { OcrResultView, type OcrResultViewExpose, type OcrResultViewProps } from '@yuwenovo/ocr-result-view'
+import '@yuwenovo/ocr-result-view/style.css'
+
+// Supply your own result and accessible preview URLs; this component makes no business API calls.
+defineProps<{ result: OcrResultViewProps }>()
+const viewer = ref<OcrResultViewExpose>()
+</script>
+
+<template>
+  <div style="height: 720px">
+    <OcrResultView ref="viewer" v-bind="result">
+      <template #toolbar>
+        <div style="padding: 8px">
+          <button @click="viewer?.previousDiff()">上一处</button>
+          <button @click="viewer?.nextDiff()">下一处</button>
+        </div>
+      </template>
+      <template #footer="{ activeIndex }">
+        <div style="padding: 8px">当前差异：{{ activeIndex >= 0 ? activeIndex + 1 : '无' }}</div>
+      </template>
+    </OcrResultView>
+  </div>
+</template>
+

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@yuwenovo/ocr-result-view",
+  "version": "1.0.0",
+  "description": "Vue 3 OCR document comparison result viewer with virtualized Canvas rendering",
+  "type": "module",
+  "main": "./dist/ocr-result-view.js",
+  "module": "./dist/ocr-result-view.js",
+  "types": "./dist/ocr-result-view.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/ocr-result-view.d.ts",
+      "import": "./dist/ocr-result-view.js"
+    },
+    "./style.css": {
+      "types": "./dist/style.d.ts",
+      "default": "./dist/ocr-result-view.css"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "examples"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "peerDependencies": {
+    "vue": "^3.5.0"
+  },
+  "devDependencies": {
+    "@iconify-json/lucide": "^1.2.132",
+    "@vitejs/plugin-vue": "^6.0.9",
+    "@vue/tsconfig": "^0.9.1",
+    "typescript": "~6.0.3",
+    "unplugin-icons": "^24.0.0",
+    "vite": "^8.3.0",
+    "vue": "^3.5.42",
+    "vue-tsc": "^3.3.11"
+  },
+  "engines": {
+    "node": "^22.18.0 || ^24.12.0 || >=26.0.0"
+  },
+  "license": "ISC",
+  "scripts": {
+    "build": "vite build && vue-tsc -p tsconfig.build.json",
+    "type-check": "vue-tsc -p tsconfig.json --noEmit"
+  }
+}