@pdfme/schemas 5.3.11 → 5.3.12-dev.1

package/dist/types/src/shapes/rectAndEllipse.d.ts

@@ -1,4 +1,4 @@
-import { Schema } from '@pdfme/common';
+import { Schema, UIRenderProps, PDFRenderProps } from '@pdfme/common';
 interface ShapeSchema extends Schema {
     type: 'ellipse' | 'rectangle';
     borderWidth: number;
@@ -38,13 +38,55 @@ export declare const rectangle: {
             schemas: import("@pdfme/common").SchemaForUI[];
             options: import("@pdfme/common").UIOptions;
             theme: import("antd").GlobalToken;
-            i18n: (key: keyof import("@pdfme/common").Dict | string) => string;
+            i18n: (key: string) => string;
         }, "rootElement">) => Record<string, import("@pdfme/common").PropPanelSchema>) | Record<string, import("@pdfme/common").PropPanelSchema>;
         widgets?: Record<string, (props: import("@pdfme/common").PropPanelWidgetProps) => void>;
     };
     icon: string;
-    pdf: (arg: import("@pdfme/common").PDFRenderProps<ShapeSchema>) => Promise<void> | void;
-    ui: (arg: import("@pdfme/common").UIRenderProps<ShapeSchema>) => Promise<void> | void;
+    pdf: (arg: PDFRenderProps<ShapeSchema & {
+        name: string;
+        type: string;
+        position: {
+            x: number;
+            y: number;
+        };
+        width: number;
+        height: number;
+        content?: string | undefined;
+        rotate?: number | undefined;
+        opacity?: number | undefined;
+        readOnly?: boolean | undefined;
+        required?: boolean | undefined;
+        __bodyRange?: {
+            start: number;
+            end?: number | undefined;
+        } | undefined;
+        __isSplit?: boolean | undefined;
+    } & {
+        [k: string]: unknown;
+    }>) => Promise<void> | void;
+    ui: (arg: UIRenderProps<ShapeSchema & {
+        name: string;
+        type: string;
+        position: {
+            x: number;
+            y: number;
+        };
+        width: number;
+        height: number;
+        content?: string | undefined;
+        rotate?: number | undefined;
+        opacity?: number | undefined;
+        readOnly?: boolean | undefined;
+        required?: boolean | undefined;
+        __bodyRange?: {
+            start: number;
+            end?: number | undefined;
+        } | undefined;
+        __isSplit?: boolean | undefined;
+    } & {
+        [k: string]: unknown;
+    }>) => Promise<void> | void;
     uninterruptedEditMode?: boolean;
 };
 export declare const ellipse: {
@@ -80,13 +122,55 @@ export declare const ellipse: {
             schemas: import("@pdfme/common").SchemaForUI[];
             options: import("@pdfme/common").UIOptions;
             theme: import("antd").GlobalToken;
-            i18n: (key: keyof import("@pdfme/common").Dict | string) => string;
+            i18n: (key: string) => string;
         }, "rootElement">) => Record<string, import("@pdfme/common").PropPanelSchema>) | Record<string, import("@pdfme/common").PropPanelSchema>;
         widgets?: Record<string, (props: import("@pdfme/common").PropPanelWidgetProps) => void>;
     };
     icon: string;
