df-ae-forms-package 1.0.73 → 1.0.74

package/dist/index.esm.js

@@ -176,21 +176,9 @@ class ConditionalLogicService {
                 if (found)
                     return found;
             }
-            if (comp.name === 'table' && comp.cells && Array.isArray(comp.cells)) {
-                for (const rowOrCell of comp.cells) {
-                    // Handle 2D array structure (standard: cells[row][col])
-                    if (Array.isArray(rowOrCell)) {
-                        for (const cell of rowOrCell) {
-                            if (cell.components) {
-                                const found = this.findComponent(cell.components, componentId);
-                                if (found)
-                                    return found;
-                            }
-                        }
-                    }
-                    // Handle 1D array structure (flat: cells[i]) - robust fallback
-                    else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                        const cell = rowOrCell;
+            if (comp.name === 'table' && comp.cells) {
+                for (const row of comp.cells) {
+                    for (const cell of row) {
                         if (cell.components) {
                             const found = this.findComponent(cell.components, componentId);
                             if (found)
@@ -232,18 +220,9 @@ class ConditionalLogicService {
                     traverse(item.children);
                 if (item.templateComponents)
                     traverse(item.templateComponents);
-                if (item.cells && Array.isArray(item.cells)) {
-                    for (const rowOrCell of item.cells) {
-                        // Handle 2D array structure (standard)
-                        if (Array.isArray(rowOrCell)) {
-                            for (const cell of rowOrCell) {
-                                if (cell.components)
-                                    traverse(cell.components);
-                            }
-                        }
-                        // Handle 1D array structure (flat)
-                        else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                            const cell = rowOrCell;
+                if (item.cells) {
+                    for (const row of item.cells) {
+                        for (const cell of row) {
                             if (cell.components)
                                 traverse(cell.components);
                         }
@@ -6018,35 +5997,17 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
                         values[component.id] = '';
                     }
                 }
-                // CRITICAL: Also store by label and _id so conditional logic can find values.
-                // condition.when stores the component LABEL (set in ConditionalLogicComponent.tsx line 163).
-                // getComponentValue() checks formValues[label] first, so we must populate it here
-                // to ensure show/hide logic evaluates correctly on initial load (before any user interaction).
-                if (component.basic?.label) {
-                    values[component.basic.label] = values[component.id];
-                }
-                if (component._id) {
-                    values[component._id] = values[component.id];
-                }
             }
             // Handle nested components in table cells
             if (component.cells && Array.isArray(component.cells)) {
-                component.cells.forEach((rowOrCell, _rowIndex) => {
-                    // Handle 2D array (standard)
-                    if (Array.isArray(rowOrCell)) {
-                        rowOrCell.forEach((cell, _cellIndex) => {
+                component.cells.forEach((row, _rowIndex) => {
+                    if (Array.isArray(row)) {
+                        row.forEach((cell, _cellIndex) => {
                             if (cell && cell.components && Array.isArray(cell.components)) {
                                 initializeComponentValues(cell.components, values);
                             }
                         });
                     }
-                    // Handle 1D array (flat)
-                    else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                        const cell = rowOrCell;
-                        if (cell && cell.components && Array.isArray(cell.components)) {
-                            initializeComponentValues(cell.components, values);
-                        }
-                    }
                 });
             }
             // Handle nested components in datagrid entries
@@ -6107,23 +6068,11 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
                 // Recurse
                 if (comp.children)
                     extractNotesAndAttachments(comp.children);
-                if (comp.cells && Array.isArray(comp.cells)) {
-                    comp.cells.forEach((rowOrCell) => {
-                        // Handle 2D array
-                        if (Array.isArray(rowOrCell)) {
-                            rowOrCell.forEach((cell) => {
-                                if (cell.components)
-                                    extractNotesAndAttachments(cell.components);
-                            });
-                        }
-                        // Handle 1D array
-                        else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                            const cell = rowOrCell;
-                            if (cell.components)
-                                extractNotesAndAttachments(cell.components);
-                        }
-                    });
-                }
+                if (comp.cells)
+                    comp.cells.forEach((row) => row.forEach((cell) => {
+                        if (cell.components)
+                            extractNotesAndAttachments(cell.components);
+                    }));
                 if (comp.entries)
                     comp.entries.forEach((entry) => {
                         if (entry.components)
@@ -6160,10 +6109,9 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
                     validatedComponent.children = getValidatedComponents(validatedComponent.children);
                 }
                 if (validatedComponent.cells && Array.isArray(validatedComponent.cells)) {
-                    validatedComponent.cells = validatedComponent.cells.map((rowOrCell) => {
-                        // Handle 2D array
-                        if (Array.isArray(rowOrCell)) {
-                            return rowOrCell.map((cell) => {
+                    validatedComponent.cells = validatedComponent.cells.map((row) => {
+                        if (Array.isArray(row)) {
+                            return row.map((cell) => {
                                 if (cell && cell.components && Array.isArray(cell.components)) {
                                     return {
                                         ...cell,
@@ -6173,18 +6121,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
                                 return cell;
                             });
                         }
-                        // Handle 1D array
-                        else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                            const cell = rowOrCell;
-                            if (cell && cell.components && Array.isArray(cell.components)) {
-                                return {
-                                    ...cell,
-                                    components: getValidatedComponents(cell.components)
-                                };
-                            }
-                            return cell;
-                        }
-                        return rowOrCell;
+                        return row;
                     });
                 }
                 if (validatedComponent.entries && Array.isArray(validatedComponent.entries)) {
@@ -6232,10 +6169,8 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
         // Initialize notes and attachments state
         setComponentNotes(prev => ({ ...initialNotes, ...prev }));
         setComponentAttachments(prev => ({ ...initialAttachments, ...prev }));
-        // Evaluate initial conditional logic with the freshly computed initialValues.
-        // We pass initialValues explicitly because setFormValues is async and formValues
-        // in the closure is still the old state at this point.
-        evaluateConditionalLogic(initialValues, validatedFormComponents);
+        // Evaluate initial conditional logic
+        evaluateConditionalLogic();
     }, [initialFormData, formComponents]);
     // Synchronize component visibility whenever form values or components change
     useEffect(() => {
@@ -6245,8 +6180,11 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
     const evaluateComponentConditionalLogic = (components, visibility, currentFormValues, fullSchema) => {
         components.forEach(component => {
             if (component.id) {
-                // Handle conditional logic for all components including table and datagrid
-                if (component.conditional) {
+                // Skip conditional logic for table and datagrid components - they are always visible
+                if (component.name === 'table' || component.name === 'datagrid') {
+                    visibility[component.id] = true;
+                }
+                else if (component.conditional) {
                     // Use the proper conditional logic service
                     const result = conditionalLogicService.evaluateConditionalLogic(component.conditional, fullSchema, currentFormValues);
                     visibility[component.id] = result.shouldShow;
@@ -6263,32 +6201,15 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
                     if (component.basic?.label)
                         visibility[component.basic.label] = true;
                 }
-                // Process nested components in table and datagrid regardless of parent visibility
-                if (component.name === 'table' || component.name === 'datagrid') {
-                    // Still add the parent to visibility map (as visible if no conditional logic)
-                    if (!component.conditional) {
-                        visibility[component.id] = true;
-                    }
-                }
             }
             // Handle nested components in table cells
             if (component.cells && Array.isArray(component.cells)) {
-                component.cells.forEach((rowOrCell) => {
-                    // Handle 2D array (standard)
-                    if (Array.isArray(rowOrCell)) {
-                        rowOrCell.forEach((cell) => {
-                            if (cell.components && Array.isArray(cell.components)) {
-                                evaluateComponentConditionalLogic(cell.components, visibility, currentFormValues, fullSchema);
-                            }
-                        });
-                    }
-                    // Handle 1D array (flat)
-                    else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                        const cell = rowOrCell;
+                component.cells.forEach((row) => {
+                    row.forEach((cell) => {
                         if (cell.components && Array.isArray(cell.components)) {
                             evaluateComponentConditionalLogic(cell.components, visibility, currentFormValues, fullSchema);
                         }
-                    }
+                    });
                 });
             }
             // Handle nested components in datagrid entries
@@ -6323,25 +6244,19 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
     }, [formComponents, formValues]);
     // Check if a component should be visible based on conditional logic
     const shouldShowComponent = useCallback((componentId) => {
-        // Check the visibility map first for the exact ID
-        if (componentVisibility.hasOwnProperty(componentId)) {
-            return componentVisibility[componentId] === true;
-        }
-        // If not found by exact ID, try to find the component in formComponents
-        // and check if it exists in visibility map by other identifiers (_id, label)
+        // Recursive find to get the component to check its type and alternate ID
+        // We need this because formComponents might only be top-level
         const component = conditionalLogicService.findComponent(formComponents, componentId);
-        if (component) {
-            // Check visibility by _id if available
-            if (component._id && componentVisibility.hasOwnProperty(component._id)) {
-                return componentVisibility[component._id] === true;
-            }
-            // Check visibility by label if available
-            if (component.basic?.label && componentVisibility.hasOwnProperty(component.basic.label)) {
-                return componentVisibility[component.basic.label] === true;
-            }
+        // Table and datagrid components are always visible at the root level (their contents handle logic)
+        if (component && (component.name === 'table' || component.name === 'datagrid')) {
+            return true;
         }
-        // If not found in visibility map by any identifier, component should be visible by default
-        return true;
+        // Default to visible if not explicitly hidden
+        // Check both id and _id for maximum resilience
+        const isVisible = (componentVisibility[componentId] !== false) &&
+            (!component?._id || componentVisibility[component._id] !== false) &&
+            (!component?.id || componentVisibility[component.id] !== false);
+        return isVisible;
     }, [componentVisibility, formComponents]);
     // Handle form value changes and re-evaluate conditional logic
     const onFormValueChange = useCallback((change) => {
@@ -6418,28 +6333,13 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
                 if (component.name === 'table' && component.cells) {
                     return {
                         ...component,
-                        cells: component.cells.map((rowOrCell) => {
-                            // Handle 2D array (standard)
-                            if (Array.isArray(rowOrCell)) {
-                                return rowOrCell.map((cell) => {
-                                    const updatedCell = { ...cell };
-                                    if (updatedCell.components) {
-                                        updatedCell.components = updateComponentValue(updatedCell.components);
-                                    }
-                                    return updatedCell;
-                                });
+                        cells: component.cells.map((row) => row.map((cell) => {
+                            const updatedCell = { ...cell };
+                            if (updatedCell.components) {
+                                updatedCell.components = updateComponentValue(updatedCell.components);
                             }
-                            // Handle 1D array (flat)
-                            else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                                const cell = rowOrCell;
-                                const updatedCell = { ...cell };
-                                if (updatedCell.components) {
-                                    updatedCell.components = updateComponentValue(updatedCell.components);
-                                }
-                                return updatedCell;
-                            }
-                            return rowOrCell;
-                        })
+                            return updatedCell;
+                        }))
                     };
                 }
                 if (component.name === 'datagrid' && component.entries) {
@@ -6493,6 +6393,8 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
                 validateField(change.id);
             }, 150);
         }
+        // Re-evaluate immediately to ensure responsive UI
+        evaluateConditionalLogic(newFormValues, updatedComponents);
     }, [formComponents, formValues, validationErrors, onFormDataChange, evaluateConditionalLogic]);
     // Recursive function to find a component by ID in nested structures
     const findComponentById = useCallback((components, fieldId) => {
@@ -7666,18 +7568,8 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
 };
 const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationErrors = {}, touchedFields = {}, formSubmitted = false, onValueChange, onSelect, isSelected = false, className = '', onTableSelect, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue }) => {
     const [isCollapsed, setIsCollapsed] = useState(false); // Always start expanded to show drop zones
-    // Check if table has any components in any cells - handle both 2D and 1D structures
-    const hasAnyComponents = properties.cells?.some((rowOrCell) => {
-        // Handle 2D array structure (each row is an array of cells)
-        if (Array.isArray(rowOrCell)) {
-            return rowOrCell.some((cell) => cell.components && cell.components.length > 0);
-        }
-        // Handle 1D array structure (each element is a cell)
-        else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-            return rowOrCell.components && rowOrCell.components.length > 0;
-        }
-        return false;
-    }) || false;
+    // Check if table has any components in any cells
+    const hasAnyComponents = properties.cells?.some(row => row.some(cell => cell.components && cell.components.length > 0)) || false;
     // Initialize and update table cells when rows/columns change
     // CRITICAL: Skip cell initialization updates to prevent flickering when user types
     useEffect(() => {
@@ -7699,34 +7591,17 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
     };
     const handleComponentDelete = useCallback((component, event) => {
         event.stopPropagation();
-        // Find and remove the component from the table cell - handle both 2D and 1D structures
-        const updatedCells = properties.cells.map((rowOrCell) => {
-            // Handle 2D array structure (each row is an array of cells)
-            if (Array.isArray(rowOrCell)) {
-                return rowOrCell.map((cell) => {
-                    if (cell.components && cell.components.some((comp) => comp.id === component.id)) {
-                        const filteredComponents = cell.components.filter((comp) => comp.id !== component.id);
-                        return {
-                            ...cell,
-                            components: filteredComponents
-                        };
-                    }
-                    return cell;
-                });
-            }
-            // Handle 1D array structure (each element is a cell)
-            else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                if (rowOrCell.components && rowOrCell.components.some((comp) => comp.id === component.id)) {
-                    const filteredComponents = rowOrCell.components.filter((comp) => comp.id !== component.id);
-                    return {
-                        ...rowOrCell,
-                        components: filteredComponents
-                    };
-                }
-                return rowOrCell;
+        // Find and remove the component from the table cell
+        const updatedCells = properties.cells.map(row => row.map(cell => {
+            if (cell.components && cell.components.some(comp => comp.id === component.id)) {
+                const filteredComponents = cell.components.filter(comp => comp.id !== component.id);
+                return {
+                    ...cell,
+                    components: filteredComponents
+                };
             }
-            return rowOrCell;
-        });
+            return cell;
+        }));
         // Update the table with the modified cells
         if (onValueChange) {
             onValueChange({
@@ -7742,56 +7617,26 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
     const cellsWithIds = useMemo(() => {
         if (!properties.cells)
             return [];
-        return properties.cells.map((rowOrCell, rowIndex) => {
-            // Handle 2D array structure (each row is an array of cells)
-            if (Array.isArray(rowOrCell)) {
-                return rowOrCell.map((cell, cellIndex) => ({
-                    ...cell,
-                    components: (cell.components && Array.isArray(cell.components))
-                        ? cell.components.map((comp, compIndex) => {
-                            // CRITICAL: Only generate ID if it's missing - never regenerate existing IDs
-                            // This prevents component remounting and losing input state
-                            if (comp.id && typeof comp.id === 'string' && comp.id.trim() !== '') {
-                                // ID already exists - keep it as is
-                                return comp;
-                            }
-                            // Generate unique ID that includes table ID, row, cell, and component index
-                            // This ensures no conflicts with other components
-                            const uniqueId = `${comp.name || 'component'}-table-${id}-row-${rowIndex}-cell-${cellIndex}-comp-${compIndex}`;
-                            return {
-                                ...comp,
-                                id: uniqueId
-                            };
-                        })
-                        : []
-                }));
-            }
-            // Handle 1D array structure (each element is a cell)
-            else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                const cell = rowOrCell;
-                return {
-                    ...cell,
-                    components: (cell.components && Array.isArray(cell.components))
-                        ? cell.components.map((comp, compIndex) => {
-                            // CRITICAL: Only generate ID if it's missing - never regenerate existing IDs
-                            // This prevents component remounting and losing input state
-                            if (comp.id && typeof comp.id === 'string' && comp.id.trim() !== '') {
-                                // ID already exists - keep it as is
-                                return comp;
-                            }
-                            // Generate unique ID that includes table ID, row, cell, and component index
-                            // This ensures no conflicts with other components
-                            const uniqueId = `${comp.name || 'component'}-table-${id}-row-${rowIndex}-cell-0-comp-${compIndex}`;
-                            return {
-                                ...comp,
-                                id: uniqueId
-                            };
-                        })
-                        : []
-                };
-            }
-            return [];
-        });
+        return properties.cells.map((row, rowIndex) => row.map((cell, cellIndex) => ({
+            ...cell,
+            components: (cell.components && Array.isArray(cell.components))
+                ? cell.components.map((comp, compIndex) => {
+                    // CRITICAL: Only generate ID if it's missing - never regenerate existing IDs
+                    // This prevents component remounting and losing input state
+                    if (comp.id && typeof comp.id === 'string' && comp.id.trim() !== '') {
+                        // ID already exists - keep it as is
+                        return comp;
+                    }
+                    // Generate unique ID that includes table ID, row, cell, and component index
+                    // This ensures no conflicts with other components
+                    const uniqueId = `${comp.name || 'component'}-table-${id}-row-${rowIndex}-cell-${cellIndex}-comp-${compIndex}`;
+                    return {
+                        ...comp,
+                        id: uniqueId
+                    };
+                })
+                : []
+        })));
     }, [properties.cells, id]); // Only recalculate if cells or table ID changes
     // CRITICAL FIX: Update the parent component with the cells that have proper IDs
     // Skip this in package to prevent flickering - cells are managed by parent
@@ -7920,17 +7765,7 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
                                                 fontSize: '14px',
                                                 textAlign: 'center'
                                             }, children: columnName }, `header-${colIndex}`));
-                                    }) }) })), jsx("tbody", { children: cellsWithIds.map((rowOrCell, rowIndex) => {
-                                    // Handle 2D array structure (each row is an array of cells)
-                                    if (Array.isArray(rowOrCell)) {
-                                        return (jsx("tr", { className: "table-row", children: rowOrCell.map((cell) => (jsx(TableCellComponent, { cell: cell, mode: mode, onComponentSelect: onComponentSelect || (() => { }), onComponentDelete: handleComponentDelete, onComponentEdit: onComponentEdit, selectedComponent: selectedComponent || null, renderFormComponent: renderComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, tableId: id, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, cell.id))) }, rowIndex));
-                                    }
-                                    // Handle 1D array structure (each element is a cell)
-                                    else if (typeof rowOrCell === 'object' && rowOrCell !== null) {
-                                        return (jsx("tr", { className: "table-row", children: jsx(TableCellComponent, { cell: rowOrCell, mode: mode, onComponentSelect: onComponentSelect || (() => { }), onComponentDelete: handleComponentDelete, onComponentEdit: onComponentEdit, selectedComponent: selectedComponent || null, renderFormComponent: renderComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, tableId: id, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, rowOrCell.id) }, rowIndex));
-                                    }
-                                    return null;
-                                }) })] })] }))] }));
+                                    }) }) })), jsx("tbody", { children: cellsWithIds.map((row, rowIndex) => (jsx("tr", { className: "table-row", children: row.map((cell) => (jsx(TableCellComponent, { cell: cell, mode: mode, onComponentSelect: onComponentSelect || (() => { }), onComponentDelete: handleComponentDelete, onComponentEdit: onComponentEdit, selectedComponent: selectedComponent || null, renderFormComponent: renderComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, tableId: id, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, cell.id))) }, rowIndex))) })] })] }))] }));
 };
 
 var dfFormTable = /*#__PURE__*/Object.freeze({