@pdfme/schemas 5.3.8-dev.6 → 5.3.8-dev.60

package/src/index.ts

@@ -1,17 +1,17 @@
-import multiVariableText from './multiVariableText/index';
-import text from './text/index';
-import image from './graphics/image';
-import svg from './graphics/svg';
-import barcodes from './barcodes/index';
-import line from './shapes/line';
-import table from './tables/index';
-import { rectangle, ellipse } from './shapes/rectAndEllipse';
-import dateTime from './date/dateTime';
-import date from './date/date';
-import time from './date/time';
-import select from './select/index';
-import radioGroup from './radioGroup/index';
-import checkbox from './checkbox/index';
+import multiVariableText from './multiVariableText/index.js';
+import text from './text/index.js';
+import image from './graphics/image.js';
+import svg from './graphics/svg.js';
+import barcodes from './barcodes/index.js';
+import line from './shapes/line.js';
+import table from './tables/index.js';
+import { rectangle, ellipse } from './shapes/rectAndEllipse.js';
+import dateTime from './date/dateTime.js';
+import date from './date/date.js';
+import time from './date/time.js';
+import select from './select/index.js';
+import radioGroup from './radioGroup/index.js';
+import checkbox from './checkbox/index.js';
 
 const builtInPlugins = { Text: text };
 

package/src/multiVariableText/helper.ts

@@ -1,14 +1,18 @@
-import { MultiVariableTextSchema } from "./types";
+import { MultiVariableTextSchema } from './types.js';
 
