df-ae-forms-package 1.0.77 → 1.0.79

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.
package/dist/index.js CHANGED
@@ -5146,7 +5146,7 @@ formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChan
5146
5146
  whiteSpace: 'nowrap',
5147
5147
  overflow: 'hidden',
5148
5148
  textOverflow: 'ellipsis'
5149
- }, children: component.basic?.label || `Column ${index + 1}` }, `header-${component.id}`))) })), dataEntries.length > 0 ? (dataEntries.map((entry, entryIndex) => (jsxRuntime.jsxs("div", { className: "table-row", style: {
5149
+ }, children: component.basic?.label || `Column ${index + 1}` }, `header-${component.id || index}`))) })), dataEntries.length > 0 ? (dataEntries.map((entry, entryIndex) => (jsxRuntime.jsxs("div", { className: "table-row", style: {
5150
5150
  // Use flex column for column view, grid for row view
5151
5151
  display: columnView ? 'flex' : 'grid',
5152
5152
  flexDirection: columnView ? 'column' : 'row',
@@ -6992,13 +6992,25 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
6992
6992
  updatedComponent.children = updateComponentValues(updatedComponent.children);
6993
6993
  }
6994
6994
  if (updatedComponent.name === 'table' && updatedComponent.cells) {
6995
- updatedComponent.cells = updatedComponent.cells.map((row) => row.map((cell) => {
6996
- const updatedCell = { ...cell };
6997
- if (updatedCell.components) {
6998
- updatedCell.components = updateComponentValues(updatedCell.components);
6995
+ updatedComponent.cells = updatedComponent.cells.map((rowOrCell) => {
6996
+ if (Array.isArray(rowOrCell)) {
6997
+ return rowOrCell.map((cell) => {
6998
+ const updatedCell = { ...cell };
6999
+ if (updatedCell.components) {
7000
+ updatedCell.components = updateComponentValues(updatedCell.components);
7001
+ }
7002
+ return updatedCell;
7003
+ });
6999
7004
  }
7000
- return updatedCell;
7001
- }));
7005
+ else {
7006
+ // 1D flat cell
7007
+ const updatedCell = { ...rowOrCell };
7008
+ if (updatedCell.components) {
7009
+ updatedCell.components = updateComponentValues(updatedCell.components);
7010
+ }
7011
+ return updatedCell;
7012
+ }
7013
+ });
7002
7014
  }
7003
7015
  if (updatedComponent.name === 'datagrid' && updatedComponent.entries) {
7004
7016
  updatedComponent.entries = updatedComponent.entries.map((entry) => {
@@ -7179,24 +7191,35 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
7179
7191
  // Handle notes change for table cell components
7180
7192
  const updatedComponents = formComponents.map(comp => {
7181
7193
  if (comp.id === component.id && comp.cells) {
7182
- const updatedCells = comp.cells.map((row) => row.map((cell) => {
7183
- if (cell.components) {
7184
- const updatedCellComponents = cell.components.map((cellComp) => {
7185
- if (cellComp.id === componentId) {
7186
- return {
7187
- ...cellComp,
7188
- basic: {
7189
- ...cellComp.basic,
7190
- notes
7194
+ const updatedCells = comp.cells.map((rowOrCell) => {
7195
+ if (Array.isArray(rowOrCell)) {
7196
+ return rowOrCell.map((cell) => {
7197
+ if (cell.components) {
7198
+ const updatedCellComponents = cell.components.map((cellComp) => {
7199
+ if (cellComp.id === componentId) {
7200
+ return { ...cellComp, basic: { ...cellComp.basic, notes } };
7191
7201
  }
7192
- };
7202
+ return cellComp;
7203
+ });
7204
+ return { ...cell, components: updatedCellComponents };
7193
7205
  }
7194
- return cellComp;
7206
+ return cell;
7195
7207
  });
7196
- return { ...cell, components: updatedCellComponents };
7197
7208
  }
7198
- return cell;
7199
- }));
7209
+ else {
7210
+ const cell = rowOrCell;
7211
+ if (cell.components) {
7212
+ const updatedCellComponents = cell.components.map((cellComp) => {
7213
+ if (cellComp.id === componentId) {
7214
+ return { ...cellComp, basic: { ...cellComp.basic, notes } };
7215
+ }
7216
+ return cellComp;
7217
+ });
7218
+ return { ...cell, components: updatedCellComponents };
7219
+ }
7220
+ return cell;
7221
+ }
7222
+ });
7200
7223
  return { ...comp, cells: updatedCells };
7201
7224
  }
7202
7225
  return comp;
@@ -7206,24 +7229,35 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
7206
7229
  // Handle attachment change for table cell components
7207
7230
  const updatedComponents = formComponents.map(comp => {
7208
7231
  if (comp.id === component.id && comp.cells) {
7209
- const updatedCells = comp.cells.map((row) => row.map((cell) => {
7210
- if (cell.components) {
7211
- const updatedCellComponents = cell.components.map((cellComp) => {
7212
- if (cellComp.id === componentId) {
7213
- return {
7214
- ...cellComp,
7215
- basic: {
7216
- ...cellComp.basic,
7217
- attachments: attachments || []
7232
+ const updatedCells = comp.cells.map((rowOrCell) => {
7233
+ if (Array.isArray(rowOrCell)) {
7234
+ return rowOrCell.map((cell) => {
7235
+ if (cell.components) {
7236
+ const updatedCellComponents = cell.components.map((cellComp) => {
7237
+ if (cellComp.id === componentId) {
7238
+ return { ...cellComp, basic: { ...cellComp.basic, attachments: attachments || [] } };
7218
7239
  }
7219
- };
7240
+ return cellComp;
7241
+ });
7242
+ return { ...cell, components: updatedCellComponents };
7220
7243
  }
7221
- return cellComp;
7244
+ return cell;
7222
7245
  });
7223
- return { ...cell, components: updatedCellComponents };
7224
7246
  }
7225
- return cell;
7226
- }));
7247
+ else {
7248
+ const cell = rowOrCell;
7249
+ if (cell.components) {
7250
+ const updatedCellComponents = cell.components.map((cellComp) => {
7251
+ if (cellComp.id === componentId) {
7252
+ return { ...cellComp, basic: { ...cellComp.basic, attachments: attachments || [] } };
7253
+ }
7254
+ return cellComp;
7255
+ });
7256
+ return { ...cell, components: updatedCellComponents };
7257
+ }
7258
+ return cell;
7259
+ }
7260
+ });
7227
7261
  return { ...comp, cells: updatedCells };
7228
7262
  }
7229
7263
  return comp;
@@ -7617,8 +7651,29 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
7617
7651
  };
7618
7652
  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 }) => {
7619
7653
  const [isCollapsed, setIsCollapsed] = React.useState(false); // Always start expanded to show drop zones
7654
+ // Normalize cells: API may return a flat 1D array of cells (each with .row/.column)
7655
+ // or a proper 2D array of rows. Always convert to 2D for consistent rendering.
7656
+ const normalizedCells = React.useMemo(() => {
7657
+ const raw = properties.cells;
7658
+ if (!raw || !Array.isArray(raw) || raw.length === 0)
7659
+ return [];
7660
+ // Check if it's already a 2D array (first element is an array)
7661
+ if (Array.isArray(raw[0])) {
7662
+ return raw;
7663
+ }
7664
+ // It's a flat 1D array — reconstruct 2D using each cell's row/column
7665
+ const grid = [];
7666
+ raw.forEach((cell) => {
7667
+ const r = typeof cell.row === 'number' ? cell.row : 0;
7668
+ const c = typeof cell.column === 'number' ? cell.column : 0;
7669
+ if (!grid[r])
7670
+ grid[r] = [];
7671
+ grid[r][c] = cell;
7672
+ });
7673
+ return grid;
7674
+ }, [properties.cells]);
7620
7675
  // Check if table has any components in any cells
7621
- const hasAnyComponents = properties.cells?.some(row => row.some(cell => cell.components && cell.components.length > 0)) || false;
7676
+ const hasAnyComponents = normalizedCells.some(row => Array.isArray(row) && row.some(cell => cell && cell.components && cell.components.length > 0)) || false;
7622
7677
  // Initialize and update table cells when rows/columns change
7623
7678
  // CRITICAL: Skip cell initialization updates to prevent flickering when user types
7624
7679
  React.useEffect(() => {
@@ -7641,9 +7696,9 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
7641
7696
  const handleComponentDelete = React.useCallback((component, event) => {
7642
7697
  event.stopPropagation();
7643
7698
  // Find and remove the component from the table cell
7644
- const updatedCells = properties.cells.map(row => row.map(cell => {
7645
- if (cell.components && cell.components.some(comp => comp.id === component.id)) {
7646
- const filteredComponents = cell.components.filter(comp => comp.id !== component.id);
7699
+ const updatedCells = normalizedCells.map(row => (Array.isArray(row) ? row : []).map(cell => {
7700
+ if (cell && cell.components && cell.components.some((comp) => comp.id === component.id)) {
7701
+ const filteredComponents = cell.components.filter((comp) => comp.id !== component.id);
7647
7702
  return {
7648
7703
  ...cell,
7649
7704
  components: filteredComponents
@@ -7663,12 +7718,13 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
7663
7718
  }, [onComponentDelete, properties, onValueChange, id]);
7664
7719
  // CRITICAL FIX: Ensure all table cell components have proper IDs with table and cell position
7665
7720
  // Use useMemo to prevent ID regeneration on every render
7721
+ // Uses normalizedCells so it works whether API returns 1D or 2D cell arrays
7666
7722
  const cellsWithIds = React.useMemo(() => {
7667
- if (!properties.cells)
7723
+ if (!normalizedCells || normalizedCells.length === 0)
7668
7724
  return [];
7669
- return properties.cells.map((row, rowIndex) => row.map((cell, cellIndex) => ({
7725
+ return normalizedCells.map((row, rowIndex) => (Array.isArray(row) ? row : []).map((cell, cellIndex) => ({
7670
7726
  ...cell,
7671
- components: (cell.components && Array.isArray(cell.components))
7727
+ components: (cell && cell.components && Array.isArray(cell.components))
7672
7728
  ? cell.components.map((comp, compIndex) => {
7673
7729
  // CRITICAL: Only generate ID if it's missing - never regenerate existing IDs
7674
7730
  // This prevents component remounting and losing input state
@@ -7686,7 +7742,7 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
7686
7742
  })
7687
7743
  : []
7688
7744
  })));
7689
- }, [properties.cells, id]); // Only recalculate if cells or table ID changes
7745
+ }, [normalizedCells, id]); // Only recalculate if cells or table ID changes
7690
7746
  // CRITICAL FIX: Update the parent component with the cells that have proper IDs
7691
7747
  // Skip this in package to prevent flickering - cells are managed by parent
7692
7748
  // useEffect(() => {
@@ -7814,7 +7870,7 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
7814
7870
  fontSize: '14px',
7815
7871
  textAlign: 'center'
7816
7872
  }, children: columnName }, `header-${colIndex}`));
7817
- }) }) })), jsxRuntime.jsx("tbody", { children: cellsWithIds.map((row, rowIndex) => (jsxRuntime.jsx("tr", { className: "table-row", children: row.map((cell) => (jsxRuntime.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))) })] })] }))] }));
7873
+ }) }) })), jsxRuntime.jsx("tbody", { children: cellsWithIds.filter(row => Array.isArray(row) && row.length > 0).map((row, rowIndex) => (jsxRuntime.jsx("tr", { className: "table-row", children: row.filter(cell => cell != null).map((cell) => (jsxRuntime.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))) })] })] }))] }));
7818
7874
  };
7819
7875
 
7820
7876
  var dfFormTable = /*#__PURE__*/Object.freeze({