react-id-card-generator 1.0.3 → 1.0.4

package/dist/esm/core/exportUtils.js

@@ -1,4 +1,4 @@
-import html2canvas from '../node_modules/html2canvas/dist/html2canvas.esm.js';
+import html2canvas from 'html2canvas';
 import jsPDF from 'jspdf';
 import { setQrCodeOnElement } from './qrUtils.js';
 

package/dist/esm/hooks/useIDCardTemplate.js

@@ -29,25 +29,42 @@ function useIDCardTemplate(initialTemplate) {
     }, []);
     // Update specific properties of a field
     const updateField = useCallback((fieldId, updates) => {
-        setTemplateState((prev) => ({
-            ...prev,
-            updatedAt: new Date().toISOString(),
-            fields: prev.fields.map((field) => field.id === fieldId ? { ...field, ...updates } : field),
-        }));
+        if (!fieldId || !updates)
+            return;
+        setTemplateState((prev) => {
+            const fieldExists = prev.fields.some((field) => field?.id === fieldId);
+            if (!fieldExists)
+                return prev;
+            return {
+                ...prev,
+                updatedAt: new Date().toISOString(),
+                fields: prev.fields.map((field) => field?.id === fieldId ? { ...field, ...updates } : field).filter(Boolean),
+            };
+        });
     }, []);
     // Add a new field to the template
     const addField = useCallback((field) => {
+        if (!field || !field.type || !field.position) {
+            console.warn('Invalid field object provided to addField:', field);
+            return;
+        }
+        const validField = {
+            ...field,
+            id: field.id || generateId('field'),
+        };
         setTemplateState((prev) => ({
             ...prev,
             updatedAt: new Date().toISOString(),
-            fields: [...prev.fields, { ...field, id: field.id || generateId('field') }],
+            fields: [...prev.fields.filter(Boolean), validField],
         }));
     }, []);
     const removeField = useCallback((fieldId) => {
+        if (!fieldId)
+            return;
         setTemplateState((prev) => ({
             ...prev,
             updatedAt: new Date().toISOString(),
-            fields: prev.fields.filter((field) => field.id !== fieldId),
+            fields: prev.fields.filter((field) => field?.id && field.id !== fieldId),
         }));
     }, []);
     const setBackground = useCallback((side, imageData) => {
@@ -94,9 +111,11 @@ function useIDCardTemplate(initialTemplate) {
         }));
     }, []);
     const duplicateField = useCallback((fieldId) => {
+        if (!fieldId)
+            return;
         setTemplateState((prev) => {
-            const field = prev.fields.find((f) => f.id === fieldId);
-            if (!field)
+            const field = prev.fields.find((f) => f?.id === fieldId);
+            if (!field || !field.position)
                 return prev;
             const newField = {
                 ...field,
@@ -110,15 +129,17 @@ function useIDCardTemplate(initialTemplate) {
             return {
                 ...prev,
                 updatedAt: new Date().toISOString(),
-                fields: [...prev.fields, newField],
+                fields: [...prev.fields.filter(Boolean), newField],
             };
         });
     }, []);
     const moveFieldToSide = useCallback((fieldId, side) => {
+        if (!fieldId || !side)
+            return;
         setTemplateState((prev) => ({
             ...prev,
             updatedAt: new Date().toISOString(),
-            fields: prev.fields.map((field) => field.id === fieldId ? { ...field, side } : field),
+            fields: prev.fields.map((field) => field?.id === fieldId ? { ...field, side } : field).filter(Boolean),
         }));
     }, []);
     const reset = useCallback(() => {
@@ -131,8 +152,16 @@ function useIDCardTemplate(initialTemplate) {
             validationErrors: errors.map((e) => `${e.field}: ${e.message}`),
         };
     }, [template]);
+    // Ensure template always has valid fields array
+    const safeTemplate = useMemo(() => ({
+        ...template,
+        fields: template.fields.filter((field) => Boolean(field) &&
+            Boolean(field.id) &&
+            Boolean(field.type) &&
+            Boolean(field.position)),
+    }), [template]);
     return {
-        template,
+        template: safeTemplate,
         setTemplate,
         updateField,
         addField,

package/dist/esm/hooks/useIDCardTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"useIDCardTemplate.js","sources":["../../../src/hooks/useIDCardTemplate.ts"],"sourcesContent":["import { useState, useCallback, useMemo } from 'react';\r\nimport type {\r\n  IDCardTemplate,\r\n  FieldMapping,\r\n  CardSize,\r\n  CardOrientation,\r\n  CardSides,\r\n  UseIDCardTemplateReturn,\r\n} from '../types';\r\nimport { createDefaultTemplate, generateId } from '../storage/templateStorage';\r\nimport { validateTemplate } from '../utils/validators';\r\n\r\n/**\r\n * Hook for managing ID card template state\r\n * Provides methods for updating fields, backgrounds, and card properties\r\n * Automatically updates the template's updatedAt timestamp on changes\r\n * \r\n * @param initialTemplate - Optional existing template to start with\r\n * @returns Template state and helper methods\r\n */\r\nexport function useIDCardTemplate(\r\n  initialTemplate?: Partial<IDCardTemplate>\r\n): UseIDCardTemplateReturn {\r\n  const [template, setTemplateState] = useState<IDCardTemplate>(() => {\r\n    if (initialTemplate) {\r\n      return {\r\n        ...createDefaultTemplate(),\r\n        ...initialTemplate,\r\n        updatedAt: new Date().toISOString(),\r\n      };\r\n    }\r\n    return createDefaultTemplate();\r\n  });\r\n\r\n  const setTemplate = useCallback((newTemplate: IDCardTemplate) => {\r\n    setTemplateState({\r\n      ...newTemplate,\r\n      updatedAt: new Date().toISOString(),\r\n    });\r\n  }, []);\r\n\r\n  // Update specific properties of a field\r\n  const updateField = useCallback((fieldId: string, updates: Partial<FieldMapping>) => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      fields: prev.fields.map((field: FieldMapping) =>\r\n        field.id === fieldId ? { ...field, ...updates } : field\r\n      ),\r\n    }));\r\n  }, []);\r\n\r\n  // Add a new field to the template\r\n  const addField = useCallback((field: FieldMapping) => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      fields: [...prev.fields, { ...field, id: field.id || generateId('field') }],\r\n    }));\r\n  }, []);\r\n\r\n  const removeField = useCallback((fieldId: string) => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      fields: prev.fields.filter((field: FieldMapping) => field.id !== fieldId),\r\n    }));\r\n  }, []);\r\n\r\n  const setBackground = useCallback((side: 'front' | 'back', imageData: string) => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      backgrounds: {\r\n        ...prev.backgrounds,\r\n        [side]: imageData,\r\n      },\r\n    }));\r\n  }, []);\r\n\r\n  const setCardSize = useCallback((size: CardSize) => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      cardSize: size,\r\n    }));\r\n  }, []);\r\n\r\n  const setOrientation = useCallback((orientation: CardOrientation) => {\r\n    setTemplateState((prev: IDCardTemplate) => {\r\n      // Swap dimensions if orientation changes\r\n      const shouldSwap =\r\n        (orientation === 'portrait' && prev.cardSize.width > prev.cardSize.height) ||\r\n        (orientation === 'landscape' && prev.cardSize.height > prev.cardSize.width);\r\n\r\n      return {\r\n        ...prev,\r\n        updatedAt: new Date().toISOString(),\r\n        orientation,\r\n        cardSize: shouldSwap\r\n          ? {\r\n              ...prev.cardSize,\r\n              width: prev.cardSize.height,\r\n              height: prev.cardSize.width,\r\n            }\r\n          : prev.cardSize,\r\n      };\r\n    });\r\n  }, []);\r\n\r\n  const setSides = useCallback((sides: CardSides) => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      sides,\r\n    }));\r\n  }, []);\r\n\r\n  const duplicateField = useCallback((fieldId: string) => {\r\n    setTemplateState((prev: IDCardTemplate) => {\r\n      const field = prev.fields.find((f: FieldMapping) => f.id === fieldId);\r\n      if (!field) return prev;\r\n\r\n      const newField: FieldMapping = {\r\n        ...field,\r\n        id: generateId('field'),\r\n        position: {\r\n          ...field.position,\r\n          x: field.position.x + 10,\r\n          y: field.position.y + 10,\r\n        },\r\n      };\r\n\r\n      return {\r\n        ...prev,\r\n        updatedAt: new Date().toISOString(),\r\n        fields: [...prev.fields, newField],\r\n      };\r\n    });\r\n  }, []);\r\n\r\n  const moveFieldToSide = useCallback((fieldId: string, side: 'front' | 'back') => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      fields: prev.fields.map((field: FieldMapping) =>\r\n        field.id === fieldId ? { ...field, side } : field\r\n      ),\r\n    }));\r\n  }, []);\r\n\r\n  const reset = useCallback(() => {\r\n    setTemplateState(createDefaultTemplate());\r\n  }, []);\r\n\r\n  const validationResult = useMemo(() => {\r\n    const errors = validateTemplate(template);\r\n    return {\r\n      isValid: errors.length === 0,\r\n      validationErrors: errors.map((e) => `${e.field}: ${e.message}`),\r\n    };\r\n  }, [template]);\r\n\r\n  return {\r\n    template,\r\n    setTemplate,\r\n    updateField,\r\n    addField,\r\n    removeField,\r\n    setBackground,\r\n    setCardSize,\r\n    setOrientation,\r\n    setSides,\r\n    duplicateField,\r\n    moveFieldToSide,\r\n    reset,\r\n    isValid: validationResult.isValid,\r\n    validationErrors: validationResult.validationErrors,\r\n  };\r\n}\r\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useIDCardTemplate.js","sources":["../../../src/hooks/useIDCardTemplate.ts"],"sourcesContent":["import { useState, useCallback, useMemo } from 'react';\r\nimport type {\r\n  IDCardTemplate,\r\n  FieldMapping,\r\n  CardSize,\r\n  CardOrientation,\r\n  CardSides,\r\n  UseIDCardTemplateReturn,\r\n} from '../types';\r\nimport { createDefaultTemplate, generateId } from '../storage/templateStorage';\r\nimport { validateTemplate } from '../utils/validators';\r\n\r\n/**\r\n * Hook for managing ID card template state\r\n * Provides methods for updating fields, backgrounds, and card properties\r\n * Automatically updates the template's updatedAt timestamp on changes\r\n * \r\n * @param initialTemplate - Optional existing template to start with\r\n * @returns Template state and helper methods\r\n */\r\nexport function useIDCardTemplate(\r\n  initialTemplate?: Partial<IDCardTemplate>\r\n): UseIDCardTemplateReturn {\r\n  const [template, setTemplateState] = useState<IDCardTemplate>(() => {\r\n    if (initialTemplate) {\r\n      return {\r\n        ...createDefaultTemplate(),\r\n        ...initialTemplate,\r\n        updatedAt: new Date().toISOString(),\r\n      };\r\n    }\r\n    return createDefaultTemplate();\r\n  });\r\n\r\n  const setTemplate = useCallback((newTemplate: IDCardTemplate) => {\r\n    setTemplateState({\r\n      ...newTemplate,\r\n      updatedAt: new Date().toISOString(),\r\n    });\r\n  }, []);\r\n\r\n  // Update specific properties of a field\r\n  const updateField = useCallback((fieldId: string, updates: Partial<FieldMapping>) => {\r\n    if (!fieldId || !updates) return;\r\n    \r\n    setTemplateState((prev: IDCardTemplate) => {\r\n      const fieldExists = prev.fields.some((field: FieldMapping) => field?.id === fieldId);\r\n      if (!fieldExists) return prev;\r\n      \r\n      return {\r\n        ...prev,\r\n        updatedAt: new Date().toISOString(),\r\n        fields: prev.fields.map((field: FieldMapping) =>\r\n          field?.id === fieldId ? { ...field, ...updates } : field\r\n        ).filter(Boolean),\r\n      };\r\n    });\r\n  }, []);\r\n\r\n  // Add a new field to the template\r\n  const addField = useCallback((field: FieldMapping) => {\r\n    if (!field || !field.type || !field.position) {\r\n      console.warn('Invalid field object provided to addField:', field);\r\n      return;\r\n    }\r\n    \r\n    const validField = {\r\n      ...field,\r\n      id: field.id || generateId('field'),\r\n    };\r\n    \r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      fields: [...prev.fields.filter(Boolean), validField],\r\n    }));\r\n  }, []);\r\n\r\n  const removeField = useCallback((fieldId: string) => {\r\n    if (!fieldId) return;\r\n    \r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      fields: prev.fields.filter((field: FieldMapping) => field?.id && field.id !== fieldId),\r\n    }));\r\n  }, []);\r\n\r\n  const setBackground = useCallback((side: 'front' | 'back', imageData: string) => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      backgrounds: {\r\n        ...prev.backgrounds,\r\n        [side]: imageData,\r\n      },\r\n    }));\r\n  }, []);\r\n\r\n  const setCardSize = useCallback((size: CardSize) => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      cardSize: size,\r\n    }));\r\n  }, []);\r\n\r\n  const setOrientation = useCallback((orientation: CardOrientation) => {\r\n    setTemplateState((prev: IDCardTemplate) => {\r\n      // Swap dimensions if orientation changes\r\n      const shouldSwap =\r\n        (orientation === 'portrait' && prev.cardSize.width > prev.cardSize.height) ||\r\n        (orientation === 'landscape' && prev.cardSize.height > prev.cardSize.width);\r\n\r\n      return {\r\n        ...prev,\r\n        updatedAt: new Date().toISOString(),\r\n        orientation,\r\n        cardSize: shouldSwap\r\n          ? {\r\n              ...prev.cardSize,\r\n              width: prev.cardSize.height,\r\n              height: prev.cardSize.width,\r\n            }\r\n          : prev.cardSize,\r\n      };\r\n    });\r\n  }, []);\r\n\r\n  const setSides = useCallback((sides: CardSides) => {\r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      sides,\r\n    }));\r\n  }, []);\r\n\r\n  const duplicateField = useCallback((fieldId: string) => {\r\n    if (!fieldId) return;\r\n    \r\n    setTemplateState((prev: IDCardTemplate) => {\r\n      const field = prev.fields.find((f: FieldMapping) => f?.id === fieldId);\r\n      if (!field || !field.position) return prev;\r\n\r\n      const newField: FieldMapping = {\r\n        ...field,\r\n        id: generateId('field'),\r\n        position: {\r\n          ...field.position,\r\n          x: field.position.x + 10,\r\n          y: field.position.y + 10,\r\n        },\r\n      };\r\n\r\n      return {\r\n        ...prev,\r\n        updatedAt: new Date().toISOString(),\r\n        fields: [...prev.fields.filter(Boolean), newField],\r\n      };\r\n    });\r\n  }, []);\r\n\r\n  const moveFieldToSide = useCallback((fieldId: string, side: 'front' | 'back') => {\r\n    if (!fieldId || !side) return;\r\n    \r\n    setTemplateState((prev: IDCardTemplate) => ({\r\n      ...prev,\r\n      updatedAt: new Date().toISOString(),\r\n      fields: prev.fields.map((field: FieldMapping) =>\r\n        field?.id === fieldId ? { ...field, side } : field\r\n      ).filter(Boolean),\r\n    }));\r\n  }, []);\r\n\r\n  const reset = useCallback(() => {\r\n    setTemplateState(createDefaultTemplate());\r\n  }, []);\r\n\r\n  const validationResult = useMemo(() => {\r\n    const errors = validateTemplate(template);\r\n    return {\r\n      isValid: errors.length === 0,\r\n      validationErrors: errors.map((e) => `${e.field}: ${e.message}`),\r\n    };\r\n  }, [template]);\r\n\r\n  // Ensure template always has valid fields array\r\n  const safeTemplate = useMemo(() => ({\r\n    ...template,\r\n    fields: template.fields.filter((field): field is FieldMapping => \r\n      Boolean(field) && \r\n      Boolean(field.id) && \r\n      Boolean(field.type) && \r\n      Boolean(field.position)\r\n    ),\r\n  }), [template]);\r\n\r\n  return {\r\n    template: safeTemplate,\r\n    setTemplate,\r\n    updateField,\r\n    addField,\r\n    removeField,\r\n    setBackground,\r\n    setCardSize,\r\n    setOrientation,\r\n    setSides,\r\n    duplicateField,\r\n    moveFieldToSide,\r\n    reset,\r\n    isValid: validationResult.isValid,\r\n    validationErrors: validationResult.validationErrors,\r\n  };\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/types/components/IDCardDesigner.d.ts

@@ -15,4 +15,3 @@ import './IDCardDesigner.css';
  * IDCardDesigner - Visual drag-and-drop ID card template builder
  */
 export declare const IDCardDesigner: React.FC<IDCardDesignerProps>;
-export default IDCardDesigner;

package/dist/types/components/IDCardGenerator.d.ts

@@ -16,4 +16,3 @@ import type { IDCardGeneratorProps } from '../types';
  * ```
  */
 export declare const IDCardGenerator: React.FC<IDCardGeneratorProps>;
-export default IDCardGenerator;

package/dist/types/components/IDCardPreview.d.ts

@@ -12,4 +12,3 @@ import type { IDCardPreviewProps } from '../types';
  * Used inside the designer for visual editing
  */
 export declare const IDCardPreview: React.FC<IDCardPreviewProps>;
-export default IDCardPreview;

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "react-id-card-generator",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "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",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
   "exports": {