@pdfme/schemas 6.0.3-dev.0 → 6.0.4-dev.1

package/src/tables/classes.ts

@@ -1,402 +0,0 @@
-import { Font, mm2pt, pt2mm } from '@pdfme/common';
-import type { Font as FontKitFont } from 'fontkit';
-import { splitTextToSize, getFontKitFont, widthOfTextAtSize } from '../text/helper.js';
-import type { Styles, TableInput, Settings, Section, StylesProps } from './types.js';
-
-type ContentSettings = { body: Row[]; head: Row[]; columns: Column[] };
-
-export class Cell {
-  raw: string;
-  text: string[];
-  styles: Styles;
-  section: Section;
-  contentHeight = 0;
-  contentWidth = 0;
-  wrappedWidth = 0;
-  minReadableWidth = 0;
-  minWidth = 0;
-
-  width = 0;
-  height = 0;
-  x = 0;
-  y = 0;
-
-  constructor(raw: string, styles: Styles, section: Section) {
-    this.styles = styles;
-    this.section = section;
-    this.raw = raw;
-    const splitRegex = /\r\n|\r|\n/g;
-    this.text = raw.split(splitRegex);
-  }
-
-  getContentHeight() {
-    const lineCount = Array.isArray(this.text) ? this.text.length : 1;
-    const lineHeight = pt2mm(this.styles.fontSize) * this.styles.lineHeight;
-    const vPadding = this.padding('top') + this.padding('bottom');
-    const height = lineCount * lineHeight + vPadding;
-    return Math.max(height, this.styles.minCellHeight);
-  }
-
-  padding(name: 'top' | 'bottom' | 'left' | 'right') {
-    return this.styles.cellPadding[name];
-  }
-}
-
-export class Column {
-  index: number;
-  wrappedWidth = 0;
-  minReadableWidth = 0;
-  minWidth = 0;
-  width = 0;
-
-  constructor(index: number) {
-    this.index = index;
-  }
-
-  getMaxCustomCellWidth(table: Table) {
-    let max = 0;
-    for (const row of table.allRows()) {
-      const cell: Cell = row.cells[this.index];
-      max = Math.max(max, cell.styles.cellWidth);
-    }
-    return max;
-  }
-}
-
-export class Row {
-  readonly raw: string[];
-  readonly index: number;
-  readonly section: Section;
-  readonly cells: { [key: string]: Cell };
-
-  height = 0;
-
-  constructor(raw: string[], index: number, section: Section, cells: { [key: string]: Cell }) {
-    this.raw = raw;
-    this.index = index;
-    this.section = section;
-    this.cells = cells;
-  }
-
-  getMaxCellHeight(columns: Column[]) {
-    return columns.reduce((acc, column) => Math.max(acc, this.cells[column.index]?.height || 0), 0);
-  }
-
-  getMinimumRowHeight(columns: Column[]) {
-    return columns.reduce((acc: number, column: Column) => {
-      const cell = this.cells[column.index];
-      if (!cell) return 0;
-      const vPadding = cell.padding('top') + cell.padding('bottom');
-      const oneRowHeight = vPadding + cell.styles.lineHeight;
-      return oneRowHeight > acc ? oneRowHeight : acc;
-    }, 0);
-  }
-}
-
-export class Table {
-  readonly settings: Settings;
-  readonly styles: StylesProps;
-
-  readonly columns: Column[];
-  readonly head: Row[];
-  readonly body: Row[];
-
-  constructor(input: TableInput, content: ContentSettings) {
-    this.settings = input.settings;
-    this.styles = input.styles;
-
-    this.columns = content.columns;
-    this.head = content.head;
-    this.body = content.body;
-  }
-
-  static async create(arg: {
-    input: TableInput;
-    content: ContentSettings;
-    font: Font;
-    _cache: Map<string | number, FontKitFont>;
-  }) {
-    const { input, content, font, _cache } = arg;
-    const table = new Table(input, content);
-
-    await calculateWidths({ table, font, _cache });
-
-    return table;
-  }
-
-  getHeadHeight() {
-    return this.head.reduce((acc, row) => acc + row.getMaxCellHeight(this.columns), 0);
-  }
-
-  getBodyHeight() {
-    return this.body.reduce((acc, row) => acc + row.getMaxCellHeight(this.columns), 0);
-  }
-
-  allRows() {
-    return this.head.concat(this.body);
-  }
-
-  getWidth() {
-    return this.settings.tableWidth;
-  }
-
-  getHeight() {
-    return (this.settings.showHead ? this.getHeadHeight() : 0) + this.getBodyHeight();
-  }
-}
-
-async function calculateWidths(arg: {
-  table: Table;
-  font: Font;
-  _cache: Map<string | number, FontKitFont>;
-}) {
-  const { table, font, _cache } = arg;
-
-  const getFontKitFontByFontName = (fontName: string | undefined) =>
-    getFontKitFont(fontName, font, _cache);
-
-  await calculate(table, getFontKitFontByFontName);
-
-  const resizableColumns: Column[] = [];
-  let initialTableWidth = 0;
-
-  table.columns.forEach((column) => {
-    const customWidth = column.getMaxCustomCellWidth(table);
-    if (customWidth) {
-      // final column width
-      column.width = customWidth;
-    } else {
-      // initial column width (will be resized)
-      column.width = column.wrappedWidth;
-      resizableColumns.push(column);
-    }
-    initialTableWidth += column.width;
-  });
-
-  // width difference that needs to be distributed
-  let resizeWidth = table.getWidth() - initialTableWidth;
-
-  // first resize attempt: with respect to minReadableWidth and minWidth
-  if (resizeWidth) {
-    resizeWidth = resizeColumns(resizableColumns, resizeWidth, (column) =>
-      Math.max(column.minReadableWidth, column.minWidth),
-    );
-  }
-
-  // second resize attempt: ignore minReadableWidth but respect minWidth
-  if (resizeWidth) {
-    resizeWidth = resizeColumns(resizableColumns, resizeWidth, (column) => column.minWidth);
-  }
-
-  resizeWidth = Math.abs(resizeWidth);
-
-  applyColSpans(table);
-  await fitContent(table, getFontKitFontByFontName);
-  applyRowSpans(table);
-}
-
-function applyRowSpans(table: Table) {
-  const rowSpanCells: {
-    [key: string]: { cell: Cell; left: number; row: Row };
-  } = {};
-  let colRowSpansLeft = 1;
-  const all = table.allRows();
-  for (let rowIndex = 0; rowIndex < all.length; rowIndex++) {
-    const row = all[rowIndex];
-    for (const column of table.columns) {
-      const data = rowSpanCells[column.index];
-      if (colRowSpansLeft > 1) {
-        colRowSpansLeft--;
-        delete row.cells[column.index];
-      } else if (data) {
-        data.cell.height += row.height;
-        colRowSpansLeft = 1;
-        delete row.cells[column.index];
-        data.left--;
-        if (data.left <= 1) {
-          delete rowSpanCells[column.index];
-        }
-      } else {
-        const cell = row.cells[column.index];
-        if (!cell) {
-          continue;
-        }
-        cell.height = row.height;
-      }
-    }
-  }
-}
-
-function applyColSpans(table: Table) {
-  const all = table.allRows();
-  for (let rowIndex = 0; rowIndex < all.length; rowIndex++) {
-    const row = all[rowIndex];
-
-    let colSpanCell = null;
-    let combinedColSpanWidth = 0;
-    let colSpansLeft = 0;
-    for (let columnIndex = 0; columnIndex < table.columns.length; columnIndex++) {
-      const column = table.columns[columnIndex];
-
-      // Width and colspan
-      colSpansLeft -= 1;
-      if (colSpansLeft > 1 && table.columns[columnIndex + 1]) {
-        combinedColSpanWidth += column.width;
-        delete row.cells[column.index];
-      } else if (colSpanCell) {
-        const cell: Cell = colSpanCell;
-        delete row.cells[column.index];
-        colSpanCell = null;
-        cell.width = column.width + combinedColSpanWidth;
-      } else {
-        const cell = row.cells[column.index];
-        if (!cell) continue;
-        colSpansLeft = 1;
-        combinedColSpanWidth = 0;
-        cell.width = column.width + combinedColSpanWidth;
-      }
-    }
-  }
-}
-
-async function fitContent(
-  table: Table,
-  getFontKitFontByFontName: (fontName: string | undefined) => Promise<FontKitFont>,
-) {
-  const rowSpanHeight = { count: 0, height: 0 };
-  for (const row of table.allRows()) {
-    for (const column of table.columns) {
-      const cell: Cell = row.cells[column.index];
-      if (!cell) continue;
-
-      const fontKitFont = await getFontKitFontByFontName(cell.styles.fontName);
-      cell.text = splitTextToSize({
-        value: cell.raw,
-        characterSpacing: cell.styles.characterSpacing,
-        boxWidthInPt: mm2pt(cell.width),
-        fontSize: cell.styles.fontSize,
-        fontKitFont,
-      });
-
-      cell.contentHeight = cell.getContentHeight();
-
-      let realContentHeight = cell.contentHeight;
-      if (rowSpanHeight && rowSpanHeight.count > 0) {
-        if (rowSpanHeight.height > realContentHeight) {
-          realContentHeight = rowSpanHeight.height;
-        }
-      }
-      if (realContentHeight > row.height) {
-        row.height = realContentHeight;
-      }
-    }
-    rowSpanHeight.count--;
-  }
-}
-
-function resizeColumns(
-  columns: Column[],
-  resizeWidth: number,
-  getMinWidth: (column: Column) => number,
-) {
-  const initialResizeWidth = resizeWidth;
-  const sumWrappedWidth = columns.reduce((acc, column) => acc + column.wrappedWidth, 0);
-
-  for (let i = 0; i < columns.length; i++) {
-    const column = columns[i];
-
-    const ratio = column.wrappedWidth / sumWrappedWidth;
-    const suggestedChange = initialResizeWidth * ratio;
-    const suggestedWidth = column.width + suggestedChange;
-
-    const minWidth = getMinWidth(column);
-    const newWidth = suggestedWidth < minWidth ? minWidth : suggestedWidth;
-
-    resizeWidth -= newWidth - column.width;
-    column.width = newWidth;
-  }
-
-  resizeWidth = Math.round(resizeWidth * 1e10) / 1e10;
-
-  // Run the resizer again if there's remaining width needs
-  // to be distributed and there're columns that can be resized
-  if (resizeWidth) {
-    const resizableColumns = columns.filter((column) => {
-      return resizeWidth < 0
-        ? column.width > getMinWidth(column) // check if column can shrink
-        : true; // check if column can grow
-    });
-
-    if (resizableColumns.length) {
-      resizeWidth = resizeColumns(resizableColumns, resizeWidth, getMinWidth);
-    }
-  }
-
-  return resizeWidth;
-}
-
-async function calculate(
-  table: Table,
-  getFontKitFontByFontName: (fontName: string | undefined) => Promise<FontKitFont>,
-) {
-  for (const row of table.allRows()) {
-    for (const column of table.columns) {
-      const cell = row.cells[column.index];
-      if (!cell) continue;
-
-      const hPadding = cell.padding('right') + cell.padding('left');
-      const fontKitFont = await getFontKitFontByFontName(cell.styles.fontName);
-
-      cell.contentWidth = getStringWidth(cell, fontKitFont) + hPadding;
-
-      const longestWordWidth = getStringWidth(
-        Object.assign(cell, { text: cell.text.join(' ').split(/\s+/) }),
-        fontKitFont,
-      );
-      cell.minReadableWidth = longestWordWidth + hPadding;
-
-      cell.minWidth = cell.styles.cellWidth;
-      cell.wrappedWidth = cell.styles.cellWidth;
-    }
-  }
-
-  for (const row of table.allRows()) {
-    for (const column of table.columns) {
-      const cell = row.cells[column.index];
-
-      // For now we ignore the minWidth and wrappedWidth of colspan cells when calculating colspan widths.
-      // Could probably be improved upon however.
-      if (cell) {
-        column.wrappedWidth = Math.max(column.wrappedWidth, cell.wrappedWidth);
-        column.minWidth = Math.max(column.minWidth, cell.minWidth);
-        column.minReadableWidth = Math.max(column.minReadableWidth, cell.minReadableWidth);
-      } else {
-        // Respect cellWidth set in columnStyles even if there is no cells for this column
-        // or if the column only have colspan cells. Since the width of colspan cells
-        // does not affect the width of columns, setting columnStyles cellWidth enables the
-        // user to at least do it manually.
-
-        // Note that this is not perfect for now since for example row and table styles are
-        // not accounted for
-        const columnStyles = table.styles.columnStyles[column.index] || {};
-        const cellWidth = columnStyles.cellWidth || columnStyles.minCellWidth;
-        if (cellWidth) {
-          column.minWidth = cellWidth;
-          column.wrappedWidth = cellWidth;
-        }
-      }
-    }
-  }
-}
-
-function getStringWidth(cell: Cell, fontKitFont: FontKitFont) {
-  const text = cell.text;
-  const textArr: string[] = Array.isArray(text) ? text : [text];
-  const fontSize = cell.styles.fontSize;
-  const characterSpacing = cell.styles.characterSpacing;
-  const widestLineWidth = textArr
-    .map((text) => widthOfTextAtSize(text, fontKitFont, fontSize, characterSpacing))
-    .reduce((a, b) => Math.max(a, b), 0);
-
-  return widestLineWidth;
-}

