@pdfme/schemas 3.1.5 → 3.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (132) hide show
  1. package/README.md +303 -0
  2. package/dist/cjs/__tests__/{renderUtils.test.js → utils.test.js} +38 -12
  3. package/dist/cjs/__tests__/utils.test.js.map +1 -0
  4. package/dist/cjs/src/barcodes/index.js +2 -2
  5. package/dist/cjs/src/barcodes/index.js.map +1 -1
  6. package/dist/cjs/src/barcodes/pdfRender.js +2 -2
  7. package/dist/cjs/src/barcodes/pdfRender.js.map +1 -1
  8. package/dist/cjs/src/barcodes/propPanel.js +28 -30
  9. package/dist/cjs/src/barcodes/propPanel.js.map +1 -1
  10. package/dist/cjs/src/barcodes/uiRender.js +11 -37
  11. package/dist/cjs/src/barcodes/uiRender.js.map +1 -1
  12. package/dist/cjs/src/graphics/helper.js +115 -0
  13. package/dist/cjs/src/graphics/helper.js.map +1 -0
  14. package/dist/cjs/src/graphics/image.js +179 -0
  15. package/dist/cjs/src/graphics/image.js.map +1 -0
  16. package/dist/cjs/src/graphics/svg.js +96 -0
  17. package/dist/cjs/src/graphics/svg.js.map +1 -0
  18. package/dist/cjs/src/index.js +42 -9
  19. package/dist/cjs/src/index.js.map +1 -1
  20. package/dist/cjs/src/shapes/line.js +57 -0
  21. package/dist/cjs/src/shapes/line.js.map +1 -0
  22. package/dist/cjs/src/shapes/rectAndEllipse.js +100 -0
  23. package/dist/cjs/src/shapes/rectAndEllipse.js.map +1 -0
  24. package/dist/cjs/src/text/helper.js.map +1 -1
  25. package/dist/cjs/src/text/index.js +16 -2
  26. package/dist/cjs/src/text/index.js.map +1 -1
  27. package/dist/cjs/src/text/pdfRender.js +9 -32
  28. package/dist/cjs/src/text/pdfRender.js.map +1 -1
  29. package/dist/cjs/src/text/propPanel.js +2 -2
  30. package/dist/cjs/src/text/propPanel.js.map +1 -1
  31. package/dist/cjs/src/text/uiRender.js +12 -18
  32. package/dist/cjs/src/text/uiRender.js.map +1 -1
  33. package/dist/cjs/src/utils.js +134 -0
  34. package/dist/cjs/src/utils.js.map +1 -0
  35. package/dist/esm/__tests__/{renderUtils.test.js → utils.test.js} +34 -8
  36. package/dist/esm/__tests__/utils.test.js.map +1 -0
  37. package/dist/esm/src/barcodes/index.js +2 -2
  38. package/dist/esm/src/barcodes/index.js.map +1 -1
  39. package/dist/esm/src/barcodes/pdfRender.js +1 -1
  40. package/dist/esm/src/barcodes/pdfRender.js.map +1 -1
  41. package/dist/esm/src/barcodes/propPanel.js +28 -30
  42. package/dist/esm/src/barcodes/propPanel.js.map +1 -1
  43. package/dist/esm/src/barcodes/uiRender.js +11 -37
  44. package/dist/esm/src/barcodes/uiRender.js.map +1 -1
  45. package/dist/esm/src/graphics/helper.js +111 -0
  46. package/dist/esm/src/graphics/helper.js.map +1 -0
  47. package/dist/esm/src/graphics/image.js +176 -0
  48. package/dist/esm/src/graphics/image.js.map +1 -0
  49. package/dist/esm/src/graphics/svg.js +93 -0
  50. package/dist/esm/src/graphics/svg.js.map +1 -0
  51. package/dist/esm/src/index.js +7 -4
  52. package/dist/esm/src/index.js.map +1 -1
  53. package/dist/esm/src/shapes/line.js +55 -0
  54. package/dist/esm/src/shapes/line.js.map +1 -0
  55. package/dist/esm/src/shapes/rectAndEllipse.js +97 -0
  56. package/dist/esm/src/shapes/rectAndEllipse.js.map +1 -0
  57. package/dist/esm/src/text/helper.js.map +1 -1
  58. package/dist/esm/src/text/index.js +15 -2
  59. package/dist/esm/src/text/index.js.map +1 -1
  60. package/dist/esm/src/text/pdfRender.js +6 -29
  61. package/dist/esm/src/text/pdfRender.js.map +1 -1
  62. package/dist/esm/src/text/propPanel.js +2 -2
  63. package/dist/esm/src/text/propPanel.js.map +1 -1
  64. package/dist/esm/src/text/uiRender.js +12 -18
  65. package/dist/esm/src/text/uiRender.js.map +1 -1
  66. package/dist/esm/src/utils.js +124 -0
  67. package/dist/esm/src/utils.js.map +1 -0
  68. package/dist/types/src/barcodes/index.d.ts +2 -2
  69. package/dist/types/src/graphics/helper.d.ts +5 -0
  70. package/dist/types/src/graphics/image.d.ts +7 -0
  71. package/dist/types/src/graphics/svg.d.ts +6 -0
  72. package/dist/types/src/index.d.ts +7 -4
  73. package/dist/types/src/shapes/line.d.ts +6 -0
  74. package/dist/types/src/shapes/rectAndEllipse.d.ts +144 -0
  75. package/dist/types/src/text/index.d.ts +3 -2
  76. package/dist/types/src/text/pdfRender.d.ts +1 -1
  77. package/dist/types/src/{renderUtils.d.ts → utils.d.ts} +5 -1
  78. package/package.json +4 -3
  79. package/src/barcodes/index.ts +2 -2
  80. package/src/barcodes/pdfRender.ts +1 -1
  81. package/src/barcodes/propPanel.ts +28 -30
  82. package/src/barcodes/uiRender.ts +11 -41
  83. package/src/graphics/helper.ts +147 -0
  84. package/src/graphics/image.ts +207 -0
  85. package/src/graphics/svg.ts +98 -0
  86. package/src/index.ts +21 -4
  87. package/src/shapes/line.ts +67 -0
  88. package/src/shapes/rectAndEllipse.ts +110 -0
  89. package/src/text/helper.ts +0 -1
  90. package/src/text/index.ts +16 -2
  91. package/src/text/pdfRender.ts +6 -42
  92. package/src/text/propPanel.ts +2 -2
  93. package/src/text/uiRender.ts +14 -29
  94. package/src/utils.ts +161 -0
  95. package/dist/cjs/__tests__/renderUtils.test.js.map +0 -1
  96. package/dist/cjs/src/image/index.js +0 -8
  97. package/dist/cjs/src/image/index.js.map +0 -1
  98. package/dist/cjs/src/image/pdfRender.js +0 -20
  99. package/dist/cjs/src/image/pdfRender.js.map +0 -1
  100. package/dist/cjs/src/image/propPanel.js +0 -19
  101. package/dist/cjs/src/image/propPanel.js.map +0 -1
  102. package/dist/cjs/src/image/types.js +0 -3
  103. package/dist/cjs/src/image/types.js.map +0 -1
  104. package/dist/cjs/src/image/uiRender.js +0 -111
  105. package/dist/cjs/src/image/uiRender.js.map +0 -1
  106. package/dist/cjs/src/renderUtils.js +0 -59
  107. package/dist/cjs/src/renderUtils.js.map +0 -1
  108. package/dist/esm/__tests__/renderUtils.test.js.map +0 -1
  109. package/dist/esm/src/image/index.js +0 -6
  110. package/dist/esm/src/image/index.js.map +0 -1
  111. package/dist/esm/src/image/pdfRender.js +0 -16
  112. package/dist/esm/src/image/pdfRender.js.map +0 -1
  113. package/dist/esm/src/image/propPanel.js +0 -16
  114. package/dist/esm/src/image/propPanel.js.map +0 -1
  115. package/dist/esm/src/image/types.js +0 -2
  116. package/dist/esm/src/image/types.js.map +0 -1
  117. package/dist/esm/src/image/uiRender.js +0 -107
  118. package/dist/esm/src/image/uiRender.js.map +0 -1
  119. package/dist/esm/src/renderUtils.js +0 -53
  120. package/dist/esm/src/renderUtils.js.map +0 -1
  121. package/dist/types/src/image/index.d.ts +0 -4
  122. package/dist/types/src/image/pdfRender.d.ts +0 -3
  123. package/dist/types/src/image/propPanel.d.ts +0 -3
  124. package/dist/types/src/image/types.d.ts +0 -3
  125. package/dist/types/src/image/uiRender.d.ts +0 -3
  126. package/src/image/index.ts +0 -8
  127. package/src/image/pdfRender.ts +0 -28
  128. package/src/image/propPanel.ts +0 -19
  129. package/src/image/types.ts +0 -3
  130. package/src/image/uiRender.ts +0 -121
  131. package/src/renderUtils.ts +0 -73
  132. /package/dist/types/__tests__/{renderUtils.test.d.ts → utils.test.d.ts} +0 -0
