@koi-br/ocr-web-sdk 1.0.65 → 1.0.67

package/dist/{tiff.min-FWTAhBuz.mjs → tiff.min-C7mxi5R2.mjs}

@@ -1,4 +1,4 @@
-import { g as getAugmentedNamespace, a as getDefaultExportFromCjs } from "./index-BQn8gr7r.mjs";
+import { g as getAugmentedNamespace, a as getDefaultExportFromCjs } from "./index-BwWdGx71.mjs";
 function _mergeNamespaces(U, W) {
   for (var Z = 0; Z < W.length; Z++) {
     const s0 = W[Z];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koi-br/ocr-web-sdk",
-  "version": "1.0.65",
+  "version": "1.0.67",
   "description": "一个支持多种Office文件格式预览的Vue3组件SDK，包括PDF、Word、Excel、图片、OFD、TIF等格式",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",

package/preview/ImagePreview.vue

@@ -639,6 +639,137 @@ const annotationTextareaRef = ref<any>(); // 批注输入框引用
 const activeBlockDiv = ref<HTMLElement | null>(null);
 const isHighlighted = ref(false); // 标识是否为定位点击的高亮
 
+// ✅ 跳转高亮目标（数据态）：用于 renderTextLayer 重建 DOM 后恢复静态高亮
+type JumpHighlightTarget = {
+  pageNum: number;
+  bbox: [number, number, number, number];
+  highlightStyle?: HighlightStyle;
+};
+
+const lastJumpHighlightTarget = ref<JumpHighlightTarget | null>(null);
+
+const applyStaticJumpHighlightStyle = (
+  el: HTMLElement,
+  highlightStyle?: HighlightStyle
+) => {
+  // 确保是“静态”状态，不要残留动画
+  el.classList.remove("highlight-animated");
+  el.style.animation = "";
+  el.style.animationFillMode = "";
+  el.style.transform = "";
+  el.style.transformOrigin = "";
+  el.style.transition = "";
+
+  // ⚠️ 这里的语义要和 highlightPosition() 保持一致：
+  // - 如果调用方传了 highlightStyle（哪怕只传了 backgroundColor），就只应用它提供的字段。
+  //   避免在“重建后补高亮”时额外加上默认的蓝色 boxShadow/边框，导致看起来像 hover 态。
+  // - 如果未传 highlightStyle，才使用默认高亮样式。
+  if (highlightStyle) {
+    if (highlightStyle.backgroundColor !== undefined) {
+      el.style.backgroundColor = highlightStyle.backgroundColor;
+    }
+    if (highlightStyle.boxShadow !== undefined) {
+      el.style.boxShadow = highlightStyle.boxShadow;
+    }
+    if (highlightStyle.border !== undefined) {
+      el.style.border = highlightStyle.border;
+    }
+    return;
+  }
+
+  el.style.backgroundColor =
+    "var(--s-color-brand-primary-transparent-3, rgba(0, 102, 255, .15))";
+  el.style.boxShadow = "0 0 0 2px rgba(30, 144, 255, 0.6)";
+  el.style.border = "none";
+};
+
+const reapplyJumpHighlightIfNeeded = (targetPage: number) => {
+  const target = lastJumpHighlightTarget.value;
+  if (!target || target.pageNum !== targetPage) return;
+
+  const textLayer = textLayerRefs.get(targetPage);
+  if (!textLayer) return;
+
+  const tolerance = 2;
+  const blockDivs = textLayer.querySelectorAll(".text-block");
+
+  let matched: HTMLElement | null = null;
+  for (let i = 0; i < blockDivs.length; i++) {
+    const div = blockDivs[i] as HTMLElement;
+    const storedBbox = div.dataset.bbox;
+    if (!storedBbox) continue;
+
+    try {
+      const parsed = JSON.parse(storedBbox) as [
+        number,
+        number,
+        number,
+        number
+      ];
+      const isMatch =
+        Math.abs(parsed[0] - target.bbox[0]) < tolerance &&
+        Math.abs(parsed[1] - target.bbox[1]) < tolerance &&
+        Math.abs(parsed[2] - target.bbox[2]) < tolerance &&
+        Math.abs(parsed[3] - target.bbox[3]) < tolerance;
+
+      if (isMatch) {
+        matched = div;
+        break;
+      }
+    } catch (_e) {
+      // ignore
+    }
+  }
+
+  if (!matched) return;
+
+  // ✅ 输入态也要补回跳转高亮（否则提交触发 renderTextLayer 重建后会丢失 B 的高亮）
+  // 但输入态不要抢占 activeBlockDiv/isHighlighted，避免影响批注弹窗锚点与焦点。
+  if (currentAnnotationBlock.value) {
+    // 如果刚好命中“锁定输入态块”，保持输入态样式优先，不覆盖
+    if (lockedAnnotationDiv.value && matched === lockedAnnotationDiv.value) {
+      return;
+    }
+
+    applyStaticJumpHighlightStyle(matched, target.highlightStyle);
+    return;
+  }
+
+  applyStaticJumpHighlightStyle(matched, target.highlightStyle);
+
+  // 让状态也恢复一致（避免 renderTextLayer 清空引用后 isHighlighted/activeBlockDiv 脱节）
+  activeBlockDiv.value = matched;
+  isHighlighted.value = true;
+};
+
+// ✅ lastJumpHighlightTarget 的清理交由 clearAllHighlights() 统一负责。
+// hover 等局部交互可能会暂时把 isHighlighted 置为 false，但这不代表用户要取消“跳转高亮”。
+// 只有在真正“全局清高亮”时才清空缓存目标，避免提交触发重建后高亮丢失。
+
+// ✅ 批注输入态锁定的文本块（与 activeBlockDiv 解耦，避免被 jump/highlight 覆盖）
+const lockedAnnotationDiv = ref<HTMLElement | null>(null);
+
+const LOCKED_ANNOTATION_OUTLINE = "2px solid rgba(24, 144, 255, 0.85)";
+const LOCKED_ANNOTATION_OUTLINE_OFFSET = "1px";
+
+const applyLockedAnnotationOutline = (blockDiv: HTMLElement) => {
+  blockDiv.style.setProperty(
+    "outline",
+    LOCKED_ANNOTATION_OUTLINE,
+    "important"
+  );
+  blockDiv.style.setProperty(
+    "outline-offset",
+    LOCKED_ANNOTATION_OUTLINE_OFFSET,
+    "important"
+  );
+};
+
+const clearLockedAnnotationOutline = (blockDiv: HTMLElement) => {
+  blockDiv.style.removeProperty("outline");
+  blockDiv.style.removeProperty("outline-offset");
+};
+
 // 根据当前页码过滤blocksData
 const currentPageBlocksData = computed(() => {
   if (!props.blocksData || props.blocksData.length === 0) {
@@ -1069,10 +1200,14 @@ const switchToPage = (page: number, autoClearMark: boolean = true) => {
     return;
   }
 
-  // 重置文本选择状态和批注状态
-  showAnnotationPopup.value = false;
-  currentAnnotationBlock.value = null;
-  annotationInput.value = "";
+  // 重置文本选择状态和批注状态（若处于输入态先解除锁定，避免 outline 残留）
+  if (lockedAnnotationDiv.value) {
+    closeAnnotationInput();
+  } else {
+    showAnnotationPopup.value = false;
+    currentAnnotationBlock.value = null;
+    annotationInput.value = "";
+  }
   const hadHighlight = isHighlighted.value && activeBlockDiv.value !== null;
   activeBlockDiv.value = null;
   isHighlighted.value = false;
@@ -1134,10 +1269,14 @@ const reset = () => {
 
   position.value = { x: 0, y: 0 };
 
-  // 重置文本选择状态和批注状态
-  showAnnotationPopup.value = false;
-  currentAnnotationBlock.value = null;
-  annotationInput.value = "";
+  // 重置文本选择状态和批注状态（若处于输入态先解除锁定，避免 outline 残留）
+  if (lockedAnnotationDiv.value) {
+    closeAnnotationInput();
+  } else {
+    showAnnotationPopup.value = false;
+    currentAnnotationBlock.value = null;
+    annotationInput.value = "";
+  }
   const hadHighlight = isHighlighted.value && activeBlockDiv.value !== null;
   activeBlockDiv.value = null;
   isHighlighted.value = false;
@@ -1475,6 +1614,11 @@ const renderTextLayer = (pageNum?: number) => {
 
       // Hover 和点击事件
       blockDiv.addEventListener("mouseenter", (e) => {
+        // ✅ 输入态：锚点已锁定，禁止 hover 驱动位置/激活块变化
+        if (currentAnnotationBlock.value) {
+          return;
+        }
+
         // 如果未启用 hover 效果，直接返回
         if (!props.enableBlockHover) {
           return;
@@ -1507,6 +1651,11 @@ const renderTextLayer = (pageNum?: number) => {
       });
 
       blockDiv.addEventListener("mouseleave", () => {
+        // ✅ 输入态：不再启动 auto-hide 逻辑
+        if (currentAnnotationBlock.value) {
+          return;
+        }
+
         // 如果未启用 hover 效果，直接返回
         if (!props.enableBlockHover) {
           return;
@@ -1526,6 +1675,9 @@ const renderTextLayer = (pageNum?: number) => {
       textLayer.appendChild(blockDiv);
     });
 
+    // ✅ 页面重建后，把“最后一次跳转高亮”补回到新 DOM 节点上（静态）
+    reapplyJumpHighlightIfNeeded(targetPage);
+
     // 标记该页面已渲染
     renderedPages.value.add(targetPage);
   } catch (error) {
@@ -1568,6 +1720,9 @@ const showAnnotationButtonForBlock = (
   event: MouseEvent,
   blockDiv: HTMLElement
 ) => {
+  // ✅ 输入态：不允许入口浮层继续跟随 hover 更新位置
+  if (currentAnnotationBlock.value) return;
+
   const bboxStr = blockDiv.dataset.bbox || "";
   if (!bboxStr) return;
 
@@ -1724,6 +1879,9 @@ const clearAllHighlights = (
     // 清除引用和标志
     activeBlockDiv.value = null;
     isHighlighted.value = false;
+
+    // ✅ 真正“全局清高亮”时才清空跳转高亮缓存
+    lastJumpHighlightTarget.value = null;
     
     // 清除定时器
     if (highlightTimer) {
@@ -2124,6 +2282,29 @@ const openAnnotationInput = (e?: Event) => {
   // 确保弹窗显示
   showAnnotationPopup.value = true;
 
+  // ✅ 锁定锚点高亮（输入态）
+  if (activeBlockDiv.value) {
+    // 如果之前有锁定块且不是当前块，先解除之前的锁定，避免 outline 残留
+    if (
+      lockedAnnotationDiv.value &&
+      lockedAnnotationDiv.value !== activeBlockDiv.value
+    ) {
+      clearLockedAnnotationOutline(lockedAnnotationDiv.value);
+      restoreBlockStyle(lockedAnnotationDiv.value);
+    }
+
+    lockedAnnotationDiv.value = activeBlockDiv.value;
+
+    // 清除其它块的高亮，避免竞态残留
+    clearAllHighlights(lockedAnnotationDiv.value);
+
+    // 保持该块的 hover/批注样式
+    applyHoverStyle(lockedAnnotationDiv.value, !!existingAnnotation);
+
+    // 使用 outline 作为“锁定态”标识（不依赖 scoped CSS）
+    applyLockedAnnotationOutline(lockedAnnotationDiv.value);
+  }
+
   // 重新计算弹窗位置（输入框更大）
   nextTick(() => {
     adjustAnnotationPopupPosition();
@@ -2169,9 +2350,13 @@ const adjustAnnotationPopupPosition = () => {
   let left: number;
   let top: number;
 
-  if (activeBlockDiv.value) {
+  const anchorBlockDiv = currentAnnotationBlock.value
+    ? lockedAnnotationDiv.value
+    : activeBlockDiv.value;
+
+  if (anchorBlockDiv) {
     // 使用文本块位置，和批注按钮使用相同的计算逻辑
-    const rect = activeBlockDiv.value.getBoundingClientRect();
+    const rect = anchorBlockDiv.getBoundingClientRect();
     const relativeX =
       rect.left - containerRect.left + containerRef.value.scrollLeft;
     const relativeY =
@@ -2250,10 +2435,30 @@ const closeAnnotationInput = () => {
   annotationInput.value = "";
   showAnnotationPopup.value = false;
 
-  // 关闭批注输入弹窗后，恢复文本块的样式
-  if (activeBlockDiv.value && !isHighlighted.value) {
-    restoreBlockStyle(activeBlockDiv.value);
-    activeBlockDiv.value = null;
+  const lockedDiv = lockedAnnotationDiv.value;
+
+  // ✅ 优先清理“输入态锁定块”（不依赖 activeBlockDiv，避免被跳转覆盖后清不到）
+  if (lockedDiv) {
+    clearLockedAnnotationOutline(lockedDiv);
+    restoreBlockStyle(lockedDiv);
+
+    // 如果当前 activeBlock 就是这个锁定块，且不是跳转高亮，则恢复引用
+    if (activeBlockDiv.value === lockedDiv && !isHighlighted.value) {
+      activeBlockDiv.value = null;
+    }
+
+    lockedAnnotationDiv.value = null;
+    return;
+  }
+
+  // 兼容路径：没有锁定块时，按原逻辑处理 activeBlock
+  if (activeBlockDiv.value) {
+    clearLockedAnnotationOutline(activeBlockDiv.value);
+
+    if (!isHighlighted.value) {
+      restoreBlockStyle(activeBlockDiv.value);
+      activeBlockDiv.value = null;
+    }
   }
 };
 
@@ -2549,10 +2754,38 @@ const highlightPosition = (
     // 🔑 关键：清除页面上所有的高亮元素，确保不会有残留
     // 这样可以避免多个高亮框同时存在的问题
     const hadHighlight = activeBlockDiv.value !== null && isHighlighted.value;
-    
+
+    // ✅ 如果当前有批注输入态锁定块，先记录它的批注状态，清理后再补回样式
+    const lockedDiv = lockedAnnotationDiv.value;
+    let lockedHasAnnotation = false;
+    if (lockedDiv) {
+      const bboxStr = lockedDiv.dataset.bbox;
+      const pageStr = lockedDiv.dataset.page;
+      const lockedPageNum = pageStr ? parseInt(pageStr, 10) : undefined;
+      if (bboxStr) {
+        try {
+          const bbox = JSON.parse(bboxStr) as [
+            number,
+            number,
+            number,
+            number
+          ];
+          lockedHasAnnotation = !!getAnnotationForBlock(bbox, lockedPageNum);
+        } catch (_e) {
+          lockedHasAnnotation = false;
+        }
+      }
+    }
+
     // 清除所有高亮（包括所有页面的文本块），不排除任何元素
     clearAllHighlights();
 
+    // ✅ 清理后补回锁定块样式（避免 jump/highlight 清掉输入态的背景高亮）
+    if (lockedDiv) {
+      applyHoverStyle(lockedDiv, lockedHasAnnotation);
+      applyLockedAnnotationOutline(lockedDiv);
+    }
+
     // 如果之前有高亮，触发高亮清除事件
     if (hadHighlight) {
       emit("highlight-clear");
@@ -2660,6 +2893,9 @@ const highlightPosition = (
     activeBlockDiv.value = elementRef;
     isHighlighted.value = true;
 
+    // ✅ 记录最后一次“跳转高亮”的目标，用于 renderTextLayer 重建后补回静态高亮
+    lastJumpHighlightTarget.value = { pageNum, bbox, highlightStyle };
+
   // 使用传入的高亮样式，如果没有传入则使用默认样式
   if (highlightStyle) {
     if (highlightStyle.backgroundColor) {
@@ -2814,8 +3050,36 @@ const jumpToPosition = (
       isHighlighted: isHighlighted.value,
       reason: previousPositioningId ? '之前的定位被新定位覆盖' : '清除残留的高亮'
     });
+    // ✅ 如果当前有批注输入态锁定块，先记录它的批注状态，清理后再补回样式
+    const lockedDiv = lockedAnnotationDiv.value;
+    let lockedHasAnnotation = false;
+    if (lockedDiv) {
+      const bboxStr = lockedDiv.dataset.bbox;
+      const pageStr = lockedDiv.dataset.page;
+      const lockedPageNum = pageStr ? parseInt(pageStr, 10) : undefined;
+      if (bboxStr) {
+        try {
+          const lockedBbox = JSON.parse(bboxStr) as [
+            number,
+            number,
+            number,
+            number
+          ];
+          lockedHasAnnotation = !!getAnnotationForBlock(lockedBbox, lockedPageNum);
+        } catch (_e) {
+          lockedHasAnnotation = false;
+        }
+      }
+    }
+
     // 清除所有页面的高亮元素，不排除任何元素
     clearAllHighlights();
+
+    // ✅ 清理后补回锁定块样式（避免跳转清掉输入态的背景高亮）
+    if (lockedDiv) {
+      applyHoverStyle(lockedDiv, lockedHasAnnotation);
+      applyLockedAnnotationOutline(lockedDiv);
+    }
   }
 
   // 🔑 关键：在定位开始时设置标记，禁用同步滚动