kviewer 0.2.1 → 0.2.2

package/dist/runtime/annotation/pdf-export/winansi.js

@@ -0,0 +1,77 @@
+const CP1252_SPECIALS = /* @__PURE__ */ new Map([
+  [8364, 128],
+  // €
+  [8218, 130],
+  // ‚
+  [402, 131],
+  // ƒ
+  [8222, 132],
+  // „
+  [8230, 133],
+  // …
+  [8224, 134],
+  // †
+  [8225, 135],
+  // ‡
+  [710, 136],
+  // ˆ
+  [8240, 137],
+  // ‰
+  [352, 138],
+  // Š
+  [8249, 139],
+  // ‹
+  [338, 140],
+  // Œ
+  [381, 142],
+  // Ž
+  [8216, 145],
+  // '
+  [8217, 146],
+  // '
+  [8220, 147],
+  // "
+  [8221, 148],
+  // "
+  [8226, 149],
+  // •
+  [8211, 150],
+  // –
+  [8212, 151],
+  // —
+  [732, 152],
+  // ˜
+  [8482, 153],
+  // ™
+  [353, 154],
+  // š
+  [8250, 155],
+  // ›
+  [339, 156],
+  // œ
+  [382, 158],
+  // ž
+  [376, 159]
+  // Ÿ
+]);
+function winAnsiByte(codePoint) {
+  if (codePoint <= 127) return codePoint;
+  if (codePoint >= 160 && codePoint <= 255) return codePoint;
+  return CP1252_SPECIALS.get(codePoint) ?? null;
+}
+export function isWinAnsiEncodable(text) {
+  for (const char of text) {
+    if (winAnsiByte(char.codePointAt(0)) === null) return false;
+  }
+  return true;
+}
+export function encodeWinAnsi(text) {
+  const bytes = [];
+  for (const char of text) {
+    bytes.push(
+      winAnsiByte(char.codePointAt(0)) ?? 63
+      /* ? */
+    );
+  }
+  return new Uint8Array(bytes);
+}

package/dist/runtime/annotation/pdf-import/decode_circle.js

@@ -18,7 +18,6 @@ export function decodeCircleAnnotation(annotation, context) {
     y: rect.y + rect.height / 2,
     radiusX: rect.width / 2,
     radiusY: rect.height / 2,
-    strokeScaleEnabled: false,
     strokeWidth,
     stroke: color
   }));

package/dist/runtime/annotation/pdf-import/decode_ink.js

