df-ae-forms-package 1.1.3 → 1.1.4

package/dist/index.js

@@ -1004,20 +1004,15 @@ const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', in
             touchedFields[id] = true;
         }
     }, [isTouched, id, touchedFields]);
-    // Reset touched state and value when switching modes
+    // Reset touched state when switching modes
     React.useEffect(() => {
+        setIsTouched(false);
+        // Only reset value when explicitly moving to edit mode to show current default
         if (mode === 'edit') {
-            setIsTouched(false);
-            // Reset value to default value when switching to edit mode
             const defaultValue = properties?.basic?.defaultValue || '';
             setValue(defaultValue);
         }
-        else if (mode === 'test') {
-            setIsTouched(false);
-            // Reset value to empty when switching to test mode for fresh start
-            setValue('');
-        }
-    }, [mode, properties?.basic?.defaultValue]);
+    }, [mode]);
     // Update value when formValue prop changes (but don't override user input)
     // CRITICAL: Only update if formValue is actually for THIS component's ID
     // Use componentIdRef to ensure we're checking against the correct component ID
@@ -4967,8 +4962,7 @@ const DfFormDataGrid = ({ id, properties, mode = 'edit', formData = {}, onValueC
             // This allows the form data to be updated for interactive components
             if (onValueChange) {
                 onValueChange({
-                    id: change.id,
-                    value: change.value
+                    ...change
                 });
             }
         }
@@ -5684,9 +5678,35 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
             return;
         }
         // CRITICAL: Check if multiple components share this ID (ID collision detection)
-        const componentsWithSameId = localFormComponents.filter(comp => comp.id === change.id);
+        // Use recursive search for accurate detection across all levels
+        const checkIdCollision = (components, targetId) => {
+            let matches = [];
+            components.forEach(comp => {
+                if (ensureStringId$1(comp.id) === targetId)
+                    matches.push(comp);
+                if (comp.name === 'section' && comp.children) {
+                    matches = [...matches, ...checkIdCollision(comp.children, targetId)];
+                }
+                if (comp.name === 'table' && comp.cells) {
+                    comp.cells.forEach((row) => {
+                        normalizeTableRow(row).forEach((cell) => {
+                            if (cell.components)
+                                matches = [...matches, ...checkIdCollision(cell.components, targetId)];
+                        });
+                    });
+                }
+                if (comp.name === 'datagrid' && comp.entries) {
+                    comp.entries.forEach((entry) => {
+                        if (entry.components)
+                            matches = [...matches, ...checkIdCollision(entry.components, targetId)];
+                    });
+                }
+            });
+            return matches;
+        };
+        const componentsWithSameId = checkIdCollision(localFormComponents, change.id);
         if (componentsWithSameId.length > 1) {
-            console.error(`[DfFormPreview] ID COLLISION DETECTED! Multiple components share ID "${change.id}":`, componentsWithSameId.map(c => ({ id: c.id, name: c.name, label: c.basic?.label })));
+            console.error(`[DfFormPreview] ID COLLISION DETECTED! Multiple components share ID "${change.id}":`, componentsWithSameId.map(c => ({ id: ensureStringId$1(c.id), name: c.name, label: c.basic?.label })));
             // Don't update - this would cause all components with this ID to get the same value
             return;
         }
@@ -5705,7 +5725,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
         }
         // Clear raised issues for this component when value changes
         // This ensures that if threshold condition changes, user must raise issue again
-        const component = localFormComponents.find(comp => comp.id === change.id);
+        const component = findComponentById(localFormComponents, change.id);
         if (component) {
             const threshold = component?.threshold;
             if (threshold && threshold.conditions && threshold.conditions.length > 0) {
@@ -5721,7 +5741,8 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
         // Recursive function to update component values
         const updateComponentValue = (components) => {
             return components.map(component => {
-                if (component.id === change.id) {
+                const componentId = ensureStringId$1(component.id);
+                if (componentId === change.id) {
                     // CRITICAL: Handle table/datagrid structure updates (cells, entries, etc.)
                     // When a table sends onValueChange with cells data, update the whole component structure
                     if (change.value && typeof change.value === 'object' && 'cells' in change.value) {
@@ -5737,13 +5758,12 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
                             ...change.value
                         };
                     }
-                    if ('defaultValue' in component.basic) {
+                    if ('value' in component.basic || 'defaultValue' in component.basic) {
                         return {
                             ...component,
                             basic: {
                                 ...component.basic,
-                                value: change.value ?? component.basic.defaultValue,
-                                defaultValue: change.value
+                                value: change.value
                             }
                         };
                     }