package/src/tables/dynamicTemplate.ts

@@ -1,88 +0,0 @@
-import { Schema, BasePdf, BlankPdf, CommonOptions, isBlankPdf } from '@pdfme/common';
-import { createSingleTable } from './tableHelper.js';
-import { getBodyWithRange, getBody } from './helper.js';
-import { TableSchema } from './types.js';
-
-export const getDynamicHeightsForTable = async (
-  value: string,
-  args: {
-    schema: Schema;
-    basePdf: BasePdf;
-    options: CommonOptions;
-    _cache: Map<string | number, unknown>;
-  },
-): Promise<number[]> => {
-  if (args.schema.type !== 'table') return Promise.resolve([args.schema.height]);
-  const schema = args.schema as TableSchema;
-  const body =
-    schema.__bodyRange?.start === 0 ? getBody(value) : getBodyWithRange(value, schema.__bodyRange);
-  const table = await createSingleTable(body, args);
-
-  const baseHeights = schema.showHead
-    ? table.allRows().map((row) => row.height)
-    : [0].concat(table.body.map((row) => row.height));
-
-  const headerHeight = schema.showHead ? table.getHeadHeight() : 0;
-  const shouldRepeatHeader = schema.repeatHead && isBlankPdf(args.basePdf) && headerHeight > 0;
-
-  if (!shouldRepeatHeader) {
-    return baseHeights;
-  }
-
-  const basePdf = args.basePdf as BlankPdf;
-  const [paddingTop, , paddingBottom] = basePdf.padding;
-  const pageContentHeight = basePdf.height - paddingTop - paddingBottom;
-  const getPageStartY = (pageIndex: number) => pageIndex * pageContentHeight + paddingTop;
-
-  const initialPageIndex = Math.max(
-    0,
-    Math.floor((schema.position.y - paddingTop) / pageContentHeight),
-  );
-  const headRowCount = schema.showHead ? table.head.length : 0;
-  const SAFETY_MARGIN = 0.5;
-
-  let currentPageIndex = initialPageIndex;
-  let currentPageY = schema.position.y;
-  let rowsOnCurrentPage = 0;
-
-  const result: number[] = [];
-
-  for (let i = 0; i < baseHeights.length; i++) {
-    const isBodyRow = i >= headRowCount;
-    const rowHeight = baseHeights[i];
-
-    while (true) {
-      const currentPageStartY = getPageStartY(currentPageIndex);
-      const remainingHeight = currentPageStartY + pageContentHeight - currentPageY;
-      const needsHeader =
-        isBodyRow && rowsOnCurrentPage === 0 && currentPageIndex > initialPageIndex;
-      const totalRowHeight = rowHeight + (needsHeader ? headerHeight : 0);
-
-      if (totalRowHeight > remainingHeight - SAFETY_MARGIN) {
-        if (rowsOnCurrentPage === 0 && Math.abs(currentPageY - currentPageStartY) < SAFETY_MARGIN) {
-          result.push(totalRowHeight);
-          currentPageY += totalRowHeight;
-          rowsOnCurrentPage++;
-          break;
-        }
-        currentPageIndex++;
-        currentPageY = getPageStartY(currentPageIndex);
-        rowsOnCurrentPage = 0;
-        continue;
-      }
-
-      result.push(totalRowHeight);
-      currentPageY += totalRowHeight;
-      rowsOnCurrentPage++;
-
-      if (currentPageY >= currentPageStartY + pageContentHeight - SAFETY_MARGIN) {
-        currentPageIndex++;
-        currentPageY = getPageStartY(currentPageIndex);
-        rowsOnCurrentPage = 0;
-      }
-      break;
-    }
-  }
-
-  return result;
-};