package/src/text/index.ts CHANGED
@@ -4,6 +4,20 @@ import { propPanel } from './propPanel.js';
4
4
  import { uiRender } from './uiRender.js';
5
5
  import type { TextSchema } from './types';
6
6
 
7
- const schema: Plugin<TextSchema> = { pdf: pdfRender, ui: uiRender, propPanel };
7
+ const textSchema: Plugin<TextSchema> = { pdf: pdfRender, ui: uiRender, propPanel };
8
8
 
9
- export default schema;
9
+ export default textSchema;
10
+
11
+ export const readOnlyText: Plugin<TextSchema> = {
12
+ pdf: textSchema.pdf,
13
+ ui: textSchema.ui,
14
+ propPanel: {
15
+ ...textSchema.propPanel,
16
+ defaultSchema: {
17
+ ...textSchema.propPanel.defaultSchema,
18
+ type: 'readOnlyText',
19
+ readOnly: true,
20
+ readOnlyValue: textSchema.propPanel.defaultValue,
21
+ },
22
+ },
23
+ };
@@ -1,13 +1,6 @@
1
- import { PDFFont, PDFDocument, rgb } from '@pdfme/pdf-lib';
2
- import {
3
- PDFRenderProps,
4
- Font,
5
- getDefaultFont,
6
- getFallbackFontName,
7
- mm2pt,
8
- isHexValid,
9
- } from '@pdfme/common';
1
+ import { PDFFont, PDFDocument } from '@pdfme/pdf-lib';
10
2
  import type { TextSchema, FontWidthCalcValues } from './types';