@@ -20,7 +20,6 @@ export function decodeInkAnnotation(annotation, context) {
     if (points.length < 4) continue;
     group.add(new Konva.Line({
       points,
-      strokeScaleEnabled: false,
       stroke: color,
       strokeWidth,
       opacity,

package/dist/runtime/annotation/pdf-import/decode_line.js

@@ -21,7 +21,6 @@ export function decodeLineAnnotation(annotation, context) {
   const group = createGhostGroup(annotation.id);
   group.add(new Konva.Arrow({
     points,
-    strokeScaleEnabled: false,
     stroke: color,
     fill: color,
     strokeWidth,

package/dist/runtime/annotation/pdf-import/decode_square.js

@@ -19,7 +19,6 @@ export function decodeSquareAnnotation(annotation, context) {
     y: rect.y,
     width: rect.width,
     height: rect.height,
-    strokeScaleEnabled: false,
     stroke: color,
     strokeWidth,
     fill: isFilled ? color : void 0,

package/dist/runtime/annotation/pdf-import/extract_stamp_appearance.d.ts

@@ -4,6 +4,9 @@ import { type RawPdfAnnotation, type StampAppearance } from './types.js';
 export interface StampExtractionOptions {
     scale?: number;
     diffThreshold?: number;
+    /** Skip annotations whose appearance changes no pixels instead of
+     *  falling back to the raw crop (which would capture page content). */
+    skipEmptyDiff?: boolean;
 }
 export interface PixelBounds {
     x: number;
@@ -22,3 +25,12 @@ export declare function applyMaskOrFallback(annotated: Uint8ClampedArray, mask:
     usedMask: boolean;
 };
 export declare function extractStampAppearancesForPage(page: PDFPageProxy, pageTransform: PageTransform, annotations: RawPdfAnnotation[], options?: StampExtractionOptions): Promise<Map<string, StampAppearance>>;
+/**
+ * Extract the rendered appearance of signature widgets on a page. The
+ * page canvas renders with annotations disabled, so a signature stamp
+ * already present in the source PDF is invisible behind the interactive
+ * form layer without this. Widgets whose appearance draws nothing (e.g.
+ * unsigned fields with an empty `/AP`) are skipped — callers decide
+ * which fields are actually signed via the AcroForm `/V` side-channel.
+ */
+export declare function extractSignedSignatureAppearancesForPage(page: PDFPageProxy, pageTransform: PageTransform, annotations: RawPdfAnnotation[], options?: StampExtractionOptions): Promise<Map<string, StampAppearance>>;

package/dist/runtime/annotation/pdf-import/extract_stamp_appearance.js

@@ -95,11 +95,23 @@ async function renderPageToCanvas(page, canvas, annotationMode, scale) {
   await task.promise;
 }
 export async function extractStampAppearancesForPage(page, pageTransform, annotations, options = {}) {
-  const appearances = /* @__PURE__ */ new Map();
   const stampAnnotations = annotations.filter(
     (annotation) => annotation.annotationType === PdfjsAnnotationType.STAMP && typeof annotation.id === "string"
   );
-  if (stampAnnotations.length === 0) return appearances;
+  return extractAppearancesForAnnotations(page, pageTransform, stampAnnotations, options);
+}
+export async function extractSignedSignatureAppearancesForPage(page, pageTransform, annotations, options = {}) {
+  const signedWidgets = annotations.filter(
+    (annotation) => annotation.annotationType === PdfjsAnnotationType.WIDGET && typeof annotation.id === "string" && annotation.fieldType === "Sig"
+  );
+  return extractAppearancesForAnnotations(page, pageTransform, signedWidgets, {
+    ...options,
+    skipEmptyDiff: true
+  });
+}
+async function extractAppearancesForAnnotations(page, pageTransform, targetAnnotations, options = {}) {
+  const appearances = /* @__PURE__ */ new Map();
+  if (targetAnnotations.length === 0) return appearances;
   const scale = options.scale ?? DEFAULT_RENDER_SCALE;
   const diffThreshold = options.diffThreshold ?? DEFAULT_DIFF_THRESHOLD;
   const viewport = page.getViewport({ scale });
@@ -118,7 +130,7 @@ export async function extractStampAppearancesForPage(page, pageTransform, annota
   const baseContext = baseCanvas.getContext("2d", { willReadFrequently: true });
   const annotatedContext = annotatedCanvas.getContext("2d", { willReadFrequently: true });
   if (!baseContext || !annotatedContext) return appearances;
-  for (const annotation of stampAnnotations) {
+  for (const annotation of targetAnnotations) {
     try {
       const id = annotation.id;
       const bounds = stampRectToPixelBounds(
@@ -138,7 +150,8 @@ export async function extractStampAppearancesForPage(page, pageTransform, annota
         bounds.height,
         diffThreshold
       );
-      const { data: maskedData } = applyMaskOrFallback(annotatedData.data, mask);
+      const { data: maskedData, usedMask } = applyMaskOrFallback(annotatedData.data, mask);
+      if (!usedMask && options.skipEmptyDiff) continue;
       const outputCanvas = createCanvas(bounds.width, bounds.height);
       if (!outputCanvas) continue;
       const outputContext = outputCanvas.getContext("2d");

package/dist/runtime/annotation/pdf-import/types.d.ts

@@ -29,6 +29,8 @@ export interface RawPdfAnnotation {
     modificationDate?: unknown;
     inReplyTo?: unknown;
     quadPoints?: unknown;
+    fieldType?: unknown;
+    fieldValue?: unknown;
     defaultAppearanceData?: unknown;
     inkLists?: unknown;
     lineCoordinates?: unknown;

package/dist/runtime/assets/fonts/LICENSE-LiberationSans

@@ -0,0 +1,102 @@
+Digitized data copyright (c) 2010 Google Corporation
+	with Reserved Font Arimo, Tinos and Cousine.
+Copyright (c) 2012 Red Hat, Inc.
+	with Reserved Font Name Liberation.
+
+This Font Software is licensed under the SIL Open Font License,
+Version 1.1.
+
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+
+PREAMBLE The goals of the Open Font License (OFL) are to stimulate
+worldwide development of collaborative font projects, to support the font
+creation efforts of academic and linguistic communities, and to provide
+a free and open framework in which fonts may be shared and improved in
+partnership with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves.
+The fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works.  The fonts and derivatives,
+however, cannot be released under any other type of license.  The
+requirement for fonts to remain under this license does not apply to
+any document created using the fonts or their derivatives.
+
+ 
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such.
+This may include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components
+as distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting ? in part or in whole ?
+any of the components of the Original Version, by changing formats or
+by porting the Font Software to a new environment.
+
+"Author" refers to any designer, engineer, programmer, technical writer
+or other person who contributed to the Font Software.
+
+
+PERMISSION & CONDITIONS
+
+Permission is hereby granted, free of charge, to any person obtaining a
+copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,in
+   Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+   redistributed and/or sold with any software, provided that each copy
+   contains the above copyright notice and this license. These can be
+   included either as stand-alone text files, human-readable headers or
+   in the appropriate machine-readable metadata fields within text or
+   binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+   Name(s) unless explicit written permission is granted by the
+   corresponding Copyright Holder. This restriction only applies to the
+   primary font name as presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+   Software shall not be used to promote, endorse or advertise any
+   Modified Version, except to acknowledge the contribution(s) of the
+   Copyright Holder(s) and the Author(s) or with their explicit written
+   permission.
+
+5) The Font Software, modified or unmodified, in part or in whole, must
+   be distributed entirely under this license, and must not be distributed
+   under any other license. The requirement for fonts to remain under
+   this license does not apply to any document created using the Font
+   Software.
+
+
+ 
+TERMINATION
+This license becomes null and void if any of the above conditions are not met.
+
+ 
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT.  IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM OTHER
+DEALINGS IN THE FONT SOFTWARE.
+

package/dist/runtime/assets/kviewer.css

@@ -1 +1 @@
-.kviewer-text-layer{left:0;line-height:1;overflow:hidden;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:1}.kviewer-text-layer--interactive{cursor:text;-webkit-user-select:text;-moz-user-select:text;user-select:text}.KViewer_is_painting.KViewer_painting_type_12 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_12 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_13 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_13 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_5 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_5 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_6 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_6 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_7 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_7 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_8 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_8 .kviewer-annotation-layer *{cursor:crosshair!important}.KViewer_is_painting.KViewer_painting_type_4 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_4 .kviewer-annotation-layer *{cursor:text!important}.KViewer_is_painting.KViewer_painting_type_11 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_11 .kviewer-annotation-layer *{cursor:crosshair!important}.KViewer_selector_hover{cursor:pointer!important}.kviewer-form-layer{left:0;overflow:hidden;position:absolute;top:0}.kviewer-form-field{box-sizing:border-box;position:absolute}.kviewer-form-input{background-color:color-mix(in srgb,var(--kvw-field-color,#1677ff) 14%,transparent);border:1px solid transparent;box-sizing:border-box;color:#000;display:block;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:500;height:100%;line-height:normal;margin:0;outline:none;padding:1px 2px;resize:none;width:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;vertical-align:top}.kviewer-form-input:hover{background-color:color-mix(in srgb,var(--kvw-field-color,#1677ff) 22%,transparent);border-color:rgba(0,0,0,.2)}.kviewer-form-input:focus{background-color:color-mix(in srgb,var(--kvw-field-color,#1677ff) 28%,transparent);border-color:var(--kvw-field-color,var(--color-primary,#3b82f6));outline:2px solid var(--kvw-field-color,var(--color-primary,#3b82f6))}.kviewer-form-select{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;cursor:pointer}.kviewer-form-listbox{overflow-y:auto;padding:0}.kviewer-form-listbox option{padding:1px 3px}.kviewer-form-editable-combo{height:100%;position:relative;width:100%}.kviewer-form-editable-combo input{height:100%;width:100%}.kviewer-form-checkbox,.kviewer-form-radio{align-items:center;background:#fff;box-sizing:border-box;cursor:pointer;display:flex;height:100%;justify-content:center;width:100%}.kviewer-form-checkbox input,.kviewer-form-radio input{accent-color:var(--kvw-field-color,var(--color-primary,#3b82f6));cursor:pointer;height:80%;margin:0;max-height:18px;max-width:18px;width:80%}.kviewer-form-checkbox--detected{background:transparent}.kviewer-form-checkbox--circle{border-radius:50%}.kviewer-form-checkbox__icon{color:#1a1a1a;height:65%;width:65%}.kviewer-form-checkbox--circle .kviewer-form-checkbox__icon{height:50%;width:50%}.kviewer-form-radio input{accent-color:var(--kvw-field-color,var(--color-primary,#3b82f6));cursor:pointer;height:80%;margin:0;max-height:18px;max-width:18px;width:80%}.kviewer-form-button{align-items:center;background:#c8c8c8;border:1px solid rgba(0,0,0,.35);box-sizing:border-box;color:#000;cursor:pointer;display:flex;font-family:inherit;font-weight:700;height:100%;justify-content:center;line-height:1;padding:0 6px;text-align:center;width:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.kviewer-form-button:hover{background:#bdbdbd}.kviewer-form-button:active{background:#b0b0b0}.kviewer-form-signature{align-items:center;background:rgba(255,255,200,.15);border:1px dashed rgba(0,0,0,.2);cursor:pointer;display:flex;height:100%;justify-content:center;width:100%}.kviewer-form-signature:hover{background:color-mix(in srgb,var(--kvw-field-color,#3b82f6) 8%,transparent);border-color:var(--kvw-field-color,var(--color-primary,#3b82f6))}.kviewer-form-signature--filled{background:transparent;border-color:transparent;border-style:solid}.kviewer-form-signature__preview{max-height:100%;max-width:100%;-o-object-fit:contain;object-fit:contain}.kviewer-form-signature__placeholder{color:rgba(0,0,0,.4);font-size:10px;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}
+.kviewer-text-layer{left:0;line-height:1;overflow:hidden;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:1}.kviewer-text-layer--interactive{cursor:text;-webkit-user-select:text;-moz-user-select:text;user-select:text}.KViewer_is_painting.KViewer_painting_type_12 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_12 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_13 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_13 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_5 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_5 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_6 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_6 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_7 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_7 .kviewer-annotation-layer *,.KViewer_is_painting.KViewer_painting_type_8 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_8 .kviewer-annotation-layer *{cursor:crosshair!important}.KViewer_is_painting.KViewer_painting_type_4 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_4 .kviewer-annotation-layer *{cursor:text!important}.KViewer_is_painting.KViewer_painting_type_11 .kviewer-annotation-layer,.KViewer_is_painting.KViewer_painting_type_11 .kviewer-annotation-layer *{cursor:crosshair!important}.KViewer_selector_hover{cursor:pointer!important}.kviewer-form-layer{left:0;overflow:hidden;position:absolute;top:0}.kviewer-form-field{box-sizing:border-box;position:absolute}.kviewer-form-input{background-color:color-mix(in srgb,var(--kvw-field-color,#1677ff) 14%,transparent);border:1px solid transparent;box-sizing:border-box;color:#000;display:block;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:500;height:100%;line-height:normal;margin:0;outline:none;padding:1px 2px;resize:none;width:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;vertical-align:top}.kviewer-form-input:hover{background-color:color-mix(in srgb,var(--kvw-field-color,#1677ff) 22%,transparent);border-color:rgba(0,0,0,.2)}.kviewer-form-input:focus{background-color:color-mix(in srgb,var(--kvw-field-color,#1677ff) 28%,transparent);border-color:var(--kvw-field-color,var(--color-primary,#3b82f6));outline:2px solid var(--kvw-field-color,var(--color-primary,#3b82f6))}.kviewer-form-uselect{align-items:center;background-color:color-mix(in srgb,var(--kvw-field-color,#1677ff) 14%,transparent);border:1px solid transparent;border-radius:0;box-sizing:border-box;color:#000;cursor:pointer;display:flex;height:100%;line-height:1;padding:0 11px 0 2px;width:100%}.kviewer-form-uselect:hover{background-color:color-mix(in srgb,var(--kvw-field-color,#1677ff) 22%,transparent);border-color:rgba(0,0,0,.2)}.kviewer-form-uselect:focus-visible{background-color:color-mix(in srgb,var(--kvw-field-color,#1677ff) 28%,transparent);outline:2px solid var(--kvw-field-color,var(--color-primary,#3b82f6));outline-offset:-2px}.kviewer-form-uselect:disabled{cursor:default}.kviewer-form-listbox{overflow-y:auto;padding:0}.kviewer-form-listbox option{padding:1px 3px}.kviewer-form-editable-combo{height:100%;position:relative;width:100%}.kviewer-form-editable-combo input{height:100%;width:100%}.kviewer-form-checkbox,.kviewer-form-radio{align-items:center;background:#fff;box-sizing:border-box;cursor:pointer;display:flex;height:100%;justify-content:center;width:100%}.kviewer-form-checkbox input,.kviewer-form-radio input{accent-color:var(--kvw-field-color,var(--color-primary,#3b82f6));cursor:pointer;height:80%;margin:0;max-height:18px;max-width:18px;width:80%}.kviewer-form-checkbox--detected{background:transparent}.kviewer-form-checkbox--circle{border-radius:50%}.kviewer-form-checkbox__icon{color:#1a1a1a;height:65%;width:65%}.kviewer-form-checkbox--circle .kviewer-form-checkbox__icon{height:50%;width:50%}.kviewer-form-radio input{accent-color:var(--kvw-field-color,var(--color-primary,#3b82f6));cursor:pointer;height:80%;margin:0;max-height:18px;max-width:18px;width:80%}.kviewer-form-button{align-items:center;background:#c8c8c8;border:1px solid rgba(0,0,0,.35);box-sizing:border-box;color:#000;cursor:pointer;display:flex;font-family:inherit;font-weight:700;height:100%;justify-content:center;line-height:1;padding:0 6px;text-align:center;width:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.kviewer-form-button:hover{background:#bdbdbd}.kviewer-form-button:active{background:#b0b0b0}.kviewer-form-signature{align-items:center;background:rgba(255,255,200,.15);border:1px dashed rgba(0,0,0,.2);cursor:pointer;display:flex;height:100%;justify-content:center;width:100%}.kviewer-form-signature:hover{background:color-mix(in srgb,var(--kvw-field-color,#3b82f6) 8%,transparent);border-color:var(--kvw-field-color,var(--color-primary,#3b82f6))}.kviewer-form-signature--filled{background:transparent;border-color:transparent;border-style:solid}.kviewer-form-signature__preview{max-height:100%;max-width:100%;-o-object-fit:contain;object-fit:contain}.kviewer-form-signature__placeholder{color:rgba(0,0,0,.4);font-size:10px;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}

package/dist/runtime/components/AnnotationToolbar.vue

@@ -9,7 +9,7 @@
       <UPopover v-if="hasColorEdit && !isMultiSelect">
         <button
           class="flex items-center justify-center w-7 h-7 rounded-md hover:bg-default cursor-pointer"
-          title="Color"
+          :title="t('color')"
         >
           <UIcon name="i-lucide-palette" class="text-sm text-muted" />
         </button>
@@ -41,14 +41,14 @@
 
       <!-- Selection count badge for multi-select -->
       <span v-if="isMultiSelect" class="text-xs text-muted px-1.5">
-        {{ state.selectedAnnotations.value.length }} selected
+        {{ t("selectedCount", { count: state.selectedAnnotations.value.length }) }}
       </span>
 
       <!-- Edit text (free text only) -->
       <button
         v-if="isFreeText"
         class="flex items-center justify-center w-7 h-7 rounded-md hover:bg-default cursor-pointer"
-        title="Edit text"
+        :title="t('editText')"
         data-testid="annotation-edit-text"
         @click="onEditText"
       >
@@ -58,7 +58,7 @@
       <!-- Delete -->
       <button
         class="flex items-center justify-center w-7 h-7 rounded-md hover:bg-default cursor-pointer"
-        title="Delete"
+        :title="t('delete')"
         data-testid="annotation-delete"
         @click="onDelete"
       >
@@ -71,9 +71,11 @@
 <script setup>
 import { computed } from "vue";
 import { useViewerState } from "../composables/useViewerState";
+import { useKviewerI18n } from "../composables/useKviewerI18n";
 import { defaultOptions, annotationDefinitions } from "../annotation/engine/config";
 import { AnnotationType } from "../annotation/engine/types";
 const state = useViewerState();
+const { t } = useKviewerI18n();
 const colors = defaultOptions.colors;
 const isMultiSelect = computed(() => state.selectedAnnotations.value.length > 1);
 const hasSelection = computed(

package/dist/runtime/components/PdfPage.d.vue.ts

@@ -6,9 +6,25 @@ type __VLS_Props = {
     /** Canvas internal resolution multiplier (CSS size unchanged).
      *  Used by panzoom to sharpen the PDF when visually zoomed in. */
     renderQuality?: number;
+    /** Visible region of this page in page-CSS coordinates (already
+     *  includes margin), supplied by the viewer's panzoom. Drives the
+     *  viewport-window raster at high zoom. Null = unknown/inapplicable
+     *  (e.g. rotated pages), full-page rendering only. */
+    viewWindow?: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    } | null;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     renderQuality: number;
+    viewWindow: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    } | null;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/PdfPage.vue

@@ -16,6 +16,15 @@
       ref="canvasRef"
       :style="{ display: 'block', width: cssWidth + 'px', height: cssHeight + 'px' }"
     />
+    <!-- Crisp viewport-window raster: when the full page would blow the
+         canvas budget at high zoom, the base canvas above is only a
+         low-res fallback and this canvas renders just the visible region
+         (plus margin) at full resolution. -->
+    <canvas
+      v-show="windowCanvasVisible"
+      ref="windowCanvasRef"
+      :style="windowCanvasStyle"
+    />
     <div
       ref="textLayerRef"
       class="kviewer-text-layer textLayer"
@@ -33,6 +42,16 @@
       :pointer-events="formFieldPointerEvents"
       :z-index="formFieldZIndex"
     />
+    <!-- transform: translateZ(0) isolates the Konva canvases in their own
+         compositing layer: per-frame canvas updates during annotation
+         drags then only re-upload the (budget-capped) Konva texture
+         instead of triggering an iPadOS re-rasterization of the subtree
+         containing the much larger PDF canvases. -->
+    <!-- overflow: hidden — between a zoom commit and the async Konva
+         re-init the old (differently sized) stage briefly overflows this
+         div; unclipped it inflates the zoom wrapper's scrollHeight and
+         the panzoom clamps against phantom bounds, leaving the page
+         resting out of position. -->
     <div
       ref="annotationRef"
       class="kviewer-annotation-layer"
@@ -43,7 +62,9 @@
   width: cssWidth + 'px',
   height: cssHeight + 'px',
   zIndex: 3,
-  pointerEvents: annotationPointerEvents
+  pointerEvents: annotationPointerEvents,
+  transform: 'translateZ(0)',
+  overflow: 'hidden'
 }"
     />
   </div>
@@ -58,21 +79,35 @@ import { usePageProxyCache } from "../composables/usePageProxyCache";
 import { useFormFields } from "../composables/useFormFields";
 import { useShapeDetection } from "../composables/useShapeDetection";
 import { AnnotationType } from "../annotation/engine/types";
+import { isIPad } from "../annotation/engine/input-device";
+import { extractSignedSignatureAppearancesForPage } from "../annotation/pdf-import/extract_stamp_appearance";
+import { pageTransformFromProxy } from "../annotation/pdf-import/transform";
+import {
+  clampRenderScale,
+  DEFAULT_MAX_CANVAS_PIXELS,
+  IOS_MAX_CANVAS_PIXELS
+} from "../composables/canvas-limits";
 import FormFieldLayer from "./FormFieldLayer.vue";
 const PDFJS_ANNOTATION_MODE_DISABLE = 0;
 const props = defineProps({
   pageNumber: { type: Number, required: true },
   pageMeta: { type: Object, required: true },
   scale: { type: Number, required: true },
-  renderQuality: { type: Number, required: false, default: 1 }
+  renderQuality: { type: Number, required: false, default: 1 },
+  viewWindow: { type: [Object, null], required: false, default: null }
 });
 const canvasRef = ref(null);
+const windowCanvasRef = ref(null);
+const windowCanvasVisible = ref(false);
+const windowCanvasStyle = ref({});
 const textLayerRef = ref(null);
 const annotationRef = ref(null);
 const runtimeConfig = useRuntimeConfig();
 const minRenderPixelRatio = Number(
   runtimeConfig.public.kviewer?.minRenderPixelRatio ?? 2
 );
+const isAppleMobile = typeof navigator !== "undefined" && (isIPad() || /iPhone|iPod/.test(navigator.userAgent));
+const maxCanvasPixels = isAppleMobile ? IOS_MAX_CANVAS_PIXELS : DEFAULT_MAX_CANVAS_PIXELS;
 const state = useViewerState();
 const search = useViewerSearch();
 const proxyCache = usePageProxyCache();
@@ -80,6 +115,11 @@ const formFields = useFormFields();
 const shapeDetection = useShapeDetection();
 const pageProxy = shallowRef(null);
 let currentRenderTask = null;
+let windowRenderTask = null;
+let windowed = false;
+let renderedWindowKey = null;
+const FALLBACK_MAX_CANVAS_PIXELS = 4e6;
+const WINDOW_MAX_CANVAS_PIXELS = 8e6;
 let textLayer = null;
 const baseWidth = props.pageMeta.width;
 const baseHeight = props.pageMeta.height;
@@ -109,8 +149,8 @@ onMounted(async () => {
   await renderTextLayer();
   initKonva();
   if (pageProxy.value) {
-    const rawAnnotations = await pageProxy.value.getAnnotations();
-    formFields.parsePageFields(props.pageNumber, rawAnnotations);
+    rawPageAnnotations = await pageProxy.value.getAnnotations();
+    formFields.parsePageFields(props.pageNumber, rawPageAnnotations);
   }
   if (state.shapeDetection.value && pageProxy.value) {
     const viewport = pageProxy.value.getViewport({ scale: props.scale });
@@ -129,6 +169,27 @@ onMounted(async () => {
     }
   }
 });
+let rawPageAnnotations = null;
+const attemptedSignatureSeedIds = /* @__PURE__ */ new Set();
+const pendingSignedSignatureKey = computed(() => formFields.getFieldsForPage(props.pageNumber).filter((def) => def.fieldType === "signature" && def.signedInSource && formFields.getFieldValue(def.id)?.value === "").map((def) => def.id).join(","));
+watch(pendingSignedSignatureKey, (key) => {
+  if (key !== "") void seedSignedSignatureAppearances();
+});
+async function seedSignedSignatureAppearances() {
+  if (!pageProxy.value || !rawPageAnnotations) return;
+  const pending = formFields.getFieldsForPage(props.pageNumber).filter((def) => def.fieldType === "signature" && def.signedInSource && formFields.getFieldValue(def.id)?.value === "" && !attemptedSignatureSeedIds.has(def.id));
+  if (pending.length === 0) return;
+  for (const def of pending) attemptedSignatureSeedIds.add(def.id);
+  const appearances = await extractSignedSignatureAppearancesForPage(
+    pageProxy.value,
+    pageTransformFromProxy(pageProxy.value),
+    rawPageAnnotations
+  );
+  for (const def of pending) {
+    const appearance = appearances.get(def.id);
+    if (appearance) formFields.setFieldValue(def.id, appearance.dataUrl);
+  }
+}
 watch(
   () => state.shapeDetection.value,
   async (enabled) => {
@@ -151,10 +212,22 @@ watch(
 );
 watch(
   () => props.scale,
-  async () => {
+  async (newScale, oldScale) => {
     if (!pageProxy.value) return;
+    if (windowCanvasVisible.value && oldScale && newScale !== oldScale) {
+      const r = newScale / oldScale;
+      const s = windowCanvasStyle.value;
+      windowCanvasStyle.value = {
+        ...s,
+        left: Number.parseFloat(s.left ?? "0") * r + "px",
+        top: Number.parseFloat(s.top ?? "0") * r + "px",
+        width: Number.parseFloat(s.width ?? "0") * r + "px",
+        height: Number.parseFloat(s.height ?? "0") * r + "px"
+      };
+      renderedWindowKey = null;
+    }
     shapeDetection.clearShapeCache(props.pageNumber);
-    await renderCanvas();
+    await renderCanvas({ doubleBuffer: true });
     updateTextLayer();
     if (state.painter.value) {
       state.painter.value.destroyCanvasForPage(props.pageNumber);
@@ -183,9 +256,16 @@ async function renderCanvas(opts) {
   }
   const dpr = Math.max(window.devicePixelRatio || 1, minRenderPixelRatio);
   const quality = props.renderQuality ?? 1;
-  const viewport = proxy.getViewport({
-    scale: props.scale * quality * dpr
-  });
+  const desiredScale = props.scale * quality * dpr;
+  const fullScale = clampRenderScale(desiredScale, baseWidth, baseHeight, maxCanvasPixels);
+  windowed = fullScale < desiredScale * 0.999;
+  const renderScale = windowed ? clampRenderScale(
+    desiredScale,
+    baseWidth,
+    baseHeight,
+    Math.min(FALLBACK_MAX_CANVAS_PIXELS, maxCanvasPixels)
+  ) : fullScale;
+  const viewport = proxy.getViewport({ scale: renderScale });
   if (opts?.doubleBuffer) {
     const tmp = document.createElement("canvas");
     tmp.width = viewport.width;
@@ -225,7 +305,84 @@ async function renderCanvas(opts) {
       currentRenderTask = null;
     }
   }
+  if (windowed) {
+    void renderWindowCanvas();
+  } else {
+    hideWindowCanvas();
+  }
+}
+function hideWindowCanvas() {
+  windowCanvasVisible.value = false;
+  renderedWindowKey = null;
+  const c = windowCanvasRef.value;
+  if (c && c.width > 0) {
+    c.width = 0;
+    c.height = 0;
+  }
 }
+async function renderWindowCanvas() {
+  const proxy = pageProxy.value;
+  const canvas = windowCanvasRef.value;
+  const win = props.viewWindow;
+  if (!proxy || !canvas || !win || !windowed) return;
+  const x = Math.max(0, Math.min(win.x, cssWidth.value));
+  const y = Math.max(0, Math.min(win.y, cssHeight.value));
+  const w = Math.min(win.x + win.width, cssWidth.value) - x;
+  const h = Math.min(win.y + win.height, cssHeight.value) - y;
+  if (w <= 0 || h <= 0) return;
+  const key = [x, y, w, h, props.scale].map((n) => Math.round(n)).join(",");
+  if (key === renderedWindowKey && windowCanvasVisible.value) return;
+  const dpr = window.devicePixelRatio || 1;
+  const renderScale = clampRenderScale(
+    props.scale * dpr,
+    w / props.scale,
+    h / props.scale,
+    Math.min(WINDOW_MAX_CANVAS_PIXELS, maxCanvasPixels)
+  );
+  const k = renderScale / props.scale;
+  const viewport = proxy.getViewport({ scale: renderScale });
+  windowRenderTask?.cancel();
+  await currentRenderTask?.promise.catch(() => {
+  });
+  const tmp = document.createElement("canvas");
+  tmp.width = Math.floor(w * k);
+  tmp.height = Math.floor(h * k);
+  try {
+    windowRenderTask = proxy.render({
+      canvasContext: tmp.getContext("2d"),
+      viewport,
+      transform: [1, 0, 0, 1, -x * k, -y * k],
+      annotationMode: PDFJS_ANNOTATION_MODE_DISABLE
+    });
+    await windowRenderTask.promise;
+    canvas.width = tmp.width;
+    canvas.height = tmp.height;
+    canvas.getContext("2d").drawImage(tmp, 0, 0);
+    windowCanvasStyle.value = {
+      position: "absolute",
+      left: x + "px",
+      top: y + "px",
+      width: w + "px",
+      height: h + "px"
+    };
+    windowCanvasVisible.value = true;
+    renderedWindowKey = key;
+  } catch (e) {
+    if (e instanceof Error && e.message?.includes("Rendering cancelled")) return;
+    console.warn("[KViewer] Window render failed:", e);
+  } finally {
+    windowRenderTask = null;
+    tmp.width = 0;
+    tmp.height = 0;
+  }
+}
+watch(
+  () => props.viewWindow,
+  (win) => {
+    if (windowed) void renderWindowCanvas();
+    state.painter.value?.setStageWindow(props.pageNumber, win ?? null);
+  }
+);
 function initKonva() {
   if (!annotationRef.value || !state.painter.value) return;
   state.painter.value.initCanvasForPage(
@@ -235,6 +392,9 @@ function initKonva() {
     baseHeight,
     props.scale
   );
+  if (props.viewWindow) {
+    state.painter.value.setStageWindow(props.pageNumber, props.viewWindow);
+  }
 }
 async function renderTextLayer() {
   const container = textLayerRef.value;
@@ -279,6 +439,7 @@ function updateTextLayer() {
 }
 onBeforeUnmount(() => {
   currentRenderTask?.cancel();
+  windowRenderTask?.cancel();
   textLayer?.cancel();
   textLayer = null;
   search.unregisterPageLayer(props.pageNumber);