@polotno/pdf-import 0.0.3 → 0.0.4

package/lib/font-registry.js

@@ -35,10 +35,18 @@ export class FontRegistry {
             return;
         const mappedFamily = mapPdfFont(fontObj.name);
         const isGoogleFont = isKnownWebFont(fontObj.name);
+        const hasEmbeddedData = fontObj.data && fontObj.data.length > 0;
         const shouldEmbed = embedAllFonts || !isGoogleFont;
         // When embedding a known Google Font, rename to avoid Polotno loading
         // the Google version instead of the embedded subset.
-        const fontFamily = embedAllFonts && isGoogleFont ? `${mappedFamily} (PDF)` : mappedFamily;
+        // Only rename if the font actually has embedded data — standard PDF fonts
+        // (Helvetica, Times, Courier, etc.) have no data, so they won't appear
+        // in the fonts[] array (all doc fonts must be declared there). Without an
+        // entry in fonts[], there's no collision risk, and keeping the original
+        // name lets Polotno load the font normally.
+        const fontFamily = embedAllFonts && isGoogleFont && hasEmbeddedData
+            ? `${mappedFamily} (PDF)`
+            : mappedFamily;
         // Track the rename so text elements can use the correct fontFamily
         if (fontFamily !== mappedFamily) {
             this.renameMap.set(fontObj.name, fontFamily);

package/lib/index.js

@@ -1 +1 @@
-import{getDocument as x,GlobalWorkerOptions as m}from"pdfjs-dist/legacy/build/pdf.mjs";import{parsePage as R}from"./page-parser.js";import{FontRegistry as I}from"./font-registry.js";import{buildJpegIndex as O}from"./pdf-image-extractor.js";import{workerSource as k}from"./generated/pdf-worker-source.js";let A=0;function C(){return`el_${Date.now()}_${++A}`}async function L({pdf:e,fontStrategy:s="embed"}){if(typeof window<"u"&&!m.workerSrc){const r=new Blob([k],{type:"application/javascript"});m.workerSrc=URL.createObjectURL(r)}const i=new Uint8Array(e instanceof ArrayBuffer?e:e.buffer.slice(e.byteOffset,e.byteOffset+e.byteLength)),d=O(i),o=await x({data:i,useSystemFonts:!0,disableFontFace:!0,fontExtraProperties:!0}).promise,c=new I;let g=612,p=792;const f=await o.getPage(1),u=f.getViewport({scale:1});g=u.width,p=u.height;const w=3,n=new Array(o.numPages);for(let r=0;r<o.numPages;r+=w){const h=Math.min(r+w,o.numPages),l=[];for(let t=r;t<h;t++)l.push((async()=>{const a=t===0?f:await o.getPage(t+1),{parsedPage:P}=await R({page:a,pageIdx:t,fontRegistry:c,generateId:C,jpegIndex:d,fontStrategy:s});return{parsedPage:P,pageIdx:t}})());const y=await Promise.all(l);for(const{parsedPage:t,pageIdx:a}of y)n[a]=t}await o.destroy();const b=c.finalize(s,n);return{width:g,height:p,fonts:b,pages:n,unit:"px",dpi:72}}export{L as pdfToJson};
+import{getDocument as I,GlobalWorkerOptions as b}from"pdfjs-dist/legacy/build/pdf.mjs";import{parsePage as O}from"./page-parser.js";import{FontRegistry as k}from"./font-registry.js";import{buildJpegIndex as A}from"./pdf-image-extractor.js";import{workerSource as C}from"./generated/pdf-worker-source.js";let E=0;function F(){return`el_${Date.now()}_${++E}`}async function _({pdf:e,fontStrategy:g="embed"}){if(typeof window<"u"&&!b.workerSrc){const r=new Blob([C],{type:"application/javascript"});b.workerSrc=URL.createObjectURL(r)}const p=new Uint8Array(e instanceof ArrayBuffer?e:e.buffer.slice(e.byteOffset,e.byteOffset+e.byteLength)),y=A(p),o=await I({data:p,useSystemFonts:!0,disableFontFace:!0,fontExtraProperties:!0}).promise,f=new k;let n=612,a=792;const u=await o.getPage(1),w=u.getViewport({scale:1});n=w.width,a=w.height;const d=3,i=new Array(o.numPages);for(let r=0;r<o.numPages;r+=d){const x=Math.min(r+d,o.numPages),h=[];for(let t=r;t<x;t++)h.push((async()=>{const s=t===0?u:await o.getPage(t+1),{parsedPage:c,pageWidth:l,pageHeight:m}=await O({page:s,pageIdx:t,fontRegistry:f,generateId:F,jpegIndex:y,fontStrategy:g});return(l!==n||m!==a)&&(c.width=l,c.height=m),{parsedPage:c,pageIdx:t}})());const R=await Promise.all(h);for(const{parsedPage:t,pageIdx:s}of R)i[s]=t}await o.destroy();const P=f.finalize(g,i);return{width:n,height:a,fonts:P,pages:i,unit:"px",dpi:72}}export{_ as pdfToJson};

package/lib/page-parser.js

@@ -27,8 +27,8 @@ export async function parsePage({ page, pageIdx, fontRegistry, generateId, jpegI
         buildImageElements(page, imageRefs, pageIdx, generateId, jpegIndex),
         collectPageFonts(page, fontRefs, fontRegistry, fontStrategy === 'embed'),
     ]);
-    const pageBackground = detectPageBackground(drawings, pageWidth, pageHeight);
-    const svgElements = buildSvgElements(drawings, pageWidth, pageHeight, generateId);
+    const { color: pageBackground, bgDrawingIndices } = detectPageBackground(drawings, pageWidth, pageHeight);
+    const svgElements = buildSvgElements(drawings, pageWidth, pageHeight, generateId, bgDrawingIndices);
     const textElements = await buildTextElements({
         page,
         pageWidth,
@@ -113,26 +113,86 @@ async function resolveDrawingGradients(page, drawings) {
     }
 }
 function detectPageBackground(drawings, pageWidth, pageHeight) {
+    const bgDrawingIndices = new Set();
     let pageBackground = '#FFFFFF';
-    for (const drawing of drawings) {
+    for (let i = 0; i < drawings.length; i++) {
+        const drawing = drawings[i];
         if (drawing.fill !== null) {
             const dw = drawing.rect[2] - drawing.rect[0];
             const dh = drawing.rect[3] - drawing.rect[1];
-            if (dw >= pageWidth * 0.9 && dh >= pageHeight * 0.9) {
+            if (dw >= pageWidth * 0.95 && dh >= pageHeight * 0.95) {
                 const [r, g, b] = drawing.fill;
                 pageBackground = rgbTupleToHex(r, g, b);
+                bgDrawingIndices.add(i);
             }
         }
     }
-    return pageBackground;
+    return { color: pageBackground, bgDrawingIndices };
+}
+/**
+ * Detect crop/bleed mark drawings (full-page, stroke-only, short edge lines)
+ * and split them into individual per-line SVGs so they don't block clicks.
+ */
+function trySplitCropMarks(drawing, pageWidth, pageHeight) {
+    if (drawing.fill !== null)
+        return null;
+    if (!drawing.stroke)
+        return null;
+    const dw = drawing.rect[2] - drawing.rect[0];
+    const dh = drawing.rect[3] - drawing.rect[1];
+    if (dw < pageWidth * 0.8 || dh < pageHeight * 0.8)
+        return null;
+    const lines = drawing.items.filter((it) => it.kind === 'l');
+    if (lines.length === 0)
+        return null;
+    // All line items must be short and near page edges
+    const edgeThreshold = Math.min(pageWidth, pageHeight) * 0.15;
+    for (const item of drawing.items) {
+        if (item.kind === 'm')
+            continue;
+        if (item.kind !== 'l')
+            return null;
+        const len = Math.hypot(item.x2 - item.x1, item.y2 - item.y1);
+        if (len > edgeThreshold)
+            return null;
+        const nearEdge = item.x1 < edgeThreshold || item.x1 > pageWidth - edgeThreshold ||
+            item.y1 < edgeThreshold || item.y1 > pageHeight - edgeThreshold;
+        if (!nearEdge)
+            return null;
+    }
+    // Build one small SVG per line segment
+    const strokeHex = rgbTupleToHex(...drawing.stroke);
+    const sw = drawing.strokeWidth || 1;
+    const results = [];
+    for (const line of lines) {
+        const x0 = Math.min(line.x1, line.x2);
+        const y0 = Math.min(line.y1, line.y2);
+        const x1 = Math.max(line.x1, line.x2);
+        const y1 = Math.max(line.y1, line.y2);
+        const half = sw / 2;
+        const bx = x0 - half;
+        const by = y0 - half;
+        const bw = Math.max(x1 - x0 + sw, sw + 1);
+        const bh = Math.max(y1 - y0 + sw, sw + 1);
+        const lx1 = line.x1 - bx;
+        const ly1 = line.y1 - by;
+        const lx2 = line.x2 - bx;
+        const ly2 = line.y2 - by;
+        const svg = `<svg viewBox="0 0 ${bw} ${bh}" xmlns="http://www.w3.org/2000/svg"><line x1="${lx1}" y1="${ly1}" x2="${lx2}" y2="${ly2}" stroke="${strokeHex}" stroke-width="${sw}"/></svg>`;
+        results.push({ svg, x: bx, y: by, width: bw, height: bh });
+    }
+    return results;
 }
-function buildSvgElements(drawings, pageWidth, pageHeight, generateId) {
+function buildSvgElements(drawings, pageWidth, pageHeight, generateId, bgDrawingIndices) {
     const svgElements = [];
     for (let idx = 0; idx < drawings.length; idx++) {
         const drawing = drawings[idx];
         // Skip fully transparent drawings (e.g. accessibility marker rectangles)
         if (drawing.opacity <= 0)
             continue;
+        // Skip drawings used as the page background
+        if (bgDrawingIndices?.has(idx))
+            continue;
         if (isMergeableClipRunDrawing(drawing)) {
             const run = [drawing];
             while (idx + 1 < drawings.length &&
@@ -161,6 +221,27 @@ function buildSvgElements(drawings, pageWidth, pageHeight, generateId) {
                 }
             }
         }
+        // Split full-page crop/bleed marks into per-segment SVGs so they don't
+        // block clicks on the entire page in the editor.
+        const splitResults = trySplitCropMarks(drawing, pageWidth, pageHeight);
+        if (splitResults) {
+            for (const seg of splitResults) {
+                svgElements.push({
+                    type: 'svg',
+                    id: generateId(),
+                    x: seg.x,
+                    y: seg.y,
+                    width: seg.width,
+                    height: seg.height,
+                    rotation: 0,
+                    opacity: drawing.opacity,
+                    src: svgToDataUri(seg.svg),
+                    name: '',
+                    _order: drawing.orderIndex,
+                });
+            }
+            continue;
+        }
         const result = drawingToSvg(drawing, pageWidth, pageHeight);
         if (result) {
             svgElements.push({

package/lib/svg-builder.js

@@ -30,8 +30,8 @@ function computeDrawingBounds(drawing, pageWidth, pageHeight) {
     if (drawing.fill !== null &&
         pageWidth > 0 &&
         pageHeight > 0 &&
-        width >= pageWidth * 0.9 &&
-        height >= pageHeight * 0.9) {
+        width >= pageWidth * 0.95 &&
+        height >= pageHeight * 0.95) {
         return null;
     }
     return { x0, y0, width, height };
@@ -86,6 +86,28 @@ function buildPathData(items, originX, originY, shouldCloseFill, closePath) {
     }
     return pathParts.join(' ');
 }
+/**
+ * Check if a clip path is a simple axis-aligned rectangle,
+ * regardless of whether it's represented as `re` or `m`/`l` segments.
+ */
+function isRectangularClipPath(items) {
+    if (items.length === 1 && items[0].kind === 're')
+        return true;
+    // Check if it's 4 line segments (plus optional move) forming a rectangle
+    const lines = items.filter(it => it.kind === 'l');
+    if (lines.length < 4)
+        return false;
+    // All lines must be axis-aligned (horizontal or vertical)
+    for (const line of lines) {
+        if (line.kind !== 'l')
+            continue;
+        const dx = Math.abs(line.x2 - line.x1);
+        const dy = Math.abs(line.y2 - line.y1);
+        if (dx > 0.5 && dy > 0.5)
+            return false; // diagonal line = not rect
+    }
+    return true;
+}
 export function drawingToSvg(drawing, pageWidth, pageHeight) {
     const bounds = computeDrawingBounds(drawing, pageWidth, pageHeight);
     if (!bounds)
@@ -150,7 +172,39 @@ export function drawingToSvg(drawing, pageWidth, pageHeight) {
             fillValue = 'url(#g)';
         }
     }
-    const svgStr = `<svg viewBox="0 0 ${w} ${h}" xmlns="http://www.w3.org/2000/svg">${defs}<path d="${dAttr}" fill="${fillValue}" ${strokeAttr}${fillRule}/></svg>`;
+    // Apply clip path if the drawing has a non-trivial one
+    let clipDef = '';
+    let clipAttr = '';
+    if (drawing.clipPath && drawing.clipRect) {
+        const [cx0, cy0, cx1, cy1] = drawing.clipRect;
+        const cw = cx1 - cx0;
+        const ch = cy1 - cy0;
+        // Only clip if it meaningfully reduces the visible area.
+        // A clip rect that covers 90%+ of the drawing in both dimensions is trivial.
+        const insetX = Math.max(0, cx0 - x0) + Math.max(0, (x0 + w) - cx1);
+        const insetY = Math.max(0, cy0 - y0) + Math.max(0, (y0 + h) - cy1);
+        const significantClip = cw > 0 && ch > 0 &&
+            (insetX > w * 0.1 || insetY > h * 0.1);
+        if (significantClip) {
+            // Check if clip is a simple axis-aligned rectangle (re or 4 line segments)
+            const isRectClip = isRectangularClipPath(drawing.clipPath);
+            if (!isRectClip) {
+                const clipD = buildPathData(drawing.clipPath, x0, y0, true, true);
+                clipDef = `<defs><clipPath id="c"><path d="${clipD}"/></clipPath></defs>`;
+                clipAttr = ' clip-path="url(#c)"';
+                // If both gradient defs and clip defs are needed, merge them
+                if (defs) {
+                    clipDef = defs.replace('</defs>', '') + `<clipPath id="c"><path d="${clipD}"/></clipPath></defs>`;
+                    defs = '';
+                }
+            }
+        }
+    }
+    const allDefs = clipDef || defs;
+    const pathEl = `<path d="${dAttr}" fill="${fillValue}" ${strokeAttr}${fillRule}/>`;
+    const svgStr = clipAttr
+        ? `<svg viewBox="0 0 ${w} ${h}" xmlns="http://www.w3.org/2000/svg">${allDefs}<g${clipAttr}>${pathEl}</g></svg>`
+        : `<svg viewBox="0 0 ${w} ${h}" xmlns="http://www.w3.org/2000/svg">${allDefs}${pathEl}</svg>`;
     return { svg: svgStr, x: x0, y: y0, width: w, height: h };
 }
 export function clippedDrawingsToSvg(drawings) {

package/lib/text-layout.js

@@ -197,8 +197,11 @@ function assignBlockNumbers(spans, startBlockNo = 0) {
             // When font size clearly differs, spans are separate visual elements even if
             // close together (e.g. bold heading label next to body text list). Use a
             // smaller gap threshold for such cases.
+            const fontNameDiffers = prev.fontName !== curr.fontName;
             const fontSizeDiffers = fontRatio > 1.1;
-            const effectiveSplitGap = fontSizeDiffers ? Math.max(avgFontSize * 0.5, 8) : splitGap;
+            const effectiveSplitGap = (fontSizeDiffers || fontNameDiffers)
+                ? Math.max(avgFontSize * 0.5, 8)
+                : splitGap;
             if (gap > effectiveSplitGap) {
                 const forceSplit = prev.color !== curr.color ||
                     prev.fontName !== curr.fontName ||
@@ -303,7 +306,7 @@ function assignBlockNumbers(spans, startBlockNo = 0) {
         if (!fontSizeChanged &&
             !colorChanged &&
             !largeSingleSpanDisplayShift &&
-            yGap < avgFontSize * 0.5 &&
+            yGap <= avgFontSize * 0.5 &&
             (xOverlap > 0 || Math.abs(prev.x0 - curr.x0) < avgFontSize * 2)) {
             currentBlock.push(curr);
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@polotno/pdf-import",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "Convert PDF files into Polotno JSON format",
   "type": "module",
   "main": "./lib/index.js",
@@ -28,19 +28,19 @@
     "pdfjs-dist": "^4.10.38"
   },
   "devDependencies": {
-    "@types/node": "^25.3.3",
+    "@types/node": "^25.5.0",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^5.1.4",
-    "esbuild": "^0.27.3",
-    "polotno": "^2.37.1",
-    "polotno-node": "^2.15.13",
+    "@vitejs/plugin-react": "^6.0.1",
+    "esbuild": "^0.27.4",
+    "polotno": "^2.38.2",
+    "polotno-node": "^2.15.15",
     "react": "^18.3.1",
     "react-dom": "^18",
     "sharp": "^0.34.5",
     "ssim.js": "^3.5.0",
     "typescript": "~5.9.3",
-    "vite": "^7.3.1",
-    "vitest": "^4.0.18"
+    "vite": "^8.0.0",
+    "vitest": "^4.1.0"
   }
 }