@pdfme/generator 2.0.2 → 2.2.0

package/dist/types/src/helper.d.ts

@@ -56,7 +56,6 @@ export declare const drawInputByTemplateSchema: (arg: {
     templateSchema: Schema;
     pdfDoc: PDFDocument;
     page: PDFPage;
-    pageHeight: number;
     fontSetting: FontSetting;
     inputImageCache: InputImageCache;
 }) => Promise<void>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pdfme/generator",
-  "version": "2.0.2",
+  "version": "2.2.0",
   "sideEffects": false,
   "author": "hand-dot",
   "license": "MIT",
@@ -60,7 +60,7 @@
     "pngjs": "^6.0.0"
   },
   "peerDependencies": {
-    "@pdfme/common": "^2.0.0"
+    "@pdfme/common": "^2.1.0"
   },
   "jest": {
     "resolver": "ts-jest-resolver",

package/src/generate.ts

@@ -75,7 +75,6 @@ const generate = async (props: GenerateProps) => {
           templateSchema,
           pdfDoc,
           page,
-          pageHeight,
           fontSetting,
           inputImageCache,
         });

package/src/helper.ts

@@ -25,14 +25,23 @@ import {
   BasePdf,
   BarCodeType,
   Alignment,
-  DEFAULT_FONT_SIZE,
   DEFAULT_ALIGNMENT,
-  DEFAULT_LINE_HEIGHT,
   DEFAULT_CHARACTER_SPACING,
   DEFAULT_FONT_COLOR,
+  DEFAULT_FONT_SIZE,
+  DEFAULT_LINE_HEIGHT,
+  DEFAULT_VERTICAL_ALIGNMENT,
+  VERTICAL_ALIGN_TOP,
+  VERTICAL_ALIGN_MIDDLE,
+  VERTICAL_ALIGN_BOTTOM,
   calculateDynamicFontSize,
   heightOfFontAtSize,
-  getFontKitFont
+  getFontDescentInPt,
+  getFontKitFont,
+  getSplittedLines,
+  mm2pt,
+  widthOfTextAtSize,
+  FontWidthCalcValues,
 } from '@pdfme/common';
 import { Buffer } from 'buffer';
 
