kviewer 0.0.4 → 0.0.6

package/README.md

@@ -13,6 +13,7 @@ A Nuxt module for viewing, annotating, and exporting PDFs. Built on pdfjs-dist,
 - ✏️ 14 annotation tools: Select, Highlight, Strikeout, Underline, Free Text, Signature, Rectangle, Circle, Arrow, Cloud, Freehand, Free Highlight, Stamp, Note
 - 📤 Export PDF with or without flattened annotations
 - 💾 Import/export annotation state for draft saving
+- 🔄 Native PDF annotations are auto-imported into editable Konva annotations (core set: Text/FreeText/Highlight/Underline/StrikeOut/Square/Circle/Ink/Line)
 - 📝 Interactive form fields (text, checkbox, radio, dropdown, signature, button)
 - 🔍 Full-text search with match highlighting
 - ⚡ Virtual scrolling for large documents
@@ -94,6 +95,8 @@ viewerRef.value?.setFormFieldValue('email', 'user@example.com')
 
 `exportPdf` options default to `{ flatten: false, download: false, preserveOriginalAnnotations: false }`.
 
+When native PDF annotations are auto-imported into Konva, exporting with `preserveOriginalAnnotations: true` may duplicate annotations. Prefer `preserveOriginalAnnotations: false` in that workflow.
+
 ## Development
 
 <details>

package/dist/module.json

@@ -1,9 +1,9 @@
 {
   "name": "kviewer",
   "configKey": "kviewer",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
-    "unbuild": "unknown"
+    "unbuild": "3.6.1"
   }
 }

package/dist/runtime/annotation/engine/painter.d.ts