-    pdf: (arg: import("@pdfme/common").PDFRenderProps<ShapeSchema>) => Promise<void> | void;
-    ui: (arg: import("@pdfme/common").UIRenderProps<ShapeSchema>) => Promise<void> | void;
+    pdf: (arg: PDFRenderProps<ShapeSchema & {
+        name: string;
+        type: string;
+        position: {
+            x: number;
+            y: number;
+        };
+        width: number;
+        height: number;
+        content?: string | undefined;
+        rotate?: number | undefined;
+        opacity?: number | undefined;
+        readOnly?: boolean | undefined;
+        required?: boolean | undefined;
+        __bodyRange?: {
+            start: number;
+            end?: number | undefined;
+        } | undefined;
+        __isSplit?: boolean | undefined;
+    } & {
+        [k: string]: unknown;
+    }>) => Promise<void> | void;
+    ui: (arg: UIRenderProps<ShapeSchema & {
+        name: string;
+        type: string;
+        position: {
+            x: number;
+            y: number;
+        };
+        width: number;
+        height: number;
+        content?: string | undefined;
+        rotate?: number | undefined;
+        opacity?: number | undefined;
+        readOnly?: boolean | undefined;
+        required?: boolean | undefined;
+        __bodyRange?: {
+            start: number;
+            end?: number | undefined;
+        } | undefined;
+        __isSplit?: boolean | undefined;
+    } & {
+        [k: string]: unknown;
+    }>) => Promise<void> | void;
     uninterruptedEditMode?: boolean;
 };
 export {};

package/dist/types/src/tables/classes.d.ts

@@ -1,4 +1,5 @@
 import { Font } from '@pdfme/common';
+import type { Font as FontKitFont } from 'fontkit';
 import type { Styles, TableInput, Settings, Section, StylesProps } from './types.js';
 type ContentSettings = {
     body: Row[];
@@ -57,7 +58,7 @@ export declare class Table {
         input: TableInput;
         content: ContentSettings;
         font: Font;
-        _cache: Map<any, any>;
+        _cache: Map<string | number, FontKitFont>;
     }): Promise<Table>;
     getHeadHeight(): number;
     getBodyHeight(): number;

package/dist/types/src/tables/dynamicTemplate.d.ts

@@ -3,5 +3,5 @@ export declare const getDynamicHeightsForTable: (value: string, args: {
     schema: Schema;
     basePdf: BasePdf;
     options: CommonOptions;
-    _cache: Map<any, any>;
+    _cache: Map<string | number, unknown>;
 }) => Promise<number[]>;

package/dist/types/src/tables/tableHelper.d.ts

@@ -4,7 +4,7 @@ interface CreateTableArgs {
     schema: Schema;
     basePdf: BasePdf;
     options: CommonOptions;
-    _cache: Map<any, any>;
+    _cache: Map<string | number, unknown>;
 }
 export declare function createSingleTable(body: string[][], args: CreateTableArgs): Promise<Table>;
 export {};

package/dist/types/src/text/extraFormatter.d.ts

