npm - react-id-card-generator - Versions diffs - 1.0.11 → 1.0.12 - Mend

react-id-card-generator 1.0.11 → 1.0.12

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 (5) hide show

package/dist/cjs/core/exportUtils.js +8 -4
package/dist/cjs/core/exportUtils.js.map +1 -1
package/dist/esm/core/exportUtils.js +8 -4
package/dist/esm/core/exportUtils.js.map +1 -1
package/package.json +1 -1

package/dist/cjs/core/exportUtils.js CHANGED Viewed

@@ -23,9 +23,13 @@ async function captureElement(elementId, scale = 10) {
     const element = document.getElementById(elementId);
     if (!element)
         return null;
+    // Get actual rendered dimensions
+    const rect = element.getBoundingClientRect();
     const canvas = await html2canvas(element, {
         ...defaultCanvasOptions,
         scale,
+        width: rect.width,
+        height: rect.height
     });
     return { canvas, element };
 }
@@ -68,10 +72,10 @@ async function downloadIDCardAsPDF(options) {
         for (let i = 0; i < pages.length; i++) {
             const { canvas, element } = pages[i];
             const imgData = canvas.toDataURL('image/jpeg', 1.0);
-            // Calculate PDF dimensions
-            const pdfWidth = parseInt(element.style.width) * 0.264583 || 85;
-            const aspectRatio = canvas.height / canvas.width;
-            const pdfHeight = pdfWidth * aspectRatio;
+            // Use getBoundingClientRect for accurate dimensions
+            const rect = element.getBoundingClientRect();
+            const pdfWidth = rect.width * 0.264583; // Convert px to mm
+            const pdfHeight = rect.height * 0.264583;
             const orientation = pdfWidth >= pdfHeight ? 'landscape' : 'portrait';
             if (i === 0) {
                 pdf = new jsPDF({

package/dist/cjs/core/exportUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"exportUtils.js","sources":["../../../src/core/exportUtils.ts"],"sourcesContent":["import html2canvas from 'html2canvas';\r\nimport jsPDF from 'jspdf';\r\nimport type { ExportOptions, ExportResult, IDCardData } from '../types';\r\nimport { setQrCodeOnElement } from './qrUtils';\r\n\r\ninterface DownloadIDCardOptions {\r\n frontElementId?: string;\r\n backElementId?: string;\r\n filename?: string;\r\n data?: IDCardData;\r\n qrElementId?: string;\r\n qrFields?: string[];\r\n format?: 'pdf' \| 'png' \| 'jpeg';\r\n scale?: number; // Canvas scale for quality (higher = better, but slower)\r\n quality?: number; // JPEG quality (0-1)\r\n}\r\n\r\n// High-quality canvas rendering defaults\r\nconst defaultCanvasOptions = {\r\n scale: 10, // 10x resolution for crisp output\r\n dpi: 1200,\r\n imageTimeout: 15000,\r\n letterRendering: true,\r\n logging: false,\r\n useCORS: true, // Allow cross-origin images\r\n backgroundColor: null,\r\n};\r\n\r\n/*\r\n Capture a DOM element as a high-resolution canvas\r\n * Uses html2canvas to convert the element to an image\r\n * @returns Canvas and the original element, or null if not found\r\n /\r\nasync function captureElement(\r\n elementId: string,\r\n scale = 10\r\n): Promise<{ canvas: HTMLCanvasElement; element: HTMLElement } \| null> {\r\n const element = document.getElementById(elementId);\r\n if (!element) return null;\r\n\r\n const canvas = await html2canvas(element, {\r\n ...defaultCanvasOptions,\r\n scale,\r\n });\r\n\r\n return { canvas, element };\r\n}\r\n\r\n/\r\n Download ID card(s) as a PDF file\r\n * Captures DOM elements and converts them to a multi-page PDF\r\n * @param options - Configuration for PDF export\r\n * @returns Export result with success status and any errors\r\n /\r\nexport async function downloadIDCardAsPDF(\r\n options: DownloadIDCardOptions\r\n): Promise<ExportResult> {\r\n try {\r\n const {\r\n frontElementId = 'idcardfront',\r\n backElementId,\r\n filename = 'ID_Card',\r\n data,\r\n qrElementId,\r\n qrFields,\r\n scale = 10,\r\n } = options;\r\n\r\n // Generate QR code if configured\r\n if (qrElementId && data && qrFields && qrFields.length > 0) {\r\n const qrData: Record<string, unknown> = {};\r\n for (const field of qrFields) {\r\n if (data[field] !== undefined) {\r\n qrData[field] = data[field];\r\n }\r\n }\r\n setQrCodeOnElement(qrElementId, qrData, 200);\r\n }\r\n\r\n // Wait for QR code and any images to fully render\r\n await new Promise((resolve) => setTimeout(resolve, 100));\r\n\r\n const pages: { canvas: HTMLCanvasElement; element: HTMLElement }[] = [];\r\n\r\n // Capture front\r\n const frontCapture = await captureElement(frontElementId, scale);\r\n if (frontCapture) pages.push(frontCapture);\r\n\r\n // Capture back if exists\r\n if (backElementId) {\r\n const backCapture = await captureElement(backElementId, scale);\r\n if (backCapture) pages.push(backCapture);\r\n }\r\n\r\n if (pages.length === 0) {\r\n return { success: false, error: 'No elements found to capture' };\r\n }\r\n\r\n let pdf: jsPDF \| undefined;\r\n\r\n for (let i = 0; i < pages.length; i++) {\r\n const { canvas, element } = pages[i];\r\n const imgData = canvas.toDataURL('image/jpeg', 1.0);\r\n\r\n // Calculate PDF dimensions\r\n const pdfWidth = parseInt(element.style.width) 0.264583 \|\| 85;\r\n const aspectRatio = canvas.height / canvas.width;\r\n const pdfHeight = pdfWidth * aspectRatio;\r\n\r\n const orientation = pdfWidth >= pdfHeight ? 'landscape' : 'portrait';\r\n\r\n if (i === 0) {\r\n pdf = new jsPDF({\r\n unit: 'mm',\r\n format: [pdfWidth, pdfHeight],\r\n orientation,\r\n });\r\n } else {\r\n pdf!.addPage([pdfWidth, pdfHeight], orientation);\r\n }\r\n\r\n pdf!.addImage(imgData, 'JPEG', 0, 0, pdfWidth, pdfHeight);\r\n }\r\n\r\n if (pdf) {\r\n const blob = pdf.output('blob');\r\n pdf.save(`${filename}.pdf`);\r\n return { success: true, blob };\r\n }\r\n\r\n return { success: false, error: 'Failed to generate PDF' };\r\n } catch (error) {\r\n return {\r\n success: false,\r\n error: error instanceof Error ? error.message : 'Unknown error',\r\n };\r\n }\r\n}\r\n\r\n/*\r\n Download ID card as image (PNG or JPEG)\r\n /\r\nexport async function downloadIDCardAsImage(\r\n options: DownloadIDCardOptions\r\n): Promise<ExportResult> {\r\n try {\r\n const {\r\n frontElementId = 'idcardfront',\r\n filename = 'ID_Card',\r\n data,\r\n qrElementId,\r\n qrFields,\r\n format = 'png',\r\n scale = 10,\r\n quality = 1.0,\r\n } = options;\r\n\r\n // Generate QR code if needed\r\n if (qrElementId && data && qrFields && qrFields.length > 0) {\r\n const qrData: Record<string, unknown> = {};\r\n for (const field of qrFields) {\r\n if (data[field] !== undefined) {\r\n qrData[field] = data[field];\r\n }\r\n }\r\n setQrCodeOnElement(qrElementId, qrData, 200);\r\n }\r\n\r\n await new Promise((resolve) => setTimeout(resolve, 100));\r\n\r\n const capture = await captureElement(frontElementId, scale);\r\n if (!capture) {\r\n return { success: false, error: 'Element not found' };\r\n }\r\n\r\n const mimeType = format === 'jpeg' ? 'image/jpeg' : 'image/png';\r\n const dataUrl = capture.canvas.toDataURL(mimeType, quality);\r\n\r\n // Trigger download\r\n const link = document.createElement('a');\r\n link.download = `${filename}.${format}`;\r\n link.href = dataUrl;\r\n link.click();\r\n\r\n return { success: true, dataUrl };\r\n } catch (error) {\r\n return {\r\n success: false,\r\n error: error instanceof Error ? error.message : 'Unknown error',\r\n };\r\n }\r\n}\r\n\r\n/\r\n Export ID card with unified options\r\n */\r\nexport async function exportIDCard(\r\n options: ExportOptions & {\r\n frontElementId?: string;\r\n backElementId?: string;\r\n data?: IDCardData;\r\n qrElementId?: string;\r\n qrFields?: string[];\r\n }\r\n): Promise<ExportResult> {\r\n const { format, ...rest } = options;\r\n\r\n if (format === 'pdf') {\r\n return downloadIDCardAsPDF(rest);\r\n } else {\r\n return downloadIDCardAsImage({ ...rest, format });\r\n }\r\n}\r\n"],"names":["setQrCodeOnElement"],"mappings":"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"}
1	+ {"version":3,"file":"exportUtils.js","sources":["../../../src/core/exportUtils.ts"],"sourcesContent":["import html2canvas from 'html2canvas';\r\nimport jsPDF from 'jspdf';\r\nimport type { ExportOptions, ExportResult, IDCardData } from '../types';\r\nimport { setQrCodeOnElement } from './qrUtils';\r\n\r\ninterface DownloadIDCardOptions {\r\n frontElementId?: string;\r\n backElementId?: string;\r\n filename?: string;\r\n data?: IDCardData;\r\n qrElementId?: string;\r\n qrFields?: string[];\r\n format?: 'pdf' \| 'png' \| 'jpeg';\r\n scale?: number; // Canvas scale for quality (higher = better, but slower)\r\n quality?: number; // JPEG quality (0-1)\r\n}\r\n\r\n// High-quality canvas rendering defaults\r\nconst defaultCanvasOptions = {\r\n scale: 10, // 10x resolution for crisp output\r\n dpi: 1200,\r\n imageTimeout: 15000,\r\n letterRendering: true,\r\n logging: false,\r\n useCORS: true, // Allow cross-origin images\r\n backgroundColor: null,\r\n};\r\n\r\n/*\r\n Capture a DOM element as a high-resolution canvas\r\n * Uses html2canvas to convert the element to an image\r\n * @returns Canvas and the original element, or null if not found\r\n /\r\nasync function captureElement(\r\n elementId: string,\r\n scale = 10\r\n): Promise<{ canvas: HTMLCanvasElement; element: HTMLElement } \| null> {\r\n const element = document.getElementById(elementId);\r\n if (!element) return null;\r\n\r\n // Get actual rendered dimensions\r\n const rect = element.getBoundingClientRect();\r\n \r\n const canvas = await html2canvas(element, {\r\n ...defaultCanvasOptions,\r\n scale,\r\n width: rect.width,\r\n height: rect.height\r\n });\r\n\r\n return { canvas, element };\r\n}\r\n\r\n/\r\n Download ID card(s) as a PDF file\r\n * Captures DOM elements and converts them to a multi-page PDF\r\n * @param options - Configuration for PDF export\r\n * @returns Export result with success status and any errors\r\n /\r\nexport async function downloadIDCardAsPDF(\r\n options: DownloadIDCardOptions\r\n): Promise<ExportResult> {\r\n try {\r\n const {\r\n frontElementId = 'idcardfront',\r\n backElementId,\r\n filename = 'ID_Card',\r\n data,\r\n qrElementId,\r\n qrFields,\r\n scale = 10,\r\n } = options;\r\n\r\n // Generate QR code if configured\r\n if (qrElementId && data && qrFields && qrFields.length > 0) {\r\n const qrData: Record<string, unknown> = {};\r\n for (const field of qrFields) {\r\n if (data[field] !== undefined) {\r\n qrData[field] = data[field];\r\n }\r\n }\r\n setQrCodeOnElement(qrElementId, qrData, 200);\r\n }\r\n\r\n // Wait for QR code and any images to fully render\r\n await new Promise((resolve) => setTimeout(resolve, 100));\r\n\r\n const pages: { canvas: HTMLCanvasElement; element: HTMLElement }[] = [];\r\n\r\n // Capture front\r\n const frontCapture = await captureElement(frontElementId, scale);\r\n if (frontCapture) pages.push(frontCapture);\r\n\r\n // Capture back if exists\r\n if (backElementId) {\r\n const backCapture = await captureElement(backElementId, scale);\r\n if (backCapture) pages.push(backCapture);\r\n }\r\n\r\n if (pages.length === 0) {\r\n return { success: false, error: 'No elements found to capture' };\r\n }\r\n\r\n let pdf: jsPDF \| undefined;\r\n\r\n for (let i = 0; i < pages.length; i++) {\r\n const { canvas, element } = pages[i];\r\n const imgData = canvas.toDataURL('image/jpeg', 1.0);\r\n\r\n // Use getBoundingClientRect for accurate dimensions\r\n const rect = element.getBoundingClientRect();\r\n const pdfWidth = rect.width 0.264583; // Convert px to mm\r\n const pdfHeight = rect.height * 0.264583;\r\n\r\n const orientation = pdfWidth >= pdfHeight ? 'landscape' : 'portrait';\r\n\r\n if (i === 0) {\r\n pdf = new jsPDF({\r\n unit: 'mm',\r\n format: [pdfWidth, pdfHeight],\r\n orientation,\r\n });\r\n } else {\r\n pdf!.addPage([pdfWidth, pdfHeight], orientation);\r\n }\r\n\r\n pdf!.addImage(imgData, 'JPEG', 0, 0, pdfWidth, pdfHeight);\r\n }\r\n\r\n if (pdf) {\r\n const blob = pdf.output('blob');\r\n pdf.save(`${filename}.pdf`);\r\n return { success: true, blob };\r\n }\r\n\r\n return { success: false, error: 'Failed to generate PDF' };\r\n } catch (error) {\r\n return {\r\n success: false,\r\n error: error instanceof Error ? error.message : 'Unknown error',\r\n };\r\n }\r\n}\r\n\r\n/*\r\n Download ID card as image (PNG or JPEG)\r\n /\r\nexport async function downloadIDCardAsImage(\r\n options: DownloadIDCardOptions\r\n): Promise<ExportResult> {\r\n try {\r\n const {\r\n frontElementId = 'idcardfront',\r\n filename = 'ID_Card',\r\n data,\r\n qrElementId,\r\n qrFields,\r\n format = 'png',\r\n scale = 10,\r\n quality = 1.0,\r\n } = options;\r\n\r\n // Generate QR code if needed\r\n if (qrElementId && data && qrFields && qrFields.length > 0) {\r\n const qrData: Record<string, unknown> = {};\r\n for (const field of qrFields) {\r\n if (data[field] !== undefined) {\r\n qrData[field] = data[field];\r\n }\r\n }\r\n setQrCodeOnElement(qrElementId, qrData, 200);\r\n }\r\n\r\n await new Promise((resolve) => setTimeout(resolve, 100));\r\n\r\n const capture = await captureElement(frontElementId, scale);\r\n if (!capture) {\r\n return { success: false, error: 'Element not found' };\r\n }\r\n\r\n const mimeType = format === 'jpeg' ? 'image/jpeg' : 'image/png';\r\n const dataUrl = capture.canvas.toDataURL(mimeType, quality);\r\n\r\n // Trigger download\r\n const link = document.createElement('a');\r\n link.download = `${filename}.${format}`;\r\n link.href = dataUrl;\r\n link.click();\r\n\r\n return { success: true, dataUrl };\r\n } catch (error) {\r\n return {\r\n success: false,\r\n error: error instanceof Error ? error.message : 'Unknown error',\r\n };\r\n }\r\n}\r\n\r\n/\r\n Export ID card with unified options\r\n */\r\nexport async function exportIDCard(\r\n options: ExportOptions & {\r\n frontElementId?: string;\r\n backElementId?: string;\r\n data?: IDCardData;\r\n qrElementId?: string;\r\n qrFields?: string[];\r\n }\r\n): Promise<ExportResult> {\r\n const { format, ...rest } = options;\r\n\r\n if (format === 'pdf') {\r\n return downloadIDCardAsPDF(rest);\r\n } else {\r\n return downloadIDCardAsImage({ ...rest, format });\r\n }\r\n}"],"names":["setQrCodeOnElement"],"mappings":"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"}

package/dist/esm/core/exportUtils.js CHANGED Viewed

@@ -21,9 +21,13 @@ async function captureElement(elementId, scale = 10) {
     const element = document.getElementById(elementId);
     if (!element)
         return null;
+    // Get actual rendered dimensions
+    const rect = element.getBoundingClientRect();
     const canvas = await html2canvas(element, {
         ...defaultCanvasOptions,
         scale,
+        width: rect.width,
+        height: rect.height
     });
     return { canvas, element };
 }
@@ -66,10 +70,10 @@ async function downloadIDCardAsPDF(options) {
         for (let i = 0; i < pages.length; i++) {
             const { canvas, element } = pages[i];
             const imgData = canvas.toDataURL('image/jpeg', 1.0);
-            // Calculate PDF dimensions
-            const pdfWidth = parseInt(element.style.width) * 0.264583 || 85;
-            const aspectRatio = canvas.height / canvas.width;
-            const pdfHeight = pdfWidth * aspectRatio;
+            // Use getBoundingClientRect for accurate dimensions
+            const rect = element.getBoundingClientRect();
+            const pdfWidth = rect.width * 0.264583; // Convert px to mm
+            const pdfHeight = rect.height * 0.264583;
             const orientation = pdfWidth >= pdfHeight ? 'landscape' : 'portrait';
             if (i === 0) {
                 pdf = new jsPDF({

package/dist/esm/core/exportUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"exportUtils.js","sources":["../../../src/core/exportUtils.ts"],"sourcesContent":["import html2canvas from 'html2canvas';\r\nimport jsPDF from 'jspdf';\r\nimport type { ExportOptions, ExportResult, IDCardData } from '../types';\r\nimport { setQrCodeOnElement } from './qrUtils';\r\n\r\ninterface DownloadIDCardOptions {\r\n frontElementId?: string;\r\n backElementId?: string;\r\n filename?: string;\r\n data?: IDCardData;\r\n qrElementId?: string;\r\n qrFields?: string[];\r\n format?: 'pdf' \| 'png' \| 'jpeg';\r\n scale?: number; // Canvas scale for quality (higher = better, but slower)\r\n quality?: number; // JPEG quality (0-1)\r\n}\r\n\r\n// High-quality canvas rendering defaults\r\nconst defaultCanvasOptions = {\r\n scale: 10, // 10x resolution for crisp output\r\n dpi: 1200,\r\n imageTimeout: 15000,\r\n letterRendering: true,\r\n logging: false,\r\n useCORS: true, // Allow cross-origin images\r\n backgroundColor: null,\r\n};\r\n\r\n/*\r\n Capture a DOM element as a high-resolution canvas\r\n * Uses html2canvas to convert the element to an image\r\n * @returns Canvas and the original element, or null if not found\r\n /\r\nasync function captureElement(\r\n elementId: string,\r\n scale = 10\r\n): Promise<{ canvas: HTMLCanvasElement; element: HTMLElement } \| null> {\r\n const element = document.getElementById(elementId);\r\n if (!element) return null;\r\n\r\n const canvas = await html2canvas(element, {\r\n ...defaultCanvasOptions,\r\n scale,\r\n });\r\n\r\n return { canvas, element };\r\n}\r\n\r\n/\r\n Download ID card(s) as a PDF file\r\n * Captures DOM elements and converts them to a multi-page PDF\r\n * @param options - Configuration for PDF export\r\n * @returns Export result with success status and any errors\r\n /\r\nexport async function downloadIDCardAsPDF(\r\n options: DownloadIDCardOptions\r\n): Promise<ExportResult> {\r\n try {\r\n const {\r\n frontElementId = 'idcardfront',\r\n backElementId,\r\n filename = 'ID_Card',\r\n data,\r\n qrElementId,\r\n qrFields,\r\n scale = 10,\r\n } = options;\r\n\r\n // Generate QR code if configured\r\n if (qrElementId && data && qrFields && qrFields.length > 0) {\r\n const qrData: Record<string, unknown> = {};\r\n for (const field of qrFields) {\r\n if (data[field] !== undefined) {\r\n qrData[field] = data[field];\r\n }\r\n }\r\n setQrCodeOnElement(qrElementId, qrData, 200);\r\n }\r\n\r\n // Wait for QR code and any images to fully render\r\n await new Promise((resolve) => setTimeout(resolve, 100));\r\n\r\n const pages: { canvas: HTMLCanvasElement; element: HTMLElement }[] = [];\r\n\r\n // Capture front\r\n const frontCapture = await captureElement(frontElementId, scale);\r\n if (frontCapture) pages.push(frontCapture);\r\n\r\n // Capture back if exists\r\n if (backElementId) {\r\n const backCapture = await captureElement(backElementId, scale);\r\n if (backCapture) pages.push(backCapture);\r\n }\r\n\r\n if (pages.length === 0) {\r\n return { success: false, error: 'No elements found to capture' };\r\n }\r\n\r\n let pdf: jsPDF \| undefined;\r\n\r\n for (let i = 0; i < pages.length; i++) {\r\n const { canvas, element } = pages[i];\r\n const imgData = canvas.toDataURL('image/jpeg', 1.0);\r\n\r\n // Calculate PDF dimensions\r\n const pdfWidth = parseInt(element.style.width) 0.264583 \|\| 85;\r\n const aspectRatio = canvas.height / canvas.width;\r\n const pdfHeight = pdfWidth * aspectRatio;\r\n\r\n const orientation = pdfWidth >= pdfHeight ? 'landscape' : 'portrait';\r\n\r\n if (i === 0) {\r\n pdf = new jsPDF({\r\n unit: 'mm',\r\n format: [pdfWidth, pdfHeight],\r\n orientation,\r\n });\r\n } else {\r\n pdf!.addPage([pdfWidth, pdfHeight], orientation);\r\n }\r\n\r\n pdf!.addImage(imgData, 'JPEG', 0, 0, pdfWidth, pdfHeight);\r\n }\r\n\r\n if (pdf) {\r\n const blob = pdf.output('blob');\r\n pdf.save(`${filename}.pdf`);\r\n return { success: true, blob };\r\n }\r\n\r\n return { success: false, error: 'Failed to generate PDF' };\r\n } catch (error) {\r\n return {\r\n success: false,\r\n error: error instanceof Error ? error.message : 'Unknown error',\r\n };\r\n }\r\n}\r\n\r\n/*\r\n Download ID card as image (PNG or JPEG)\r\n /\r\nexport async function downloadIDCardAsImage(\r\n options: DownloadIDCardOptions\r\n): Promise<ExportResult> {\r\n try {\r\n const {\r\n frontElementId = 'idcardfront',\r\n filename = 'ID_Card',\r\n data,\r\n qrElementId,\r\n qrFields,\r\n format = 'png',\r\n scale = 10,\r\n quality = 1.0,\r\n } = options;\r\n\r\n // Generate QR code if needed\r\n if (qrElementId && data && qrFields && qrFields.length > 0) {\r\n const qrData: Record<string, unknown> = {};\r\n for (const field of qrFields) {\r\n if (data[field] !== undefined) {\r\n qrData[field] = data[field];\r\n }\r\n }\r\n setQrCodeOnElement(qrElementId, qrData, 200);\r\n }\r\n\r\n await new Promise((resolve) => setTimeout(resolve, 100));\r\n\r\n const capture = await captureElement(frontElementId, scale);\r\n if (!capture) {\r\n return { success: false, error: 'Element not found' };\r\n }\r\n\r\n const mimeType = format === 'jpeg' ? 'image/jpeg' : 'image/png';\r\n const dataUrl = capture.canvas.toDataURL(mimeType, quality);\r\n\r\n // Trigger download\r\n const link = document.createElement('a');\r\n link.download = `${filename}.${format}`;\r\n link.href = dataUrl;\r\n link.click();\r\n\r\n return { success: true, dataUrl };\r\n } catch (error) {\r\n return {\r\n success: false,\r\n error: error instanceof Error ? error.message : 'Unknown error',\r\n };\r\n }\r\n}\r\n\r\n/\r\n Export ID card with unified options\r\n */\r\nexport async function exportIDCard(\r\n options: ExportOptions & {\r\n frontElementId?: string;\r\n backElementId?: string;\r\n data?: IDCardData;\r\n qrElementId?: string;\r\n qrFields?: string[];\r\n }\r\n): Promise<ExportResult> {\r\n const { format, ...rest } = options;\r\n\r\n if (format === 'pdf') {\r\n return downloadIDCardAsPDF(rest);\r\n } else {\r\n return downloadIDCardAsImage({ ...rest, format });\r\n }\r\n}\r\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"exportUtils.js","sources":["../../../src/core/exportUtils.ts"],"sourcesContent":["import html2canvas from 'html2canvas';\r\nimport jsPDF from 'jspdf';\r\nimport type { ExportOptions, ExportResult, IDCardData } from '../types';\r\nimport { setQrCodeOnElement } from './qrUtils';\r\n\r\ninterface DownloadIDCardOptions {\r\n frontElementId?: string;\r\n backElementId?: string;\r\n filename?: string;\r\n data?: IDCardData;\r\n qrElementId?: string;\r\n qrFields?: string[];\r\n format?: 'pdf' \| 'png' \| 'jpeg';\r\n scale?: number; // Canvas scale for quality (higher = better, but slower)\r\n quality?: number; // JPEG quality (0-1)\r\n}\r\n\r\n// High-quality canvas rendering defaults\r\nconst defaultCanvasOptions = {\r\n scale: 10, // 10x resolution for crisp output\r\n dpi: 1200,\r\n imageTimeout: 15000,\r\n letterRendering: true,\r\n logging: false,\r\n useCORS: true, // Allow cross-origin images\r\n backgroundColor: null,\r\n};\r\n\r\n/*\r\n Capture a DOM element as a high-resolution canvas\r\n * Uses html2canvas to convert the element to an image\r\n * @returns Canvas and the original element, or null if not found\r\n /\r\nasync function captureElement(\r\n elementId: string,\r\n scale = 10\r\n): Promise<{ canvas: HTMLCanvasElement; element: HTMLElement } \| null> {\r\n const element = document.getElementById(elementId);\r\n if (!element) return null;\r\n\r\n // Get actual rendered dimensions\r\n const rect = element.getBoundingClientRect();\r\n \r\n const canvas = await html2canvas(element, {\r\n ...defaultCanvasOptions,\r\n scale,\r\n width: rect.width,\r\n height: rect.height\r\n });\r\n\r\n return { canvas, element };\r\n}\r\n\r\n/\r\n Download ID card(s) as a PDF file\r\n * Captures DOM elements and converts them to a multi-page PDF\r\n * @param options - Configuration for PDF export\r\n * @returns Export result with success status and any errors\r\n /\r\nexport async function downloadIDCardAsPDF(\r\n options: DownloadIDCardOptions\r\n): Promise<ExportResult> {\r\n try {\r\n const {\r\n frontElementId = 'idcardfront',\r\n backElementId,\r\n filename = 'ID_Card',\r\n data,\r\n qrElementId,\r\n qrFields,\r\n scale = 10,\r\n } = options;\r\n\r\n // Generate QR code if configured\r\n if (qrElementId && data && qrFields && qrFields.length > 0) {\r\n const qrData: Record<string, unknown> = {};\r\n for (const field of qrFields) {\r\n if (data[field] !== undefined) {\r\n qrData[field] = data[field];\r\n }\r\n }\r\n setQrCodeOnElement(qrElementId, qrData, 200);\r\n }\r\n\r\n // Wait for QR code and any images to fully render\r\n await new Promise((resolve) => setTimeout(resolve, 100));\r\n\r\n const pages: { canvas: HTMLCanvasElement; element: HTMLElement }[] = [];\r\n\r\n // Capture front\r\n const frontCapture = await captureElement(frontElementId, scale);\r\n if (frontCapture) pages.push(frontCapture);\r\n\r\n // Capture back if exists\r\n if (backElementId) {\r\n const backCapture = await captureElement(backElementId, scale);\r\n if (backCapture) pages.push(backCapture);\r\n }\r\n\r\n if (pages.length === 0) {\r\n return { success: false, error: 'No elements found to capture' };\r\n }\r\n\r\n let pdf: jsPDF \| undefined;\r\n\r\n for (let i = 0; i < pages.length; i++) {\r\n const { canvas, element } = pages[i];\r\n const imgData = canvas.toDataURL('image/jpeg', 1.0);\r\n\r\n // Use getBoundingClientRect for accurate dimensions\r\n const rect = element.getBoundingClientRect();\r\n const pdfWidth = rect.width 0.264583; // Convert px to mm\r\n const pdfHeight = rect.height * 0.264583;\r\n\r\n const orientation = pdfWidth >= pdfHeight ? 'landscape' : 'portrait';\r\n\r\n if (i === 0) {\r\n pdf = new jsPDF({\r\n unit: 'mm',\r\n format: [pdfWidth, pdfHeight],\r\n orientation,\r\n });\r\n } else {\r\n pdf!.addPage([pdfWidth, pdfHeight], orientation);\r\n }\r\n\r\n pdf!.addImage(imgData, 'JPEG', 0, 0, pdfWidth, pdfHeight);\r\n }\r\n\r\n if (pdf) {\r\n const blob = pdf.output('blob');\r\n pdf.save(`${filename}.pdf`);\r\n return { success: true, blob };\r\n }\r\n\r\n return { success: false, error: 'Failed to generate PDF' };\r\n } catch (error) {\r\n return {\r\n success: false,\r\n error: error instanceof Error ? error.message : 'Unknown error',\r\n };\r\n }\r\n}\r\n\r\n/*\r\n Download ID card as image (PNG or JPEG)\r\n /\r\nexport async function downloadIDCardAsImage(\r\n options: DownloadIDCardOptions\r\n): Promise<ExportResult> {\r\n try {\r\n const {\r\n frontElementId = 'idcardfront',\r\n filename = 'ID_Card',\r\n data,\r\n qrElementId,\r\n qrFields,\r\n format = 'png',\r\n scale = 10,\r\n quality = 1.0,\r\n } = options;\r\n\r\n // Generate QR code if needed\r\n if (qrElementId && data && qrFields && qrFields.length > 0) {\r\n const qrData: Record<string, unknown> = {};\r\n for (const field of qrFields) {\r\n if (data[field] !== undefined) {\r\n qrData[field] = data[field];\r\n }\r\n }\r\n setQrCodeOnElement(qrElementId, qrData, 200);\r\n }\r\n\r\n await new Promise((resolve) => setTimeout(resolve, 100));\r\n\r\n const capture = await captureElement(frontElementId, scale);\r\n if (!capture) {\r\n return { success: false, error: 'Element not found' };\r\n }\r\n\r\n const mimeType = format === 'jpeg' ? 'image/jpeg' : 'image/png';\r\n const dataUrl = capture.canvas.toDataURL(mimeType, quality);\r\n\r\n // Trigger download\r\n const link = document.createElement('a');\r\n link.download = `${filename}.${format}`;\r\n link.href = dataUrl;\r\n link.click();\r\n\r\n return { success: true, dataUrl };\r\n } catch (error) {\r\n return {\r\n success: false,\r\n error: error instanceof Error ? error.message : 'Unknown error',\r\n };\r\n }\r\n}\r\n\r\n/\r\n Export ID card with unified options\r\n */\r\nexport async function exportIDCard(\r\n options: ExportOptions & {\r\n frontElementId?: string;\r\n backElementId?: string;\r\n data?: IDCardData;\r\n qrElementId?: string;\r\n qrFields?: string[];\r\n }\r\n): Promise<ExportResult> {\r\n const { format, ...rest } = options;\r\n\r\n if (format === 'pdf') {\r\n return downloadIDCardAsPDF(rest);\r\n } else {\r\n return downloadIDCardAsImage({ ...rest, format });\r\n }\r\n}"],"names":[],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "react-id-card-generator",
-  "version": "1.0.11",
+  "version": "1.0.12",
   "description": "A flexible React library for designing, configuring, and generating ID cards with drag-and-drop field positioning",
   "main": "dist/cjs/index.js",
   "type": "module",