-export const substituteVariables = (text: string, variablesIn: string | Record<string, string>): string => {
+export const substituteVariables = (
+  text: string,
+  variablesIn: string | Record<string, string>,
+): string => {
   if (!text) {
-    return "";
+    return '';
   }
 
   let substitutedText = text;
 
   if (variablesIn) {
-    const variables: Record<string, string> = (typeof variablesIn === "string") ? JSON.parse(variablesIn) || {} : variablesIn;
+    const variables: Record<string, string> =
+      typeof variablesIn === 'string' ? JSON.parse(variablesIn) || {} : variablesIn;
 
     Object.keys(variables).forEach((variableName) => {
       // handle special characters in variable name
@@ -33,13 +37,17 @@ export const validateVariables = (value: string, schema: MultiVariableTextSchema
   try {
     values = value ? JSON.parse(value) : {};
   } catch (e) {
-    throw new SyntaxError(`[@pdfme/generator] invalid JSON string '${value}' for variables in field ${schema.name}`);
+    throw new SyntaxError(
+      `[@pdfme/generator] invalid JSON string '${value}' for variables in field ${schema.name}`,
+    );
   }
 
   for (const variable of schema.variables) {
     if (!values[variable]) {
       if (schema.required) {
-        throw new Error(`[@pdfme/generator] variable ${variable} is missing for field ${schema.name}`);
+        throw new Error(
+          `[@pdfme/generator] variable ${variable} is missing for field ${schema.name}`,
+        );
       }
       // If not required, then simply don't render this field if an input is missing
       return false;
@@ -47,4 +55,4 @@ export const validateVariables = (value: string, schema: MultiVariableTextSchema
   }
 
   return true;
-}
+};

package/src/multiVariableText/index.ts

@@ -2,7 +2,7 @@ import type { Plugin } from '@pdfme/common';
 import { pdfRender } from './pdfRender.js';
 import { propPanel } from './propPanel.js';
 import { uiRender } from './uiRender.js';
-import type { MultiVariableTextSchema } from './types';
+import type { MultiVariableTextSchema } from './types.js';
 import { Type } from 'lucide';
 import { createSvgStr } from '../utils.js';
 

package/src/multiVariableText/pdfRender.ts

@@ -1,7 +1,7 @@
 import { PDFRenderProps } from '@pdfme/common';
-import { MultiVariableTextSchema } from './types';
-import { pdfRender as parentPdfRender } from '../text/pdfRender';
-import { substituteVariables, validateVariables } from './helper';
+import { MultiVariableTextSchema } from './types.js';
+import { pdfRender as parentPdfRender } from '../text/pdfRender.js';
+import { substituteVariables, validateVariables } from './helper.js';
 
 export const pdfRender = async (arg: PDFRenderProps<MultiVariableTextSchema>) => {
   const { value, schema, ...rest } = arg;

package/src/multiVariableText/propPanel.ts

@@ -1,11 +1,11 @@
-import { propPanel as parentPropPanel } from '../text/propPanel';
+import { propPanel as parentPropPanel } from '../text/propPanel.js';
 import { PropPanel, PropPanelWidgetProps } from '@pdfme/common';
-import { MultiVariableTextSchema } from './types';
+import { MultiVariableTextSchema } from './types.js';
 
 const mapDynamicVariables = (props: PropPanelWidgetProps) => {
   const { rootElement, changeSchemas, activeSchema, i18n, options } = props;
 
-  const mvtSchema = (activeSchema as any);
+  const mvtSchema = activeSchema as any;
   const text = mvtSchema.text || '';
   const variables = JSON.parse(mvtSchema.content) || {};
   const variablesChanged = updateVariablesFromText(text, variables);
@@ -14,11 +14,13 @@ const mapDynamicVariables = (props: PropPanelWidgetProps) => {
   if (variablesChanged) {
     changeSchemas([
       { key: 'content', value: JSON.stringify(variables), schemaId: activeSchema.id },
-      { key: 'variables', value: varNames, schemaId: activeSchema.id }
+      { key: 'variables', value: varNames, schemaId: activeSchema.id },
     ]);
   }
 
-  const placeholderRowEl = document.getElementById('placeholder-dynamic-var')?.closest('.ant-form-item') as HTMLElement;
+  const placeholderRowEl = document
+    .getElementById('placeholder-dynamic-var')
+    ?.closest('.ant-form-item') as HTMLElement;
   if (!placeholderRowEl) {
     throw new Error('Failed to find Ant form placeholder row to create dynamic variables inputs.');
   }
@@ -36,10 +38,12 @@ const mapDynamicVariables = (props: PropPanelWidgetProps) => {
       textarea.value = variables[variableName];
       textarea.addEventListener('change', (e: Event) => {
         variables[variableName] = (e.target as HTMLTextAreaElement).value;
-        changeSchemas([{ key: 'content', value: JSON.stringify(variables), schemaId: activeSchema.id }]);
+        changeSchemas([
+          { key: 'content', value: JSON.stringify(variables), schemaId: activeSchema.id },
+        ]);
       });
 
-      const label = varRow.querySelector('label') as HTMLLabelElement
+      const label = varRow.querySelector('label') as HTMLLabelElement;
       label.innerText = variableName;
 
       varRow.style.display = 'block';
@@ -47,10 +51,11 @@ const mapDynamicVariables = (props: PropPanelWidgetProps) => {
     }
   } else {
     const para = document.createElement('p');
-    para.innerHTML = i18n('schemas.mvt.typingInstructions')
-        + ` <code style="color:${options?.theme?.token?.colorPrimary || "#168fe3"}; font-weight:bold;">{`
-        + i18n('schemas.mvt.sampleField')
-        + '}</code>';
+    para.innerHTML =
+      i18n('schemas.mvt.typingInstructions') +
+      ` <code style="color:${options?.theme?.token?.colorPrimary || '#168fe3'}; font-weight:bold;">{` +
+      i18n('schemas.mvt.sampleField') +
+      '}</code>';
     rootElement.appendChild(para);
   }
 };
@@ -73,7 +78,7 @@ export const propPanel: PropPanel<MultiVariableTextSchema> = {
             type: 'object',
             widget: 'mapDynamicVariables',
             bind: false,
-            span: 24
+            span: 24,
           },
           placeholderDynamicVar: {
             title: 'Placeholder Dynamic Variable',
@@ -88,9 +93,8 @@ export const propPanel: PropPanel<MultiVariableTextSchema> = {
             },
             span: 24,
           },
-        }
+        },
       },
-
     };
   },
   widgets: { ...parentPropPanel.widgets, mapDynamicVariables },
@@ -106,7 +110,6 @@ export const propPanel: PropPanel<MultiVariableTextSchema> = {
   },
 };
 
-
 const updateVariablesFromText = (text: string, variables: any): boolean => {
   const regex = /\{([^{}]+)}/g;
   const matches = text.match(regex);
@@ -138,4 +141,4 @@ const updateVariablesFromText = (text: string, variables: any): boolean => {
   }
 
   return changed;
-}
+};

package/src/multiVariableText/types.ts

@@ -1,4 +1,4 @@
-import type { TextSchema } from '../text/types';
+import type { TextSchema } from '../text/types.js';
 
 export interface MultiVariableTextSchema extends TextSchema {
   text: string;

package/src/multiVariableText/uiRender.ts

@@ -1,13 +1,13 @@
 import { getDefaultFont, UIRenderProps } from '@pdfme/common';
-import { MultiVariableTextSchema } from './types';
+import { MultiVariableTextSchema } from './types.js';
 import {
   uiRender as parentUiRender,
   buildStyledTextContainer,
-  makeElementPlainTextContentEditable
-} from '../text/uiRender';
-import { isEditable } from '../utils';
-import { getFontKitFont } from '../text/helper';
-import { substituteVariables } from './helper';
+  makeElementPlainTextContentEditable,
+} from '../text/uiRender.js';
+import { isEditable } from '../utils.js';
+import { getFontKitFont } from '../text/helper.js';
+import { substituteVariables } from './helper.js';
 
 export const uiRender = async (arg: UIRenderProps<MultiVariableTextSchema>) => {
   const { value, schema, rootElement, mode, onChange, ...rest } = arg;
@@ -25,10 +25,14 @@ export const uiRender = async (arg: UIRenderProps<MultiVariableTextSchema>) => {
     schema,
     mode: mode == 'form' ? 'viewer' : mode, // if no variables for form it's just a viewer
     rootElement,
-    onChange: (arg: { key: string; value: any; } | { key: string; value: any; }[]) => {
+    onChange: (arg: { key: string; value: any } | { key: string; value: any }[]) => {
       if (!Array.isArray(arg)) {
         const numVariables = countUniqueVariableNames(arg.value);
-        onChange && onChange([{key: 'text', value: arg.value}, {key: 'readOnly', value: numVariables == 0}]);
+        onChange &&
+          onChange([
+            { key: 'text', value: arg.value },
+            { key: 'readOnly', value: numVariables == 0 },
+          ]);
       } else {
         throw new Error('onChange is not an array, the parent text plugin has changed...');
       }
@@ -49,7 +53,10 @@ export const uiRender = async (arg: UIRenderProps<MultiVariableTextSchema>) => {
         if (numVariables !== newNumVariables) {
           // If variables were modified during this keypress, we trigger a change
           if (onChange) {
-            onChange([{key: 'text', value: text}, {key: 'readOnly', value: newNumVariables == 0}]);
+            onChange([
+              { key: 'text', value: text },
+              { key: 'readOnly', value: newNumVariables == 0 },
+            ]);
           }
           numVariables = newNumVariables;
         }
@@ -59,16 +66,7 @@ export const uiRender = async (arg: UIRenderProps<MultiVariableTextSchema>) => {
 };
 
 const formUiRender = async (arg: UIRenderProps<MultiVariableTextSchema>) => {
-  const {
-    value,
-    schema,
-    rootElement,
-    onChange,
-    stopEditing,
-    theme,
-    _cache,
-    options,
-  } = arg;
+  const { value, schema, rootElement, onChange, stopEditing, theme, _cache, options } = arg;
   const rawText = schema.text;
 
   if (rootElement.parentElement) {
@@ -92,7 +90,7 @@ const formUiRender = async (arg: UIRenderProps<MultiVariableTextSchema>) => {
       inVarString = true;
       let span = document.createElement('span');
       span.style.outline = `${theme.colorPrimary} dashed 1px`;
-      makeElementPlainTextContentEditable(span)
+      makeElementPlainTextContentEditable(span);
       span.textContent = variables[variableIndices[i]];
       span.addEventListener('blur', (e: Event) => {
         const newValue = (e.target as HTMLSpanElement).textContent || '';
@@ -114,7 +112,7 @@ const formUiRender = async (arg: UIRenderProps<MultiVariableTextSchema>) => {
       textBlock.appendChild(span);
     }
   }
-}
+};
 
 const getVariableIndices = (content: string) => {
   const regex = /\{([^}]+)}/g;
@@ -146,7 +144,12 @@ const countUniqueVariableNames = (content: string) => {
  * Regex would otherwise be performed on every key press (which isn't terrible, but this code helps).
  */
 const keyPressShouldBeChecked = (event: KeyboardEvent) => {
-  if (event.key == "ArrowUp" || event.key == "ArrowDown" || event.key == "ArrowLeft" || event.key == "ArrowRight") {
+  if (
+    event.key == 'ArrowUp' ||
+    event.key == 'ArrowDown' ||
+    event.key == 'ArrowLeft' ||
+    event.key == 'ArrowRight'
+  ) {
     return false;
   }
 
@@ -164,4 +167,4 @@ const keyPressShouldBeChecked = (event: KeyboardEvent) => {
   }
 
   return true;
-}
+};

package/src/radioGroup/index.ts

@@ -1,7 +1,7 @@
 import { Plugin } from '@pdfme/common';
 import { Schema } from '@pdfme/common';
 import { Circle, CircleDot } from 'lucide';
-import svg from '../graphics/svg';
+import svg from '../graphics/svg.js';
 import { isEditable, createSvgStr } from '../utils.js';
 import { HEX_COLOR_PATTERN } from '../constants.js';
 
@@ -65,7 +65,7 @@ const schema: Plugin<RadioGroup> = {
           onChange({ key: 'content', value: 'true' });
           radioButtonStates.set(schema.name, { value: 'true', onChange });
           eventEmitter.dispatchEvent(
-            new CustomEvent(`group-${schema.group}`, { detail: schema.name })
+            new CustomEvent(`group-${schema.group}`, { detail: schema.name }),
           );
         }
       });
@@ -89,7 +89,7 @@ const schema: Plugin<RadioGroup> = {
         type: 'string',
         widget: 'color',
         props: {
-          disabledAlpha: true
+          disabledAlpha: true,
         },
         required: true,
         rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],

package/src/select/index.ts

@@ -1,8 +1,8 @@
 import type * as CSS from 'csstype';
-import { propPanel as parentPropPanel } from '../text/propPanel';
+import { propPanel as parentPropPanel } from '../text/propPanel.js';
 import { Plugin, PropPanelWidgetProps, SchemaForUI } from '@pdfme/common';
-import text from '../text';
-import { TextSchema } from '../text/types';
+import text from '../text/index.js';
+import { TextSchema } from '../text/types.js';
 import { ChevronDown } from 'lucide';
 import { createSvgStr } from '../utils.js';
 
@@ -157,7 +157,7 @@ const schema: Plugin<Select> = {
       selectElement.innerHTML = schema.options
         .map(
           (option) =>
-            `<option value="${option}" ${option === value ? 'selected' : ''}>${option}</option>`
+            `<option value="${option}" ${option === value ? 'selected' : ''}>${option}</option>`,
         )
         .join('');
       rootElement.appendChild(selectElement);

package/src/shapes/line.ts

@@ -51,7 +51,7 @@ const lineSchema: Plugin<LineSchema> = {
         type: 'string',
         widget: 'color',
         props: {
-          disabledAlpha: true
+          disabledAlpha: true,
         },
         required: true,
         rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],

package/src/shapes/rectAndEllipse.ts

@@ -58,8 +58,14 @@ const shape: Plugin<ShapeSchema> = {
       });
     } else if (schema.type === 'rectangle') {
       page.drawRectangle({
-        x: position.x + borderWidth * ((1 - Math.sin(toRadians(rotate))) / 2) + Math.tan(toRadians(rotate)) * (Math.PI ** 2),
-        y: position.y + borderWidth * ((1 + Math.sin(toRadians(rotate))) / 2) + Math.tan(toRadians(rotate)) * (Math.PI ** 2),
+        x:
+          position.x +
+          borderWidth * ((1 - Math.sin(toRadians(rotate))) / 2) +
+          Math.tan(toRadians(rotate)) * Math.PI ** 2,
+        y:
+          position.y +
+          borderWidth * ((1 + Math.sin(toRadians(rotate))) / 2) +
+          Math.tan(toRadians(rotate)) * Math.PI ** 2,
         width: width - borderWidth,
         height: height - borderWidth,
         ...drawOptions,
@@ -80,7 +86,7 @@ const shape: Plugin<ShapeSchema> = {
         type: 'string',
         widget: 'color',
         props: {
-          disabledAlpha: true
+          disabledAlpha: true,
         },
         rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
       },
@@ -89,7 +95,7 @@ const shape: Plugin<ShapeSchema> = {
         type: 'string',
         widget: 'color',
         props: {
-          disabledAlpha: true
+          disabledAlpha: true,
         },
         rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
       },

package/src/tables/cell.ts

@@ -9,7 +9,7 @@ import { uiRender as textUiRender } from '../text/uiRender.js';
 import { pdfRender as textPdfRender } from '../text/pdfRender.js';
 import line from '../shapes/line.js';
 import { rectangle } from '../shapes/rectAndEllipse.js';
-import type { CellSchema } from './types';
+import type { CellSchema } from './types.js';
 import { getCellPropPanelSchema, getDefaultCellStyles } from './helper.js';
 const linePdfRender = line.pdf;
 const rectanglePdfRender = rectangle.pdf;
@@ -19,7 +19,7 @@ const renderLine = async (
   schema: CellSchema,
   position: { x: number; y: number },
   width: number,
-  height: number
+  height: number,
 ) =>
   linePdfRender({
     ...arg,
@@ -45,7 +45,7 @@ const createLineDiv = (
   right: string | null,
   bottom: string | null,
   left: string | null,
-  borderColor: string
+  borderColor: string,
 ) => {
   const div = document.createElement('div');
   div.style.width = width;
@@ -86,7 +86,7 @@ const cellSchema: Plugin<CellSchema> = {
         schema,
         { x: position.x + width - borderWidth.right, y: position.y },
         borderWidth.right,
-        height
+        height,
       ),
       // BOTTOM
       renderLine(
@@ -94,7 +94,7 @@ const cellSchema: Plugin<CellSchema> = {
         schema,
         { x: position.x, y: position.y + height - borderWidth.bottom },
         width,
-        borderWidth.bottom
+        borderWidth.bottom,
       ),
       // LEFT
       renderLine(arg, schema, { x: position.x, y: position.y }, borderWidth.left, height),

package/src/tables/classes.ts

@@ -1,7 +1,7 @@
 import { Font, mm2pt, pt2mm } from '@pdfme/common';
 import type { Font as FontKitFont } from 'fontkit';
-import { splitTextToSize, getFontKitFont, widthOfTextAtSize } from '../text/helper';
-import type { Styles, TableInput, Settings, Section, StylesProps } from './types';
+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[] };
 
@@ -175,7 +175,7 @@ async function calculateWidths(arg: { table: Table; font: Font; _cache: Map<any,
   // first resize attempt: with respect to minReadableWidth and minWidth
   if (resizeWidth) {
     resizeWidth = resizeColumns(resizableColumns, resizeWidth, (column) =>
-      Math.max(column.minReadableWidth, column.minWidth)
+      Math.max(column.minReadableWidth, column.minWidth),
     );
   }
 
@@ -257,7 +257,7 @@ function applyColSpans(table: Table) {
 
 async function fitContent(
   table: Table,
-  getFontKitFontByFontName: (fontName: string | undefined) => Promise<FontKitFont>
+  getFontKitFontByFontName: (fontName: string | undefined) => Promise<FontKitFont>,
 ) {
   const rowSpanHeight = { count: 0, height: 0 };
   for (const row of table.allRows()) {
@@ -293,7 +293,7 @@ async function fitContent(
 function resizeColumns(
   columns: Column[],
   resizeWidth: number,
-  getMinWidth: (column: Column) => number
+  getMinWidth: (column: Column) => number,
 ) {
   const initialResizeWidth = resizeWidth;
   const sumWrappedWidth = columns.reduce((acc, column) => acc + column.wrappedWidth, 0);
@@ -333,7 +333,7 @@ function resizeColumns(
 
 async function calculate(
   table: Table,
-  getFontKitFontByFontName: (fontName: string | undefined) => Promise<FontKitFont>
+  getFontKitFontByFontName: (fontName: string | undefined) => Promise<FontKitFont>,
 ) {
   for (const row of table.allRows()) {
     for (const column of table.columns) {
@@ -347,7 +347,7 @@ async function calculate(
 
       const longestWordWidth = getStringWidth(
         Object.assign(cell, { text: cell.text.join(' ').split(/\s+/) }),
-        fontKitFont
+        fontKitFont,
       );
       cell.minReadableWidth = longestWordWidth + hPadding;
 

package/src/tables/dynamicTemplate.ts

@@ -1,7 +1,7 @@
 import { Schema, BasePdf, CommonOptions } from '@pdfme/common';
-import { createSingleTable } from './tableHelper';
+import { createSingleTable } from './tableHelper.js';
 import { getBodyWithRange, getBody } from './helper.js';
-import { TableSchema } from './types';
+import { TableSchema } from './types.js';
 
 export const getDynamicHeightsForTable = async (
   value: string,
@@ -10,7 +10,7 @@ export const getDynamicHeightsForTable = async (
     basePdf: BasePdf;
     options: CommonOptions;
     _cache: Map<any, any>;
-  }
+  },
 ): Promise<number[]> => {
   if (args.schema.type !== 'table') return Promise.resolve([args.schema.height]);
   const schema = args.schema as TableSchema;

package/src/tables/helper.ts

@@ -10,7 +10,7 @@ import {
   VERTICAL_ALIGN_TOP,
   VERTICAL_ALIGN_MIDDLE,
   VERTICAL_ALIGN_BOTTOM,
-} from '../text/constants';
+} from '../text/constants.js';
 import { HEX_COLOR_PATTERN } from '../constants.js';
 
 export const getDefaultCellStyles = () => ({
@@ -112,7 +112,7 @@ export const getCellPropPanelSchema = (arg: {
       type: 'string',
       widget: 'color',
       props: {
-        disabledAlpha: true
+        disabledAlpha: true,
       },
       rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
     },
@@ -121,7 +121,7 @@ export const getCellPropPanelSchema = (arg: {
       type: 'string',
       widget: 'color',
       props: {
-        disabledAlpha: true
+        disabledAlpha: true,
       },
       rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
     },
@@ -130,7 +130,7 @@ export const getCellPropPanelSchema = (arg: {
       type: 'string',
       widget: 'color',
       props: {
-        disabledAlpha: true
+        disabledAlpha: true,
       },
       rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
     },
@@ -141,7 +141,7 @@ export const getCellPropPanelSchema = (arg: {
             type: 'string',
             widget: 'color',
             props: {
-              disabledAlpha: true
+              disabledAlpha: true,
             },
             rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
           },
@@ -194,7 +194,7 @@ export const getColumnStylesPropPanelSchema = ({
             },
           },
         }),
-      {}
+      {},
     ),
   },
 });
@@ -208,7 +208,7 @@ export const getBody = (value: string | string[][]): string[][] => {
 
 export const getBodyWithRange = (
   value: string | string[][],
-  range?: { start: number; end?: number | undefined }
+  range?: { start: number; end?: number | undefined },
 ) => {
   const body = getBody(value);
   if (!range) return body;

package/src/tables/pdfRender.ts

@@ -1,10 +1,10 @@
-import type { TableSchema } from './types';
+import type { TableSchema } from './types.js';
 import type { PDFRenderProps } from '@pdfme/common';
-import { Cell, Table, Row, Column } from './classes';
-import { rectangle } from '../shapes/rectAndEllipse';
-import cell from './cell';
-import { getBodyWithRange } from './helper';
-import { createSingleTable } from './tableHelper';
+import { Cell, Table, Row, Column } from './classes.js';
+import { rectangle } from '../shapes/rectAndEllipse.js';
+import cell from './cell.js';
+import { getBodyWithRange } from './helper.js';
+import { createSingleTable } from './tableHelper.js';
 
 type Pos = { x: number; y: number };
 
@@ -41,7 +41,7 @@ async function drawRow(
   table: Table,
   row: Row,
   cursor: Pos,
-  columns: Column[]
+  columns: Column[],
 ) {
   cursor.x = table.settings.margin.left;
   for (const column of columns) {
@@ -65,7 +65,7 @@ async function drawTableBorder(
   arg: PDFRenderProps<TableSchema>,
   table: Table,
   startPos: Pos,
-  cursor: Pos
+  cursor: Pos,
 ) {
   const lineWidth = table.settings.tableLineWidth;
   const lineColor = table.settings.tableLineColor;
@@ -112,7 +112,7 @@ export const pdfRender = async (arg: PDFRenderProps<TableSchema>) => {
 
   const body = getBodyWithRange(
     typeof value !== 'string' ? JSON.stringify(value || '[]') : value,
-    schema.__bodyRange
+    schema.__bodyRange,
   );
   const table = await createSingleTable(body, arg);
   await drawTable(arg, table);

package/src/tables/propPanel.ts

@@ -1,5 +1,5 @@
 import type { PropPanel } from '@pdfme/common';
-import type { TableSchema } from './types';
+import type { TableSchema } from './types.js';
 import { getFallbackFontName, DEFAULT_FONT_NAME } from '@pdfme/common';
 import {
   getDefaultCellStyles,