@@ -1,4 +1,3 @@
-import { Dict } from '@pdfme/common';
 export declare enum Formatter {
     STRIKETHROUGH = "strikethrough",
     UNDERLINE = "underline",
@@ -16,8 +15,8 @@ interface GroupButtonString {
     type: 'select';
     value: string;
 }
-export type GroupButton = GroupButtonBoolean | GroupButtonString;
-export declare function getExtraFormatterSchema(i18n: (key: keyof Dict | string) => string): {
+type GroupButton = GroupButtonBoolean | GroupButtonString;
+export declare function getExtraFormatterSchema(i18n: (key: string) => string): {
     title: string;
     widget: string;
     buttons: GroupButton[];

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

@@ -9,7 +9,7 @@ export declare const getBrowserVerticalFontAdjustments: (fontKitFont: FontKitFon
 export declare const getFontDescentInPt: (fontKitFont: FontKitFont, fontSize: number) => number;
 export declare const heightOfFontAtSize: (fontKitFont: FontKitFont, fontSize: number) => number;
 export declare const widthOfTextAtSize: (text: string, fontKitFont: FontKitFont, fontSize: number, characterSpacing: number) => number;
-export declare const getFontKitFont: (fontName: string | undefined, font: Font, _cache: Map<any, any>) => Promise<fontkit.Font>;
+export declare const getFontKitFont: (fontName: string | undefined, font: Font, _cache: Map<string | number, fontkit.Font>) => Promise<fontkit.Font>;
 /**
  * Recursively splits the line at getSplitPosition.
  * If there is some leftover, split the rest again in the same manner.

package/dist/types/src/text/uiRender.d.ts

@@ -9,6 +9,3 @@ export declare const buildStyledTextContainer: (arg: UIRenderProps<TextSchema>,
  */
 export declare const makeElementPlainTextContentEditable: (element: HTMLElement) => void;
 export declare const mapVerticalAlignToFlex: (verticalAlignmentValue: string | undefined) => "center" | "flex-end" | "flex-start";
-export declare const getBackgroundColor: (value: string, schema: {
-    backgroundColor?: string;
-}) => string;

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

@@ -29,7 +29,7 @@ export declare const getDynamicHeightsForTable: (value: string, args: {
     schema: Schema;
     basePdf: import("@pdfme/common").BasePdf;
     options: import("@pdfme/common").CommonOptions;
-    _cache: Map<any, any>;
+    _cache: Map<string | number, unknown>;
 }) => Promise<number[]>;
 export declare const addAlphaToHex: (hex: string, alphaPercentage: number) => string;
 export declare const isEditable: (mode: Mode, schema: Schema) => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pdfme/schemas",
-  "version": "5.3.11",
+  "version": "5.3.12-dev.1",
   "sideEffects": false,
   "author": "hand-dot",
   "license": "MIT",
@@ -49,7 +49,7 @@
     "build:esm": "tsc -p tsconfig.esm.json",
     "build:node": "tsc -p tsconfig.node.json",
     "clean": "rimraf dist",
-    "lint": "eslint --ext .ts src --config eslint.config.mjs --no-error-on-unmatched-pattern",
+    "lint": "eslint --ext .ts src --config eslint.config.mjs",
     "test": "jest",
     "prune": "ts-prune src",
     "prettier": "prettier --write 'src/**/*.ts'"

package/src/barcodes/constants.ts

@@ -10,6 +10,7 @@ export const BARCODE_TYPES = [
   'upca',
   'upce',
   'gs1datamatrix',
+  'pdf417',
 ] as const;
 
 export const DEFAULT_BARCODE_BG_COLOR = '#ffffff';

package/src/barcodes/helper.ts

@@ -25,76 +25,74 @@ const validateCheckDigit = (input: string, checkDigitPos: number) => {
 
   return passCheckDigit;
 };
-
 export const validateBarcodeInput = (type: BarcodeTypes, input: string) => {
   if (!input) return false;
 
   if (!BARCODE_TYPES.includes(type)) return false;
 
   if (type === 'qrcode') {
-    // 500文字以下
+    // Up to 500 characters
     return input.length < 500;
   }
   if (type === 'japanpost') {
-    // 郵便番号は数字(0-9)のみ。住所表示番号は英数字(0-9,A-Z)とハイフン(-)が使用可能です。
+    // For Japan Post: Postal codes must be digits (0-9) only.
+    // Address display numbers can use alphanumeric characters (0-9, A-Z) and hyphen (-).
     const regexp = /^(\d{7})(\d|[A-Z]|-)+$/;
-
     return regexp.test(input);
   }
   if (type === 'ean13') {
-    // 有効文字は数値(0-9)のみ。チェックデジットを含まない12桁orチェックデジットを含む13桁。
+    // For EAN-13: Valid characters are digits (0-9) only.
+    // Either 12 digits (without check digit) or 13 digits (with check digit).
     const regexp = /^\d{12}$|^\d{13}$/;
-
     return regexp.test(input) && validateCheckDigit(input, 13);
   }
   if (type === 'ean8') {
-    // 有効文字は数値(0-9)のみ。チェックデジットを含まない7桁orチェックデジットを含む8桁。
+    // For EAN-8: Valid characters are digits (0-9) only.
+    // Either 7 digits (without check digit) or 8 digits (with check digit).
     const regexp = /^\d{7}$|^\d{8}$/;
-
     return regexp.test(input) && validateCheckDigit(input, 8);
   }
   if (type === 'code39') {
-    // 有効文字は数字(0-9)。アルファベット大文字(A-Z)、記号(-.$/+%)、半角スペース。
+    // For Code39: Valid characters are digits (0-9), uppercase alphabets (A-Z),
+    // symbols (-, ., $, /, +, %), and space.
     const regexp = /^(\d|[A-Z]|\-|\.|\$|\/|\+|\%|\s)+$/;
-
     return regexp.test(input);
   }
   if (type === 'code128') {
-    // 有効文字は漢字、ひらがな、カタカナ以外。
+    // For Code128: Valid characters are all except Kanji, Hiragana, and Katakana.
     // https://qiita.com/graminume/items/2ac8dd9c32277fa9da64
     return !input.match(
       /([\u30a0-\u30ff\u3040-\u309f\u3005-\u3006\u30e0-\u9fcf]|[Ａ-Ｚａ-ｚ０-９！＂＃＄％＆＇（）＊＋，－．／：；＜＝＞？＠［＼］＾＿｀｛｜｝〜　])+/,
     );
   }
   if (type === 'nw7') {
-    // 有効文字はNW-7は数字(0-9)と記号(-.$:/+)。
-    // スタートコード／ストップコードとして、コードの始まりと終わりはアルファベット(A-D)のいずれかを使用してください。
+    // For NW-7: Valid characters are digits (0-9) and symbols (-, ., $, :, /, +).
+    // The first and last characters must be one of the alphabets A-D (start/stop codes).
     const regexp = /^[A-Da-d]([0-9\-\.\$\:\/\+])+[A-Da-d]$/;
-
     return regexp.test(input);
   }
   if (type === 'itf14') {
-    // 有効文字は数値(0-9)のみ。 チェックデジットを含まない13桁orチェックデジットを含む14桁。
+    // For ITF-14: Valid characters are digits (0-9) only.
+    // Either 13 digits (without check digit) or 14 digits (with check digit).
     const regexp = /^\d{13}$|^\d{14}$/;
-
     return regexp.test(input) && validateCheckDigit(input, 14);
   }
   if (type === 'upca') {
-    // 有効文字は数値(0-9)のみ。 チェックデジットを含まない11桁orチェックデジットを含む12桁。
+    // For UPCA: Valid characters are digits (0-9) only.
+    // Either 11 digits (without check digit) or 12 digits (with check digit).
     const regexp = /^\d{11}$|^\d{12}$/;
-
     return regexp.test(input) && validateCheckDigit(input, 12);
   }
   if (type === 'upce') {
-    // 有効文字は数値(0-9)のみ。 1桁目に指定できる数字(ナンバーシステムキャラクタ)は0のみ。
-    // チェックデジットを含まない7桁orチェックデジットを含む8桁。
+    // For UPCE: Valid characters are digits (0-9) only.
+    // The first digit (number system character) must be 0.
+    // Either 7 digits (without check digit) or 8 digits (with check digit).
     const regexp = /^0(\d{6}$|\d{7}$)/;
-
     return regexp.test(input) && validateCheckDigit(input, 8);
   }
   if (type === 'gs1datamatrix') {
     let ret = false;
-    // find the GTIN application identifier, regex for "(01)" and the digits after it until another "("
+    // Find the GTIN application identifier: regex for "(01)" and the digits following it until another "(".
     const regexp = /\((01)\)(\d*)(\(|$)/;
     let res = input.match(regexp);
     if (
@@ -106,9 +104,13 @@ export const validateBarcodeInput = (type: BarcodeTypes, input: string) => {
       let gtin = res[2];
       ret = validateCheckDigit(gtin, gtin.length);
     }
-
     return ret;
   }
+  if (type === 'pdf417') {
+    // PDF417 can encode a wide range of characters,
+    // but considering performance and library limitations, the maximum number of characters is limited (up to 1000 characters here).
+    return input.length > 0 && input.length <= 1000;
+  }
 
   return false;
 };
@@ -166,12 +168,19 @@ export const createBarCode = async (arg: {
 
   if (typeof window !== 'undefined') {
     const canvas = document.createElement('canvas');
-    // @ts-ignore
-    bwipjs.toCanvas(canvas, bwipjsArg);
+    // Use a type assertion to safely call toCanvas
+    const bwipjsModule = bwipjs as unknown as {
+      toCanvas(canvas: HTMLCanvasElement, options: RenderOptions): void;
+    };
+    bwipjsModule.toCanvas(canvas, bwipjsArg);
     const dataUrl = canvas.toDataURL('image/png');
     res = Buffer.from(b64toUint8Array(dataUrl).buffer);
   } else {
-    res = await bwipjs.toBuffer(bwipjsArg);
+    // Use a type assertion to safely call toBuffer
+    const bwipjsModule = bwipjs as unknown as {
+      toBuffer(options: RenderOptions): Promise<Buffer>;
+    };
+    res = await bwipjsModule.toBuffer(bwipjsArg);
   }
 
   return res;

package/src/barcodes/pdfRender.ts

@@ -2,6 +2,7 @@ import { PDFRenderProps } from '@pdfme/common';
 import { convertForPdfLayoutProps } from '../utils.js';
 import type { BarcodeSchema } from './types.js';
 import { createBarCode, validateBarcodeInput } from './helper.js';
+import { PDFImage } from '@pdfme/pdf-lib';
 
 const getBarcodeCacheKey = (schema: BarcodeSchema, value: string) => {
   return `${schema.type}${schema.backgroundColor}${schema.barColor}${schema.textColor}${value}${schema.includetext}`;
@@ -12,11 +13,13 @@ export const pdfRender = async (arg: PDFRenderProps<BarcodeSchema>) => {
   if (!validateBarcodeInput(schema.type, value)) return;
 
   const inputBarcodeCacheKey = getBarcodeCacheKey(schema, value);
-  let image = _cache.get(inputBarcodeCacheKey);
+  let image = _cache.get(inputBarcodeCacheKey) as PDFImage | undefined;
   if (!image) {
-    const imageBuf = await createBarCode(
-      Object.assign(schema, { type: schema.type, input: value }),
-    );
+    const imageBuf = await createBarCode({
+      ...schema,
+      type: schema.type,
+      input: value,
+    });
     image = await pdfDoc.embedPng(imageBuf);
     _cache.set(inputBarcodeCacheKey, image);
   }

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/barcodes/uiRender.ts

@@ -69,10 +69,10 @@ export const uiRender = async (arg: UIRenderProps<BarcodeSchema>) => {
     input.placeholder = placeholder || '';
     input.tabIndex = tabIndex || 0;
     input.addEventListener('change', (e: Event) => {
-      onChange && onChange({ key: 'content', value: (e.target as HTMLInputElement).value });
+      if (onChange) onChange({ key: 'content', value: (e.target as HTMLInputElement).value });
     });
     input.addEventListener('blur', () => {
-      stopEditing && stopEditing();
+      if (stopEditing) stopEditing();
     });
     container.appendChild(input);
     input.setSelectionRange(value.length, value.length);
@@ -88,7 +88,7 @@ export const uiRender = async (arg: UIRenderProps<BarcodeSchema>) => {
     const imgElm = await createBarcodeImageElm(schema, value);
     container.appendChild(imgElm);
   } catch (err) {
-    console.error(`[@pdfme/ui] ${err}`);
+    console.error(`[@pdfme/ui] ${String(err)}`);
     container.appendChild(createErrorElm());
   }
 };

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%';
@@ -27,7 +26,7 @@ const schema: Plugin<Checkbox> = {
 
     if (isEditable(mode, schema)) {
       container.addEventListener('click', () => {
-        onChange && onChange({ key: 'content', value: value === 'true' ? 'false' : 'true' });
+        if (onChange) onChange({ key: 'content', value: value === 'true' ? 'false' : 'true' });
       });
     }
 
@@ -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);
@@ -318,12 +325,12 @@ export const getPlugin = ({ type, icon }: { type: PickerType; icon: string }) =>
         const fallbackFontName = getFallbackFontName(font);
 
         const locale = getAirDatepickerLocale(
-          (activeSchema as any).locale || options.lang || defaultLocale,
+          (activeSchema as { locale?: string }).locale || options.lang || defaultLocale,
         );
 
         if (
-          (activeSchema as any).locale === undefined &&
-          (activeSchema as any).locale !== options.lang
+          (activeSchema as { locale?: string }).locale === undefined &&
+          (activeSchema as { locale?: string }).locale !== options.lang
         ) {
           changeSchemas([
             { schemaId: activeSchema.id, key: 'locale', value: options.lang },
@@ -336,13 +343,13 @@ export const getPlugin = ({ type, icon }: { type: PickerType; icon: string }) =>
           (button) => button.key === Formatter.ALIGNMENT,
         );
 
-        const validateDateTimeFormat = (_rule: any, formatString: string): boolean => {
+        const validateDateTimeFormat = (_rule: unknown, formatString: string): boolean => {
           try {
             format('Thu Jan 01 1970 00:00:00 GMT+0000', formatString, {
               locale: locale.formatLocale,
             });
             return true;
-          } catch (_err) {
+          } catch {
             return false;
           }
         };

package/src/graphics/image.ts

@@ -20,7 +20,7 @@ const fullSize = { width: '100%', height: '100%' };
 const defaultValue =
   'data:image/png;base64,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';
 
-export interface ImageSchema extends Schema {}
+type ImageSchema = Schema;
 
 const imageSchema: Plugin<ImageSchema> = {
   pdf: async (arg: PDFRenderProps<ImageSchema>) => {
@@ -131,7 +131,7 @@ const imageSchema: Plugin<ImageSchema> = {
       };
       Object.assign(button.style, buttonStyle);
       button.addEventListener('click', () => {
-        onChange && onChange({ key: 'content', value: '' });
+        if (onChange) onChange({ key: 'content', value: '' });
       });
       container.appendChild(button);
     }
@@ -168,13 +168,15 @@ const imageSchema: Plugin<ImageSchema> = {
         const changeEvent = event as unknown as ChangeEvent<HTMLInputElement>;
         readFile(changeEvent.target.files)
           .then((result) => {
-            onChange && onChange({ key: 'content', value: result as string });
+            if (onChange) onChange({ key: 'content', value: result as string });
           })
           .catch((error) => {
             console.error('Error reading file:', error);
           });
       });
-      input.addEventListener('blur', () => 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,
@@ -31,7 +31,7 @@ const isValidSVG = (svgString: string): boolean => {
     }
 
     return true;
-  } catch (error) {
+  } catch {
     return false;
   }
 };
@@ -42,10 +42,10 @@ const defaultValue = `<svg viewBox="0 0 488 600" version="1.1" xmlns="http://www
     </g>
 </svg>`;
 
-interface SVGSchema extends Schema {}
+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%';
@@ -73,7 +73,7 @@ const svgSchema: Plugin<SVGSchema> = {
 
       textarea.addEventListener('change', (e: Event) => {
         const newValue = (e.target as HTMLTextAreaElement).value;
-        onChange && onChange({ key: 'content', value: newValue });
+        if (onChange) onChange({ key: 'content', value: newValue });
       });
       rootElement.appendChild(container);
       textarea.setSelectionRange(value.length, value.length);
@@ -93,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) || {} : variablesIn;
+      typeof variablesIn === 'string'
+        ? (JSON.parse(variablesIn || '{}') as Record<string, string>)
+        : variablesIn;
 
     Object.keys(variables).forEach((variableName) => {
       // handle special characters in variable name
@@ -29,14 +31,14 @@ export const substituteVariables = (
 };
 
 export const validateVariables = (value: string, schema: MultiVariableTextSchema): boolean => {
-  if (schema.variables.length == 0) {
+  if (schema.variables.length === 0) {
     return true;
   }
 
   let values;
   try {
-    values = value ? JSON.parse(value) : {};
-  } catch (e) {
+    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}`,
     );