package/src/tables/helper.ts

@@ -1,216 +0,0 @@
-import {
-  DEFAULT_ALIGNMENT,
-  DEFAULT_FONT_SIZE,
-  DEFAULT_LINE_HEIGHT,
-  DEFAULT_CHARACTER_SPACING,
-  DEFAULT_FONT_COLOR,
-  ALIGN_RIGHT,
-  ALIGN_CENTER,
-  ALIGN_LEFT,
-  VERTICAL_ALIGN_TOP,
-  VERTICAL_ALIGN_MIDDLE,
-  VERTICAL_ALIGN_BOTTOM,
-} from '../text/constants.js';
-import { HEX_COLOR_PATTERN } from '../constants.js';
-
-export const getDefaultCellStyles = () => ({
-  fontName: undefined,
-  alignment: DEFAULT_ALIGNMENT,
-  verticalAlignment: VERTICAL_ALIGN_MIDDLE,
-  fontSize: DEFAULT_FONT_SIZE,
-  lineHeight: DEFAULT_LINE_HEIGHT,
-  characterSpacing: DEFAULT_CHARACTER_SPACING,
-  fontColor: DEFAULT_FONT_COLOR,
-  backgroundColor: '',
-  borderColor: '#888888',
-  borderWidth: { top: 0.1, bottom: 0.1, left: 0.1, right: 0.1 },
-  padding: { top: 5, bottom: 5, left: 5, right: 5 },
-});
-
-const getBoxDimensionProp = (step = 1) => {
-  const getCommonProp = () => ({
-    type: 'number',
-    widget: 'inputNumber',
-    props: { min: 0, step },
-    span: 6,
-  });
-  return {
-    top: { title: 'Top', ...getCommonProp() },
-    right: { title: 'Right', ...getCommonProp() },
-    bottom: { title: 'Bottom', ...getCommonProp() },
-    left: { title: 'Left', ...getCommonProp() },
-  };
-};
-
-export const getCellPropPanelSchema = (arg: {
-  i18n: (key: string) => string;
-  fallbackFontName: string;
-  fontNames: string[];
-  isBody?: boolean;
-}) => {
-  const { i18n, fallbackFontName, fontNames, isBody } = arg;
-
-  return {
-    fontName: {
-      title: i18n('schemas.text.fontName'),
-      type: 'string',
-      widget: 'select',
-      default: fallbackFontName,
-      placeholder: fallbackFontName,
-      props: { options: fontNames.map((name) => ({ label: name, value: name })) },
-      span: 12,
-    },
-    fontSize: {
-      title: i18n('schemas.text.size'),
-      type: 'number',
-      widget: 'inputNumber',
-      props: { min: 0 },
-      span: 6,
-    },
-    characterSpacing: {
-      title: i18n('schemas.text.spacing'),
-      type: 'number',
-      widget: 'inputNumber',
-      props: { min: 0 },
-      span: 6,
-    },
-    alignment: {
-      title: i18n('schemas.text.textAlign'),
-      type: 'string',
-      widget: 'select',
-      props: {
-        options: [
-          { label: i18n('schemas.left'), value: ALIGN_LEFT },
-          { label: i18n('schemas.center'), value: ALIGN_CENTER },
-          { label: i18n('schemas.right'), value: ALIGN_RIGHT },
-        ],
-      },
-      span: 8,
-    },
-    verticalAlignment: {
-      title: i18n('schemas.text.verticalAlign'),
-      type: 'string',
-      widget: 'select',
-      props: {
-        options: [
-          { label: i18n('schemas.top'), value: VERTICAL_ALIGN_TOP },
-          { label: i18n('schemas.middle'), value: VERTICAL_ALIGN_MIDDLE },
-          { label: i18n('schemas.bottom'), value: VERTICAL_ALIGN_BOTTOM },
-        ],
-      },
-      span: 8,
-    },
-    lineHeight: {
-      title: i18n('schemas.text.lineHeight'),
-      type: 'number',
-      widget: 'inputNumber',
-      props: { step: 0.1, min: 0 },
-      span: 8,
-    },
-    fontColor: {
-      title: i18n('schemas.textColor'),
-      type: 'string',
-      widget: 'color',
-      props: {
-        disabledAlpha: true,
-      },
-      rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
-    },
-    borderColor: {
-      title: i18n('schemas.borderColor'),
-      type: 'string',
-      widget: 'color',
-      props: {
-        disabledAlpha: true,
-      },
-      rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
-    },
-    backgroundColor: {
-      title: i18n('schemas.backgroundColor'),
-      type: 'string',
-      widget: 'color',
-      props: {
-        disabledAlpha: true,
-      },
-      rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
-    },
-    ...(isBody
-      ? {
-          alternateBackgroundColor: {
-            title: i18n('schemas.table.alternateBackgroundColor'),
-            type: 'string',
-            widget: 'color',
-            props: {
-              disabledAlpha: true,
-            },
-            rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
-          },
-        }
-      : {}),
-    '-': { type: 'void', widget: 'Divider' },
-    borderWidth: {
-      title: i18n('schemas.borderWidth'),
-      type: 'object',
-      widget: 'lineTitle',
-      span: 24,
-      properties: getBoxDimensionProp(0.1),
-    },
-    '--': { type: 'void', widget: 'Divider' },
-    padding: {
-      title: i18n('schemas.padding'),
-      type: 'object',
-      widget: 'lineTitle',
-      span: 24,
-      properties: getBoxDimensionProp(),
-    },
-  };
-};
-
-export const getColumnStylesPropPanelSchema = ({
-  head,
-  i18n,
-}: {
-  head: string[];
-  i18n: (key: string) => string;
-}) => ({
-  alignment: {
-    type: 'object',
-    widget: 'lineTitle',
-    title: i18n('schemas.text.textAlign'),
-    column: 3,
-    properties: head.reduce(
-      (acc, cur, i) =>
-        Object.assign(acc, {
-          [i]: {
-            title: cur || 'Column ' + String(i + 1),
-            type: 'string',
-            widget: 'select',
-            props: {
-              options: [
-                { label: i18n('schemas.left'), value: ALIGN_LEFT },
-                { label: i18n('schemas.center'), value: ALIGN_CENTER },
-                { label: i18n('schemas.right'), value: ALIGN_RIGHT },
-              ],
-            },
-          },
-        }),
-      {},
-    ),
-  },
-});
-
-export const getBody = (value: string | string[][]): string[][] => {
-  if (typeof value === 'string') {
-    return JSON.parse(value || '[]') as string[][];
-  }
-  return value || [];
-};
-
-export const getBodyWithRange = (
-  value: string | string[][],
-  range?: { start: number; end?: number | undefined },
-) => {
-  const body = getBody(value);
-  if (!range) return body;
-  return body.slice(range.start, range.end);
-};