@@ -90,6 +90,13 @@ export declare class Painter {
     updateAnnotationStyle(annotationStore: IAnnotationStore, style: IAnnotationStyle): void;
     reAddAnnotation(annotation: IAnnotationStore): void;
     getData(): IAnnotationStore[];
+    getExportContext(): {
+        annotations: IAnnotationStore[];
+        changedAnnotations: IAnnotationStore[];
+        originalIds: Set<string>;
+        modifiedIds: Set<string>;
+        deletedIds: Set<string>;
+    };
     getAnnotation(id: string): IAnnotationStore | undefined;
     clearAllAnnotations(emit?: boolean): void;
     replaceAnnotations(annotations: IAnnotationStore[]): void;

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

@@ -546,6 +546,20 @@ export class Painter {
   getData() {
     return this.store.annotations;
   }
+  getExportContext() {
+    const originalIds = this.store.originalIds;
+    const modifiedIds = this.store.modifiedOriginals;
+    const changedAnnotations = this.store.annotations.filter(
+      (a) => !originalIds.has(a.id) || modifiedIds.has(a.id)
+    );
+    return {
+      annotations: this.store.annotations,
+      changedAnnotations,
+      originalIds,
+      modifiedIds,
+      deletedIds: this.store.deletedOriginals
+    };
+  }
   getAnnotation(id) {
     return this.store.annotation(id);
   }

package/dist/runtime/annotation/engine/store.d.ts

@@ -2,10 +2,15 @@ import type { IAnnotationStore } from './types.js';
 export declare class Store {
     private annotationStore;
     private originalAnnotationStore;
+    private deletedOriginalIds;
+    private modifiedOriginalIds;
     get annotation(): (id: string) => IAnnotationStore | undefined;
     get annotations(): IAnnotationStore[];
     save(store: IAnnotationStore, isOriginal: boolean): IAnnotationStore;
     update(id: string, updates: Partial<IAnnotationStore>): IAnnotationStore | null;
     getByPage(pageNumber: number): IAnnotationStore[];
     delete(id: string): void;
+    get originalIds(): Set<string>;
+    get deletedOriginals(): Set<string>;
+    get modifiedOriginals(): Set<string>;
 }

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

@@ -2,6 +2,8 @@ import { formatTimestamp } from "./utils.js";
 export class Store {
   annotationStore = /* @__PURE__ */ new Map();
   originalAnnotationStore = /* @__PURE__ */ new Map();
+  deletedOriginalIds = /* @__PURE__ */ new Set();
+  modifiedOriginalIds = /* @__PURE__ */ new Set();
   get annotation() {
     return (id) => this.annotationStore.get(id);
   }
@@ -25,6 +27,9 @@ export class Store {
           date: formatTimestamp(Date.now())
         };
         this.annotationStore.set(id, updatedAnnotation);
+        if (this.originalAnnotationStore.has(id)) {
+          this.modifiedOriginalIds.add(id);
+        }
         return updatedAnnotation;
       }
     } else {
@@ -40,8 +45,20 @@ export class Store {
   delete(id) {
     if (this.annotationStore.has(id)) {
       this.annotationStore.delete(id);
+      if (this.originalAnnotationStore.has(id)) {
+        this.deletedOriginalIds.add(id);
+      }
     } else {
       console.warn(`Annotation with id ${id} not found.`);
     }
   }
+  get originalIds() {
+    return new Set(this.originalAnnotationStore.keys());
+  }
+  get deletedOriginals() {
+    return new Set(this.deletedOriginalIds);
+  }
+  get modifiedOriginals() {
+    return new Set(this.modifiedOriginalIds);
+  }
 }

package/dist/runtime/annotation/engine/tools/free-text.js

@@ -74,7 +74,9 @@ export class EditorFreeText extends Editor {
     const { finalWidth, wrap } = EditorFreeText.measureText(value, fontSize);
     group.getChildren().forEach((shape) => {
       if (shape instanceof Konva.Text) {
-        shape.setAttrs({ text: value, fill: color, fontSize, width: finalWidth, wrap });
+        const existingWidth = shape.width();
+        const keepWidth = existingWidth > 0 ? Math.max(existingWidth, finalWidth) : finalWidth;
+        shape.setAttrs({ text: value, fill: color, fontSize, width: keepWidth, wrap: keepWidth > finalWidth ? "word" : wrap });
       }
     });
     this.setChanged(id, {

package/dist/runtime/annotation/engine/types.d.ts

@@ -142,6 +142,8 @@ export interface FormFieldDefinition {
     rect: [number, number, number, number];
     readOnly: boolean;
     required: boolean;
+    /** Visual shape hint for detected checkboxes (circle renders round, rectangle renders square). */
+    shapeType?: DetectedShapeType;
     defaultValue?: string;
     maxLen?: number;
     multiLine?: boolean;
@@ -168,3 +170,21 @@ export interface FormFieldValue {
     fieldType: FormFieldType;
     value: string | boolean | string[];
 }
+export interface DetectedShapeRect {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+export interface DetectedShapeCenter {
+    x: number;
+    y: number;
+}
+export type DetectedShapeType = 'rectangle' | 'circle';
+export interface DetectedShape {
+    id: string;
+    rect: DetectedShapeRect;
+    center: DetectedShapeCenter;
+    size: number;
+    shapeType?: DetectedShapeType;
+}

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

@@ -10,6 +10,9 @@ interface ExportPdfParams {
     annotations: IAnnotationStore[];
     options?: ExportPdfOptions;
     formFieldValues?: FormFieldValue[];
+    originalAnnotationIds?: Set<string>;
+    modifiedAnnotationIds?: Set<string>;
+    deletedAnnotationIds?: Set<string>;
 }
-export declare function exportAnnotationsToPdf({ pdfData, annotations, options, formFieldValues, }: ExportPdfParams): Promise<Uint8Array>;
+export declare function exportAnnotationsToPdf({ pdfData, annotations, options, formFieldValues, originalAnnotationIds, modifiedAnnotationIds, deletedAnnotationIds, }: ExportPdfParams): Promise<Uint8Array>;
 export {};

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

@@ -1,4 +1,4 @@
-import { PDFDocument, PDFName } from "pdf-lib";
+import { PDFArray, PDFDict, PDFDocument, PDFName, PDFRef, PDFString } from "pdf-lib";
 import { PdfjsAnnotationType } from "../engine/types.js";
 import { writeFormFieldsToPdf } from "./export-form-fields.js";
 import { CircleParser } from "./parse_circle.js";
@@ -37,6 +37,92 @@ function clearAllAnnotations(pdfDoc) {
     }
   }
 }
+const ALWAYS_PRESERVE_SUBTYPES = /* @__PURE__ */ new Set([
+  "Widget",
+  "Link",
+  "Popup",
+  "Sound",
+  "Movie",
+  "Screen",
+  "PrinterMark",
+  "TrapNet",
+  "Watermark",
+  "3D",
+  "Redact",
+  "FileAttachment",
+  "Caret"
+]);
+function resolveAnnotDict(ref, context) {
+  if (ref instanceof PDFRef) {
+    const looked = context.lookup(ref);
+    return looked instanceof PDFDict ? looked : null;
+  }
+  if (ref instanceof PDFDict) {
+    return ref;
+  }
+  return null;
+}
+function getAnnotNM(dict) {
+  const nm = dict.get(PDFName.of("NM"));
+  if (nm instanceof PDFString) return nm.decodeText();
+  return null;
+}
+function getAnnotSubtype(dict) {
+  const sub = dict.get(PDFName.of("Subtype"));
+  if (sub instanceof PDFName) return sub.decodeText();
+  return null;
+}
+function getAnnotIRT(dict) {
+  return dict.get(PDFName.of("IRT")) ?? null;
+}
+function refMatchesId(ref, ids) {
+  if (!(ref instanceof PDFRef)) return false;
+  return ids.has(`${ref.objectNumber}R`);
+}
+function removeOwnedAnnotations(pdfDoc, ownedIds, deletedIds) {
+  const context = pdfDoc.context;
+  const idsToRemove = /* @__PURE__ */ new Set([...ownedIds, ...deletedIds]);
+  for (const page of pdfDoc.getPages()) {
+    const annotsKey = PDFName.of("Annots");
+    const rawAnnots = page.node.lookup(annotsKey);
+    if (!(rawAnnots instanceof PDFArray)) continue;
+    const removedRefs = /* @__PURE__ */ new Set();
+    const entries = [];
+    for (let i = 0; i < rawAnnots.size(); i++) {
+      const ref = rawAnnots.get(i);
+      const dict = resolveAnnotDict(ref, context);
+      entries.push({ ref, dict });
+      if (!dict) continue;
+      const subtype = getAnnotSubtype(dict);
+      if (subtype && ALWAYS_PRESERVE_SUBTYPES.has(subtype)) continue;
+      const nm = getAnnotNM(dict);
+      const shouldRemove = nm && idsToRemove.has(nm) || refMatchesId(ref, idsToRemove);
+      if (shouldRemove && ref instanceof PDFRef) {
+        removedRefs.add(ref);
+      }
+    }
+    const kept = [];
+    for (const { ref, dict } of entries) {
+      if (!(ref instanceof PDFRef)) continue;
+      if (!dict) {
+        kept.push(ref);
+        continue;
+      }
+      const subtype = getAnnotSubtype(dict);
+      if (subtype && ALWAYS_PRESERVE_SUBTYPES.has(subtype)) {
+        kept.push(ref);
+        continue;
+      }
+      const nm = getAnnotNM(dict);
+      const matched = nm && idsToRemove.has(nm) || refMatchesId(ref, idsToRemove);
+      if (matched) continue;
+      const irt = getAnnotIRT(dict);
+      if (irt instanceof PDFRef && removedRefs.has(irt)) continue;
+      kept.push(ref);
+    }
+    page.node.set(annotsKey, context.obj(kept));
+  }
+}
 async function parseAnnotationToPdf(annotation, page, pdfDoc) {
   const ParserClass = parserMap[annotation.pdfjsType];
   if (!ParserClass) {
@@ -111,7 +197,10 @@ export async function exportAnnotationsToPdf({
   pdfData,
   annotations,
   options,
-  formFieldValues
+  formFieldValues,
+  originalAnnotationIds,
+  modifiedAnnotationIds,
+  deletedAnnotationIds
 }) {
   const flatten = options?.flatten ?? false;
   const preserveOriginalAnnotations = options?.preserveOriginalAnnotations ?? false;
@@ -119,8 +208,16 @@ export async function exportAnnotationsToPdf({
   if (formFieldValues && formFieldValues.length > 0) {
     await writeFormFieldsToPdf(pdfDoc, formFieldValues);
   }
+  let annotationsToWrite = annotations;
   if (!preserveOriginalAnnotations) {
-    clearAllAnnotations(pdfDoc);
+    if (originalAnnotationIds && modifiedAnnotationIds && deletedAnnotationIds) {
+      removeOwnedAnnotations(pdfDoc, modifiedAnnotationIds, deletedAnnotationIds);
+      annotationsToWrite = annotations.filter(
+        (a) => !originalAnnotationIds.has(a.id) || modifiedAnnotationIds.has(a.id)
+      );
+    } else {
+      clearAllAnnotations(pdfDoc);
+    }
   }
   if (flatten) {
     const pages = pdfDoc.getPages();
@@ -132,7 +229,7 @@ export async function exportAnnotationsToPdf({
     }
   } else {
     const pages = pdfDoc.getPages();
-    for (const annotation of annotations) {
+    for (const annotation of annotationsToWrite) {
       const page = pages[annotation.pageNumber - 1];
       if (!page) {
         console.warn(`Skipping annotation ${annotation.id}; page ${annotation.pageNumber} missing`);

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

@@ -1,35 +1,123 @@
-import { PDFName, PDFNumber, PDFString } from "pdf-lib";
+import { PDFName, PDFNumber, PDFRawStream, PDFString } from "pdf-lib";
 import { convertKonvaRectToPdfRect, rgbToPdfColor, stringToPDFHexString } from "../engine/utils.js";
 import { AnnotationParser } from "./parse.js";
 const UNKNOWN_USER = "Unknown user";
+function formatPdfNumber(value) {
+  if (!Number.isFinite(value)) return "0";
+  return Number(value.toFixed(3)).toString();
+}
+function escapePdfString(text) {
+  return text.replace(/\\/g, "\\\\").replace(/\(/g, "\\(").replace(/\)/g, "\\)");
+}
+function quaddingFromAlign(align) {
+  if (align === "center") return 1;
+  if (align === "right") return 2;
+  return 0;
+}
 export class FreeTextParser extends AnnotationParser {
   async parse() {
     const { annotation, page, pdfDoc } = this;
-    const [x1, , , y2] = convertKonvaRectToPdfRect(annotation.konvaClientRect, page.getHeight());
     const context = pdfDoc.context;
-    const pageWidth = page.getWidth();
     const pageHeight = page.getHeight();
-    const iconSize = 20;
-    const xLeft = Math.max(0, Math.min(x1, pageWidth - iconSize));
-    const yTop = Math.min(pageHeight, Math.max(y2, iconSize));
-    const yBottom = yTop - iconSize;
+    let konvaGroup;
+    try {
+      konvaGroup = JSON.parse(annotation.konvaString);
+    } catch {
+      console.warn(`Invalid konva JSON for FreeText annotation ${annotation.id}`);
+      return;
+    }
+    const textNodes = (konvaGroup.children ?? []).filter((c) => c.className === "Text");
+    const textNode = textNodes[0]?.attrs;
+    const groupX = konvaGroup.attrs?.x ?? 0;
+    const groupY = konvaGroup.attrs?.y ?? 0;
+    const scaleX = konvaGroup.attrs?.scaleX ?? 1;
+    const scaleY = konvaGroup.attrs?.scaleY ?? 1;
+    const text = textNode?.text ?? annotation.contentsObj?.text ?? "";
+    const fontSize = (textNode?.fontSize ?? annotation.fontSize ?? 16) * scaleY;
+    const color = textNode?.fill ?? annotation.color ?? "#000000";
+    const [r, g, b] = rgbToPdfColor(color);
+    const align = textNode?.align;
+    const quadding = quaddingFromAlign(align);
+    const nodeX = groupX + (textNode?.x ?? 0) * scaleX;
+    const nodeY = groupY + (textNode?.y ?? 0) * scaleY;
+    const lines = text.split("\n");
+    const lineHeight = fontSize * 1.2;
+    const textHeight = Math.max(lineHeight, lines.length * lineHeight);
+    const estimatedCharWidth = fontSize * 0.56;
+    const longestLine = lines.reduce((max, line) => Math.max(max, line.length), 0);
+    const textWidthFromNode = textNode?.width ? textNode.width * scaleX : longestLine * estimatedCharWidth;
+    const textWidth = Math.max(1, textWidthFromNode);
+    const pdfX1 = nodeX;
+    const pdfY1 = pageHeight - nodeY - textHeight;
+    const pdfX2 = pdfX1 + textWidth;
+    const pdfY2 = pageHeight - nodeY;
     const rect = [
-      PDFNumber.of(xLeft),
-      PDFNumber.of(yBottom),
-      PDFNumber.of(xLeft + iconSize),
-      PDFNumber.of(yTop)
+      PDFNumber.of(pdfX1),
+      PDFNumber.of(pdfY1),
+      PDFNumber.of(pdfX2),
+      PDFNumber.of(pdfY2)
     ];
+    const appearanceWidth = Math.max(1, pdfX2 - pdfX1);
+    const appearanceHeight = Math.max(1, pdfY2 - pdfY1);
+    const commands = ["q"];
+    for (let i = 0; i < lines.length; i++) {
+      const line = lines[i] ?? "";
+      if (line.length === 0 && i < lines.length - 1) continue;
+      const lineY = appearanceHeight - (i + 0.8) * lineHeight;
+      let lineX = 0;
+      if (quadding === 1) {
+        const lineWidth = line.length * estimatedCharWidth;
+        lineX = Math.max(0, (appearanceWidth - lineWidth) / 2);
+      } else if (quadding === 2) {
+        const lineWidth = line.length * estimatedCharWidth;
+        lineX = Math.max(0, appearanceWidth - lineWidth);
+      }
+      commands.push(
+        "BT",
+        `/Helvetica ${formatPdfNumber(fontSize)} Tf`,
+        `${formatPdfNumber(r)} ${formatPdfNumber(g)} ${formatPdfNumber(b)} rg`,
+        `${formatPdfNumber(lineX)} ${formatPdfNumber(lineY)} Td`,
+        `(${escapePdfString(line)}) Tj`,
+        "ET"
+      );
+    }
+    commands.push("Q");
+    const fontDict = context.obj({
+      Type: PDFName.of("Font"),
+      Subtype: PDFName.of("Type1"),
+      BaseFont: PDFName.of("Helvetica"),
+      Encoding: PDFName.of("WinAnsiEncoding")
+    });
+    const fontRef = context.register(fontDict);
+    const appearanceStream = PDFRawStream.of(
+      context.obj({
+        Type: PDFName.of("XObject"),
+        Subtype: PDFName.of("Form"),
+        BBox: context.obj([0, 0, appearanceWidth, appearanceHeight]),
+        Resources: context.obj({
+          Font: context.obj({ Helvetica: fontRef })
+        })
+      }),
+      new TextEncoder().encode(commands.join("\n"))
+    );
+    const appearanceRef = context.register(appearanceStream);
+    const ap = context.obj({ N: appearanceRef });
+    const da = `${formatPdfNumber(r)} ${formatPdfNumber(g)} ${formatPdfNumber(b)} rg /Helvetica ${formatPdfNumber(fontSize)} Tf`;
     const mainAnn = context.obj({
       Type: PDFName.of("Annot"),
-      Subtype: PDFName.of("Text"),
+      Subtype: PDFName.of("FreeText"),
       Rect: rect,
       NM: PDFString.of(annotation.id),
-      Contents: stringToPDFHexString(annotation.contentsObj?.text || ""),
-      Name: PDFName.of("Comment"),
+      Contents: stringToPDFHexString(text),
+      DA: PDFString.of(da),
+      Q: PDFNumber.of(quadding),
       T: stringToPDFHexString(annotation.title || UNKNOWN_USER),
       M: PDFString.of(annotation.date || ""),
-      C: rgbToPdfColor(annotation.color || void 0),
-      Open: false
+      C: context.obj(rgbToPdfColor(annotation.color || void 0)),
+      Border: context.obj([0, 0, 0]),
+      F: PDFNumber.of(4),
+      // Print flag
+      AP: ap
     });
     const mainAnnRef = context.register(mainAnn);
     this.addAnnotationToPage(page, mainAnnRef);
@@ -37,11 +125,11 @@ export class FreeTextParser extends AnnotationParser {
       const replyAnn = context.obj({
         Type: PDFName.of("Annot"),
         Subtype: PDFName.of("Text"),
-        Rect: rect,
+        Rect: convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight),
         Contents: stringToPDFHexString(comment.content),
         T: stringToPDFHexString(comment.title || UNKNOWN_USER),
         M: PDFString.of(comment.date || ""),
-        C: rgbToPdfColor(annotation.color || void 0),
+        C: context.obj(rgbToPdfColor(annotation.color || void 0)),
         IRT: mainAnnRef,
         RT: PDFName.of("R"),
         NM: PDFString.of(comment.id),

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

@@ -56,9 +56,26 @@ export class HighlightParser extends AnnotationParser {
       }];
     }
     const quadPoints = buildQuadPoints(highlightRects, pageHeight);
-    const rect = convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight);
     const color = rgbToPdfColor(annotation.color || void 0);
-    const [x1, y1, x2, y2] = rect;
+    let minX = Infinity;
+    let minY = Infinity;
+    let maxX = -Infinity;
+    let maxY = -Infinity;
+    for (const hr of highlightRects) {
+      const pdfLeft = hr.x;
+      const pdfBottom = pageHeight - hr.y - hr.height;
+      const pdfRight = hr.x + hr.width;
+      const pdfTop = pageHeight - hr.y;
+      if (pdfLeft < minX) minX = pdfLeft;
+      if (pdfBottom < minY) minY = pdfBottom;
+      if (pdfRight > maxX) maxX = pdfRight;
+      if (pdfTop > maxY) maxY = pdfTop;
+    }
+    const x1 = minX;
+    const y1 = minY;
+    const x2 = maxX;
+    const y2 = maxY;
+    const rect = [x1, y1, x2, y2];
     const appearanceWidth = Math.max(1, x2 - x1);
     const appearanceHeight = Math.max(1, y2 - y1);
     const [r, g, b] = color;
@@ -87,9 +104,8 @@ export class HighlightParser extends AnnotationParser {
           ExtGState: context.obj({
             GS1: context.obj({
               Type: PDFName.of("ExtGState"),
-              ca: PDFNumber.of(0.35),
-              CA: PDFNumber.of(0.35),
-              BM: PDFName.of("Multiply")
+              ca: PDFNumber.of(0.5),
+              CA: PDFNumber.of(0.5)
             })
           })
         })
@@ -108,7 +124,7 @@ export class HighlightParser extends AnnotationParser {
       Contents: stringToPDFHexString(annotation.contentsObj?.text || ""),
       M: PDFString.of(annotation.date || ""),
       NM: PDFString.of(annotation.id),
-      CA: PDFNumber.of(0.35),
+      CA: PDFNumber.of(0.5),
       AP: ap
     });
     const mainAnnRef = context.register(mainAnn);

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

@@ -51,12 +51,32 @@ export class InkParser extends AnnotationParser {
       W: PDFNumber.of(strokeWidth),
       S: PDFName.of("S")
     });
-    const rect = convertKonvaRectToPdfRect(annotation.konvaClientRect, pageHeight);
-    const [x1, y1, x2, y2] = rect;
+    const pad = Math.max(strokeWidth, 1);
+    let minX = Infinity;
+    let minY = Infinity;
+    let maxX = -Infinity;
+    let maxY = -Infinity;
+    for (const path of transformedPaths) {
+      for (let i = 0; i < path.length; i += 2) {
+        const px = path[i];
+        const py = path[i + 1];
+        if (px < minX) minX = px;
+        if (py < minY) minY = py;
+        if (px > maxX) maxX = px;
+        if (py > maxY) maxY = py;
+      }
+    }
+    const x1 = minX - pad;
+    const y1 = minY - pad;
+    const x2 = maxX + pad;
+    const y2 = maxY + pad;
+    const rect = [x1, y1, x2, y2];
     const appearanceWidth = Math.max(1, x2 - x1);
     const appearanceHeight = Math.max(1, y2 - y1);
+    const useExtGState = opacity !== 1;
     const commands = [
       "q",
+      ...useExtGState ? ["/GS1 gs"] : [],
       `${formatPdfNumber(r)} ${formatPdfNumber(g)} ${formatPdfNumber(b)} RG`,
       `${formatPdfNumber(Math.max(0.1, strokeWidth))} w`,
       "1 J",
@@ -75,12 +95,21 @@ export class InkParser extends AnnotationParser {
       commands.push("S");
     }
     commands.push("Q");
+    const resources = useExtGState ? context.obj({
+      ExtGState: context.obj({
+        GS1: context.obj({
+          Type: PDFName.of("ExtGState"),
+          CA: PDFNumber.of(opacity),
+          ca: PDFNumber.of(opacity)
+        })
+      })
+    }) : context.obj({});
     const appearanceStream = PDFRawStream.of(
       context.obj({
         Type: PDFName.of("XObject"),
         Subtype: PDFName.of("Form"),
         BBox: context.obj([0, 0, appearanceWidth, appearanceHeight]),
-        Resources: context.obj({})
+        Resources: resources
       }),
       new TextEncoder().encode(commands.join("\n"))
     );