@pdfme/schemas 5.3.11-dev.9 → 5.3.12

package/src/barcodes/propPanel.ts

@@ -172,10 +172,23 @@ const barcodeDefaults: { defaultSchema: BarcodeSchema }[] = [
       opacity: DEFAULT_OPACITY,
     },
   },
+  {
+    defaultSchema: {
+      name: '',
+      type: 'pdf417',
+      content: 'This is PDF417!',
+      position,
+      ...defaultColors,
+      width: 40,
+      height: 16,
+      rotate: 0,
+      opacity: DEFAULT_OPACITY,
+    },
+  },
 ];
 
 export const getPropPanelByBarcodeType = (barcodeType: string): PropPanel<BarcodeSchema> => {
-  const barcodeHasText = barcodeType !== 'qrcode' && barcodeType !== 'gs1datamatrix';
+  const barcodeHasText = barcodeType !== 'qrcode' && barcodeType !== 'gs1datamatrix' && barcodeType !== 'pdf417';
 
   const defaults = barcodeDefaults.find(({ defaultSchema }) => defaultSchema.type === barcodeType);
 

package/src/checkbox/index.ts

@@ -1,5 +1,4 @@
-import { Plugin } from '@pdfme/common';
-import { Schema } from '@pdfme/common';
+import { Plugin, Schema, UIRenderProps, PDFRenderProps } from '@pdfme/common';
 import svg from '../graphics/svg.js';
 import { isEditable } from '../utils.js';
 import { HEX_COLOR_PATTERN } from '../constants.js';
@@ -19,7 +18,7 @@ const getIcon = ({ value, color }: { value: string; color: string }) =>
   value === 'true' ? getCheckedIcon(color) : getUncheckedIcon(color);
 
 const schema: Plugin<Checkbox> = {
-  ui: (arg) => {
+  ui: (arg: UIRenderProps<Checkbox>) => {
     const { schema, value, onChange, rootElement, mode } = arg;
     const container = document.createElement('div');
     container.style.width = '100%';
@@ -40,7 +39,7 @@ const schema: Plugin<Checkbox> = {
 
     rootElement.appendChild(container);
   },
-  pdf: (arg) =>
+  pdf: (arg: PDFRenderProps<Checkbox>) =>
     svg.pdf(Object.assign(arg, { value: getIcon({ value: arg.value, color: arg.schema.color }) })),
   propPanel: {
     schema: ({ i18n }) => ({

package/src/date/helper.ts

@@ -39,7 +39,14 @@ import localeZh from 'air-datepicker/locale/zh';
 import * as dateFns from 'date-fns/locale';
 import { format } from 'date-fns';
 
-import { Plugin, getFallbackFontName, DEFAULT_FONT_NAME, PropPanelSchema } from '@pdfme/common';
+import {
+  Plugin,
+  getFallbackFontName,
+  DEFAULT_FONT_NAME,
+  PropPanelSchema,
+  UIRenderProps,
+  PDFRenderProps,
+} from '@pdfme/common';
 import text from '../text/index.js';
 import { DEFAULT_OPACITY, HEX_COLOR_PATTERN } from '../constants.js';
 import { mapVerticalAlignToFlex } from '../text/uiRender.js';
@@ -200,7 +207,7 @@ export const getPlugin = ({ type, icon }: { type: PickerType; icon: string }) =>
   const defaultFormat = getFormat(type, getAirDatepickerLocale(defaultLocale));
 
   const plugin: Plugin<DateSchema> = {
-    ui: async (arg) => {
+    ui: async (arg: UIRenderProps<DateSchema>) => {
       const { schema, value, onChange, rootElement, mode, options, i18n } = arg;
 
       const locale = getAirDatepickerLocale(schema.locale || options.lang || defaultLocale);
@@ -297,7 +304,7 @@ export const getPlugin = ({ type, icon }: { type: PickerType; icon: string }) =>
       rootElement.appendChild(input);
       rootElement.appendChild(textElement);
     },
-    pdf: (arg) => {
+    pdf: (arg: PDFRenderProps<DateSchema>) => {
       const { schema, value, options } = arg;
       if (!value) return void 0;
       const locale = getAirDatepickerLocale(schema.locale || options.lang || defaultLocale);

package/src/graphics/image.ts

@@ -174,7 +174,9 @@ const imageSchema: Plugin<ImageSchema> = {
             console.error('Error reading file:', error);
           });
       });
-      input.addEventListener('blur', () => { if (stopEditing) stopEditing(); });
+      input.addEventListener('blur', () => {
+        if (stopEditing) stopEditing();
+      });
       label.appendChild(input);
     }
   },

package/src/graphics/svg.ts

@@ -1,4 +1,4 @@
-import { Plugin, Schema } from '@pdfme/common';
+import { Plugin, Schema, UIRenderProps, PDFRenderProps } from '@pdfme/common';
 import {
   convertForPdfLayoutProps,
   isEditable,
@@ -42,11 +42,10 @@ const defaultValue = `<svg viewBox="0 0 488 600" version="1.1" xmlns="http://www
     </g>
 </svg>`;
 
-// This interface extends Schema with no additional properties
 export type SVGSchema = Schema;
 
 const svgSchema: Plugin<SVGSchema> = {
-  ui: (arg) => {
+  ui: (arg: UIRenderProps<SVGSchema>) => {
     const { rootElement, value, mode, onChange, theme, schema } = arg;
     const container = document.createElement(isEditable(mode, schema) ? 'textarea' : 'div');
     container.style.width = '100%';
@@ -94,7 +93,7 @@ const svgSchema: Plugin<SVGSchema> = {
       }
     }
   },
-  pdf: async (arg) => {
+  pdf: async (arg: PDFRenderProps<SVGSchema>) => {
     const { page, schema, value } = arg;
     if (!value || !isValidSVG(value)) return;
     const pageHeight = page.getHeight();

package/src/multiVariableText/helper.ts

@@ -12,7 +12,9 @@ export const substituteVariables = (
 
   if (variablesIn) {
     const variables: Record<string, string> =
-      typeof variablesIn === 'string' ? JSON.parse(variablesIn || '{}') as Record<string, string> : variablesIn;
+      typeof variablesIn === 'string'
+        ? (JSON.parse(variablesIn || '{}') as Record<string, string>)
+        : variablesIn;
 
     Object.keys(variables).forEach((variableName) => {
       // handle special characters in variable name
@@ -35,7 +37,7 @@ export const validateVariables = (value: string, schema: MultiVariableTextSchema
 
   let values;
   try {
-    values = value ? JSON.parse(value) as Record<string, string> : {};
+    values = value ? (JSON.parse(value) as Record<string, string>) : {};
   } catch {
     throw new SyntaxError(
       `[@pdfme/generator] invalid JSON string '${value}' for variables in field ${schema.name}`,

package/src/multiVariableText/propPanel.ts

@@ -55,12 +55,18 @@ const mapDynamicVariables = (props: PropPanelWidgetProps) => {
     const para = document.createElement('p');
     // Extract color value to avoid unsafe property access
     const colorValue = options?.theme?.token?.colorPrimary || '#168fe3';
-    const isValidColor = /^#[0-9A-F]{6}$/i.test(colorValue) || /^(rgb|hsl)a?\(\s*([+-]?\d+%?\s*,\s*){2,3}[+-]?\d+%?\s*\)$/i.test(colorValue);
+    const isValidColor =
+      /^#[0-9A-F]{6}$/i.test(colorValue) ||
+      /^(rgb|hsl)a?\(\s*([+-]?\d+%?\s*,\s*){2,3}[+-]?\d+%?\s*\)$/i.test(colorValue);
     const safeColorValue = isValidColor ? colorValue : '#168fe3';
+
+    // Use safe string concatenation for innerHTML
+    const typingInstructions = i18n('schemas.mvt.typingInstructions');
+    const sampleField = i18n('schemas.mvt.sampleField');
     para.innerHTML =
-      i18n('schemas.mvt.typingInstructions') +
+      typingInstructions +
       ` <code style="color:${safeColorValue}; font-weight:bold;">{` +
-      i18n('schemas.mvt.sampleField') +
+      sampleField +
       '}</code>';
     rootElement.appendChild(para);
   }
@@ -72,12 +78,13 @@ export const propPanel: PropPanel<MultiVariableTextSchema> = {
       throw new Error('Oops, is text schema no longer a function?');
     }
     // Safely call schema function with proper type handling
-    const parentSchema = parentPropPanel.schema?.(propPanelProps) || {};
+    const parentSchema =
+      typeof parentPropPanel.schema === 'function' ? parentPropPanel.schema(propPanelProps) : {};
     return {
       ...parentSchema,
       '-------': { type: 'void', widget: 'Divider' },
       dynamicVarContainer: {
-        title: typeof propPanelProps.i18n === 'function' ? propPanelProps.i18n('schemas.mvt.variablesSampleData') : 'Variables Sample Data',
+        title: 'Variables Sample Data',
         type: 'string',
         widget: 'Card',
         span: 24,

package/src/multiVariableText/uiRender.ts

@@ -75,11 +75,17 @@ const formUiRender = async (arg: UIRenderProps<MultiVariableTextSchema>) => {
     rootElement.parentElement.style.outline = '';
   }
 
-  const variables: Record<string, string> = value ? JSON.parse(value) as Record<string, string> || {} : {};
+  const variables: Record<string, string> = value
+    ? (JSON.parse(value) as Record<string, string>) || {}
+    : {};
   const variableIndices = getVariableIndices(rawText);
   const substitutedText = substituteVariables(rawText, variables);
   const font = options?.font || getDefaultFont();
-  const fontKitFont = await getFontKitFont(schema.fontName, font, _cache as Map<string, import('fontkit').Font>);
+  const fontKitFont = await getFontKitFont(
+    schema.fontName,
+    font,
+    _cache as Map<string, import('fontkit').Font>,
+  );
 
   const textBlock = buildStyledTextContainer(arg, fontKitFont, substitutedText);
 

package/src/radioGroup/index.ts

@@ -1,5 +1,4 @@
-import { Plugin } from '@pdfme/common';
-import { Schema } from '@pdfme/common';
+import { Plugin, Schema, UIRenderProps, PDFRenderProps } from '@pdfme/common';
 import { Circle, CircleDot } from 'lucide';
 import svg from '../graphics/svg.js';
 import { isEditable, createSvgStr } from '../utils.js';
@@ -29,7 +28,7 @@ const radioButtonStates = new Map<string, RadioButtonState>();
 const eventListeners = new Map<string, EventListener>();
 
 const schema: Plugin<RadioGroup> = {
-  ui: (arg) => {
+  ui: (arg: UIRenderProps<RadioGroup>) => {
     const { schema, value, onChange, rootElement, mode } = arg;
     const container = document.createElement('div');
     container.style.width = '100%';
@@ -80,7 +79,7 @@ const schema: Plugin<RadioGroup> = {
 
     rootElement.appendChild(container);
   },
-  pdf: (arg) =>
+  pdf: (arg: PDFRenderProps<RadioGroup>) =>
     svg.pdf(Object.assign(arg, { value: getIcon({ value: arg.value, color: arg.schema.color }) })),
   propPanel: {
     schema: ({ i18n }) => ({

package/src/select/index.ts

@@ -1,6 +1,6 @@
 import type * as CSS from 'csstype';
 import { propPanel as parentPropPanel } from '../text/propPanel.js';
-import { Plugin, PropPanelWidgetProps, SchemaForUI } from '@pdfme/common';
+import { Plugin, PropPanelWidgetProps, SchemaForUI, UIRenderProps } from '@pdfme/common';
 import text from '../text/index.js';
 import { TextSchema } from '../text/types.js';
 import { ChevronDown } from 'lucide';
@@ -112,7 +112,7 @@ const addOptions = (props: PropPanelWidgetProps) => {
 };
 
 const schema: Plugin<Select> = {
-  ui: async (arg) => {
+  ui: async (arg: UIRenderProps<Select>) => {
     const { schema, value, onChange, rootElement, mode } = arg;
     await text.ui(Object.assign(arg, { mode: 'viewer' }));
 
@@ -154,7 +154,9 @@ const schema: Plugin<Select> = {
         }
       });
 
-      selectElement.innerHTML = schema.options
+      // Ensure schema.options is an array before mapping
+      const options = Array.isArray(schema.options) ? schema.options : [];
+      selectElement.innerHTML = options
         .map(
           (option) =>
             `<option value="${option}" ${option === value ? 'selected' : ''}>${option}</option>`,
@@ -172,8 +174,12 @@ const schema: Plugin<Select> = {
         throw Error('Oops, is text schema no longer a function?');
       }
 
+      // Safely call the parent schema function with proper type checking
+      const parentSchema = parentPropPanel.schema(propPanelProps);
+
+      // Create a type-safe return object
       return {
-        ...parentPropPanel.schema(propPanelProps),
+        ...parentSchema,
         '-------': { type: 'void', widget: 'Divider' },
 
         optionsContainer: {
@@ -186,7 +192,7 @@ const schema: Plugin<Select> = {
       };
     },
     defaultSchema: {
-      ...text.propPanel.defaultSchema,
+      ...(text.propPanel.defaultSchema as TextSchema),
       type: 'select',
       content: 'option1',
       options: ['option1', 'option2'],

package/src/shapes/rectAndEllipse.ts

@@ -1,4 +1,4 @@
-import { Plugin, Schema, mm2pt } from '@pdfme/common';
+import { Plugin, Schema, mm2pt, UIRenderProps, PDFRenderProps } from '@pdfme/common';
 import { HEX_COLOR_PATTERN } from '../constants.js';
 import { hex2PrintingColor, convertForPdfLayoutProps, createSvgStr } from '../utils.js';
 import { toRadians } from '@pdfme/pdf-lib';
@@ -12,7 +12,7 @@ interface ShapeSchema extends Schema {
 }
 
 const shape: Plugin<ShapeSchema> = {
-  ui: (arg) => {
+  ui: (arg: UIRenderProps<ShapeSchema>) => {
     const { schema, rootElement } = arg;
     const div = document.createElement('div');
     div.style.width = '100%';
@@ -28,7 +28,7 @@ const shape: Plugin<ShapeSchema> = {
 
     rootElement.appendChild(div);
   },
-  pdf: (arg) => {
+  pdf: (arg: PDFRenderProps<ShapeSchema>) => {
     const { schema, page, options } = arg;
     if (!schema.color && !schema.borderColor) return;
     const { colorType } = options;
@@ -119,7 +119,7 @@ const shape: Plugin<ShapeSchema> = {
 const getPropPanelSchema = (type: 'rectangle' | 'ellipse') => ({
   ...shape.propPanel,
   defaultSchema: {
-    ...shape.propPanel.defaultSchema,
+    ...(shape.propPanel.defaultSchema as ShapeSchema),
     type,
   },
 });

package/src/tables/classes.ts

@@ -114,7 +114,7 @@ export class Table {
     input: TableInput;
     content: ContentSettings;
     font: Font;
-    _cache: Map<string, FontKitFont>;
+    _cache: Map<string | number, FontKitFont>;
   }) {
     const { input, content, font, _cache } = arg;
     const table = new Table(input, content);
@@ -145,7 +145,11 @@ export class Table {
   }
 }
 
-async function calculateWidths(arg: { table: Table; font: Font; _cache: Map<string, FontKitFont> }) {
+async function calculateWidths(arg: {
+  table: Table;
+  font: Font;
+  _cache: Map<string | number, FontKitFont>;
+}) {
   const { table, font, _cache } = arg;
 
   const getFontKitFontByFontName = (fontName: string | undefined) =>

package/src/tables/dynamicTemplate.ts

@@ -9,7 +9,7 @@ export const getDynamicHeightsForTable = async (
     schema: Schema;
     basePdf: BasePdf;
     options: CommonOptions;
-    _cache: Map<string, unknown>;
+    _cache: Map<string | number, unknown>;
   },
 ): Promise<number[]> => {
   if (args.schema.type !== 'table') return Promise.resolve([args.schema.height]);

package/src/tables/pdfRender.ts

@@ -1,11 +1,19 @@
 import type { TableSchema } from './types.js';
-import type { PDFRenderProps } from '@pdfme/common';
+import type { PDFRenderProps, Schema, BasePdf, CommonOptions } from '@pdfme/common';
 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';
 
+// Define the CreateTableArgs interface locally since it's not exported from tableHelper.js
+interface CreateTableArgs {
+  schema: Schema;
+  basePdf: BasePdf;
+  options: CommonOptions;
+  _cache: Map<string | number, unknown>;
+}
+
 type Pos = { x: number; y: number };
 
 const rectanglePdfRender = rectangle.pdf;
@@ -108,12 +116,29 @@ async function drawTable(arg: PDFRenderProps<TableSchema>, table: Table): Promis
 }
 
 export const pdfRender = async (arg: PDFRenderProps<TableSchema>) => {
-  const { value, schema } = arg;
+  const { value, schema, basePdf, options, _cache } = arg;
 
   const body = getBodyWithRange(
     typeof value !== 'string' ? JSON.stringify(value || '[]') : value,
     schema.__bodyRange,
   );
-  const table = await createSingleTable(body, arg);
+
+  // Create a properly typed CreateTableArgs object
+  const createTableArgs: CreateTableArgs = {
+    schema,
+    basePdf,
+    options,
+    _cache,
+  };
+
+  // Ensure body is properly typed before passing to createSingleTable
+  // Ensure body is properly typed as string[][] before passing to createSingleTable
+  const typedBody: string[][] = Array.isArray(body)
+    ? body.map((row) => (Array.isArray(row) ? row.map((cell) => String(cell)) : []))
+    : [];
+  const table = await createSingleTable(typedBody, createTableArgs);
+
+  // Use the original arg directly since drawTable expects PDFRenderProps<TableSchema>
+  // which is the same type as our arg parameter
   await drawTable(arg, table);
 };

package/src/tables/tableHelper.ts

@@ -25,7 +25,7 @@ interface CreateTableArgs {
   schema: Schema;
   basePdf: BasePdf;
   options: CommonOptions;
-  _cache: Map<string, unknown>;
+  _cache: Map<string | number, unknown>;
 }
 
 interface UserOptions {
@@ -279,5 +279,10 @@ export function createSingleTable(body: string[][], args: CreateTableArgs) {
 
   const content = parseContent4Table(input, fallbackFontName);
 
-  return Table.create({ input, content, font, _cache: _cache as Map<string, FontKitFont> });
+  return Table.create({
+    input,
+    content,
+    font,
+    _cache: _cache as unknown as Map<string | number, FontKitFont>,
+  });
 }

package/src/text/helper.ts

@@ -112,7 +112,7 @@ const getCacheKey = (fontName: string) => `getFontKitFont-${fontName}`;
 export const getFontKitFont = async (
   fontName: string | undefined,
   font: Font,
-  _cache: Map<string, fontkit.Font>,
+  _cache: Map<string | number, fontkit.Font>,
 ) => {
   const fntNm = fontName || getFallbackFontName(font);
   const cacheKey = getCacheKey(fntNm);

package/src/text/pdfRender.ts

@@ -94,7 +94,11 @@ export const pdfRender = async (arg: PDFRenderProps<TextSchema>) => {
   const { font = getDefaultFont(), colorType } = options;
 
   const [pdfFontObj, fontKitFont] = await Promise.all([
-    embedAndGetFontObj({ pdfDoc, font, _cache: _cache as unknown as Map<PDFDocument, { [key: string]: PDFFont }> }),
+    embedAndGetFontObj({
+      pdfDoc,
+      font,
+      _cache: _cache as unknown as Map<PDFDocument, { [key: string]: PDFFont }>,
+    }),
     getFontKitFont(schema.fontName, font, _cache as Map<string, FontKitFont>),
   ]);
   const fontProp = getFontProp({ value, fontKitFont, schema, colorType });

package/src/text/propPanel.ts

@@ -54,7 +54,9 @@ export const propPanel: PropPanel<TextSchema> = {
     const fontNames = Object.keys(font);
     const fallbackFontName = getFallbackFontName(font);
 
-    const enableDynamicFont = Boolean((activeSchema as { dynamicFontSize?: unknown })?.dynamicFontSize);
+    const enableDynamicFont = Boolean(
+      (activeSchema as { dynamicFontSize?: unknown })?.dynamicFontSize,
+    );
 
     const textSchema: Record<string, PropPanelSchema> = {
       fontName: {

package/src/text/uiRender.ts

@@ -69,7 +69,11 @@ export const uiRender = async (arg: UIRenderProps<TextSchema>) => {
     return text;
   };
   const font = options?.font || getDefaultFont();
-  const fontKitFont = await getFontKitFont(schema.fontName, font, _cache as Map<string, import('fontkit').Font>);
+  const fontKitFont = await getFontKitFont(
+    schema.fontName,
+    font,
+    _cache as Map<string, import('fontkit').Font>,
+  );
   const textBlock = buildStyledTextContainer(
     arg,
     fontKitFont,

package/src/utils.ts

@@ -243,7 +243,11 @@ export const createSvgStr = (icon: IconNode, attrs?: Record<string, string>): st
       return String(element);
     }
 
-    const [tag, attributes = {}, children = []] = element as [unknown, Record<string, string>, unknown[]];
+    const [tag, attributes = {}, children = []] = element as [
+      unknown,
+      Record<string, string>,
+      unknown[],
+    ];
     const tagName = String(tag);
 
     // Format attributes string