3
+ import { PDFRenderProps, Font, getDefaultFont, getFallbackFontName, mm2pt } from '@pdfme/common';
11
4
  import {
12
5
  VERTICAL_ALIGN_TOP,
13
6
  VERTICAL_ALIGN_MIDDLE,
@@ -27,37 +20,7 @@ import {
27
20
  getSplittedLines,
28
21
  widthOfTextAtSize,
29
22
  } from './helper.js';
30
- import { convertForPdfLayoutProps, rotatePoint } from '../renderUtils.js';
31
-
32
- const hex2rgb = (hex: string) => {
33
- if (hex.slice(0, 1) === '#') hex = hex.slice(1);
34
- if (hex.length === 3)
35
- hex =
36
- hex.slice(0, 1) +
37
- hex.slice(0, 1) +
38
- hex.slice(1, 2) +
39
- hex.slice(1, 2) +
40
- hex.slice(2, 3) +
41
- hex.slice(2, 3);
42
-
43
- return [hex.slice(0, 2), hex.slice(2, 4), hex.slice(4, 6)].map((str) => parseInt(str, 16));
44
- };
45
-
46
- const hex2RgbColor = (hexString: string | undefined) => {
47
- if (hexString) {
48
- const isValid = isHexValid(hexString);
49
-
50
- if (!isValid) {
51
- throw new Error(`Invalid hex color value ${hexString}`);
52
- }
53
-
54
- const [r, g, b] = hex2rgb(hexString);
55
-
56
- return rgb(r / 255, g / 255, b / 255);
57
- }
58
-
59
- return undefined;
60
- };
23
+ import { convertForPdfLayoutProps, rotatePoint, hex2RgbColor } from '../utils.js';
61
24
 
62
25
  const embedAndGetFontObj = async (arg: {
63
26
  pdfDoc: PDFDocument;
@@ -118,6 +81,7 @@ const getFontProp = async ({
118
81
 
119
82
  export const pdfRender = async (arg: PDFRenderProps<TextSchema>) => {
120
83
  const { value, pdfDoc, pdfLib, page, options, schema, _cache } = arg;
84
+ if (!value) return;
121
85
 
122
86
  const { font = getDefaultFont() } = options;
123
87
 
@@ -132,7 +96,7 @@ export const pdfRender = async (arg: PDFRenderProps<TextSchema>) => {
132
96
  const fontName = (
133
97
  schema.fontName ? schema.fontName : getFallbackFontName(font)
134
98
  ) as keyof typeof pdfFontObj;
135
- const pdfFontValue = pdfFontObj[fontName];
99
+ const pdfFontValue = pdfFontObj && pdfFontObj[fontName];
136
100
 
137
101
  const pageHeight = page.getHeight();
138
102
  const {
@@ -162,7 +126,7 @@ export const pdfRender = async (arg: PDFRenderProps<TextSchema>) => {
162
126
  };
163
127
 
164
128
  let lines: string[] = [];
165
- value.split(/\r|\n|\r\n/g).forEach((line: string) => {
129
+ value.split(/\r\n|\r|\n/g).forEach((line: string) => {
166
130
  lines = lines.concat(getSplittedLines(line, fontWidthCalcValues));
167
131
  });
168
132
 
@@ -153,7 +153,7 @@ export const propPanel: PropPanel<TextSchema> = {
153
153
  rules: [
154
154
  {
155
155
  pattern: HEX_COLOR_PATTERN,
156
- message: 'Please enter a valid hex color code.',
156
+ message: i18n('hexColorPrompt'),
157
157
  },
158
158
  ],
159
159
  },
@@ -164,7 +164,7 @@ export const propPanel: PropPanel<TextSchema> = {
164
164
  rules: [
165
165
  {
166
166
  pattern: HEX_COLOR_PATTERN,
167
- message: 'Please enter a valid hex color code.',
167
+ message: i18n('hexColorPrompt'),
168
168
  },
169
169
  ],
170
170
  },
@@ -18,8 +18,7 @@ import {
18
18
  getFontKitFont,
19
19
  getBrowserVerticalFontAdjustments,
20
20
  } from './helper.js';
21
- import { addAlphaToHex } from '../renderUtils.js';
22
- import { DEFAULT_OPACITY } from '../constants.js';
21
+ import { addAlphaToHex, isEditable } from '../utils.js';
23
22
 
24
23
  const mapVerticalAlignToFlex = (verticalAlignmentValue: string | undefined) => {
25
24
  switch (verticalAlignmentValue) {
@@ -33,19 +32,10 @@ const mapVerticalAlignToFlex = (verticalAlignmentValue: string | undefined) => {
33
32
  return 'flex-start';
34
33
  };
35
34
 
36
- const getBackgroundColor = (
37
- mode: 'form' | 'viewer' | 'designer',
38
- value: string,
39
- schema: Schema,
40
- defaultBackgroundColor: string
41
- ) => {
42
- if ((mode === 'form' || mode === 'designer') && value && schema.backgroundColor) {
43
- return schema.backgroundColor as string;
44
- } else if (mode === 'viewer') {
45
- return (schema.backgroundColor as string) ?? 'transparent';
46
- } else {
47
- return defaultBackgroundColor;
48
- }
35
+ const getBackgroundColor = (value: string, schema: Schema, defaultBackgroundColor: string) => {
36
+ if (!value) return 'transparent';
37
+ if (schema.backgroundColor) return schema.backgroundColor as string;
38
+ return defaultBackgroundColor;
49
39
  };
50
40
 
51
41
  export const uiRender = async (arg: UIRenderProps<TextSchema>) => {
@@ -94,19 +84,13 @@ export const uiRender = async (arg: UIRenderProps<TextSchema>) => {
94
84
  const containerStyle: CSS.Properties = {
95
85
  padding: 0,
96
86
  resize: 'none',
97
- backgroundColor: getBackgroundColor(
98
- mode,
99
- value,
100
- schema,
101
- addAlphaToHex(theme.colorPrimaryBg, 30)
102
- ),
87
+ backgroundColor: getBackgroundColor(value, schema, addAlphaToHex(theme.colorPrimaryBg, 30)),
103
88
  border: 'none',
104
89
  display: 'flex',
105
90
  flexDirection: 'column',
106
91
  justifyContent: mapVerticalAlignToFlex(schema.verticalAlignment),
107
92
  width: '100%',
108
93
  height: '100%',
109
- opacity: schema.opacity ?? DEFAULT_OPACITY,
110
94
  };
111
95
  Object.assign(container.style, containerStyle);
112
96
  rootElement.innerHTML = '';
@@ -126,14 +110,14 @@ export const uiRender = async (arg: UIRenderProps<TextSchema>) => {
126
110
  resize: 'none',
127
111
  border: 'none',
128
112
  outline: 'none',
129
- marginBottom: bottomAdjustment + 'px',
130
- paddingTop: topAdjustment + 'px',
113
+ marginBottom: `${bottomAdjustment}px`,
114
+ paddingTop: `${topAdjustment}px`,
131
115
  backgroundColor: 'transparent',
132
116
  };
133
117
  const textBlock = document.createElement('div');
134
118
  Object.assign(textBlock.style, textBlockStyle);
135
119
 
136
- if (mode === 'form' || mode === 'designer') {
120
+ if (isEditable(mode, schema)) {
137
121
  textBlock.contentEditable = 'plaintext-only';
138
122
  textBlock.tabIndex = tabIndex || 0;
139
123
  textBlock.innerText = value;
@@ -150,14 +134,15 @@ export const uiRender = async (arg: UIRenderProps<TextSchema>) => {
150
134
  dynamicFontSize = await calculateDynamicFontSize(getCdfArg(textBlock.textContent));
151
135
  textBlock.style.fontSize = `${dynamicFontSize}pt`;
152
136
 
153
- const { topAdj: newTopAdj, bottomAdj: newBottomAdj } = getBrowserVerticalFontAdjustments(
137
+ const { topAdj: newTopAdj, bottomAdj: newBottomAdj } =
138
+ getBrowserVerticalFontAdjustments(
154
139
  fontKitFont,
155
140
  dynamicFontSize ?? schema.fontSize ?? DEFAULT_FONT_SIZE,
156
141
  schema.lineHeight ?? DEFAULT_LINE_HEIGHT,
157
142
  schema.verticalAlignment ?? DEFAULT_VERTICAL_ALIGNMENT
158
- );
159
- textBlock.style.paddingTop = newTopAdj.toString() + 'px';
160
- textBlock.style.marginBottom = newBottomAdj.toString() + 'px';
143
+ );
144
+ textBlock.style.paddingTop = `${newTopAdj}px`;
145
+ textBlock.style.marginBottom = `${newBottomAdj}px`;
161
146
  })();
162
147
  }, 0);
163
148
  });
package/src/utils.ts ADDED
@@ -0,0 +1,161 @@
1
+ import type * as CSS from 'csstype';
2
+ import { degrees, degreesToRadians, rgb } from '@pdfme/pdf-lib';
3
+ import { Schema, mm2pt, Mode, isHexValid } from '@pdfme/common';
4
+
5
+ export const convertForPdfLayoutProps = ({
6
+ schema,
7
+ pageHeight,
8
+ applyRotateTranslate = true,
9
+ }: {
10
+ schema: Schema;
11
+ pageHeight: number;
12
+ applyRotateTranslate?: boolean;
13
+ }) => {
14
+ const { width: mmWidth, height: mmHeight, position, rotate, opacity } = schema;
15
+ const { x: mmX, y: mmY } = position;
16
+
17
+ const rotateDegrees = rotate ? -rotate : 0;
18
+ const width = mm2pt(mmWidth);
19
+ const height = mm2pt(mmHeight);
20
+ let x = mm2pt(mmX);
21
+ // PDF coordinate system is from bottom left, UI is top left, so we need to flip the y axis
22
+ let y = pageHeight - mm2pt(mmY) - height;
23
+
24
+ if (rotateDegrees && applyRotateTranslate) {
25
+ // If rotating we must pivot around the same point as the UI performs its rotation.
26
+ // The UI performs rotation around the objects center point (the pivot point below),
27
+ // pdflib rotates around the bottom left corner of the object.
28
+ // We must therefore adjust the X and Y by rotating the bottom left corner by this pivot point.
29
+ const pivotPoint = { x: x + width / 2, y: pageHeight - mm2pt(mmY) - height / 2 };
30
+ const rotatedPoint = rotatePoint({ x, y }, pivotPoint, rotateDegrees);
31
+ x = rotatedPoint.x;
32
+ y = rotatedPoint.y;
33
+ }
34
+
35
+ return {
36
+ position: { x, y },
37
+ height: height,
38
+ width: width,
39
+ rotate: degrees(rotateDegrees),
40
+ opacity,
41
+ };
42
+ };
43
+
44
+ export const rotatePoint = (
45
+ point: { x: number; y: number },
46
+ pivot: { x: number; y: number },
47
+ angleDegrees: number
48
+ ): { x: number; y: number } => {
49
+ const angleRadians = degreesToRadians(angleDegrees);
50
+
51
+ const x =
52
+ Math.cos(angleRadians) * (point.x - pivot.x) -
53
+ Math.sin(angleRadians) * (point.y - pivot.y) +
54
+ pivot.x;
55
+ const y =
56
+ Math.sin(angleRadians) * (point.x - pivot.x) +
57
+ Math.cos(angleRadians) * (point.y - pivot.y) +
58
+ pivot.y;
59
+
60
+ return { x, y };
61
+ };
62
+
63
+ export const addAlphaToHex = (hex: string, alphaPercentage: number) => {
64
+ if (!/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/i.test(hex)) {
65
+ throw new Error('Invalid HEX color code');
66
+ }
67
+ const alphaValue = Math.round((alphaPercentage / 100) * 255);
68
+ let alphaHex = alphaValue.toString(16);
69
+ if (alphaHex.length === 1) alphaHex = '0' + alphaHex;
70
+ return hex + alphaHex;
71
+ };
72
+
73
+ export const isEditable = (mode: Mode, schema: Schema) =>
74
+ mode === 'designer' || (mode === 'form' && schema.readOnly !== true);
75
+
76
+ const hex2rgb = (hex: string) => {
77
+ if (hex.slice(0, 1) === '#') hex = hex.slice(1);
78
+ if (hex.length === 3)
79
+ hex =
80
+ hex.slice(0, 1) +
81
+ hex.slice(0, 1) +
82
+ hex.slice(1, 2) +
83
+ hex.slice(1, 2) +
84
+ hex.slice(2, 3) +
85
+ hex.slice(2, 3);
86
+
87
+ return [hex.slice(0, 2), hex.slice(2, 4), hex.slice(4, 6)].map((str) => parseInt(str, 16));
88
+ };
89
+
90
+ export const hex2RgbColor = (hexString: string | undefined) => {
91
+ if (hexString) {
92
+ const isValid = isHexValid(hexString);
93
+
94
+ if (!isValid) {
95
+ throw new Error(`Invalid hex color value ${hexString}`);
96
+ }
97
+
98
+ const [r, g, b] = hex2rgb(hexString);
99
+
100
+ return rgb(r / 255, g / 255, b / 255);
101
+ }
102
+
103
+ return undefined;
104
+ };
105
+
106
+ export const readFile = (input: File | FileList | null): Promise<string | ArrayBuffer> =>
107
+ new Promise((resolve, reject) => {
108
+ const fileReader = new FileReader();
109
+
110
+ fileReader.onload = (e) => {
111
+ if (e.target?.result) {
112
+ resolve(e.target.result);
113
+ }
114
+ };
115
+
116
+ fileReader.onerror = (e) => {
117
+ reject(new Error('[@pdfme/schemas] File reading failed'));
118
+ };
119
+
120
+ let file: File | null = null;
121
+ if (input instanceof FileList && input.length > 0) {
122
+ file = input[0];
123
+ } else if (input instanceof File) {
124
+ file = input;
125
+ }
126
+
127
+ if (file) {
128
+ fileReader.readAsDataURL(file);
129
+ } else {
130
+ reject(new Error('[@pdfme/schemas] No files provided'));
131
+ }
132
+ });
133
+
134
+ export const createErrorElm = () => {
135
+ const container = document.createElement('div');
136
+ const containerStyle: CSS.Properties = {
137
+ display: 'flex',
138
+ alignItems: 'center',
139
+ justifyContent: 'center',
140
+ width: '100%',
141
+ height: '100%',
142
+ };
143
+ Object.assign(container.style, containerStyle);
144
+
145
+ const span = document.createElement('span');
146
+ const spanStyle: CSS.Properties = {
147
+ color: 'white',
148
+ background: 'red',
149
+ padding: '0.25rem',
150
+ fontSize: '12pt',
151
+ fontWeight: 'bold',
152
+ borderRadius: '2px',
153
+ fontFamily: "'Open Sans', sans-serif",
154
+ };
155
+ Object.assign(span.style, spanStyle);
156
+
157
+ span.textContent = 'ERROR';
158
+ container.appendChild(span);
159
+
160
+ return container;
161
+ };
@@ -1 +0,0 @@
1
- {"version":3,"file":"renderUtils.test.js","sourceRoot":"","sources":["../../../__tests__/renderUtils.test.ts"],"names":[],"mappings":"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"}
@@ -1,8 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- const pdfRender_js_1 = require("./pdfRender.js");
4
- const propPanel_js_1 = require("./propPanel.js");
5
- const uiRender_js_1 = require("./uiRender.js");
6
- const schema = { pdf: pdfRender_js_1.pdfRender, ui: uiRender_js_1.uiRender, propPanel: propPanel_js_1.propPanel };
7
- exports.default = schema;
8
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/image/index.ts"],"names":[],"mappings":";;AACA,iDAA2C;AAC3C,iDAA2C;AAC3C,+CAAyC;AAGzC,MAAM,MAAM,GAAwB,EAAE,GAAG,EAAE,wBAAS,EAAE,EAAE,EAAE,sBAAQ,EAAE,SAAS,EAAT,wBAAS,EAAE,CAAC;AAChF,kBAAe,MAAM,CAAC"}
@@ -1,20 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.pdfRender = void 0;
4
- const renderUtils_js_1 = require("../renderUtils.js");
5
- const getCacheKey = (schema, input) => `${schema.type}${input}`;
6
- const pdfRender = async (arg) => {
7
- const { value, schema, pdfDoc, page, _cache } = arg;
8
- const inputImageCacheKey = getCacheKey(schema, value);
9
- let image = _cache.get(inputImageCacheKey);
10
- if (!image) {
11
- const isPng = value.startsWith('data:image/png;');
12
- image = await (isPng ? pdfDoc.embedPng(value) : pdfDoc.embedJpg(value));
13
- _cache.set(inputImageCacheKey, image);
14
- }
15
- const pageHeight = page.getHeight();
16
- const { width, height, rotate, position: { x, y }, opacity, } = (0, renderUtils_js_1.convertForPdfLayoutProps)({ schema, pageHeight });
17
- page.drawImage(image, { x, y, rotate, width, height, opacity });
18
- };
19
- exports.pdfRender = pdfRender;
20
- //# sourceMappingURL=pdfRender.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"pdfRender.js","sourceRoot":"","sources":["../../../../src/image/pdfRender.ts"],"names":[],"mappings":";;;AAEA,sDAA6D;AAE7D,MAAM,WAAW,GAAG,CAAC,MAAc,EAAE,KAAa,EAAE,EAAE,CAAC,GAAG,MAAM,CAAC,IAAI,GAAG,KAAK,EAAE,CAAC;AAEzE,MAAM,SAAS,GAAG,KAAK,EAAE,GAAgC,EAAE,EAAE;IAClE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,GAAG,CAAC;IAEpD,MAAM,kBAAkB,GAAG,WAAW,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IACtD,IAAI,KAAK,GAAG,MAAM,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;IAC3C,IAAI,CAAC,KAAK,EAAE;QACV,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC;QAClD,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;QACxE,MAAM,CAAC,GAAG,CAAC,kBAAkB,EAAE,KAAK,CAAC,CAAC;KACvC;IAED,MAAM,UAAU,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;IACpC,MAAM,EACJ,KAAK,EACL,MAAM,EACN,MAAM,EACN,QAAQ,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EAClB,OAAO,GACR,GAAG,IAAA,yCAAwB,EAAC,EAAE,MAAM,EAAE,UAAU,EAAE,CAAC,CAAC;IAErD,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC;AAClE,CAAC,CAAC;AArBW,QAAA,SAAS,aAqBpB"}
@@ -1,19 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.propPanel = void 0;
4
- const constants_js_1 = require("../constants.js");
5
- exports.propPanel = {
6
- schema: {},
7
- defaultValue: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAu4AAALuAQMAAADL0wGJAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAGUExURbzAw+rv8fKruy0AAAPoSURBVHja7dwxbtwwEEBRCkKwRQodYftcYk+ROkcJz5NTsEuZK/AIKlIQAUEnke0VqQ0pA5zxWvFnZcD2s0CNuENxPOZBc0QDDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PDw8PD/+P8bkxvnTzzjTG0M2b5rh08rHNT518aPOnTt63+aGTd23edPJ2h//ax+/oO6Gzx6c78+cuPu7x01vmwx5/6uLnO/PjO+b/rGifvtWH3VnT9vmh/e3eqx/bc9d79af2YwEPDw8P/6r8r1GVt5VcUoZPtXxGhp9rGYEM72vbEBne1hJ5Gb6ayIvwqZppi/CxmgqL8KGaTIrwc3WDfATeV/ffIryr7r+PwNvq/vsIfH17D5/qbw/gb/mLKp/OqnycFPj14yqcJPm4vfp5VJ0cP6jyzqjy9rr2q/Dr4qzBp3V5E1wxp/V3rl8LXn32qF6fAY31Psv2NXi/5lQaH+Vuzak0eLsmPRppVPa3FPiU3QiFFDZmD4FCAh6yxV+Bn7O9isLmx2d/TGHr5rI7obDxtFkcKWyb89M2+U1/sX7Kv7Io8gaxFy5l2D/faRk++3x6PgsalV52+fwUW4j/+eGhDPuneyH/otHmp9jyfHHMLM6n4phZnI/FObA4H4qDWnF+Lo46xXlflG+I864o3xDnbVG+Ic6X9RXSfCrrK6T5WBZASPOhrFCQ5ufyjF+a92XdkjTvyrolad6WdUvS/KawSI7/sQn7JfDl+O+bsF8CX44fN2FvHnNnIT4Nm7BfAl+ON5uwXwJfjA/LCuk2BXvCvN0U7InxflmAtxV1gvx0U2N3luPtdZOlwj/FoR5vbuq85Pi48F6LD0scOk3+sq1cleP9ohlNfkpq/N9pGaMuH7T4ZVqGWYt/nBavyxstftblfaVIWJU/y72yODCfzJH5oMvPh+adLm+PzCdzZD5U/61ClT9Lnvyo8e7QvFHlE3ydj0zOu5ucickhcpgcJofJedUVk8j5b/nGgIeHh4d/I3x/RwLlhgfNH3DavSwGXf7YjT76uqCEQ/P37p9z7uKVmwspd17S7hul3PXK6fbsmnvWhO6GZlMnn3ri8gXN5GzHnX0B35ydj91814CHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHh4eHl+d/A9cKjmiL040TAAAAAElFTkSuQmCC',
8
- defaultSchema: {
9
- type: 'image',
10
- position: { x: 0, y: 0 },
11
- width: 40,
12
- height: 40,
13
- // If the value of "rotate" is set to undefined or not set at all, rotation will be disabled in the UI.
14
- // Check this document: https://pdfme.com//docs/custom-schemas#learning-how-to-create-from-pdfmeschemas-code
15
- rotate: 0,
16
- opacity: constants_js_1.DEFAULT_OPACITY,
17
- },
18
- };
19
- //# sourceMappingURL=propPanel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"propPanel.js","sourceRoot":"","sources":["../../../../src/image/propPanel.ts"],"names":[],"mappings":";;;AAEA,kDAAkD;AAErC,QAAA,SAAS,GAA2B;IAC/C,MAAM,EAAE,EAAE;IACV,YAAY,EACV,w9CAAw9C;IAC19C,aAAa,EAAE;QACb,IAAI,EAAE,OAAO;QACb,QAAQ,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;QACxB,KAAK,EAAE,EAAE;QACT,MAAM,EAAE,EAAE;QACV,uGAAuG;QACvG,4GAA4G;QAC5G,MAAM,EAAE,CAAC;QACT,OAAO,EAAE,8BAAe;KACzB;CACF,CAAC"}
@@ -1,3 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- //# sourceMappingURL=types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/image/types.ts"],"names":[],"mappings":""}
@@ -1,111 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.uiRender = void 0;
4
- const common_1 = require("@pdfme/common");
5
- const renderUtils_js_1 = require("../renderUtils.js");
6
- const fullSize = { width: '100%', height: '100%' };
7
- const readFile = (input) => new Promise((resolve, reject) => {
8
- const fileReader = new FileReader();
9
- fileReader.onload = (e) => {
10
- if (e.target?.result) {
11
- resolve(e.target.result);
12
- }
13
- };
14
- fileReader.onerror = (e) => {
15
- reject(new Error('[@pdfme/schemas] File reading failed'));
16
- };
17
- let file = null;
18
- if (input instanceof FileList && input.length > 0) {
19
- file = input[0];
20
- }
21
- else if (input instanceof File) {
22
- file = input;
23
- }
24
- if (file) {
25
- fileReader.readAsDataURL(file);
26
- }
27
- else {
28
- reject(new Error('[@pdfme/schemas] No files provided'));
29
- }
30
- });
31
- const uiRender = async (arg) => {
32
- const { value, rootElement, mode, onChange, stopEditing, tabIndex, placeholder, schema, theme } = arg;
33
- const editable = mode === 'form' || mode === 'designer';
34
- const size = { width: schema.width * common_1.ZOOM, height: schema.height * common_1.ZOOM };
35
- const container = document.createElement('div');
36
- const containerStyle = {
37
- ...fullSize,
38
- backgroundImage: value ? 'none' : `url(${placeholder})`,
39
- backgroundSize: `${size.width}px ${size.height}px`,
40
- opacity: schema.opacity,
41
- };
42
- Object.assign(container.style, containerStyle);
43
- container.addEventListener('click', (e) => {
44
- if (editable) {
45
- e.stopPropagation();
46
- }
47
- });
48
- rootElement.appendChild(container);
49
- // image tag
50
- if (value) {
51
- const img = document.createElement('img');
52
- const imgStyle = { height: '100%', width: '100%', borderRadius: 0 };
53
- Object.assign(img.style, imgStyle);
54
- img.src = value;
55
- container.appendChild(img);
56
- }
57
- // remove button
58
- if (value && editable) {
59
- const button = document.createElement('button');
60
- button.textContent = 'x';
61
- const buttonStyle = {
62
- position: 'absolute',
63
- top: 0,
64
- left: 0,
65
- zIndex: 1,
66
- display: 'flex',
67
- justifyContent: 'center',
68
- alignItems: 'center',
69
- color: '#333',
70
- background: '#f2f2f2',
71
- borderRadius: '2px',
72
- border: '1px solid #767676',
73
- cursor: 'pointer',
74
- height: '24px',
75
- width: '24px',
76
- };
77
- Object.assign(button.style, buttonStyle);
78
- button.addEventListener('click', () => {
79
- onChange && onChange('');
80
- });
81
- container.appendChild(button);
82
- }
83
- // file input
84
- if (!value && editable) {
85
- const label = document.createElement('label');
86
- const labelStyle = {
87
- ...fullSize,
88
- display: editable ? 'flex' : 'none',
89
- position: 'absolute',
90
- top: 0,
91
- backgroundColor: editable || value ? (0, renderUtils_js_1.addAlphaToHex)(theme.colorPrimaryBg, 30) : 'none',
92
- cursor: 'pointer',
93
- };
94
- Object.assign(label.style, labelStyle);
95
- container.appendChild(label);
96
- const input = document.createElement('input');
97
- const inputStyle = { ...fullSize, position: 'absolute', top: '50%' };
98
- Object.assign(input.style, inputStyle);
99
- input.tabIndex = tabIndex || 0;
100
- input.type = 'file';
101
- input.accept = 'image/jpeg, image/png';
102
- input.addEventListener('change', (event) => {
103
- const changeEvent = event;
104
- readFile(changeEvent.target.files).then((result) => onChange && onChange(result));
105
- });
106
- input.addEventListener('blur', () => stopEditing && stopEditing());
107
- label.appendChild(input);
108
- }
109
- };
110
- exports.uiRender = uiRender;
111
- //# sourceMappingURL=uiRender.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"uiRender.js","sourceRoot":"","sources":["../../../../src/image/uiRender.ts"],"names":[],"mappings":"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"}
@@ -1,59 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.addAlphaToHex = exports.rotatePoint = exports.convertForPdfLayoutProps = void 0;
4
- const pdf_lib_1 = require("@pdfme/pdf-lib");
5
- const common_1 = require("@pdfme/common");
6
- const convertForPdfLayoutProps = ({ schema, pageHeight, applyRotateTranslate = true, }) => {
7
- const { width: mmWidth, height: mmHeight, position, rotate, opacity } = schema;
8
- const { x: mmX, y: mmY } = position;
9
- const rotateDegrees = rotate ? -rotate : 0;
10
- const width = (0, common_1.mm2pt)(mmWidth);
11
- const height = (0, common_1.mm2pt)(mmHeight);
12
- let x = (0, common_1.mm2pt)(mmX);
13
- // PDF coordinate system is from bottom left, UI is top left, so we need to flip the y axis
14
- let y = pageHeight - (0, common_1.mm2pt)(mmY) - height;
15
- if (rotateDegrees && applyRotateTranslate) {
16
- // If rotating we must pivot around the same point as the UI performs its rotation.
17
- // The UI performs rotation around the objects center point (the pivot point below),
18
- // pdflib rotates around the bottom left corner of the object.
19
- // We must therefore adjust the X and Y by rotating the bottom left corner by this pivot point.
20
- const pivotPoint = { x: x + width / 2, y: pageHeight - (0, common_1.mm2pt)(mmY) - height / 2 };
21
- const rotatedPoint = (0, exports.rotatePoint)({ x, y }, pivotPoint, rotateDegrees);
22
- x = rotatedPoint.x;
23
- y = rotatedPoint.y;
24
- }
25
- return {
26
- position: {
27
- x: x,
28
- y: y,
29
- },
30
- height: height,
31
- width: width,
32
- rotate: (0, pdf_lib_1.degrees)(rotateDegrees),
33
- opacity,
34
- };
35
- };
36
- exports.convertForPdfLayoutProps = convertForPdfLayoutProps;
37
- const rotatePoint = (point, pivot, angleDegrees) => {
38
- const angleRadians = (0, pdf_lib_1.degreesToRadians)(angleDegrees);
39
- const x = Math.cos(angleRadians) * (point.x - pivot.x) -
40
- Math.sin(angleRadians) * (point.y - pivot.y) +
41
- pivot.x;
42
- const y = Math.sin(angleRadians) * (point.x - pivot.x) +
43
- Math.cos(angleRadians) * (point.y - pivot.y) +
44
- pivot.y;
45
- return { x, y };
46
- };
47
- exports.rotatePoint = rotatePoint;
48
- const addAlphaToHex = (hex, alphaPercentage) => {
49
- if (!/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/i.test(hex)) {
50
- throw new Error('Invalid HEX color code');
51
- }
52
- const alphaValue = Math.round((alphaPercentage / 100) * 255);
53
- let alphaHex = alphaValue.toString(16);
54
- if (alphaHex.length === 1)
55
- alphaHex = '0' + alphaHex;
56
- return hex + alphaHex;
57
- };
58
- exports.addAlphaToHex = addAlphaToHex;
59
- //# sourceMappingURL=renderUtils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"renderUtils.js","sourceRoot":"","sources":["../../../src/renderUtils.ts"],"names":[],"mappings":"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"}