@@ -130,14 +139,7 @@ export const getEmbeddedPagesAndEmbedPdfBoxes = async (arg: {
   return { embeddedPages, embedPdfBoxes };
 };
 
-const mm2pt = (mm: number): number => {
-  // https://www.ddc.co.jp/words/archives/20090701114500.html
-  const ptRatio = 2.8346;
-
-  return parseFloat(String(mm)) * ptRatio;
-};
-
-const getSchemaSizeAndRotate = (schema: Schema) => {
+const convertSchemaDimensionsToPt = (schema: Schema) => {
   const width = mm2pt(schema.width);
   const height = mm2pt(schema.height);
   const rotate = degrees(schema.rotate ? schema.rotate : 0);
@@ -171,13 +173,14 @@ const hex2RgbColor = (hexString: string | undefined) => {
 };
 
 const getFontProp = async ({ input, font, schema }: { input: string, font: Font, schema: TextSchema }) => {
-  const size = schema.dynamicFontSize ? await calculateDynamicFontSize({ textSchema: schema, font, input }) : schema.fontSize ?? DEFAULT_FONT_SIZE;
+  const fontSize = schema.dynamicFontSize ? await calculateDynamicFontSize({ textSchema: schema, font, input }) : schema.fontSize ?? DEFAULT_FONT_SIZE;
   const color = hex2RgbColor(schema.fontColor ?? DEFAULT_FONT_COLOR);
   const alignment = schema.alignment ?? DEFAULT_ALIGNMENT;
+  const verticalAlignment = schema.verticalAlignment ?? DEFAULT_VERTICAL_ALIGNMENT;
   const lineHeight = schema.lineHeight ?? DEFAULT_LINE_HEIGHT;
   const characterSpacing = schema.characterSpacing ?? DEFAULT_CHARACTER_SPACING;
 
-  return { size, color, alignment, lineHeight, characterSpacing };
+  return { fontSize, color, alignment, verticalAlignment, lineHeight, characterSpacing };
 };
 
 const calcX = (x: number, alignment: Alignment, boxWidth: number, textWidth: number) => {
@@ -191,7 +194,7 @@ const calcX = (x: number, alignment: Alignment, boxWidth: number, textWidth: num
   return mm2pt(x) + addition;
 };
 
-const calcY = (y: number, height: number, itemHeight: number) => height - mm2pt(y) - itemHeight;
+const calcY = (y: number, pageHeight: number, itemHeight: number) => pageHeight - mm2pt(y) - itemHeight;
 
 const drawBackgroundColor = (arg: {
   templateSchema: TextSchema;
@@ -200,7 +203,7 @@ const drawBackgroundColor = (arg: {
 }) => {
   const { templateSchema, page, pageHeight } = arg;
   if (!templateSchema.backgroundColor) return;
-  const { width, height } = getSchemaSizeAndRotate(templateSchema);
+  const { width, height } = convertSchemaDimensionsToPt(templateSchema);
   const color = hex2RgbColor(templateSchema.backgroundColor);
   page.drawRectangle({
     x: calcX(templateSchema.position.x, 'left', width, width),
@@ -211,57 +214,6 @@ const drawBackgroundColor = (arg: {
   });
 };
 
-type IsOverEval = (testString: string) => boolean;
-
-/**
- * Incrementally checks the current line for its real length
- * and returns the position where it exceeds the box width.
- * Returns `null` to indicate if inputLine is shorter as the available bbox.
- */
-const getOverPosition = (inputLine: string, isOverEval: IsOverEval) => {
-  for (let i = 0; i <= inputLine.length; i++) {
-    if (isOverEval(inputLine.slice(0, i))) {
-      return i;
-    }
-  }
-
-  return null;
-};
-
-/**
- * Gets the position of the split. Splits the exceeding line at
- * the last whitespace over it exceeds the bounding box width.
- */
-const getSplitPosition = (inputLine: string, isOverEval: IsOverEval) => {
-  const overPos = getOverPosition(inputLine, isOverEval);
-  if (overPos === null) return inputLine.length;  // input line is shorter than the available space
-
-  let overPosTmp = overPos;
-  while (inputLine[overPosTmp] !== ' ' && overPosTmp >= 0) {
-    overPosTmp--;
-  }
-
-  // For very long lines with no whitespace use the original overPos
-  return overPosTmp > 0 ? overPosTmp : overPos - 1;
-};
-
-/**
- * Recursively splits the line at getSplitPosition.
- * If there is some leftover, split the rest again in the same manner.
- */
-const getSplittedLines = (inputLine: string, isOverEval: IsOverEval): string[] => {
-  const splitPos = getSplitPosition(inputLine, isOverEval);
-  const splittedLine = inputLine.substring(0, splitPos);
-  const rest = inputLine.substring(splitPos).trimStart();
-
-  if (rest.length === 0) {
-    // end recursion if there is no rest
-    return [splittedLine];
-  }
-
-  return [splittedLine, ...getSplittedLines(rest, isOverEval)];
-};
-
 interface FontSetting {
   font: Font;
   pdfFontObj: {
@@ -275,60 +227,72 @@ const drawInputByTextSchema = async (arg: {
   templateSchema: TextSchema;
   pdfDoc: PDFDocument;
   page: PDFPage;
-  pageHeight: number;
   fontSetting: FontSetting;
 }) => {
-  const { input, templateSchema, page, pageHeight, fontSetting } = arg;
+  const { input, templateSchema, page, fontSetting } = arg;
   const { font, pdfFontObj, fallbackFontName } = fontSetting;
 
   const pdfFontValue = pdfFontObj[templateSchema.fontName ? templateSchema.fontName : fallbackFontName];
-  const fontKitFont = await getFontKitFont(templateSchema, font)
+  const fontKitFont = await getFontKitFont(templateSchema, font);
 
+  const pageHeight = page.getHeight();
   drawBackgroundColor({ templateSchema, page, pageHeight });
 
-  const { width, height, rotate } = getSchemaSizeAndRotate(templateSchema);
-  const { size, color, alignment, lineHeight, characterSpacing } = await getFontProp({
-    input,
-    font,
-    schema: templateSchema,
-  });
+  const { width, height, rotate } = convertSchemaDimensionsToPt(templateSchema);
+  const { fontSize, color, alignment, verticalAlignment, lineHeight, characterSpacing } =
+    await getFontProp({
+      input,
+      font,
+      schema: templateSchema,
+    });
 
   page.pushOperators(setCharacterSpacing(characterSpacing));
 
-  let beforeLineOver = 0;
+  const firstLineTextHeight = heightOfFontAtSize(fontKitFont, fontSize);
+  const descent = getFontDescentInPt(fontKitFont, fontSize);
+  const halfLineHeightAdjustment = lineHeight === 0 ? 0 : ((lineHeight - 1) * fontSize) / 2;
 
-  const isOverEval = (testString: string) => {
-    const testStringWidth =
-      pdfFontValue.widthOfTextAtSize(testString, size) + (testString.length - 1) * characterSpacing;
-    return width <= testStringWidth;
+  const fontWidthCalcValues: FontWidthCalcValues = {
+    font: fontKitFont,
+    fontSize,
+    characterSpacing,
+    boxWidthInPt: width,
   };
-  input.split(/\r|\n|\r\n/g).forEach((inputLine, inputLineIndex) => {
-    const splitLines = getSplittedLines(inputLine, isOverEval);
-
-    const drawLine = (line: string, lineIndex: number) => {
-      const textWidth = pdfFontValue.widthOfTextAtSize(line, size) + (line.length - 1) * characterSpacing;
-      const textHeight = heightOfFontAtSize(fontKitFont, size);
-
-      page.drawText(line, {
-        x: calcX(templateSchema.position.x, alignment, width, textWidth),
-        y:
-          calcY(templateSchema.position.y, pageHeight, height) +
-          height -
-          textHeight -
-          lineHeight * size * (inputLineIndex + lineIndex + beforeLineOver) -
-          (lineHeight === 0 ? 0 : ((lineHeight - 1) * size) / 2),
-        rotate,
-        size,
-        color,
-        lineHeight: lineHeight * size,
-        maxWidth: width,
-        font: pdfFontValue,
-        wordBreaks: [''],
-      });
-      if (splitLines.length === lineIndex + 1) beforeLineOver += lineIndex;
-    };
 
-    splitLines.forEach(drawLine);
+  let lines: string[] = [];
+  input.split(/\r|\n|\r\n/g).forEach((inputLine) => {
+    lines = lines.concat(getSplittedLines(inputLine, fontWidthCalcValues));
+  });
+
+  // Text lines are rendered from the bottom upwards, we need to adjust the position down
+  let yOffset = 0;
+  if (verticalAlignment === VERTICAL_ALIGN_TOP) {
+    yOffset = firstLineTextHeight + halfLineHeightAdjustment;
+  } else {
+    const otherLinesHeight = lineHeight * fontSize * (lines.length - 1);
+
+    if (verticalAlignment === VERTICAL_ALIGN_BOTTOM) {
+      yOffset = height - otherLinesHeight + descent - halfLineHeightAdjustment;
+    } else if (verticalAlignment === VERTICAL_ALIGN_MIDDLE) {
+      yOffset = (height - otherLinesHeight - firstLineTextHeight + descent) / 2 + firstLineTextHeight;
+    }
+  }
+
+  lines.forEach((line, rowIndex) => {
+    const textWidth = widthOfTextAtSize(line, fontKitFont, fontSize, characterSpacing);
+    const rowYOffset = lineHeight * fontSize * rowIndex;
+
+    page.drawText(line, {
+      x: calcX(templateSchema.position.x, alignment, width, textWidth),
+      y: calcY(templateSchema.position.y, pageHeight, yOffset) - rowYOffset,
+      rotate,
+      size: fontSize,
+      color,
+      lineHeight: lineHeight * fontSize,
+      maxWidth: width,
+      font: pdfFontValue,
+      wordBreaks: [''],
+    });
   });
 };
 
@@ -337,17 +301,16 @@ const getCacheKey = (templateSchema: Schema, input: string) => `${templateSchema
 const drawInputByImageSchema = async (arg: {
   input: string;
   templateSchema: ImageSchema;
-  pageHeight: number;
   pdfDoc: PDFDocument;
   page: PDFPage;
   inputImageCache: InputImageCache;
 }) => {
-  const { input, templateSchema, pageHeight, pdfDoc, page, inputImageCache } = arg;
+  const { input, templateSchema, pdfDoc, page, inputImageCache } = arg;
 
-  const { width, height, rotate } = getSchemaSizeAndRotate(templateSchema);
+  const { width, height, rotate } = convertSchemaDimensionsToPt(templateSchema);
   const opt = {
     x: calcX(templateSchema.position.x, 'left', width, width),
-    y: calcY(templateSchema.position.y, pageHeight, height),
+    y: calcY(templateSchema.position.y, page.getHeight(), height),
     rotate,
     width,
     height,
@@ -365,18 +328,17 @@ const drawInputByImageSchema = async (arg: {
 const drawInputByBarcodeSchema = async (arg: {
   input: string;
   templateSchema: BarcodeSchema;
-  pageHeight: number;
   pdfDoc: PDFDocument;
   page: PDFPage;
   inputImageCache: InputImageCache;
 }) => {
-  const { input, templateSchema, pageHeight, pdfDoc, page, inputImageCache } = arg;
+  const { input, templateSchema, pdfDoc, page, inputImageCache } = arg;
   if (!validateBarcodeInput(templateSchema.type as BarCodeType, input)) return;
 
-  const { width, height, rotate } = getSchemaSizeAndRotate(templateSchema);
+  const { width, height, rotate } = convertSchemaDimensionsToPt(templateSchema);
   const opt = {
     x: calcX(templateSchema.position.x, 'left', width, width),
-    y: calcY(templateSchema.position.y, pageHeight, height),
+    y: calcY(templateSchema.position.y, page.getHeight(), height),
     rotate,
     width,
     height,
@@ -398,7 +360,6 @@ export const drawInputByTemplateSchema = async (arg: {
   templateSchema: Schema;
   pdfDoc: PDFDocument;
   page: PDFPage;
-  pageHeight: number;
   fontSetting: FontSetting;
   inputImageCache: InputImageCache;
 }) => {