df-ae-forms-package 1.0.83 → 1.0.84

package/dist/index.js

@@ -7594,44 +7594,10 @@ 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, shouldShowComponent }) => {
     const [isCollapsed, setIsCollapsed] = React.useState(false);
-    // Initialize and update table cells when rows/columns change (matching main website)
-    React.useEffect(() => {
-        const currentRows = Number(properties.table?.rows || properties.basic?.rows || 3);
-        const currentColumns = Number(properties.table?.columns || properties.basic?.columns || 3);
-        const currentCells = properties.cells || [];
-        // Check if we need to update the table structure
-        const needsUpdate = currentCells.length === 0 ||
-            currentCells.length !== currentRows ||
-            (currentCells.length > 0 && Array.isArray(currentCells[0]) && currentCells[0].length !== currentColumns);
-        if (needsUpdate) {
-            const newCells = [];
-            for (let row = 0; row < currentRows; row++) {
-                const rowCells = [];
-                for (let col = 0; col < currentColumns; col++) {
-                    const cellId = `cell-${row}-${col}`;
-                    // Try to preserve existing components if the cell exists
-                    let existingComponents = [];
-                    if (currentCells[row] && Array.isArray(currentCells[row]) && currentCells[row][col]) {
-                        existingComponents = (currentCells[row][col].components || []).map(ensureComponentHasId);
-                    }
-                    rowCells.push({
-                        id: cellId,
-                        row,
-                        column: col,
-                        components: existingComponents,
-                        styles: {}
-                    });
-                }
-                newCells.push(rowCells);
-            }
-            if (onValueChange) {
-                onValueChange({
-                    id,
-                    value: { ...properties, cells: newCells }
-                });
-            }
-        }
-    }, [properties.table?.rows, properties.table?.columns, properties.basic?.rows, properties.basic?.columns, properties.cells, id, onValueChange]);
+    // NOTE: Unlike the main website, the package does NOT have a cell initialization useEffect.
+    // In the main website, onValueChange handles component structure updates (updating cells).
+    // In the package, onValueChange maps to onFormValueChange which only handles simple form values.
+    // The cells are already properly structured from the API and processed by the useMemo in DfFormPreview.
     // Check if table has any components in any cells
     const hasAnyComponents = properties.cells?.some((row) => {
         if (Array.isArray(row)) {
@@ -7696,18 +7662,10 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
     const cellsWithIds = properties.cells && properties.cells.length > 0
         ? ensureTableCellComponentsHaveIds(properties.cells)
         : [];
-    // CRITICAL FIX: Update the parent component with the cells that have proper IDs (matching main website)
-    React.useEffect(() => {
-        if (cellsWithIds.length > 0 && JSON.stringify(cellsWithIds) !== JSON.stringify(properties.cells)) {
-            onValueChange?.({
-                id: id,
-                value: {
-                    ...properties,
-                    cells: cellsWithIds
-                }
-            });
-        }
-    }, [cellsWithIds, properties.cells, id, onValueChange]);
+    // NOTE: Unlike the main website, we do NOT sync cellsWithIds back via onValueChange.
+    // In the package, onValueChange = onFormValueChange which handles simple form values,
+    // not component structure updates. Syncing would corrupt the state.
+    // cellsWithIds is used only for rendering.
     // CRITICAL: Create a stable renderComponent that doesn't recreate on every render
     // Match main app implementation - directly access formData from closure
     const renderComponent = renderFormComponent || React.useCallback((field) => {