kviewer 0.0.5 → 0.0.7

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "kviewer",
   "configKey": "kviewer",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/annotation/engine/editor/editor.js

@@ -50,7 +50,7 @@ export class Editor {
       id,
       pageNumber,
       konvaString: konvaGroup.toJSON(),
-      konvaClientRect: konvaGroup.getClientRect(),
+      konvaClientRect: Konva.Node.create(konvaGroup.toJSON()).getClientRect(),
       title: this.userName,
       type: annotation.type,
       pdfjsType: annotation.pdfjsAnnotationType,

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

@@ -1,16 +1,19 @@
 import { PDFName, PDFString } from "pdf-lib";
 import { convertKonvaRectToPdfRect, rgbToPdfColor, stringToPDFHexString } from "../engine/utils.js";
 import { AnnotationParser } from "./parse.js";
+import { computeBoundsFromKonvaString } from "./parse_utils.js";
 const UNKNOWN_USER = "Unknown user";
 export class CircleParser extends AnnotationParser {
   async parse() {
     const { annotation, page, pdfDoc } = this;
     const context = pdfDoc.context;
     const pageHeight = page.getHeight();
+    const bounds = computeBoundsFromKonvaString(annotation.konvaString);
+    const rect = convertKonvaRectToPdfRect(bounds ?? annotation.konvaClientRect, pageHeight);
     const mainAnn = context.obj({
       Type: PDFName.of("Annot"),
       Subtype: PDFName.of("Circle"),
-      Rect: convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight),
+      Rect: rect,
       C: rgbToPdfColor(annotation.color || void 0),
       T: stringToPDFHexString(annotation.title || UNKNOWN_USER),
       Contents: stringToPDFHexString(annotation.contentsObj?.text || ""),
@@ -24,7 +27,7 @@ export class CircleParser extends AnnotationParser {
       const replyAnn = context.obj({
         Type: PDFName.of("Annot"),
         Subtype: PDFName.of("Text"),
-        Rect: convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight),
+        Rect: rect,
         Contents: stringToPDFHexString(comment.content),
         T: stringToPDFHexString(comment.title || UNKNOWN_USER),
         M: PDFString.of(comment.date || ""),

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

@@ -1,6 +1,7 @@
 import { PDFName, PDFNumber, PDFString } from "pdf-lib";
 import { convertKonvaRectToPdfRect, rgbToPdfColor, stringToPDFHexString } from "../engine/utils.js";
 import { AnnotationParser } from "./parse.js";
+import { computeBoundsFromKonvaString } from "./parse_utils.js";
 const UNKNOWN_USER = "Unknown user";
 function parseSvgPathToPoints(data) {
   const commands = data.match(/[a-z][^a-z]*/gi) || [];
@@ -59,7 +60,9 @@ export class PolylineParser extends AnnotationParser {
     const mainAnn = context.obj({
       Type: PDFName.of("Annot"),
       Subtype: PDFName.of("Ink"),
-      Rect: convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight),
+      // Compute Rect from konvaString so it reflects the current position
+      // even when konvaClientRect is stale after a move/resize.
+      Rect: convertKonvaRectToPdfRect(computeBoundsFromKonvaString(annotation.konvaString) ?? annotation.konvaClientRect, pageHeight),
       InkList: inkList,
       C: context.obj([PDFNumber.of(r), PDFNumber.of(g), PDFNumber.of(b)]),
       T: stringToPDFHexString(annotation.title || UNKNOWN_USER),
@@ -76,7 +79,7 @@ export class PolylineParser extends AnnotationParser {
       const replyAnn = context.obj({
         Type: PDFName.of("Annot"),
         Subtype: PDFName.of("Text"),
-        Rect: convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight),
+        Rect: convertKonvaRectToPdfRect(computeBoundsFromKonvaString(annotation.konvaString) ?? annotation.konvaClientRect, pageHeight),
         Contents: stringToPDFHexString(comment.content),
         T: stringToPDFHexString(comment.title || UNKNOWN_USER),
         M: PDFString.of(comment.date || ""),

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

@@ -1,16 +1,19 @@
 import { PDFName, PDFString } from "pdf-lib";
 import { convertKonvaRectToPdfRect, rgbToPdfColor, stringToPDFHexString } from "../engine/utils.js";
 import { AnnotationParser } from "./parse.js";
+import { computeBoundsFromKonvaString } from "./parse_utils.js";
 const UNKNOWN_USER = "Unknown user";
 export class SquareParser extends AnnotationParser {
   async parse() {
     const { annotation, page, pdfDoc } = this;
     const context = pdfDoc.context;
     const pageHeight = page.getHeight();
+    const bounds = computeBoundsFromKonvaString(annotation.konvaString);
+    const rect = convertKonvaRectToPdfRect(bounds ?? annotation.konvaClientRect, pageHeight);
     const mainAnn = context.obj({
       Type: PDFName.of("Annot"),
       Subtype: PDFName.of("Square"),
-      Rect: convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight),
+      Rect: rect,
       C: rgbToPdfColor(annotation.color || void 0),
       T: stringToPDFHexString(annotation.title || UNKNOWN_USER),
       Contents: stringToPDFHexString(annotation.contentsObj?.text || ""),
@@ -24,7 +27,7 @@ export class SquareParser extends AnnotationParser {
       const replyAnn = context.obj({
         Type: PDFName.of("Annot"),
         Subtype: PDFName.of("Text"),
-        Rect: convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight),
+        Rect: rect,
         Contents: stringToPDFHexString(comment.content),
         T: stringToPDFHexString(comment.title || UNKNOWN_USER),
         M: PDFString.of(comment.date || ""),

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

@@ -1,6 +1,7 @@
 import { PDFName, PDFNumber, PDFRawStream, PDFString } from "pdf-lib";
 import { convertKonvaRectToPdfRect, stringToPDFHexString } from "../engine/utils.js";
 import { AnnotationParser } from "./parse.js";
+import { computeBoundsFromKonvaString } from "./parse_utils.js";
 const UNKNOWN_USER = "Unknown user";
 const SVG_RASTER_SCALE = 4;
 const MAX_RASTER_EDGE = 4096;
@@ -122,7 +123,8 @@ export class StampParser extends AnnotationParser {
   async parse() {
     const { annotation, page, pdfDoc } = this;
     const context = pdfDoc.context;
-    const [x1, y1, x2, y2] = convertKonvaRectToPdfRect(annotation.konvaClientRect, page.getHeight());
+    const bounds = computeBoundsFromKonvaString(annotation.konvaString);
+    const [x1, y1, x2, y2] = convertKonvaRectToPdfRect(bounds ?? annotation.konvaClientRect, page.getHeight());
     const pageWidth = page.getWidth();
     const pageHeight = page.getHeight();
     const left = Math.max(0, Math.min(x1, pageWidth));
@@ -179,7 +181,7 @@ export class StampParser extends AnnotationParser {
       const replyAnn = context.obj({
         Type: PDFName.of("Annot"),
         Subtype: PDFName.of("Text"),
-        Rect: convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight),
+        Rect: convertKonvaRectToPdfRect(bounds ?? annotation.konvaClientRect, pageHeight),
         Contents: stringToPDFHexString(comment.content),
         T: stringToPDFHexString(comment.title || UNKNOWN_USER),
         M: PDFString.of(comment.date || ""),

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

@@ -1,11 +1,13 @@
 import { PDFName, PDFString } from "pdf-lib";
 import { convertKonvaRectToPdfRect, rgbToPdfColor, stringToPDFHexString } from "../engine/utils.js";
 import { AnnotationParser } from "./parse.js";
+import { computeBoundsFromKonvaString } from "./parse_utils.js";
 const UNKNOWN_USER = "Unknown user";
 export class TextParser extends AnnotationParser {
   async parse() {
     const { annotation, page, pdfDoc } = this;
-    const rect = convertKonvaRectToPdfRect(annotation.konvaClientRect, page.getHeight());
+    const bounds = computeBoundsFromKonvaString(annotation.konvaString);
+    const rect = convertKonvaRectToPdfRect(bounds ?? annotation.konvaClientRect, page.getHeight());
     const context = pdfDoc.context;
     const mainAnn = context.obj({
       Type: PDFName.of("Annot"),

package/dist/runtime/annotation/pdf-export/parse_utils.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Shared utilities for PDF export parsers.
+ *
+ * The main purpose is to compute annotation bounding boxes from the
+ * serialised Konva JSON (`konvaString`) rather than relying on
+ * `konvaClientRect`, which can become stale after the annotation is
+ * moved or resized.
+ */
+/**
+ * Compute the bounding box of a Konva group from its serialised JSON,
+ * applying group-level transforms (x, y, scaleX, scaleY) to every child.
+ *
+ * Handles:
+ *  - Rect / Image / Text children  → x, y, width, height
+ *  - Ellipse children              → x (centre), y (centre), radiusX, radiusY
+ *
+ * Returns `null` when the string cannot be parsed or contains no children
+ * with computable dimensions. Callers should fall back to
+ * `annotation.konvaClientRect` in that case.
+ */
+export declare function computeBoundsFromKonvaString(konvaString: string): {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+} | null;

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

@@ -0,0 +1,54 @@
+export function computeBoundsFromKonvaString(konvaString) {
+  let konvaGroup;
+  try {
+    konvaGroup = JSON.parse(konvaString);
+  } catch {
+    return null;
+  }
+  const groupX = konvaGroup.attrs?.x ?? 0;
+  const groupY = konvaGroup.attrs?.y ?? 0;
+  const scaleX = konvaGroup.attrs?.scaleX ?? 1;
+  const scaleY = konvaGroup.attrs?.scaleY ?? 1;
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  for (const child of konvaGroup.children ?? []) {
+    const attrs = child.attrs;
+    if (!attrs) continue;
+    let cx;
+    let cy;
+    let cw;
+    let ch;
+    if (child.className === "Ellipse") {
+      const rx = attrs.radiusX ?? 0;
+      const ry = attrs.radiusY ?? 0;
+      if (rx <= 0 && ry <= 0) continue;
+      cx = (attrs.x ?? 0) - rx;
+      cy = (attrs.y ?? 0) - ry;
+      cw = rx * 2;
+      ch = ry * 2;
+    } else {
+      cx = attrs.x ?? 0;
+      cy = attrs.y ?? 0;
+      cw = attrs.width ?? 0;
+      ch = attrs.height ?? 0;
+      if (cw <= 0 && ch <= 0) continue;
+    }
+    const x = groupX + cx * scaleX;
+    const y = groupY + cy * scaleY;
+    const w = Math.abs(cw * scaleX);
+    const h = Math.abs(ch * scaleY);
+    minX = Math.min(minX, x);
+    minY = Math.min(minY, y);
+    maxX = Math.max(maxX, x + w);
+    maxY = Math.max(maxY, y + h);
+  }
+  if (!Number.isFinite(minX) || !Number.isFinite(minY)) return null;
+  return {
+    x: minX,
+    y: minY,
+    width: maxX - minX,
+    height: maxY - minY
+  };
+}

package/dist/runtime/components/Viewer.vue

@@ -189,7 +189,7 @@ const props = defineProps({
 });
 const viewerRoot = ref(null);
 const scrollContainer = ref(null);
-const { state: viewerState, setScrollToPageFn } = provideViewerState();
+const { state: viewerState, setScrollToPageFn, setDownloadPdfFn } = provideViewerState();
 watchEffect(() => {
   viewerState.readonly.value = props.readonly ?? false;
 });
@@ -640,6 +640,7 @@ onMounted(() => {
   if (isIPad()) {
     viewerState.setStylusMode(true);
   }
+  setDownloadPdfFn(() => exportPdf({ download: true }));
   loadDocument();
   window.addEventListener("keydown", onGlobalKeydown);
 });

package/dist/runtime/components/ViewerBar.vue

@@ -58,9 +58,6 @@
 <script setup>
 import { ref } from "vue";
 import { useViewerState } from "../composables/useViewerState";
-import { getTimestampString } from "../annotation/engine/utils";
-import { downloadPdfBytes } from "../annotation/pdf-export/download";
-import { exportAnnotationsToPdf } from "../annotation/pdf-export/export";
 import PageSettings from "./tools/PageSettings.vue";
 import ZoomControls from "./tools/ZoomControls.vue";
 import HandTool from "./tools/HandTool.vue";
@@ -77,20 +74,7 @@ function bumpStyleVersion() {
 }
 async function onDownload() {
   try {
-    if (!state.doc.value || !state.painter.value) return;
-    const exportContext = state.painter.value.getExportContext();
-    const bytes = await exportAnnotationsToPdf({
-      pdfData: await state.doc.value.getData(),
-      annotations: exportContext.annotations,
-      options: {
-        flatten: false,
-        preserveOriginalAnnotations: false
-      },
-      originalAnnotationIds: exportContext.originalIds,
-      modifiedAnnotationIds: exportContext.modifiedIds,
-      deletedAnnotationIds: exportContext.deletedIds
-    });
-    downloadPdfBytes(bytes, `annotated_${getTimestampString()}.pdf`);
+    await state.downloadPdf();
   } catch (error) {
     console.error("Failed to export PDF from menu action", error);
   }

package/dist/runtime/composables/useViewerState.d.ts

@@ -53,6 +53,7 @@ export interface ViewerState {
     stylusMode: Ref<boolean>;
     setStylusMode: (enabled: boolean) => void;
     scrollToPage: (pageNumber: number) => void;
+    downloadPdf: () => Promise<void>;
     history: AnnotationHistory;
     readonly: Ref<boolean>;
     shapeDetection: Ref<boolean>;
@@ -60,6 +61,7 @@ export interface ViewerState {
 export interface ViewerStateProvider {
     state: ViewerState;
     setScrollToPageFn: (fn: (pageNumber: number) => void) => void;
+    setDownloadPdfFn: (fn: () => Promise<void>) => void;
 }
 export declare function provideViewerState(): ViewerStateProvider;
 export declare function useViewerState(): ViewerState;

package/dist/runtime/composables/useViewerState.js

@@ -130,9 +130,13 @@ export function provideViewerState() {
     return painter.value?.getData() ?? [];
   }
   let _scrollToPageFn = null;
+  let _downloadPdfFn = null;
   function scrollToPage(pageNumber) {
     _scrollToPageFn?.(pageNumber);
   }
+  async function downloadPdf() {
+    await _downloadPdfFn?.();
+  }
   const history = createAnnotationHistory(annotations, painter);
   const state = {
     scale,
@@ -174,6 +178,7 @@ export function provideViewerState() {
     stylusMode,
     setStylusMode,
     scrollToPage,
+    downloadPdf,
     history,
     readonly,
     shapeDetection: shapeDetectionEnabled
@@ -183,6 +188,9 @@ export function provideViewerState() {
     state,
     setScrollToPageFn(fn) {
       _scrollToPageFn = fn;
+    },
+    setDownloadPdfFn(fn) {
+      _downloadPdfFn = fn;
     }
   };
 }

package/dist/runtime/plugin.d.ts

@@ -1,2 +1,2 @@
-declare const _default: any;
+declare const _default: import("nuxt/app").Plugin<Record<string, unknown>> & import("nuxt/app").ObjectPlugin<Record<string, unknown>>;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kviewer",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "description": "Kabema PDF Editor",
   "repository": "kabema/kviewer",
   "license": "MIT",